@adam-milo/ui 1.0.136 β†’ 1.0.137

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index15.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react"),a=require("react-dom"),r=require("./index67.cjs"),n=require("@adam-milo/icons"),o=require("./index69.cjs"),s=require("./index79.cjs"),i=require("./index81.cjs"),l={name:"United States",dialCode:"+1",flag:"πŸ‡ΊπŸ‡Έ",mask:o.defaultPhoneMask},d=t.forwardRef(({label:d,error:c,helperText:u,fullWidth:p=!0,value:h="",onChange:y,countryCode:f,initialCountryCode:m,onCountryChange:g,countries:v,enableFormatting:w=!0,onValidationChange:x,disabled:S,required:b,placeholder:$,id:C,"data-cy":k,"data-testid":D,className:N,onFocus:j,onBlur:E,...I},L)=>{const[M,P]=t.useState(!1),[q,A]=t.useState(!1),[F,T]=t.useState(0),[W,_]=t.useState({top:0,left:0,width:0}),[R,B]=t.useState(()=>f??m??"US"),O=f??R,V=t.useId(),z=C||V,G=`${z}-error`,K=`${z}-helper`,U=`${z}-listbox`,X=t.useRef(null),H=t.useRef(null),J=t.useRef(null),Q=t.useRef(null),Y=k||"phone-input",Z=D||"phone-input",ee=v.find(e=>e.code===O)||v[0]||l,te=ee.mask??o.defaultPhoneMask,ae=$??te.placeholder,re=d&&b&&!d.includes("*")?`${d}*`:d,ne=ee.dialCode.replace(/\D/g,"").length,oe=o.getPhoneDigits(h),se=h.startsWith("+")?oe.slice(ne):oe,ie=w?o.formatWithMask(se,te):se;t.useLayoutEffect(()=>{if(!M||!H.current)return;const e=()=>{if(H.current){const e=H.current.getBoundingClientRect();_({top:e.bottom+8,left:e.left,width:Math.max(e.width,320)})}};return e(),window.addEventListener("scroll",e,!0),window.addEventListener("resize",e),()=>{window.removeEventListener("scroll",e,!0),window.removeEventListener("resize",e)}},[M]),t.useEffect(()=>{const e=e=>{const t=e.target,a=X.current?.contains(t),r=J.current?.contains(t);a||r||P(!1)};return M&&document.addEventListener("pointerdown",e),()=>{document.removeEventListener("pointerdown",e)}},[M]),t.useEffect(()=>{if(!M)return;const e=J.current;if(!e)return;const t=e=>e.stopPropagation(),a={passive:!1};return e.addEventListener("touchmove",t,a),e.addEventListener("wheel",t,a),()=>{e.removeEventListener("touchmove",t),e.removeEventListener("wheel",t)}},[M]);const le=t.useCallback(e=>{void 0===f&&B(e.code),g?.(e);const t=o.getPhoneDigits(h),a=ee.dialCode.replace(/\D/g,"").length,r=h.startsWith("+")?t.slice(a):t;y?.(`${e.dialCode}${r}`),P(!1),setTimeout(()=>{const e=X.current?.querySelector("input");e?.focus()},0)},[f,g,y,h,ee.dialCode]),de=t.useCallback(e=>{switch(e.key){case"ArrowDown":e.preventDefault(),T(e=>Math.min(e+1,v.length-1));break;case"ArrowUp":e.preventDefault(),T(e=>Math.max(e-1,0));break;case"Enter":case" ":e.preventDefault(),le(v[F]);break;case"Escape":e.preventDefault(),P(!1),Q.current?.focus();break;case"Tab":P(!1)}},[v,F,le]),ce=S?"disabled":c?"error":q||M?"focus":"idle";return e.jsxs("div",{ref:X,className:r.cn(i.wrapperStyles,p&&i.wrapperFullWidthStyles),"data-cy":`${Y}-wrapper`,"data-testid":`${Z}-wrapper`,children:[d&&e.jsx("label",{htmlFor:z,className:i.labelStyles,"data-cy":`${Y}-label`,"data-testid":`${Z}-label`,children:re}),e.jsxs("div",{ref:H,className:r.cn(i.containerBaseStyles,p&&i.containerFullWidthStyles,"focus"===ce&&i.containerFocusStyles,"error"===ce&&i.containerErrorStyles,"disabled"===ce&&i.containerDisabledStyles,"idle"===ce&&i.containerIdleStyles),"data-state":ce,"data-cy":`${Y}-container`,"data-testid":`${Z}-container`,children:[e.jsxs("button",{ref:Q,type:"button",className:i.triggerStyles,onClick:()=>!S&&P(!M),onKeyDown:e=>{if("Enter"===e.key||" "===e.key||"ArrowDown"===e.key){e.preventDefault(),P(!0);const t=v.findIndex(e=>e.code===O);T(-1===t?0:t)}},disabled:S,"aria-haspopup":"listbox","aria-expanded":M,"aria-controls":U,"aria-label":`Select country. Current: ${ee.name}`,"data-cy":`${Y}-country-trigger`,"data-testid":`${Z}-country-trigger`,children:[e.jsx(s.CountryFlag,{flag:ee.flag,className:i.flagStyles,"data-cy":`${Y}-flag`,"data-testid":`${Z}-flag`}),e.jsx(n.Icon,{name:"ChevronDownIcon",size:"sm",color:q||M?"clickable":"text",decorative:!0,"data-cy":`${Y}-chevron`})]}),e.jsx("span",{className:i.dialCodeStyles,"data-cy":`${Y}-dial-code`,"data-testid":`${Z}-dial-code`,children:ee.dialCode}),e.jsx("input",{ref:L,id:z,type:"tel",inputMode:"numeric",value:ie,onChange:e=>{const t=e.target.value,a=(w?o.getPhoneDigits(t):t.replace(/[^0-9]/g,"")).slice(0,o.E164_MAX_NATIONAL_DIGITS);y?.(`${ee.dialCode}${a}`),x?.(a.length>0)},onFocus:e=>{A(!0),j?.(e)},onBlur:e=>{A(!1),E?.(e)},placeholder:ae,disabled:S,required:b,className:r.cn(i.inputStyles,N),"aria-invalid":c?"true":"false","aria-required":b?"true":void 0,"aria-describedby":c?G:u?K:void 0,"data-cy":Y,"data-testid":Z,...I})]}),M&&a.createPortal(e.jsx("div",{ref:J,id:U,role:"listbox","aria-label":"Select country",className:i.dropdownStyles,style:{top:W.top,left:W.left,width:W.width,minWidth:"20rem"},tabIndex:-1,onKeyDown:de,"data-cy":`${Y}-dropdown`,"data-testid":`${Z}-dropdown`,children:e.jsx("div",{className:i.dropdownViewportStyles,children:v.map((t,a)=>e.jsxs("div",{role:"option","aria-selected":t.code===O,className:r.cn(i.optionBaseStyles,a===F&&i.optionHighlightedStyles,t.code===O&&i.optionSelectedStyles),onClick:()=>le(t),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),le(t))},onMouseEnter:()=>T(a),tabIndex:a===F?0:-1,"data-cy":`${Y}-option-${t.code.toLowerCase()}`,"data-testid":`${Z}-option-${t.code.toLowerCase()}`,children:[e.jsx(s.CountryFlag,{flag:t.flag,className:i.optionFlagStyles}),e.jsx("span",{className:i.optionNameStyles,children:t.name}),e.jsx("span",{className:i.optionDialCodeStyles,children:t.dialCode})]},t.code))})}),document.body),c&&e.jsx("span",{id:G,className:i.errorStyles,role:"alert","data-cy":`${Y}-error`,"data-testid":`${Z}-error`,children:c}),u&&!c&&e.jsx("span",{id:K,className:i.helperStyles,"data-cy":`${Y}-helper`,"data-testid":`${Z}-helper`,children:u})]})});d.displayName="PhoneInput",exports.E164_MAX_NATIONAL_DIGITS=o.E164_MAX_NATIONAL_DIGITS,exports.defaultPhoneMask=o.defaultPhoneMask,exports.formatWithMask=o.formatWithMask,exports.getPhoneDigits=o.getPhoneDigits,exports.isValidPhoneLength=o.isValidPhoneLength,exports.PhoneInput=d;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react"),a=require("react-dom"),r=require("./index67.cjs"),n=require("@adam-milo/icons"),o=require("./index69.cjs"),s=require("./index79.cjs"),i=require("./index81.cjs"),l={name:"United States",dialCode:"+1",flag:"πŸ‡ΊπŸ‡Έ",mask:o.defaultPhoneMask},d=t.forwardRef(({label:d,error:c,helperText:u,fullWidth:p=!0,value:h="",onChange:y,countryCode:f,initialCountryCode:m,onCountryChange:g,countries:x,enableFormatting:S=!0,maxNationalDigits:v=o.E164_MAX_NATIONAL_DIGITS,onValidationChange:w,disabled:b,required:$,placeholder:N,id:C,"data-cy":D,"data-testid":k,className:E,onFocus:I,onBlur:j,...M},L)=>{const[A,P]=t.useState(!1),[_,T]=t.useState(!1),[q,F]=t.useState(0),[W,O]=t.useState({top:0,left:0,width:0}),[R,B]=t.useState(()=>f??m??"US"),G=f??R,X=t.useId(),V=C||X,z=`${V}-error`,K=`${V}-helper`,U=`${V}-listbox`,H=t.useRef(null),J=t.useRef(null),Q=t.useRef(null),Y=t.useRef(null),Z=D||"phone-input",ee=k||"phone-input",te=x.find(e=>e.code===G)||x[0]||l,ae=te.mask??o.defaultPhoneMask,re=Number.isFinite(v)?Math.min(Math.max(Math.floor(v),1),o.E164_MAX_NATIONAL_DIGITS):o.E164_MAX_NATIONAL_DIGITS,ne=N??ae.placeholder,oe=d&&$&&!d.includes("*")?`${d}*`:d,se=te.dialCode.replace(/\D/g,"").length,ie=o.getPhoneDigits(h),le=h.startsWith("+")?ie.slice(se):ie,de=S?o.formatWithMask(le,ae):le;t.useLayoutEffect(()=>{if(!A||!J.current)return;const e=()=>{if(J.current){const e=J.current.getBoundingClientRect();O({top:e.bottom+8,left:e.left,width:Math.max(e.width,320)})}};return e(),window.addEventListener("scroll",e,!0),window.addEventListener("resize",e),()=>{window.removeEventListener("scroll",e,!0),window.removeEventListener("resize",e)}},[A]),t.useEffect(()=>{const e=e=>{const t=e.target,a=H.current?.contains(t),r=Q.current?.contains(t);a||r||P(!1)};return A&&document.addEventListener("pointerdown",e),()=>{document.removeEventListener("pointerdown",e)}},[A]),t.useEffect(()=>{if(!A)return;const e=Q.current;if(!e)return;const t=e=>e.stopPropagation(),a={passive:!1};return e.addEventListener("touchmove",t,a),e.addEventListener("wheel",t,a),()=>{e.removeEventListener("touchmove",t),e.removeEventListener("wheel",t)}},[A]);const ce=t.useCallback(e=>{void 0===f&&B(e.code),g?.(e);const t=o.getPhoneDigits(h),a=te.dialCode.replace(/\D/g,"").length,r=h.startsWith("+")?t.slice(a):t;y?.(`${e.dialCode}${r}`),P(!1),setTimeout(()=>{const e=H.current?.querySelector("input");e?.focus()},0)},[f,g,y,h,te.dialCode]),ue=t.useCallback(e=>{switch(e.key){case"ArrowDown":e.preventDefault(),F(e=>Math.min(e+1,x.length-1));break;case"ArrowUp":e.preventDefault(),F(e=>Math.max(e-1,0));break;case"Enter":case" ":e.preventDefault(),ce(x[q]);break;case"Escape":e.preventDefault(),P(!1),Y.current?.focus();break;case"Tab":P(!1)}},[x,q,ce]),pe=b?"disabled":c?"error":_||A?"focus":"idle";return e.jsxs("div",{ref:H,className:r.cn(i.wrapperStyles,p&&i.wrapperFullWidthStyles),"data-cy":`${Z}-wrapper`,"data-testid":`${ee}-wrapper`,children:[d&&e.jsx("label",{htmlFor:V,className:i.labelStyles,"data-cy":`${Z}-label`,"data-testid":`${ee}-label`,children:oe}),e.jsxs("div",{ref:J,className:r.cn(i.containerBaseStyles,p&&i.containerFullWidthStyles,"focus"===pe&&i.containerFocusStyles,"error"===pe&&i.containerErrorStyles,"disabled"===pe&&i.containerDisabledStyles,"idle"===pe&&i.containerIdleStyles),"data-state":pe,"data-cy":`${Z}-container`,"data-testid":`${ee}-container`,children:[e.jsxs("button",{ref:Y,type:"button",className:i.triggerStyles,onClick:()=>!b&&P(!A),onKeyDown:e=>{if("Enter"===e.key||" "===e.key||"ArrowDown"===e.key){e.preventDefault(),P(!0);const t=x.findIndex(e=>e.code===G);F(-1===t?0:t)}},disabled:b,"aria-haspopup":"listbox","aria-expanded":A,"aria-controls":U,"aria-label":`Select country. Current: ${te.name}`,"data-cy":`${Z}-country-trigger`,"data-testid":`${ee}-country-trigger`,children:[e.jsx(s.CountryFlag,{flag:te.flag,className:i.flagStyles,"data-cy":`${Z}-flag`,"data-testid":`${ee}-flag`}),e.jsx(n.Icon,{name:"ChevronDownIcon",size:"sm",color:_||A?"clickable":"text",decorative:!0,"data-cy":`${Z}-chevron`})]}),e.jsx("span",{className:i.dialCodeStyles,"data-cy":`${Z}-dial-code`,"data-testid":`${ee}-dial-code`,children:te.dialCode}),e.jsx("input",{ref:L,id:V,type:"tel",inputMode:"numeric",value:de,onChange:e=>{const t=e.target.value,a=(S?o.getPhoneDigits(t):t.replace(/[^0-9]/g,"")).slice(0,re);y?.(`${te.dialCode}${a}`),w?.(a.length>0)},onFocus:e=>{T(!0),I?.(e)},onBlur:e=>{T(!1),j?.(e)},placeholder:ne,disabled:b,required:$,className:r.cn(i.inputStyles,E),"aria-invalid":c?"true":"false","aria-required":$?"true":void 0,"aria-describedby":c?z:u?K:void 0,"data-cy":Z,"data-testid":ee,...M})]}),A&&a.createPortal(e.jsx("div",{ref:Q,id:U,role:"listbox","aria-label":"Select country",className:i.dropdownStyles,style:{top:W.top,left:W.left,width:W.width,minWidth:"20rem"},tabIndex:-1,onKeyDown:ue,"data-cy":`${Z}-dropdown`,"data-testid":`${ee}-dropdown`,children:e.jsx("div",{className:i.dropdownViewportStyles,children:x.map((t,a)=>e.jsxs("div",{role:"option","aria-selected":t.code===G,className:r.cn(i.optionBaseStyles,a===q&&i.optionHighlightedStyles,t.code===G&&i.optionSelectedStyles),onClick:()=>ce(t),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),ce(t))},onMouseEnter:()=>F(a),tabIndex:a===q?0:-1,"data-cy":`${Z}-option-${t.code.toLowerCase()}`,"data-testid":`${ee}-option-${t.code.toLowerCase()}`,children:[e.jsx(s.CountryFlag,{flag:t.flag,className:i.optionFlagStyles}),e.jsx("span",{className:i.optionNameStyles,children:t.name}),e.jsx("span",{className:i.optionDialCodeStyles,children:t.dialCode})]},t.code))})}),document.body),c&&e.jsx("span",{id:z,className:i.errorStyles,role:"alert","data-cy":`${Z}-error`,"data-testid":`${ee}-error`,children:c}),u&&!c&&e.jsx("span",{id:K,className:i.helperStyles,"data-cy":`${Z}-helper`,"data-testid":`${ee}-helper`,children:u})]})});d.displayName="PhoneInput",exports.E164_MAX_NATIONAL_DIGITS=o.E164_MAX_NATIONAL_DIGITS,exports.defaultPhoneMask=o.defaultPhoneMask,exports.formatWithMask=o.formatWithMask,exports.getPhoneDigits=o.getPhoneDigits,exports.isValidPhoneLength=o.isValidPhoneLength,exports.PhoneInput=d;
package/dist/index15.js CHANGED
@@ -1,12 +1,12 @@
1
- import{jsxs as e,jsx as t}from"react/jsx-runtime";import{forwardRef as a,useState as r,useId as n,useRef as o,useLayoutEffect as d,useEffect as i,useCallback as l}from"react";import{createPortal as s}from"react-dom";import{cn as c}from"./index67.js";import{Icon as u}from"@adam-milo/icons";import{defaultPhoneMask as m,getPhoneDigits as p,formatWithMask as h,E164_MAX_NATIONAL_DIGITS as f}from"./index69.js";import{isValidPhoneLength as v}from"./index69.js";import{CountryFlag as y}from"./index79.js";import{labelStyles as w,triggerStyles as $,flagStyles as b,dialCodeStyles as g,dropdownStyles as C,dropdownViewportStyles as x,optionFlagStyles as N,optionNameStyles as k,optionDialCodeStyles as E,optionSelectedStyles as D,optionHighlightedStyles as L,optionBaseStyles as j,errorStyles as I,helperStyles as M,inputStyles as S,containerIdleStyles as q,containerDisabledStyles as F,containerErrorStyles as W,containerFocusStyles as z,containerFullWidthStyles as A,containerBaseStyles as B,wrapperFullWidthStyles as K,wrapperStyles as T}from"./index81.js";const U={name:"United States",dialCode:"+1",flag:"πŸ‡ΊπŸ‡Έ",mask:m},P=a(({label:a,error:v,helperText:P,fullWidth:R=!0,value:V="",onChange:G,countryCode:H,initialCountryCode:J,onCountryChange:O,countries:Q,enableFormatting:X=!0,onValidationChange:Y,disabled:Z,required:_,placeholder:ee,id:te,"data-cy":ae,"data-testid":re,className:ne,onFocus:oe,onBlur:de,...ie},le)=>{const[se,ce]=r(!1),[ue,me]=r(!1),[pe,he]=r(0),[fe,ve]=r({top:0,left:0,width:0}),[ye,we]=r(()=>H??J??"US"),$e=H??ye,be=n(),ge=te||be,Ce=`${ge}-error`,xe=`${ge}-helper`,Ne=`${ge}-listbox`,ke=o(null),Ee=o(null),De=o(null),Le=o(null),je=ae||"phone-input",Ie=re||"phone-input",Me=Q.find(e=>e.code===$e)||Q[0]||U,Se=Me.mask??m,qe=ee??Se.placeholder,Fe=a&&_&&!a.includes("*")?`${a}*`:a,We=Me.dialCode.replace(/\D/g,"").length,ze=p(V),Ae=V.startsWith("+")?ze.slice(We):ze,Be=X?h(Ae,Se):Ae;d(()=>{if(!se||!Ee.current)return;const e=()=>{if(Ee.current){const e=Ee.current.getBoundingClientRect();ve({top:e.bottom+8,left:e.left,width:Math.max(e.width,320)})}};return e(),window.addEventListener("scroll",e,!0),window.addEventListener("resize",e),()=>{window.removeEventListener("scroll",e,!0),window.removeEventListener("resize",e)}},[se]),i(()=>{const e=e=>{const t=e.target,a=ke.current?.contains(t),r=De.current?.contains(t);a||r||ce(!1)};return se&&document.addEventListener("pointerdown",e),()=>{document.removeEventListener("pointerdown",e)}},[se]),i(()=>{if(!se)return;const e=De.current;if(!e)return;const t=e=>e.stopPropagation(),a={passive:!1};return e.addEventListener("touchmove",t,a),e.addEventListener("wheel",t,a),()=>{e.removeEventListener("touchmove",t),e.removeEventListener("wheel",t)}},[se]);const Ke=l(e=>{void 0===H&&we(e.code),O?.(e);const t=p(V),a=Me.dialCode.replace(/\D/g,"").length,r=V.startsWith("+")?t.slice(a):t;G?.(`${e.dialCode}${r}`),ce(!1),setTimeout(()=>{const e=ke.current?.querySelector("input");e?.focus()},0)},[H,O,G,V,Me.dialCode]),Te=l(e=>{switch(e.key){case"ArrowDown":e.preventDefault(),he(e=>Math.min(e+1,Q.length-1));break;case"ArrowUp":e.preventDefault(),he(e=>Math.max(e-1,0));break;case"Enter":case" ":e.preventDefault(),Ke(Q[pe]);break;case"Escape":e.preventDefault(),ce(!1),Le.current?.focus();break;case"Tab":ce(!1)}},[Q,pe,Ke]),Ue=Z?"disabled":v?"error":ue||se?"focus":"idle";/* @__PURE__ */
2
- return e("div",{ref:ke,className:c(T,R&&K),"data-cy":`${je}-wrapper`,"data-testid":`${Ie}-wrapper`,children:[a&&/* @__PURE__ */t("label",{htmlFor:ge,className:w,"data-cy":`${je}-label`,"data-testid":`${Ie}-label`,children:Fe}),
3
- /* @__PURE__ */e("div",{ref:Ee,className:c(B,R&&A,"focus"===Ue&&z,"error"===Ue&&W,"disabled"===Ue&&F,"idle"===Ue&&q),"data-state":Ue,"data-cy":`${je}-container`,"data-testid":`${Ie}-container`,children:[
4
- /* @__PURE__ */e("button",{ref:Le,type:"button",className:$,onClick:()=>!Z&&ce(!se),onKeyDown:e=>{if("Enter"===e.key||" "===e.key||"ArrowDown"===e.key){e.preventDefault(),ce(!0);const t=Q.findIndex(e=>e.code===$e);he(-1===t?0:t)}},disabled:Z,"aria-haspopup":"listbox","aria-expanded":se,"aria-controls":Ne,"aria-label":`Select country. Current: ${Me.name}`,"data-cy":`${je}-country-trigger`,"data-testid":`${Ie}-country-trigger`,children:[
5
- /* @__PURE__ */t(y,{flag:Me.flag,className:b,"data-cy":`${je}-flag`,"data-testid":`${Ie}-flag`}),
6
- /* @__PURE__ */t(u,{name:"ChevronDownIcon",size:"sm",color:ue||se?"clickable":"text",decorative:!0,"data-cy":`${je}-chevron`})]}),
7
- /* @__PURE__ */t("span",{className:g,"data-cy":`${je}-dial-code`,"data-testid":`${Ie}-dial-code`,children:Me.dialCode}),
8
- /* @__PURE__ */t("input",{ref:le,id:ge,type:"tel",inputMode:"numeric",value:Be,onChange:e=>{const t=e.target.value,a=(X?p(t):t.replace(/[^0-9]/g,"")).slice(0,f);G?.(`${Me.dialCode}${a}`),Y?.(a.length>0)},onFocus:e=>{me(!0),oe?.(e)},onBlur:e=>{me(!1),de?.(e)},placeholder:qe,disabled:Z,required:_,className:c(S,ne),"aria-invalid":v?"true":"false","aria-required":_?"true":void 0,"aria-describedby":v?Ce:P?xe:void 0,"data-cy":je,"data-testid":Ie,...ie})]}),se&&s(
9
- /* @__PURE__ */t("div",{ref:De,id:Ne,role:"listbox","aria-label":"Select country",className:C,style:{top:fe.top,left:fe.left,width:fe.width,minWidth:"20rem"},tabIndex:-1,onKeyDown:Te,"data-cy":`${je}-dropdown`,"data-testid":`${Ie}-dropdown`,children:/* @__PURE__ */t("div",{className:x,children:Q.map((a,r)=>/* @__PURE__ */e("div",{role:"option","aria-selected":a.code===$e,className:c(j,r===pe&&L,a.code===$e&&D),onClick:()=>Ke(a),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),Ke(a))},onMouseEnter:()=>he(r),tabIndex:r===pe?0:-1,"data-cy":`${je}-option-${a.code.toLowerCase()}`,"data-testid":`${Ie}-option-${a.code.toLowerCase()}`,children:[
1
+ import{jsxs as e,jsx as t}from"react/jsx-runtime";import{forwardRef as a,useState as r,useId as n,useRef as o,useLayoutEffect as i,useEffect as d,useCallback as l}from"react";import{createPortal as s}from"react-dom";import{cn as c}from"./index67.js";import{Icon as u}from"@adam-milo/icons";import{defaultPhoneMask as m,getPhoneDigits as p,formatWithMask as h,E164_MAX_NATIONAL_DIGITS as f}from"./index69.js";import{isValidPhoneLength as v}from"./index69.js";import{CountryFlag as y}from"./index79.js";import{labelStyles as w,triggerStyles as $,flagStyles as b,dialCodeStyles as g,dropdownStyles as C,dropdownViewportStyles as x,optionFlagStyles as N,optionNameStyles as k,optionDialCodeStyles as D,optionSelectedStyles as E,optionHighlightedStyles as L,optionBaseStyles as M,errorStyles as j,helperStyles as F,inputStyles as I,containerIdleStyles as S,containerDisabledStyles as q,containerErrorStyles as W,containerFocusStyles as z,containerFullWidthStyles as A,containerBaseStyles as B,wrapperFullWidthStyles as K,wrapperStyles as T}from"./index81.js";const U={name:"United States",dialCode:"+1",flag:"πŸ‡ΊπŸ‡Έ",mask:m},P=a(({label:a,error:v,helperText:P,fullWidth:R=!0,value:V="",onChange:G,countryCode:H,initialCountryCode:J,onCountryChange:O,countries:Q,enableFormatting:X=!0,maxNationalDigits:Y=f,onValidationChange:Z,disabled:_,required:ee,placeholder:te,id:ae,"data-cy":re,"data-testid":ne,className:oe,onFocus:ie,onBlur:de,...le},se)=>{const[ce,ue]=r(!1),[me,pe]=r(!1),[he,fe]=r(0),[ve,ye]=r({top:0,left:0,width:0}),[we,$e]=r(()=>H??J??"US"),be=H??we,ge=n(),Ce=ae||ge,xe=`${Ce}-error`,Ne=`${Ce}-helper`,ke=`${Ce}-listbox`,De=o(null),Ee=o(null),Le=o(null),Me=o(null),je=re||"phone-input",Fe=ne||"phone-input",Ie=Q.find(e=>e.code===be)||Q[0]||U,Se=Ie.mask??m,qe=Number.isFinite(Y)?Math.min(Math.max(Math.floor(Y),1),f):f,We=te??Se.placeholder,ze=a&&ee&&!a.includes("*")?`${a}*`:a,Ae=Ie.dialCode.replace(/\D/g,"").length,Be=p(V),Ke=V.startsWith("+")?Be.slice(Ae):Be,Te=X?h(Ke,Se):Ke;i(()=>{if(!ce||!Ee.current)return;const e=()=>{if(Ee.current){const e=Ee.current.getBoundingClientRect();ye({top:e.bottom+8,left:e.left,width:Math.max(e.width,320)})}};return e(),window.addEventListener("scroll",e,!0),window.addEventListener("resize",e),()=>{window.removeEventListener("scroll",e,!0),window.removeEventListener("resize",e)}},[ce]),d(()=>{const e=e=>{const t=e.target,a=De.current?.contains(t),r=Le.current?.contains(t);a||r||ue(!1)};return ce&&document.addEventListener("pointerdown",e),()=>{document.removeEventListener("pointerdown",e)}},[ce]),d(()=>{if(!ce)return;const e=Le.current;if(!e)return;const t=e=>e.stopPropagation(),a={passive:!1};return e.addEventListener("touchmove",t,a),e.addEventListener("wheel",t,a),()=>{e.removeEventListener("touchmove",t),e.removeEventListener("wheel",t)}},[ce]);const Ue=l(e=>{void 0===H&&$e(e.code),O?.(e);const t=p(V),a=Ie.dialCode.replace(/\D/g,"").length,r=V.startsWith("+")?t.slice(a):t;G?.(`${e.dialCode}${r}`),ue(!1),setTimeout(()=>{const e=De.current?.querySelector("input");e?.focus()},0)},[H,O,G,V,Ie.dialCode]),Pe=l(e=>{switch(e.key){case"ArrowDown":e.preventDefault(),fe(e=>Math.min(e+1,Q.length-1));break;case"ArrowUp":e.preventDefault(),fe(e=>Math.max(e-1,0));break;case"Enter":case" ":e.preventDefault(),Ue(Q[he]);break;case"Escape":e.preventDefault(),ue(!1),Me.current?.focus();break;case"Tab":ue(!1)}},[Q,he,Ue]),Re=_?"disabled":v?"error":me||ce?"focus":"idle";/* @__PURE__ */
2
+ return e("div",{ref:De,className:c(T,R&&K),"data-cy":`${je}-wrapper`,"data-testid":`${Fe}-wrapper`,children:[a&&/* @__PURE__ */t("label",{htmlFor:Ce,className:w,"data-cy":`${je}-label`,"data-testid":`${Fe}-label`,children:ze}),
3
+ /* @__PURE__ */e("div",{ref:Ee,className:c(B,R&&A,"focus"===Re&&z,"error"===Re&&W,"disabled"===Re&&q,"idle"===Re&&S),"data-state":Re,"data-cy":`${je}-container`,"data-testid":`${Fe}-container`,children:[
4
+ /* @__PURE__ */e("button",{ref:Me,type:"button",className:$,onClick:()=>!_&&ue(!ce),onKeyDown:e=>{if("Enter"===e.key||" "===e.key||"ArrowDown"===e.key){e.preventDefault(),ue(!0);const t=Q.findIndex(e=>e.code===be);fe(-1===t?0:t)}},disabled:_,"aria-haspopup":"listbox","aria-expanded":ce,"aria-controls":ke,"aria-label":`Select country. Current: ${Ie.name}`,"data-cy":`${je}-country-trigger`,"data-testid":`${Fe}-country-trigger`,children:[
5
+ /* @__PURE__ */t(y,{flag:Ie.flag,className:b,"data-cy":`${je}-flag`,"data-testid":`${Fe}-flag`}),
6
+ /* @__PURE__ */t(u,{name:"ChevronDownIcon",size:"sm",color:me||ce?"clickable":"text",decorative:!0,"data-cy":`${je}-chevron`})]}),
7
+ /* @__PURE__ */t("span",{className:g,"data-cy":`${je}-dial-code`,"data-testid":`${Fe}-dial-code`,children:Ie.dialCode}),
8
+ /* @__PURE__ */t("input",{ref:se,id:Ce,type:"tel",inputMode:"numeric",value:Te,onChange:e=>{const t=e.target.value,a=(X?p(t):t.replace(/[^0-9]/g,"")).slice(0,qe);G?.(`${Ie.dialCode}${a}`),Z?.(a.length>0)},onFocus:e=>{pe(!0),ie?.(e)},onBlur:e=>{pe(!1),de?.(e)},placeholder:We,disabled:_,required:ee,className:c(I,oe),"aria-invalid":v?"true":"false","aria-required":ee?"true":void 0,"aria-describedby":v?xe:P?Ne:void 0,"data-cy":je,"data-testid":Fe,...le})]}),ce&&s(
9
+ /* @__PURE__ */t("div",{ref:Le,id:ke,role:"listbox","aria-label":"Select country",className:C,style:{top:ve.top,left:ve.left,width:ve.width,minWidth:"20rem"},tabIndex:-1,onKeyDown:Pe,"data-cy":`${je}-dropdown`,"data-testid":`${Fe}-dropdown`,children:/* @__PURE__ */t("div",{className:x,children:Q.map((a,r)=>/* @__PURE__ */e("div",{role:"option","aria-selected":a.code===be,className:c(M,r===he&&L,a.code===be&&E),onClick:()=>Ue(a),onKeyDown:e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),Ue(a))},onMouseEnter:()=>fe(r),tabIndex:r===he?0:-1,"data-cy":`${je}-option-${a.code.toLowerCase()}`,"data-testid":`${Fe}-option-${a.code.toLowerCase()}`,children:[
10
10
  /* @__PURE__ */t(y,{flag:a.flag,className:N}),
11
11
  /* @__PURE__ */t("span",{className:k,children:a.name}),
12
- /* @__PURE__ */t("span",{className:E,children:a.dialCode})]},a.code))})}),document.body),v&&/* @__PURE__ */t("span",{id:Ce,className:I,role:"alert","data-cy":`${je}-error`,"data-testid":`${Ie}-error`,children:v}),P&&!v&&/* @__PURE__ */t("span",{id:xe,className:M,"data-cy":`${je}-helper`,"data-testid":`${Ie}-helper`,children:P})]})});P.displayName="PhoneInput";export{f as E164_MAX_NATIONAL_DIGITS,P as PhoneInput,m as defaultPhoneMask,h as formatWithMask,p as getPhoneDigits,v as isValidPhoneLength};
12
+ /* @__PURE__ */t("span",{className:D,children:a.dialCode})]},a.code))})}),document.body),v&&/* @__PURE__ */t("span",{id:xe,className:j,role:"alert","data-cy":`${je}-error`,"data-testid":`${Fe}-error`,children:v}),P&&!v&&/* @__PURE__ */t("span",{id:Ne,className:F,"data-cy":`${je}-helper`,"data-testid":`${Fe}-helper`,children:P})]})});P.displayName="PhoneInput";export{f as E164_MAX_NATIONAL_DIGITS,P as PhoneInput,m as defaultPhoneMask,h as formatWithMask,p as getPhoneDigits,v as isValidPhoneLength};
@@ -1 +1 @@
1
- {"version":3,"file":"PhoneInput.component.d.ts","sourceRoot":"","sources":["../../../../../src/components/forms/phone-input/PhoneInput.component.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AA2B1D,YAAY,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACtD,OAAO,EACL,gBAAgB,EAChB,wBAAwB,EACxB,cAAc,EACd,cAAc,EACd,kBAAkB,GACnB,MAAM,aAAa,CAAC;AAUrB,eAAO,MAAM,UAAU,8GAyZtB,CAAC;AAIF,YAAY,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC"}
1
+ {"version":3,"file":"PhoneInput.component.d.ts","sourceRoot":"","sources":["../../../../../src/components/forms/phone-input/PhoneInput.component.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AA2B1D,YAAY,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACtD,OAAO,EACL,gBAAgB,EAChB,wBAAwB,EACxB,cAAc,EACd,cAAc,EACd,kBAAkB,GACnB,MAAM,aAAa,CAAC;AAUrB,eAAO,MAAM,UAAU,8GA6ZtB,CAAC;AAIF,YAAY,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC"}
@@ -16,6 +16,8 @@ export interface PhoneInputProps extends Omit<InputHTMLAttributes<HTMLInputEleme
16
16
  /** Array of country objects for the selector. Each object: `{ code, name, dialCode, flag }`. */
17
17
  countries: Country[];
18
18
  enableFormatting?: boolean;
19
+ /** Maximum national digits accepted by typing or paste. Defaults to the E.164 cap. */
20
+ maxNationalDigits?: number;
19
21
  /**
20
22
  * Soft signal when national digits are non-empty. Not mask-length or
21
23
  * libphonenumber validity β€” prefer form-schema validation for that.
@@ -1 +1 @@
1
- {"version":3,"file":"PhoneInput.types.d.ts","sourceRoot":"","sources":["../../../../../src/components/forms/phone-input/PhoneInput.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAE3C,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAC3C,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,MAAM,GAAG,OAAO,GAAG,UAAU,CAC9B;IACC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,0EAA0E;IAC1E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,8GAA8G;IAC9G,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,gGAAgG;IAChG,SAAS,EAAE,OAAO,EAAE,CAAC;IACrB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;OAGG;IACH,kBAAkB,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB"}
1
+ {"version":3,"file":"PhoneInput.types.d.ts","sourceRoot":"","sources":["../../../../../src/components/forms/phone-input/PhoneInput.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AAE3C,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAC3C,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,MAAM,GAAG,OAAO,GAAG,UAAU,CAC9B;IACC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,0EAA0E;IAC1E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,8GAA8G;IAC9G,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,gGAAgG;IAChG,SAAS,EAAE,OAAO,EAAE,CAAC;IACrB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,sFAAsF;IACtF,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;;OAGG;IACH,kBAAkB,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@adam-milo/ui",
3
- "version": "1.0.136",
3
+ "version": "1.0.137",
4
4
  "type": "module",
5
5
  "description": "Adam Milo Design System - UI Component Library",
6
6
  "keywords": [