{
  "version": 3,
  "sources": ["ssg:https://framerusercontent.com/modules/0CiZN2KlgCLQzlLS039A/fqDQwsBIJJEv5AGVL3Mr/CustomPhoneInput.js"],
  "sourcesContent": ["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useState,useEffect}from\"react\";import{addPropertyControls,ControlType}from\"framer\";import{createStore}from\"https://framer.com/m/framer/store.js@^1.0.0\";// --- Framer Store (Copied for local use, but it's the SAME store as the overrides) ---\nconst useValidationStore=createStore({isValid:true,errors:{},submitted:false});/**\n * A custom phone number input component with built-in validation and customizable error messages.\n * This component integrates with the global form validation store.\n */export function CustomPhoneInput({name=\"phone\",placeholder=\"Enter phone number\",required=false,showErrorsImmediately=false,fontFamily=\"Arial\",fontSize=16,fontWeight=\"normal\",color=\"#333\",backgroundColor=\"#F5F5F5\",borderRadius=8,padding=12,width=\"100%\",height=48,borderColor=\"#E0E0E0\",borderWidth=1,customEmptyPhoneMessage,customInvalidPhoneMessage,onChange}){const[value,setValue]=useState(\"\");const[store,setStore]=useValidationStore();const[isTouched,setIsTouched]=useState(false);const phoneRegex=/^\\d{9,10}$/;const validate=inputValue=>{let currentErrorMessage=\"\";const isEmpty=inputValue.trim()===\"\";if(required&&isEmpty){currentErrorMessage=customEmptyPhoneMessage||\"\u05DE\u05E1\u05E4\u05E8 \u05D4\u05D8\u05DC\u05E4\u05D5\u05DF \u05D0\u05D9\u05E0\u05D5 \u05D9\u05DB\u05D5\u05DC \u05DC\u05D4\u05D9\u05D5\u05EA \u05E8\u05D9\u05E7.\";}else if(!isEmpty&&!phoneRegex.test(inputValue)){currentErrorMessage=customInvalidPhoneMessage||\"\u05DE\u05E1\u05E4\u05E8 \u05D4\u05D8\u05DC\u05E4\u05D5\u05DF \u05D7\u05D9\u05D9\u05D1 \u05DC\u05D4\u05D9\u05D5\u05EA \u05D1\u05DF 9 \u05D0\u05D5 10 \u05E1\u05E4\u05E8\u05D5\u05EA (\u05DE\u05E1\u05E4\u05E8\u05D9\u05DD \u05D1\u05DC\u05D1\u05D3).\";}// --- Debugging ---\n// console.log(`[${name}] Validating: \"${inputValue}\" -> Error: \"${currentErrorMessage}\"`);\n// --- End Debugging ---\nsetStore(prev=>({...prev,errors:{...prev.errors,[name]:currentErrorMessage}}));return currentErrorMessage===\"\";};// Initial validation when component mounts or required prop changes\n// This ensures the store is populated with initial validity before any user interaction\nuseEffect(()=>{validate(value);},[required]);const handleChange=e=>{const newValue=e.target.value;setValue(newValue);// --- CRITICAL FIX: Always validate on change to keep store updated ---\nvalidate(newValue);// --- End CRITICAL FIX ---\nif(onChange){onChange(newValue);}};const handleBlur=()=>{setIsTouched(true);validate(value)// Validate on blur to ensure the final state is captured\n;};// Determine if visual error should be shown\nconst showVisualError=showErrorsImmediately&&isTouched&&store.errors[name]||// Show immediately if toggled, touched, and error exists\nstore.submitted&&store.errors[name]// OR show if form submitted and error exists\n;// Dynamic border style\nconst effectiveBorderStyle=showVisualError?`1px solid red`:`${borderWidth}px solid ${borderColor}`;return /*#__PURE__*/_jsxs(\"div\",{style:{width:width,height:height,position:\"relative\",marginBottom:showVisualError?20:0},children:[/*#__PURE__*/_jsx(\"input\",{type:\"tel\",name:name,placeholder:placeholder,value:value,onChange:handleChange,onBlur:handleBlur,onFocus:()=>setIsTouched(true),style:{width:\"100%\",height:\"100%\",fontSize:fontSize,color:color,backgroundColor:backgroundColor,borderRadius:borderRadius,padding:`${padding}px`,border:effectiveBorderStyle,outline:\"none\",boxSizing:\"border-box\",textAlign:\"right\",direction:\"rtl\",fontFamily:fontFamily,fontWeight:fontWeight}}),showVisualError&&/*#__PURE__*/_jsx(\"div\",{style:{color:\"red\",fontSize:\"12px\",marginTop:\"4px\",textAlign:\"right\",direction:\"rtl\",position:\"absolute\",width:\"100%\",bottom:\"-16px\",left:0},children:store.errors[name]})]});}// --- Property Controls for Framer UI ---\naddPropertyControls(CustomPhoneInput,{name:{type:ControlType.String,title:\"Name\",defaultValue:\"phone\",placeholder:\"e.g., phone\",tooltip:\"Unique identifier for this input in the form validation store.\"},placeholder:{type:ControlType.String,title:\"Placeholder\",defaultValue:\"Enter phone number\",placeholder:\"e.g., 0501234567\"},required:{type:ControlType.Boolean,title:\"Required\",defaultValue:false,tooltip:\"Check if this field is mandatory for form submission.\"},showErrorsImmediately:{type:ControlType.Boolean,title:\"Show Errors Immediately\",defaultValue:false,tooltip:\"If checked, errors will appear as you type or on blur, not just on submit.\"},fontFamily:{type:ControlType.String,title:\"Font Family\",defaultValue:\"Arial\",placeholder:\"e.g., Assistant, Inter\",tooltip:\"Enter the exact name of a font available in Framer.\"},fontSize:{type:ControlType.Number,title:\"Font Size\",defaultValue:16,min:8,max:64,step:1},fontWeight:{type:ControlType.Enum,title:\"Font Weight\",defaultValue:\"normal\",options:[\"normal\",\"bold\",\"100\",\"200\",\"300\",\"400\",\"500\",\"600\",\"700\",\"800\",\"900\"],optionTitles:[\"Normal\",\"Bold\",\"100 Thin\",\"200 Extra Light\",\"300 Light\",\"400 Regular\",\"500 Medium\",\"600 Semi Bold\",\"700 Bold\",\"800 Extra Bold\",\"900 Black\"],tooltip:\"Select a font weight. Available weights depend on the font family.\"},color:{type:ControlType.Color,title:\"Text Color\",defaultValue:\"#333\"},backgroundColor:{type:ControlType.Color,title:\"Background\",defaultValue:\"#F5F5F5\"},borderRadius:{type:ControlType.Number,title:\"Radius\",defaultValue:8,min:0,step:1},padding:{type:ControlType.Number,title:\"Padding\",defaultValue:12,min:0,step:1},width:{type:ControlType.String,title:\"Width\",defaultValue:\"100%\",placeholder:\"e.g., 200px, 100%\"},height:{type:ControlType.Number,title:\"Height\",defaultValue:48,min:20,step:1},borderColor:{type:ControlType.Color,title:\"Border Color\",defaultValue:\"#E0E0E0\"},borderWidth:{type:ControlType.Number,title:\"Border Width\",defaultValue:1,min:0,max:5,step:.5},customEmptyPhoneMessage:{type:ControlType.String,title:\"Empty Message\",defaultValue:\"\u05DE\u05E1\u05E4\u05E8 \u05D4\u05D8\u05DC\u05E4\u05D5\u05DF \u05D0\u05D9\u05E0\u05D5 \u05D9\u05DB\u05D5\u05DC \u05DC\u05D4\u05D9\u05D5\u05EA \u05E8\u05D9\u05E7.\",placeholder:\"e.g., Phone cannot be empty.\",tooltip:\"Custom message when the field is empty.\"},customInvalidPhoneMessage:{type:ControlType.String,title:\"Invalid Message\",defaultValue:\"\u05DE\u05E1\u05E4\u05E8 \u05D4\u05D8\u05DC\u05E4\u05D5\u05DF \u05D7\u05D9\u05D9\u05D1 \u05DC\u05D4\u05D9\u05D5\u05EA \u05D1\u05DF 9 \u05D0\u05D5 10 \u05E1\u05E4\u05E8\u05D5\u05EA (\u05DE\u05E1\u05E4\u05E8\u05D9\u05DD \u05D1\u05DC\u05D1\u05D3).\",placeholder:\"e.g., Phone must be 9 or 10 digits.\",tooltip:\"Custom message when the phone number format is invalid.\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"CustomPhoneInput\":{\"type\":\"reactComponent\",\"name\":\"CustomPhoneInput\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./CustomPhoneInput.map"],
  "mappings": "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",
  "names": ["useValidationStore", "createStore", "CustomPhoneInput", "name", "placeholder", "required", "showErrorsImmediately", "fontFamily", "fontSize", "fontWeight", "color", "backgroundColor", "borderRadius", "padding", "width", "height", "borderColor", "borderWidth", "customEmptyPhoneMessage", "customInvalidPhoneMessage", "onChange", "value", "setValue", "ye", "store", "setStore", "isTouched", "setIsTouched", "phoneRegex", "validate", "inputValue", "currentErrorMessage", "isEmpty", "prev", "ue", "handleChange", "e", "newValue", "handleBlur", "showVisualError", "effectiveBorderStyle", "u", "p", "addPropertyControls", "ControlType"]
}