@snowball-tech/fractal/dist/InputDate/InputDate.js

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

"use client";import{a as e}from"../constants-CW2-utNH.js";import{n as t,r as n}from"../helpers-DBEwVIlX.js";import{Typography as r}from"../Typography/Typography.js";import{r as ee}from"../utils-K22C_6qC.js";import{InputText as i}from"../InputText/InputText.js";import{GROUP_NAME as a}from"./InputDate.constants.js";import{forwardRef as o,useEffect as te,useId as ne,useImperativeHandle as re,useRef as s,useState as c}from"react";import l from"lodash/fp/isFunction.js";import u from"lodash/fp/isString.js";import d from"lodash/fp/omit.js";import f from"lodash/fp/isNil.js";import{jsx as p,jsxs as m}from"react/jsx-runtime";import{Label as ie}from"@radix-ui/react-label";import h from"lodash/fp/isError.js";import{UilCheckCircle as ae,UilExclamationCircle as g}from"@tooni/iconscout-unicons-react";import _ from"lodash/fp/isInteger.js";function v(e,t,n){if(!_(t)||t===``)return!1;switch(e){case`day`:return t>=1&&t<=31;case`month`:return t>=1&&t<=12;case`year`:return n===void 0||!_(n)?t>=1900:t>=1900&&t<=n;default:return!1}}const y=o(({autoFocus:o=!1,defaultValue:y,descriptions:b,disabled:x=!1,error:S,id:oe,label:C,labelElement:se,maxYear:w=2099,name:T,onBlur:E,onChange:D,onFieldChange:O,onFocus:k,onKeyDown:A,onKeyUp:j,placeholders:M,readOnly:N=!1,required:P=!1,success:F,value:I,...L},ce)=>{let R=ne(),z=(oe??R)||R,B=!1,V=s(null),H=s(null),U=s(null);re(ce,()=>({get day(){return V?.current??null},get month(){return H?.current??null},get year(){return U?.current??null}}));let[W,G]=c({day:!1,month:!1,year:!1}),[le,K]=c(!0),ue=h(S)?S.message:S,q=S!==!0&&!!ue,J=F!==!0&&!!F,Y=q||S===!0||h(S),X=(J||F===!0)&&!Y;te(()=>{let e={...W},t=I?.day||y?.day;e.day=!f(t)&&(!_(t)||!v(`day`,t));let n=I?.month||y?.month;e.month=!f(n)&&(!_(n)||!v(`month`,n));let r=I?.year||y?.year;e.year=!f(r)&&(!_(r)||!v(`year`,r,w)),(e.day!==W.day||e.month!==W.month||e.year!==W.year)&&G(e)},[y?.day,y?.month,y?.year,I?.day,I?.month,I?.year,W,G,w]);let Z=(e,t,n)=>{let r=Number.parseInt(t,10);if(l(D)&&D(e,{...y,...I,[n]:r}),l(O)&&O(e,n,r),B){B=!1;return}if(!f(r)&&_(r)&&v(n,r,w)&&le)switch(n){case`day`:t.length===2&&H?.current&&H.current.focus();break;case`month`:t.length===2&&U?.current&&U.current.focus();break;case`year`:t.length===4&&U?.current&&U.current.blur();break;default:break}},Q=(e,t)=>{switch(l(A)&&A(e,t),e.key){case`ArrowDown`:case`ArrowUp`:B=!0;break;case`ArrowLeft`:switch(t){case`month`:V?.current&&(V.current.focus(),e.preventDefault());break;case`year`:H?.current&&(H.current.focus(),e.preventDefault());break;default:break}break;case`ArrowRight`:switch(t){case`day`:H?.current&&(H.current.focus(),e.preventDefault());break;case`month`:U?.current&&(U.current.focus(),e.preventDefault());break;default:break}break;default:break}e.key===`ArrowUp`||e.key===`ArrowDown`?K(!1):K(!0)},de=!x&&!N,$=`${e}-${a}__field !max-w-[100px] w-fit`,fe=u(C)?C:ee(C);return m(`div`,{className:n(`${e}-${a}`,`flex w-fit max-w-full flex-col gap-1`,`${e}-${a}--${de?``:`not-`}writable`,x?`${e}-${a}--disabled`:``,Y?`${e}-${a}--with-error`:``,N?`${e}-${a}--readonly`:``,P?`${e}-${a}--required`:``,X?`${e}-${a}--with-success`:``,L.className),title:fe,children:[C?p(ie,{asChild:!0,className:t(`${e}-${a}__label`,de?`cursor-pointer`:`cursor-default`,P?`${e}-${a}__label--required after:text-feedback-danger-50 after:content-required`:``),htmlFor:`${z}-day`,children:p(r,{element:se||(u(C)?`label`:`div`),children:C})}):!1,m(`div`,{className:t(`${e}-${a}__fields`,`flex w-fit gap-1`),children:[p(i,{id:`${z}-day`,ref:V,autoFocus:o,className:t(`${e}-${a}__field__day`,$,`[&_input]:min-w-9`),description:b?.day??``,disabled:x,error:W.day||Y,inputMode:`numeric`,max:31,maxLength:2,min:1,name:`${T||z}-day`,pattern:`[0-9]*`,placeholder:M?.day??``,readOnly:N,required:P,size:2,success:X,suffix:W.day?p(g,{}):void 0,type:`number`,...I?.day===void 0?{}:{value:I.day},...y?.day===void 0?{}:{defaultValue:y.day},onChange:(e,t)=>Z(e,t,`day`),onKeyDown:e=>Q(e,`day`),...l(E)?{onBlur:e=>E(e,`day`)}:{},...l(k)?{onFocus:e=>k(e,`year`)}:{},...l(j)?{onKeyUp:e=>j(e,`day`)}:{},...d([`className`],L)}),p(i,{id:`${z}-month`,ref:H,className:t(`${e}-${a}__field__month`,$,`[&_input]:min-w-9`),description:b?.month??``,disabled:x,error:W.month||Y,inputMode:`numeric`,max:12,maxLength:2,min:1,name:`${T||z}-month`,pattern:`[0-9]*`,placeholder:M?.month??``,readOnly:N,required:P,size:2,success:X,suffix:W.month?p(g,{}):void 0,type:`number`,...I?.month===void 0?{}:{value:I.month},...y?.month===void 0?{}:{defaultValue:y.month},onChange:(e,t)=>Z(e,t,`month`),onKeyDown:e=>Q(e,`month`),...l(E)?{onBlur:e=>E(e,`month`)}:{},...l(k)?{onFocus:e=>k(e,`year`)}:{},...l(j)?{onKeyUp:e=>j(e,`month`)}:{},...d([`className`],L)}),p(i,{id:`${z}-year`,ref:U,className:t(`${e}-${a}__field__year`,$,`[&_input]:!w-unset [&_input]:min-w-11`),description:b?.year??``,disabled:x,error:W.year||Y,inputMode:`numeric`,max:w,maxLength:4,min:1900,name:`${T||z}-year`,pattern:`[0-9]*`,placeholder:M?.year??``,readOnly:N,required:P,size:4,success:X,suffix:W.year||Y?p(g,{}):X?p(ae,{}):void 0,type:`number`,...I?.year===void 0?{}:{value:I.year},...y?.year===void 0?{}:{defaultValue:y.year},onKeyDown:e=>Q(e,`year`),...l(E)?{onBlur:e=>E(e,`year`)}:{},...l(k)?{onFocus:e=>k(e,`year`)}:{},...l(j)?{onKeyUp:e=>j(e,`year`)}:{},...d([`className`],L)})]}),(q||J)&&p(r,{className:t(`fractal-input-date__message fractal-input-date__message--${Y?`error`:`success`}`,`cursor-default text-dark`),element:`div`,variant:`caption-median`,children:Y?h(S)?S.message:S:F})]})});y.displayName=`InputDate`;export{y as InputDate,y as default};
//# sourceMappingURL=InputDate.js.map