{"version":3,"file":"SLForm.CO9shDmL.mjs","names":["useState","Suspense","_Fragment"],"sources":["https:/framerusercontent.com/modules/yigBgBq8FEzCOg5yo2Ks/Bp7iDVMZaKGi0RGmEldk/SLForm.js"],"sourcesContent":["/**\n * SLForm.tsx\n *\n * This component handles a serial number form submission and displays the result in a card.\n * It uses a polling mechanism to check the status of a long-running task on the server.\n *\n * Key Points:\n * - On submit, it sends formData to the API via POST.\n * - If the API indicates the task is still \"PROCESSING\", we poll the status in intervals.\n * - We handle three main states: \"loading\", \"submitted\", and \"error\".\n * - The CardDev component displays different UI states based on the status prop.\n */import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from\"react/jsx-runtime\";import React,{Suspense,useState,useEffect}from\"react\";import{addPropertyControls,ControlType}from\"framer\";// Dynamically import components only on the client side\nconst SLCard=/*#__PURE__*/React.lazy(()=>import(\"https://framer.com/m/SLCard-hOZQ.js@kP0xDfG3uqMoAGsqZtg1\"));const ButtonCopy2=/*#__PURE__*/React.lazy(()=>import(\"https://framer.com/m/Button-idp4gz.js\"));const SLInputCheckBox=/*#__PURE__*/React.lazy(()=>import(\"https://framer.com/m/SLInputCheckBox-h3bH.js@Zm4pNyQ1LqEnBAJitYQC\"));const SLInputText=/*#__PURE__*/React.lazy(()=>import(\"https://framer.com/m/SLInputText-loCW.js@oIwWul9GqpMO9i4VL7lG\"));/**\n * Main component: FormDev\n * - Manages form data and submission.\n * - Polls for task status if needed.\n * - Displays the CardDev component for loading, submitted, and error states.\n */export default function SLForm(props){// API Endpoints\nconst baseUrl=\"https://free-tools.macpaw.com/api/serial-lookup\";const formUrl=`${baseUrl}/processing/`;const statusUrl=taskId=>`${baseUrl}/processing/status/${taskId}`;const[isClient,setIsClient]=useState(false);// Polling Config\nconst MAX_ATTEMPTS=40;const POLL_INTERVAL=2e3// in ms\n;// State\nconst[formData,setFormData]=useState({email:\"\",serialNumber:\"\",agreePrivacyPolicy:false,subscribeNewsletter:false});const[formStatus,setFormStatus]=useState(\"unsubmitted\");const[responseData,setResponseData]=useState(null);const[isSubmitting,setIsSubmitting]=useState(false);const[serialLookupError,setSerialLookupError]=useState(null);const INVALID_SERIAL_UI_MESSAGE=\"The serial number looks incorrect. Please check it and try again.\";const isSuccessStatus=status=>status===\"SUCCESS\";const isFailureStatus=status=>status===\"ERROR\"||status===\"FAILURE\"||status===\"FAILED\";const isPendingStatus=status=>status===\"PROCESSING\"||status===\"PENDING\"||status===\"STARTED\";const normalizeMessage=value=>value.toLowerCase().replace(/[’']/g,\"\");const isInvalidSerialResponse=data=>{const signals=[data?.message,data?.result?.model,data?.result?.message,data?.error];return signals.some(value=>{if(typeof value!==\"string\")return false;const normalized=normalizeMessage(value);return normalized.includes(\"serial number\")&&normalized.includes(\"isnt valid\");});};const sanitizeSerialLookupResponse=data=>{const additionalInfo=data?.result?.additional_info;if(!additionalInfo||typeof additionalInfo!==\"object\")return data;const{image_url,...additionalInfoWithoutImage}=additionalInfo;return{...data,result:{...data.result,additional_info:additionalInfoWithoutImage}};};/**\n     * handleInputChange\n     * Updates formData on every keystroke or checkbox toggle.\n     */const handleInputChange=event=>{const{name,value,type,checked}=event.target;setFormData(prev=>({...prev,[name]:type===\"checkbox\"?checked:value}));if(name===\"serialNumber\"&&serialLookupError){setSerialLookupError(null);}};/**\n     * pollTaskStatus\n     * Polls the server for task status until completion or error.\n     */const pollTaskStatus=async taskId=>{for(let attempt=1;attempt<=MAX_ATTEMPTS;attempt++){await new Promise(resolve=>setTimeout(resolve,POLL_INTERVAL));try{const res=await fetch(statusUrl(taskId),{mode:\"cors\",headers:{Accept:\"application/json\"}});if(!res.ok)throw new Error(\"Status check failed\");const data=await res.json();if(isInvalidSerialResponse(data)){setSerialLookupError(INVALID_SERIAL_UI_MESSAGE);setResponseData(null);setFormStatus(\"unsubmitted\");setIsSubmitting(false);return;}if(isSuccessStatus(data.status)){setResponseData(sanitizeSerialLookupResponse(data));setFormStatus(\"submitted\");setIsSubmitting(false);return;}if(isFailureStatus(data.status)){setResponseData(null);setFormStatus(\"error\");setIsSubmitting(false);return;}// PENDING / STARTED / PROCESSING — continue polling\n}catch(err){setFormStatus(\"error\");setIsSubmitting(false);return;}}// Exceeded maximum attempts\nsetFormStatus(\"error\");setIsSubmitting(false);};/**\n     * handleSubmit\n     * Submits the form data to the server for processing.\n     * If processing is long-running, we start polling for status.\n     */const handleSubmit=async event=>{event.preventDefault();setSerialLookupError(null);setFormStatus(\"loading\");setIsSubmitting(true);try{const response=await fetch(formUrl,{mode:\"cors\",method:\"POST\",headers:{\"Content-Type\":\"application/json\",Accept:\"application/json\"},body:JSON.stringify({email:formData.email,serial_number:formData.serialNumber,subscribe_newsletter:formData.subscribeNewsletter})});if(!response.ok)throw new Error(\"Network response was not ok\");const data=await response.json();if(isInvalidSerialResponse(data)){setSerialLookupError(INVALID_SERIAL_UI_MESSAGE);setResponseData(null);setFormStatus(\"unsubmitted\");setIsSubmitting(false);return;}// If the task completed immediately\nif(isSuccessStatus(data.status)){setResponseData(sanitizeSerialLookupResponse(data));setFormStatus(\"submitted\");setIsSubmitting(false);return;}// If there's an error\nif(isFailureStatus(data.status)){setFormStatus(\"error\");setIsSubmitting(false);return;}// If the task is still pending, poll the status endpoint\nif(isPendingStatus(data.status)&&data.task_id){await pollTaskStatus(data.task_id);}else{// Unexpected status\nsetFormStatus(\"error\");setIsSubmitting(false);}}catch(error){setFormStatus(\"error\");setIsSubmitting(false);}};/**\n     * handleCloseCard\n     * Resets the UI state, hiding the card and clearing response data.\n     */const handleCloseCard=()=>{setFormStatus(\"unsubmitted\");setResponseData(null);setIsSubmitting(false);setSerialLookupError(null);};useEffect(()=>{setIsClient(true);},[]);if(!isClient){return null;}// Render\nreturn /*#__PURE__*/_jsx(Suspense,{fallback:/*#__PURE__*/_jsx(\"div\",{style:loadingTextStyle,children:\"Loading...\"}),children:/*#__PURE__*/_jsxs(\"div\",{style:formWrapperStyle,children:[/*#__PURE__*/_jsxs(\"form\",{onSubmit:handleSubmit,style:formContainerStyle,children:[/*#__PURE__*/_jsx(SLInputText,{name1:\"email\",type:\"email\",value:formData.email,placeholder:\"Email\",onChange:handleInputChange,style:inputFieldStyle}),/*#__PURE__*/_jsx(SLInputText,{name1:\"serialNumber\",placeholder:\"Serial Number\",value:formData.serialNumber,onChange:handleInputChange,style:inputFieldStyle}),serialLookupError&&/*#__PURE__*/_jsx(\"p\",{style:formErrorTextStyle,children:serialLookupError}),/*#__PURE__*/_jsx(\"div\",{style:checkboxRowStyle,children:/*#__PURE__*/_jsx(SLInputCheckBox,{name:\"agreePrivacyPolicy\",checked:formData.agreePrivacyPolicy,onChange:handleInputChange,content:/*#__PURE__*/_jsxs(_Fragment,{children:[\"I agree to the\",\" \",/*#__PURE__*/_jsx(\"a\",{href:\"https://setapp.com/privacy-policy\",target:\"_blank\",rel:\"noopener\",children:\"privacy policy\"}),\".\"]})})}),/*#__PURE__*/_jsx(\"div\",{style:checkboxRowStyle,children:/*#__PURE__*/_jsx(SLInputCheckBox,{name:\"subscribeNewsletter\",checked:formData.subscribeNewsletter,onChange:handleInputChange,required:false,content:\"Sign me up for updates and newsletters about similar tools and services.\"})}),/*#__PURE__*/_jsx(ButtonCopy2,{title:isSubmitting?\"Processing...\":\"Lookup now\",style:buttonStyle})]}),formStatus===\"loading\"&&/*#__PURE__*/_jsx(SLCard,{status:\"loading\",onClose:handleCloseCard}),formStatus===\"submitted\"&&responseData&&/*#__PURE__*/_jsx(SLCard,{rawContent:responseData.result,onClose:handleCloseCard,status:\"submitted\"}),formStatus===\"error\"&&/*#__PURE__*/_jsx(SLCard,{status:\"error\",onClose:handleCloseCard})]})});}// =====================\n//      STYLES\n// =====================\nconst formWrapperStyle={width:\"100%\",maxWidth:\"100%\",margin:\"0 auto\",padding:0,display:\"flex\",justifyContent:\"flex-start\"};const formContainerStyle={display:\"flex\",flexDirection:\"column\",alignItems:\"flex-start\",gap:18,width:\"100%\",maxWidth:564,fontFamily:'\"Avenir Next W1G Regular\", \"Avenir Next W1G Regular Placeholder\", sans-serif'};const inputFieldStyle={width:\"100%\",minHeight:56};const checkboxRowStyle={width:\"100%\",display:\"flex\",alignItems:\"flex-start\"};const buttonStyle={marginTop:6,width:\"min(260px, 100%)\",minHeight:56,borderRadius:10,alignSelf:\"flex-start\"};const formErrorTextStyle={margin:\"2px 0 0\",fontSize:13,lineHeight:\"18px\",color:\"#d92d20\",fontFamily:'\"Avenir Next W1G Regular\", \"Avenir Next W1G Regular Placeholder\", sans-serif'};const loadingTextStyle={fontFamily:'\"Avenir Next W1G Regular\", \"Avenir Next W1G Regular Placeholder\", sans-serif',color:\"#52535e\",fontSize:14,lineHeight:\"20px\"};addPropertyControls(SLForm,{buttonWidth:{type:ControlType.String}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"SLForm\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./SLForm.map"],"mappings":"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"}