input-states-react/dist/input-states-react.umd.js

Reusable UI components for forms and steps

(function(T,i){typeof exports=="object"&&typeof module<"u"?i(exports,require("react")):typeof define=="function"&&define.amd?define(["exports","react"],i):(T=typeof globalThis<"u"?globalThis:T||self,i(T.InputStatesReact={},T.React))})(this,function(T,i){"use strict";var Q={exports:{}},U={};/**
 * @license React
 * react-jsx-runtime.production.js
 *
 * Copyright (c) Meta Platforms, Inc. and affiliates.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 */var re;function ge(){if(re)return U;re=1;var n=Symbol.for("react.transitional.element"),s=Symbol.for("react.fragment");function r(o,d,m){var E=null;if(m!==void 0&&(E=""+m),d.key!==void 0&&(E=""+d.key),"key"in d){m={};for(var S in d)S!=="key"&&(m[S]=d[S])}else m=d;return d=m.ref,{$$typeof:n,type:o,key:E,ref:d!==void 0?d:null,props:m}}return U.Fragment=s,U.jsx=r,U.jsxs=r,U}var J={};/**
 * @license React
 * react-jsx-runtime.development.js
 *
 * Copyright (c) Meta Platforms, Inc. and affiliates.
 *
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 */var ne;function ve(){return ne||(ne=1,process.env.NODE_ENV!=="production"&&function(){function n(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===X?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case _:return"Fragment";case w:return"Profiler";case v:return"StrictMode";case z:return"Suspense";case Z:return"SuspenseList";case B:return"Activity"}if(typeof e=="object")switch(typeof e.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case g:return"Portal";case M:return(e.displayName||"Context")+".Provider";case C:return(e._context.displayName||"Context")+".Consumer";case D:var a=e.render;return e=e.displayName,e||(e=a.displayName||a.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case k:return a=e.displayName||null,a!==null?a:n(e.type)||"Memo";case P:a=e._payload,e=e._init;try{return n(e(a))}catch{}}return null}function s(e){return""+e}function r(e){try{s(e);var a=!1}catch{a=!0}if(a){a=console;var h=a.error,R=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return h.call(a,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",R),s(e)}}function o(e){if(e===_)return"<>";if(typeof e=="object"&&e!==null&&e.$$typeof===P)return"<...>";try{var a=n(e);return a?"<"+a+">":"<...>"}catch{return"<...>"}}function d(){var e=Y.A;return e===null?null:e.getOwner()}function m(){return Error("react-stack-top-frame")}function E(e){if(p.call(e,"key")){var a=Object.getOwnPropertyDescriptor(e,"key").get;if(a&&a.isReactWarning)return!1}return e.key!==void 0}function S(e,a){function h(){b||(b=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",a))}h.isReactWarning=!0,Object.defineProperty(e,"key",{get:h,configurable:!0})}function x(){var e=n(this.type);return V[e]||(V[e]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),e=this.props.ref,e!==void 0?e:null}function N(e,a,h,R,F,y,$,ee){return h=y.ref,e={$$typeof:u,type:e,key:a,props:y,_owner:F},(h!==void 0?h:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:x}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:$}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:ee}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function l(e,a,h,R,F,y,$,ee){var I=a.children;if(I!==void 0)if(R)if(j(I)){for(R=0;R<I.length;R++)c(I[R]);Object.freeze&&Object.freeze(I)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else c(I);if(p.call(a,"key")){I=n(e);var G=Object.keys(a).filter(function(we){return we!=="key"});R=0<G.length?"{key: someKey, "+G.join(": ..., ")+": ...}":"{key: someKey}",O[I+R]||(G=0<G.length?"{"+G.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
  let props = %s;
  <%s {...props} />
React keys must be passed directly to JSX without using spread:
  let props = %s;
  <%s key={someKey} {...props} />`,R,I,G,I),O[I+R]=!0)}if(I=null,h!==void 0&&(r(h),I=""+h),E(a)&&(r(a.key),I=""+a.key),"key"in a){h={};for(var te in a)te!=="key"&&(h[te]=a[te])}else h=a;return I&&S(h,typeof e=="function"?e.displayName||e.name||"Unknown":e),N(e,I,y,F,d(),h,$,ee)}function c(e){typeof e=="object"&&e!==null&&e.$$typeof===u&&e._store&&(e._store.validated=1)}var f=i,u=Symbol.for("react.transitional.element"),g=Symbol.for("react.portal"),_=Symbol.for("react.fragment"),v=Symbol.for("react.strict_mode"),w=Symbol.for("react.profiler"),C=Symbol.for("react.consumer"),M=Symbol.for("react.context"),D=Symbol.for("react.forward_ref"),z=Symbol.for("react.suspense"),Z=Symbol.for("react.suspense_list"),k=Symbol.for("react.memo"),P=Symbol.for("react.lazy"),B=Symbol.for("react.activity"),X=Symbol.for("react.client.reference"),Y=f.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,p=Object.prototype.hasOwnProperty,j=Array.isArray,H=console.createTask?console.createTask:function(){return null};f={"react-stack-bottom-frame":function(e){return e()}};var b,V={},L=f["react-stack-bottom-frame"].bind(f,m)(),A=H(o(m)),O={};J.Fragment=_,J.jsx=function(e,a,h,R,F){var y=1e4>Y.recentlyCreatedOwnerStacks++;return l(e,a,h,!1,R,F,y?Error("react-stack-top-frame"):L,y?H(o(e)):A)},J.jsxs=function(e,a,h,R,F){var y=1e4>Y.recentlyCreatedOwnerStacks++;return l(e,a,h,!0,R,F,y?Error("react-stack-top-frame"):L,y?H(o(e)):A)}}()),J}var se;function xe(){return se||(se=1,process.env.NODE_ENV==="production"?Q.exports=ge():Q.exports=ve()),Q.exports}var t=xe();const oe=n=>t.jsxs("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...n,children:[t.jsx("path",{d:"M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z",stroke:"#FF0000",strokeWidth:"2",strokeMiterlimit:"10"}),t.jsx("path",{d:"M12 17V11",stroke:"#FF0000",strokeWidth:"2",strokeMiterlimit:"10"}),t.jsx("path",{d:"M11.9998 7.5C12.4415 7.5 12.7995 7.85807 12.7996 8.2998C12.7996 8.74163 12.4416 9.09961 11.9998 9.09961C11.558 9.0995 11.2 8.74157 11.2 8.2998C11.2001 7.85813 11.5581 7.50011 11.9998 7.5Z",fill:"#FF0000",stroke:"#FF0000",strokeMiterlimit:"10"})]}),K=n=>t.jsx("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...n,children:t.jsx("path",{d:"M2 12.6924L8.245 19L22 5",stroke:"#2DCD73",strokeWidth:"2",strokeMiterlimit:"10"})}),ae=i.forwardRef(({height:n=200,checked:s,onChange:r,children:o,errorMessage:d="กรุณากรอกข้อมูลให้ถูกต้อง",requireFullScroll:m=!0,scrollThreshold:E=.95},S)=>{const[x,N]=i.useState(!1),[l,c]=i.useState(!1),[f,u]=i.useState(!1),[g,_]=i.useState(0),v=i.useRef(null),w=i.useRef(null);i.useImperativeHandle(S,()=>({validate:()=>(N(!0),s===!0),focus:()=>{w.current&&w.current.scrollIntoView({behavior:"smooth",block:"center"}),setTimeout(()=>{v.current&&v.current.focus()},300)}}));const C=i.useRef(null),[M,D]=i.useState(!1);i.useEffect(()=>{const k=C.current,P=()=>{k.scrollTop+k.clientHeight>=k.scrollHeight-1&&(D(!0),c(!1),u(!0))};if(k.scrollHeight<=k.clientHeight&&D(!0),k)return k.scrollHeight<=k.clientHeight&&(D(!0),u(!0)),k.addEventListener("scroll",P),()=>k.removeEventListener("scroll",P)},[]);const z=()=>{M||c(!0)},Z=k=>{const P=k.target,B=P.scrollTop,X=P.scrollHeight,Y=P.clientHeight,p=B/(X-Y);_(Math.min(p,1)),p>=E&&u(!0)};return t.jsxs("div",{className:"input-group consent-scroll-box",ref:w,children:[t.jsxs("label",{className:"consent-container",onClick:z,children:[t.jsx("input",{ref:v,type:"checkbox",checked:s,disabled:!M,onChange:k=>{M&&(r(k.target.checked),c(!1)),N(!0)}}),t.jsx("span",{className:"custom-checkbox",children:s?t.jsxs("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",children:[t.jsx("rect",{x:"2",y:"2",width:"20",height:"20",rx:"4",stroke:"#007BFF",strokeWidth:"2"}),t.jsx("path",{d:"M7 12L10 15L17 8",stroke:"#007BFF",strokeWidth:"2"})]}):t.jsx("svg",{width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",children:t.jsx("rect",{x:"2",y:"2",width:"20",height:"20",rx:"4",stroke:"#ccc",strokeWidth:"2"})})}),t.jsxs("div",{className:"scroll-container",style:{position:"relative",width:"100%"},children:[t.jsx("div",{ref:C,className:`scroll-content ${l?"error":""}`,style:{height:n,border:`1px solid ${l?"var(--font-color-error-pws)":"#ddd"}`},onScroll:Z,tabIndex:0,children:t.jsx("div",{dangerouslySetInnerHTML:{__html:o}})}),m&&t.jsx("div",{style:{position:"absolute",bottom:"8px",right:"8px",backgroundColor:f?"":"#007bff",color:"white",padding:"4px 8px",borderRadius:"12px",fontSize:"12px",fontWeight:"bold"},children:f?t.jsx(K,{}):`${Math.round(g*100)}%`})]})]}),l?t.jsx("div",{className:"text-error-message",children:"※ กรุณาเลื่อนอ่านข้อมูลให้ครบก่อนติ๊กยินยอม"}):x&&!s?t.jsx("div",{className:"text-error-message",children:d||"※ กรุณายินยอมก่อนดำเนินการต่อ"}):null]})}),ie=i.forwardRef(({head:n,label:s,value:r,onChange:o,errorMessage:d,required:m},E)=>{const[S,x]=i.useState(!1),l=(g=>/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(g))(r),f=S&&(m||r!=="")&&!l,u=i.useRef(null);return i.useImperativeHandle(E,()=>({validate:()=>(x(!0),l),focus:()=>{u.current&&(u.current.focus(),setTimeout(()=>{const g=u.current.getBoundingClientRect();window.scrollTo({top:window.scrollY+g.top-80-24,behavior:"smooth"})},10))}})),t.jsxs("div",{className:`input-group ${f?"error":""} ${!f&&S&&l?"valid":""}`,children:[n&&t.jsx("div",{className:"group-label",children:n}),t.jsxs("div",{className:"input-inner",children:[t.jsx("input",{ref:u,type:"email",className:"form-input",placeholder:" ",value:r,onChange:g=>{o(g.target.value),x(!0)},onBlur:()=>x(!0)}),t.jsxs("label",{className:"input-label",children:[s,m&&" "]}),t.jsx("span",{className:"validation-icon valid-icon",children:t.jsx(K,{})}),t.jsx("span",{className:"validation-icon error-icon",children:t.jsx(oe,{})}),f&&t.jsx("div",{className:"text-error-message",children:d})]})]})});function le({html:n,children:s,className:r="",style:o={}}){return n?t.jsx("div",{className:`text-default label-standard ${r}`,style:o,dangerouslySetInnerHTML:{__html:n}}):t.jsx("div",{className:`text-default label-standard ${r}`,style:o,children:s})}const ce=(n,s=0)=>{const r=(n??"").toString().replace(/,/g,"");if(r==="")return"";if(r.endsWith(".")&&s>0){const d=r.slice(0,-1);if(d===""&&r===".")return"0.";const m=parseFloat(d);return isNaN(m)?r:m.toLocaleString(void 0,{minimumFractionDigits:0,maximumFractionDigits:0})+"."}const o=parseFloat(r);return isNaN(o)?r:o.toLocaleString(void 0,{minimumFractionDigits:s,maximumFractionDigits:s})},W=(n,s)=>{let r="",o=!1;typeof n!="string"&&(n=(n??"").toString());for(let d=0;d<n.length;d++){const m=n[d];/\d/.test(m)?r+=m:m==="."&&!o&&s>0?(r+=".",o=!0):m==="-"&&d===0&&r===""&&(r+="-")}return r==="."&&s>0?"0.":r==="-."&&s>0?"-0.":r.startsWith(".")&&s>0&&r.length>1?"0"+r:r.startsWith("-.")&&s>0&&r.length>2?"-0"+r.substring(1):r},ue=i.forwardRef(({head:n="หัวข้อ",label:s="Label",suggest:r="",value:o,onChange:d,min:m=-1/0,max:E=1/0,errorMessage:S="กรุณากรอกข้อมูลให้ถูกต้อง",required:x=!1,maxDigit:N=null,decimalPlaces:l=0},c)=>{const[f,u]=i.useState(""),[g,_]=i.useState(!1),[v,w]=i.useState(!1),C=i.useRef(null),M=i.useRef({value:"",cursor:0});i.useEffect(()=>{const p=o==null?"":o.toString(),j=W(p,l);if(!v)u(ce(j,l));else{const H=W(f,l);j!==H&&(u(j),C.current&&(M.current={value:j,cursor:j.length}))}},[o,v,l]);const D=parseFloat(W(f,l)),z=W(f,l),Z=!x&&z===""||z==="-"&&!x||!isNaN(D)&&D>=m&&D<=E;i.useImperativeHandle(c,()=>({validate:()=>{_(!0);const p=W(f,l);if(!x&&p===""||p==="-"&&!x)return!0;const j=parseFloat(p);return!isNaN(j)&&j>=m&&j<=E},focus:()=>{C.current&&(C.current.focus(),setTimeout(()=>{const p=C.current.getBoundingClientRect();window.scrollTo({top:window.scrollY+p.top-100-24,behavior:"smooth"})},10))}}));const k=g&&!Z&&!!S,P=()=>{w(!0);const p=W(f,l);u(p),C.current&&(M.current={value:p,cursor:p.length})},B=p=>{const j=p.target.value,H=p.target.selectionStart;M.current={value:j,cursor:H};let b="",V=!1,L=!1;for(let F=0;F<j.length;F++){const y=j[F];/\d/.test(y)?b+=y:y==="."&&!V&&l>0?(b+=y,V=!0):y==="-"&&F===0&&!L&&(b+=y,L=!0)}b==="."&&l>0&&(b="0."),b==="-."&&l>0&&(b="-0.");let A="",O=b;b.startsWith("-")&&(A="-",O=b.substring(1));let[e,a]=O.split(".");e=e||"",N&&e.length>N&&(e=e.slice(0,N)),a!==void 0?(l!=null&&a.length>l&&(a=a.slice(0,l)),O=e+"."+a):O=e,b=A+O;let h=e;if(e){const F=parseFloat(e);(!isNaN(F)||e.match(/^0+$/))&&(h=F.toLocaleString(void 0,{minimumFractionDigits:0,maximumFractionDigits:0}))}let R=A+h;a!==void 0?R+="."+a:O.endsWith(".")&&l>0&&O.length>0&&e.length>=0&&(R===A&&O==="."?R=A+"0.":R.endsWith(".")||(R+=".")),b==="0."&&l>0&&(R="0."),b==="-0."&&l>0&&(R="-0."),u(R),d(b),g||_(!0)};i.useLayoutEffect(()=>{if(v&&C.current){const p=C.current,{value:j,cursor:H}=M.current,b=f;if(j===b&&p.value===b&&p.selectionStart===H)return;let V=0;for(let e=0;e<H;e++)j[e]!==","&&V++;let L=0,A=0;for(let e=0;e<b.length&&(b[e]!==","&&A++,L++,!(A>=V));e++);if(A<V&&A===0&&b.length>0)L=0,b.startsWith("-")&&(L=1);else if(A<V){let e=0,a=0;for(let h=0;h<b.length&&(b[h]!==","&&a++,e++,!(a>=A));h++);L=e}const O=Math.max(0,Math.min(L,p.value.length));p.value===b&&p.setSelectionRange(O,O)}},[f,v]);const X=()=>{w(!1),_(!0);const p=W(f,l);let j=p;if(p===""||p==="-")u(p==="-"?"-":""),j=p==="-"?"-":"";else{const H=parseFloat(p);isNaN(H)?(u(p),j=p):(j=H.toFixed(l),u(ce(j,l)))}d(j)},Y=f;return t.jsxs("div",{className:`input-group numeric-input-wrapper ${k?"error":""}`,children:[n&&t.jsx("div",{className:"group-label",children:n}),t.jsxs("div",{className:"numeric-input-inner",children:[t.jsx("span",{className:"left-label",children:s}),t.jsx("input",{ref:C,type:"text",value:Y,onChange:B,onFocus:P,onBlur:X,className:`numeric-input ${k?"input-error":""}`,placeholder:r,inputMode:"decimal",onKeyDown:p=>{p.key}})]}),k&&t.jsx("div",{className:"text-error-message",children:S})]})}),fe=i.forwardRef(({head:n,name:s,options:r,value:o,onChange:d,errorMessage:m="กรุณากรอกข้อมูลให้ถูกต้อง",direction:E="horizontal"},S)=>{const[x,N]=i.useState(!1),[l,c]=i.useState(null),f=i.useRef(null),u=i.useRef(null);i.useImperativeHandle(S,()=>({validate:()=>(N(!0),!!o),focus:()=>{f.current&&f.current.scrollIntoView({behavior:"smooth",block:"center"}),setTimeout(()=>{u.current&&u.current.focus()},300)}}));const g=x&&!o,_=E==="vertical"?"radio-options-row-Vertical":"radio-options-row-Horizontal";return t.jsxs("div",{ref:f,className:"input-group radio-group-horizontal",children:[n&&t.jsx("div",{className:"group-label",children:n}),t.jsx("div",{className:_,children:r.map((v,w)=>{const C=o===v.value,M=l===v.value;return t.jsxs("label",{className:"radio-option",onMouseEnter:()=>c(v.value),onMouseLeave:()=>c(null),children:[t.jsx("input",{ref:w===0?u:null,type:"radio",name:s,value:v.value,checked:C,onChange:d}),t.jsx("span",{className:"custom-radio-customForm",children:C?t.jsxs("svg",{width:"25",height:"25",viewBox:"0 0 24 24",fill:"none",children:[t.jsx("circle",{cx:"12",cy:"12",r:"10",stroke:"#0064FF",strokeWidth:"2"}),t.jsx("path",{d:"M7 12L10 15L16 8",stroke:"#0064FF",strokeWidth:"2"})]}):M?t.jsx("svg",{width:"25",height:"25",viewBox:"0 0 24 24",fill:"none",children:t.jsx("circle",{cx:"12",cy:"12",r:"10",stroke:"#0064FF",strokeWidth:"2"})}):t.jsx("svg",{width:"25",height:"25",viewBox:"0 0 24 24",fill:"none",children:t.jsx("circle",{cx:"12",cy:"12",r:"10",stroke:"#ccc",strokeWidth:"2"})})}),t.jsx("span",{className:"radio-text",children:v.label})]},v.value)})}),g&&t.jsx("div",{className:"text-error-message",children:m||"กรุณาเลือกเพศ"})]})}),de=i.forwardRef(({head:n,label:s,value:r,onChange:o,errorMessage:d="กรุณากรอกข้อมูลให้ถูกต้อง",required:m},E)=>{const[S,x]=i.useState(!1),N=i.useRef(null),l=/^[a-zA-Z\u0E00-\u0E7F\s]+$/,f=(v=>{const w=v||"";return!m||w.trim()!==""&&l.test(w)})(r),g=S&&(m||r!=="")&&!f,_=v=>{let w=v.target.value;w=w.replace(/[^a-zA-Z\u0E00-\u0E7F\s]/g,""),o(w),x(!0)};return i.useImperativeHandle(E,()=>({validate:()=>(x(!0),f),focus:()=>{N.current&&(N.current.focus(),setTimeout(()=>{const v=N.current.getBoundingClientRect();window.scrollTo({top:window.scrollY+v.top-80-24,behavior:"smooth"})},10))}})),t.jsxs("div",{className:`input-group ${g?"error":""} ${!g&&S&&f?"valid":""}`,children:[n&&t.jsx("div",{className:"group-label",children:n}),t.jsxs("div",{className:"input-inner",children:[t.jsx("input",{ref:N,type:"text",className:"form-input",placeholder:" ",value:r||"",onChange:_,onBlur:()=>x(!0)}),t.jsxs("label",{className:"input-label",children:[s,m&&" "]}),t.jsx("span",{className:"validation-icon valid-icon",children:t.jsx(K,{})}),t.jsx("span",{className:"validation-icon error-icon",children:t.jsx(oe,{})}),g&&t.jsx("div",{className:"text-error-message",children:d})]})]})}),me=({children:n,type:s="button",className:r="",...o})=>t.jsx("button",{type:s,className:`btn-primary  ${r}`,...o,children:n}),be=({steps:n,initialStep:s=1})=>{const[r,o]=i.useState(s),[d,m]=i.useState({}),E=l=>{console.log(`Stepper: Step ${r} completed. Data:`,l),m(c=>({...c,[r-1]:l})),r<n.length?o(c=>c+1):console.log("Stepper: All steps completed!")},S=l=>{l<r&&o(l)},x=n[r-1];let N;return x&&(N=i.cloneElement(x.component,{onStepComplete:E,stepsData:d})),t.jsxs("div",{className:"stepper-container",children:[t.jsx("div",{className:"stepper-row",children:n.map((l,c)=>{const f=c+1,u=f<r,g=f===r,_=u;let v="stepper-item__indicator";u?v+=" stepper-item__indicator--completed":g?v+=" stepper-item__indicator--active":v+=" stepper-item__indicator--upcoming",_&&(v+=" stepper-item__indicator--clickable");let w="stepper-item__label";u||g?w+=" stepper-item__label--highlighted":w+=" stepper-item__label--dimmed";let C="stepper-line";return u&&(C+=" stepper-line--completed"),t.jsxs(i.Fragment,{children:[t.jsxs("div",{className:"stepper-item",children:[t.jsx("div",{className:v,onClick:()=>_?S(f):null,children:u?t.jsx("svg",{className:"stepper-item__icon",viewBox:"0 0 20 20",fill:"currentColor",children:t.jsx("path",{fillRule:"evenodd",d:"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z",clipRule:"evenodd"})}):t.jsx("span",{className:"stepper-item__number",children:f})}),t.jsx("p",{className:w,children:l.name})]}),f<n.length&&t.jsx("div",{className:C})]},l.name+c)})}),t.jsx("div",{className:"stepper-content",children:N})]})};function Ee(n){const s={};return n.forEach(r=>{var o;(!r.type||r.type==="input")&&r.name&&(r.name==="consent"?s[r.name]=!1:s[r.name]=((o=r.props)==null?void 0:o.defaultValue)??"")}),s}const je={RadioGroup:fe,NumericTextInput:ue,EmailInput:ie,ConsentCheckbox:ae,TextInput:de,StandardLabel:le};function Re(n){return(n||[]).map(s=>{const r=typeof s.component=="string"?s.component.trim():s.component;return{...s,component:typeof r=="string"?je[r]:r}})}function pe(){const[n,s]=i.useState({});return{errors:n,setErrors:s,clearFieldError:o=>{s(d=>{const{[o]:m,...E}=d;return E})}}}const q=(n,s,r)=>o=>{var m;const d=((m=o==null?void 0:o.target)==null?void 0:m.value)??o;s(E=>({...E,[n]:d})),r(E=>{const{[n]:S,...x}=E;return x})};function he(n,s){const r={};return Object.keys(n).forEach(o=>{var d;(d=n[o].current)!=null&&d.validate()||(r[o]=s[o])}),r}const Se=({onFormSubmitAndValidated:n,fields:s,formData:r,setFormData:o,buttonLabel:d})=>{const{errors:m,setErrors:E}=pe(),[S,x]=i.useState(!1),N=Object.fromEntries(s.filter(c=>c.type!=="label"&&c.name).map(c=>[c.name,i.useRef()])),l=async c=>{c.preventDefault(),x(!0);const f=he(N,Object.fromEntries(s.filter(u=>!u.type||u.type!=="label").map(u=>[u.name,u.errorMessage])));if(E(f),Object.keys(f).length>0){const u=Object.keys(f)[0],g=N[u];g&&g.current&&typeof g.current.focus=="function"&&g.current.focus(),x(!1);return}try{await new Promise(u=>setTimeout(u,3e3)),n&&n(r)}catch(u){console.error(u),alert("เกิดข้อผิดพลาด กรุณาลองใหม่อีกครั้ง")}x(!1)};return t.jsxs("form",{onSubmit:l,children:[s.map((c,f)=>{if(!c.component)return null;if(c.type==="custom"){const _=c.component;return t.jsx(_,{...c.props},f)}const u=c.component,g=N[c.name];return c.name==="consent"?t.jsx(u,{ref:g,...c.props,checked:!!r[c.name],onChange:q(c.name,o,()=>{},c.errorMessage),errorMessage:c.errorMessage},f):t.jsx(u,{ref:g,...c.props,value:r[c.name],onChange:q(c.name,o,()=>{},c.errorMessage),errorMessage:c.errorMessage},f)}),t.jsx("div",{className:"submit-container",children:t.jsx(me,{type:"submit",className:"btn-primary",disabled:S,children:d})})]})};function Ne(n){const s=parseInt((n||"").toString().replace(/[^\d]/g,""),10);return isNaN(s)?"-":s.toLocaleString()}T.BaseForm=Se,T.ButtonPrimary=me,T.ConsentCheckbox=ae,T.EmailInput=ie,T.Label=le,T.NumericTextInput=ue,T.RadioGroup=fe,T.Stepper=be,T.TextInput=de,T.formatNumber=Ne,T.getInitialFormData=Ee,T.mapFieldComponents=Re,T.updateFieldState=q,T.useFormErrors=pe,T.validateFields=he,Object.defineProperty(T,Symbol.toStringTag,{value:"Module"})});