@snowball-tech/fractal/dist/chunk-HOVNAEN3.js

Fractal's (Snowball's design system) React component library based on RadixUI and PandaCSS

'use client';
import{a as ee}from"./chunk-C6ZVGGW3.js";import{a as re}from"./chunk-BBTSMODL.js";import{a as te}from"./chunk-IU6NEDME.js";import{a as t,b as w,c as v,d as U}from"./chunk-5YED4B7W.js";import{b as O}from"./chunk-ZVU3BHJI.js";import{a as C}from"./chunk-HTOKQYVM.js";import{b as r}from"./chunk-CMFNILWJ.js";import{a,b as L}from"./chunk-XYM7TA65.js";import{Label as be}from"@radix-ui/react-label";import{UilCheckCircle as ge,UilExclamationCircle as Ne,UilSearchAlt as Ie}from"@tooni/iconscout-unicons-react";import ne,{getExampleNumber as Re}from"libphonenumber-js/max";import Se from"libphonenumber-js/mobile/examples";import{forwardRef as Pe,useCallback as we,useEffect as ve,useId as Ee,useImperativeHandle as Fe,useRef as A,useState as m}from"react";import n from"lodash/fp/isEmpty";import oe from"lodash/fp/isFunction";import ke from"lodash/fp/omit";import{Fragment as Te,jsx as l,jsxs as d}from"react/jsx-runtime";var se=Pe(({autoFocus:le=!1,defaultValue:b,description:D,disabled:p=!1,emptyPrefixLabel:ae="-",error:M,id:ce,label:q,name:B,onChange:g,placeholder:_,readOnly:$=!1,required:N=!1,searchPlaceholder:ie,success:H,updateOnInvalid:ue=!0,value:I,withPrefix:u=!0,...J},pe)=>{L();let G=Ee(),h=(ce??G)||G,K=A(null),W=A(null),R=A(null);Fe(pe,()=>({get phone(){return K?.current??null},get prefix(){return W?.current??null},get searchPrefixInput(){return R?.current??null}}));let[X,Y]=m(!1),[fe,me]=m(""),[E,de]=m(U),[c,_e]=m(null),[F,S]=m(""),[j,z]=m(null),[$e,Q]=m(_),x=we(e=>{if(_e(e),n(e.countryCode))return;let o=v?.[e.countryCode]??null;z(o);let{countryCode:s}=e;n(s)?Q(_):Q(Re(s,Se)?.formatNational()??_)},[_]);ve(()=>{if(!u){S(I?.number??b?.number??"");return}if(n(I)&&n(b)){let{locale:s="fr-FR"}=Intl.DateTimeFormat().resolvedOptions(),i=new Intl.Locale(s)?.region??"FR";if(!n(i)){let f=v?.[i]??null;n(f)||(n(f.prefix)||x({countryCode:i,prefix:f.prefix}),z(f))}return}let e=I?.number??b?.number??"",o=ne(e,w);if(n(o)){n(c?.countryCode)&&(x({countryCode:w,prefix:v?.[w]?.prefix??""}),S(e.replace("+","")));return}x({countryCode:o.country??c?.countryCode,prefix:o.countryCallingCode}),S(o.nationalNumber)},[x,b,I,c?.countryCode,u]);let y=!n(M),k=!n(H),P=y,T=k&&!P,V=(e,o)=>{if(!u){oe(g)&&g({number:o});return}if(n(e))return;let s=`+${e.prefix}${o.replaceAll(/^\+/g,"")}`,i=ne(s),f=i?.isValid()??!1;oe(g)&&(f||ue)&&g({countryCode:e.countryCode,number:i?.number??s},f)},he=e=>{x(e),n(F)||V(e,F)},xe=e=>{S(e),(!u||!n(c))&&V(c,e)},Z=(e,o=!0)=>{me(e),de(U.filter(({countryName:s})=>s.search(new RegExp(`.*${e}.*`,"gi"))>=0)),o&&Y(!0)},ye=()=>{X&&(R?.current&&R.current.focus(),Y(!1))},Ce=!p&&!$;return d("div",{className:L(`${r}-${t}`,"flex max-w-full flex-col gap-1",`${r}-${t}--${Ce?"":"not-"}-writable`,p?`${r}-${t}--disabled`:"",$&&!p?"cursor-default":"",P?`${r}-${t}--with-error`:"",$?`${r}-${t}--readonly cursor-default`:"",N?`${r}-${t}--required`:"",T?`${r}-${t}--with-success`:"",J.className),children:[n(q)?!1:l(be,{asChild:!0,className:a(`${r}-${t}__label`,p?`${r}-${t}__label--disabled cursor-default`:"cursor-pointer",N?`${r}-${t}__label--required after:text-feedback-danger-50 after:content-required`:""),htmlFor:`${h}-number`,children:l(C,{element:"label",children:q})}),d("div",{className:a(`${r}-${t}__fields`,"flex w-fit max-w-full gap-1"),children:[u&&l(ee,{id:`${h}-prefix`,ref:W,className:a(`${r}-${t}__fields__phone-prefix`,"w-[110px] min-w-[110px] max-w-[110px]"),disabled:p,displayedValue:d("span",{children:[j?.flag,"\xA0\xA0",j?.countryCode]}),dropdown:{className:a(`${r}-${t}__fields__phone-prefix__dropdown`,"max-w-full !pt-8 !w-fit")},name:`${B||h}-prefix`,readOnly:$,required:N,value:JSON.stringify(c),onClose:()=>Z("",!1),onSelect:e=>he(JSON.parse(e)),children:d(Te,{children:[l(O,{ref:R,className:a(`${r}-${t}__fields__phone-prefix__dropdown__search`,"fixed top-2 !w-[calc(100%-theme(spacing.3))]"),fullWidth:!0,..._===void 0?{}:{placeholder:ie},prefix:l(Ie,{}),selectOnFocus:!X,type:"search",value:fe,onBlur:ye,onChange:(e,o)=>Z(o,!0)}),n(E)&&l(re,{children:ae}),!n(E)&&E.map(({countryCode:e,countryName:o,flag:s,prefix:i})=>d(te,{value:JSON.stringify({countryCode:e,prefix:i}),children:[s," ",o," (+",i,")"]},e))]})}),l(O,{id:`${h}-number`,ref:K,autoFocus:le&&!u,className:a(`${r}-${t}__fields__phone-number`,"!w-[calc(12rem+theme(spacing.2)+theme(spacing.2)]",u&&!n(c)?`${r}-${t}__fields__phone-number--with-prefix-helper [&_input]:!pl-6`:""),disabled:p,error:y,name:`${B||h}-number`,placeholder:$e??"",prefix:u&&!n(c)?d(C,{className:a(`${r}-${t}__fields__phone-number__prefix-helper`,p?"text-disabled":"text-dark","w-[36px] text-right"),element:"span",children:["+",c.prefix]}):void 0,readOnly:$,required:N,success:T,suffix:y?l(Ne,{}):T?l(ge,{}):void 0,type:"tel",value:F,onChange:(e,o)=>xe(o),...ke(["className"],J)})]}),!n(D)&&!y&&!k?l(C,{className:a(`${r}-${t}__description`,"cursor-default text-dark"),element:"div",variant:"caption-median",children:D}):!1,y||k?l(C,{className:a(`${r}-${t}__message ${r}-${t}__message--${P?"error":"success"}`,"cursor-default text-dark"),element:"div",variant:"caption-median",children:P?M:H}):!1]})});se.displayName="InputPhone";var ze=se;export{se as a,ze as b};
//# sourceMappingURL=chunk-HOVNAEN3.js.map