@sth87/shadcn-design-system 0.1.5 → 0.1.6
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/AI_CONTEXT.md +1 -0
- package/dist/cjs/components/Button/Button.cjs +1 -1
- package/dist/cjs/components/Button/Button.cjs.map +1 -1
- package/dist/cjs/components/DatePicker/RangePicker.cjs +1 -1
- package/dist/cjs/components/DatePicker/RangePicker.cjs.map +1 -1
- package/dist/cjs/components/Input/Input.cjs +1 -1
- package/dist/cjs/components/Input/Input.cjs.map +1 -1
- package/dist/cjs/components/Table/data-table.cjs +1 -1
- package/dist/cjs/components/Table/data-table.cjs.map +1 -1
- package/dist/cjs/packages/ui/src/components/alert-dialog.cjs +1 -1
- package/dist/cjs/packages/ui/src/components/alert-dialog.cjs.map +1 -1
- package/dist/cjs/packages/ui/src/components/calendar.cjs +1 -1
- package/dist/cjs/packages/ui/src/components/calendar.cjs.map +1 -1
- package/dist/cjs/packages/ui/src/components/combobox.cjs +1 -1
- package/dist/cjs/packages/ui/src/components/combobox.cjs.map +1 -1
- package/dist/cjs/packages/ui/src/components/context-menu.cjs +1 -1
- package/dist/cjs/packages/ui/src/components/context-menu.cjs.map +1 -1
- package/dist/cjs/packages/ui/src/components/popover.cjs +1 -1
- package/dist/cjs/packages/ui/src/components/popover.cjs.map +1 -1
- package/dist/cjs/packages/ui/src/components/sidebar.cjs +1 -1
- package/dist/cjs/packages/ui/src/components/sidebar.cjs.map +1 -1
- package/dist/cjs/styles/index.css +1 -1
- package/dist/esm/components/Button/Button.js +22 -24
- package/dist/esm/components/Button/Button.js.map +1 -1
- package/dist/esm/components/DatePicker/RangePicker.js +41 -41
- package/dist/esm/components/DatePicker/RangePicker.js.map +1 -1
- package/dist/esm/components/Input/Input.js +37 -36
- package/dist/esm/components/Input/Input.js.map +1 -1
- package/dist/esm/components/Table/data-table.js +22 -16
- package/dist/esm/components/Table/data-table.js.map +1 -1
- package/dist/esm/packages/ui/src/components/alert-dialog.js +7 -7
- package/dist/esm/packages/ui/src/components/alert-dialog.js.map +1 -1
- package/dist/esm/packages/ui/src/components/calendar.js +1 -1
- package/dist/esm/packages/ui/src/components/calendar.js.map +1 -1
- package/dist/esm/packages/ui/src/components/combobox.js +1 -1
- package/dist/esm/packages/ui/src/components/combobox.js.map +1 -1
- package/dist/esm/packages/ui/src/components/context-menu.js +1 -1
- package/dist/esm/packages/ui/src/components/context-menu.js.map +1 -1
- package/dist/esm/packages/ui/src/components/popover.js +1 -1
- package/dist/esm/packages/ui/src/components/popover.js.map +1 -1
- package/dist/esm/packages/ui/src/components/sidebar.js +2 -2
- package/dist/esm/packages/ui/src/components/sidebar.js.map +1 -1
- package/dist/esm/styles/index.css +1 -1
- package/dist/types/components/Button/Button.d.ts.map +1 -1
- package/dist/types/components/Input/Input.d.ts +1 -0
- package/dist/types/components/Input/Input.d.ts.map +1 -1
- package/dist/types/components/Table/data-table.d.ts.map +1 -1
- package/package.json +1 -1
package/dist/AI_CONTEXT.md
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),r=require("react"),o=require("../../packages/ui/src/components/button.cjs"),
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),r=require("react"),o=require("../../packages/ui/src/components/button.cjs"),h=require("../../packages/ui/src/lib/utils.cjs"),N=require("lucide-react"),b=require("../../utils/animations.cjs"),l=r.forwardRef((c,u)=>{const{variant:n="solid",size:a="normal",animation:i,...e}=c,t=r.useMemo(()=>b.animationEffect({animation:i,children:e?.children,className:e?.className,rootClassName:o.buttonVariants({variant:n,size:a}),variantType:n,...e}),[i,e,a,n]),d=(t?.children?!0:e.asChild)&&!e?.isLoading,m=e?.isLoading?s.jsxs(s.Fragment,{children:[s.jsx(N.LoaderCircle,{className:"ds:animate-spin"}),t?.children??e.children??null]}):t?.children??e.children??null;return s.jsx(o.Button,{ref:u,...e,className:h.cn("ds:cursor-pointer ds:group",e?.className,t?.className),asChild:d,style:{...e.style||{},...t?.style||{}},variant:t?.variant??n,size:a,children:m})});l.displayName="Button";exports.default=l;
|
|
2
2
|
//# sourceMappingURL=Button.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.cjs","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport {\n buttonVariants,\n Button as SButton,\n type ButtonProps as SButtonProps,\n} from \"@dsui/ui/components/button\";\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport type { ButtonAnimation } from \"@/types/variables\";\nimport { LoaderCircle } from \"lucide-react\";\nimport { animationEffect } from \"@/utils/animations\";\n\nexport type ButtonProps = SButtonProps & {\n animation?: ButtonAnimation;\n isLoading?: boolean;\n};\n\ntype AnimResult = {\n className?: string;\n style?: React.CSSProperties;\n children?: React.ReactNode;\n variant?: SButtonProps[\"variant\"];\n};\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n (props, ref) => {\n const {\n variant = \"solid\",\n size = \"normal\",\n
|
|
1
|
+
{"version":3,"file":"Button.cjs","sources":["../../../../src/components/Button/Button.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport {\n buttonVariants,\n Button as SButton,\n type ButtonProps as SButtonProps,\n} from \"@dsui/ui/components/button\";\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport type { ButtonAnimation } from \"@/types/variables\";\nimport { LoaderCircle } from \"lucide-react\";\nimport { animationEffect } from \"@/utils/animations\";\n\nexport type ButtonProps = SButtonProps & {\n animation?: ButtonAnimation;\n isLoading?: boolean;\n};\n\ntype AnimResult = {\n className?: string;\n style?: React.CSSProperties;\n children?: React.ReactNode;\n variant?: SButtonProps[\"variant\"];\n};\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n (props, ref) => {\n const {\n variant = \"solid\",\n size = \"normal\",\n animation,\n ...rest\n } = props;\n\n const buttonAnimation = useMemo<AnimResult | null>(() => {\n return animationEffect<ButtonAnimation, SButtonProps[\"variant\"]>({\n animation,\n children: rest?.children,\n className: rest?.className,\n rootClassName: buttonVariants({\n variant: variant,\n size: size,\n }),\n variantType: variant,\n ...rest,\n });\n }, [animation, rest, size, variant]);\n\n // Disable asChild when loading to avoid React.Children.only error\n const shouldUseAsChild =\n (buttonAnimation?.children ? true : rest.asChild) && !rest?.isLoading;\n\n const buttonContent = rest?.isLoading ? (\n <>\n <LoaderCircle className=\"ds:animate-spin\" />\n {\n (buttonAnimation?.children ??\n rest.children ??\n null) as SButtonProps[\"children\"]\n }\n </>\n ) : (\n ((buttonAnimation?.children ??\n rest.children ??\n null) as SButtonProps[\"children\"])\n );\n\n return (\n <SButton\n ref={ref}\n {...rest}\n className={cn(\n \"ds:cursor-pointer ds:group\",\n rest?.className,\n buttonAnimation?.className\n )}\n asChild={shouldUseAsChild}\n style={{ ...(rest.style || {}), ...(buttonAnimation?.style || {}) }}\n variant={buttonAnimation?.variant ?? variant}\n size={size}\n >\n {buttonContent}\n </SButton>\n );\n }\n);\n\nButton.displayName = \"Button\";\nexport default Button;\n"],"names":["Button","React","props","ref","variant","size","animation","rest","buttonAnimation","useMemo","animationEffect","buttonVariants","shouldUseAsChild","buttonContent","jsxs","Fragment","jsx","LoaderCircle","SButton","cn"],"mappings":"gVAuBMA,EAASC,EAAM,WACnB,CAACC,EAAOC,IAAQ,CACd,KAAM,CACJ,QAAAC,EAAU,QACV,KAAAC,EAAO,SACP,UAAAC,EACA,GAAGC,CAAA,EACDL,EAEEM,EAAkBC,EAAAA,QAA2B,IAC1CC,kBAA0D,CAC/D,UAAAJ,EACA,SAAUC,GAAM,SAChB,UAAWA,GAAM,UACjB,cAAeI,EAAAA,eAAe,CAC5B,QAAAP,EACA,KAAAC,CAAA,CACD,EACD,YAAaD,EACb,GAAGG,CAAA,CACJ,EACA,CAACD,EAAWC,EAAMF,EAAMD,CAAO,CAAC,EAG7BQ,GACHJ,GAAiB,SAAW,GAAOD,EAAK,UAAY,CAACA,GAAM,UAExDM,EAAgBN,GAAM,UAC1BO,EAAAA,KAAAC,EAAAA,SAAA,CACE,SAAA,CAAAC,EAAAA,IAACC,EAAAA,aAAA,CAAa,UAAU,iBAAA,CAAkB,EAEvCT,GAAiB,UAChBD,EAAK,UACL,IAAA,CAAA,CAEN,EAEEC,GAAiB,UACjBD,EAAK,UACL,KAGJ,OACES,EAAAA,IAACE,EAAAA,OAAA,CACC,IAAAf,EACC,GAAGI,EACJ,UAAWY,EAAAA,GACT,6BACAZ,GAAM,UACNC,GAAiB,SAAA,EAEnB,QAASI,EACT,MAAO,CAAE,GAAIL,EAAK,OAAS,CAAA,EAAK,GAAIC,GAAiB,OAAS,EAAC,EAC/D,QAASA,GAAiB,SAAWJ,EACrC,KAAAC,EAEC,SAAAQ,CAAA,CAAA,CAGP,CACF,EAEAb,EAAO,YAAc"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),Oe=require("react"),Se=require("../../packages/ui/src/components/calendar.cjs"),Z=require("../../packages/ui/src/components/popover.cjs"),P=require("../../packages/ui/src/components/drawer.cjs");require("@radix-ui/react-slot");require("../../packages/ui/src/components/button.cjs");require("../../packages/ui/src/components/button-group.cjs");require("../../packages/ui/src/components/input.cjs");require("../../packages/ui/src/components/textarea.cjs");require("@radix-ui/react-label");const z=require("../../packages/ui/src/lib/utils.cjs");require("../../packages/ui/src/components/select.cjs");require("../../packages/ui/src/components/combobox.cjs");require("@radix-ui/react-tooltip");require("@radix-ui/react-separator");require("../../packages/ui/src/components/switch.cjs");require("@radix-ui/react-scroll-area");require("../../packages/ui/src/components/tree-view.cjs");require("@radix-ui/react-alert-dialog");require("@radix-ui/react-avatar");require("../../packages/ui/src/components/badge.cjs");const ue=require("lucide-react");require("../../packages/ui/src/components/checkbox.cjs");require("@radix-ui/react-collapsible");require("cmdk");require("@radix-ui/react-dialog");require("@radix-ui/react-dropdown-menu");require("../../packages/ui/src/components/input-otp.cjs");require("../../packages/ui/src/components/radio-group.cjs");require("../../packages/ui/src/components/sidebar.cjs");require("@radix-ui/react-slider");require("../../packages/ui/src/components/tabs.cjs");require("../../packages/ui/src/components/toggle.cjs");const le=require("./TimePicker.cjs"),S=require("react-device-detect"),H=require("date-fns"),fe=require("date-fns/locale"),me=require("../../constants/common.cjs"),Ie=require("../FloatLabel.cjs"),ke=require("../Button/Button.cjs"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),Oe=require("react"),Se=require("../../packages/ui/src/components/calendar.cjs"),Z=require("../../packages/ui/src/components/popover.cjs"),P=require("../../packages/ui/src/components/drawer.cjs");require("@radix-ui/react-slot");require("../../packages/ui/src/components/button.cjs");require("../../packages/ui/src/components/button-group.cjs");require("../../packages/ui/src/components/input.cjs");require("../../packages/ui/src/components/textarea.cjs");require("@radix-ui/react-label");const z=require("../../packages/ui/src/lib/utils.cjs");require("../../packages/ui/src/components/select.cjs");require("../../packages/ui/src/components/combobox.cjs");require("@radix-ui/react-tooltip");require("@radix-ui/react-separator");require("../../packages/ui/src/components/switch.cjs");require("@radix-ui/react-scroll-area");require("../../packages/ui/src/components/tree-view.cjs");require("@radix-ui/react-alert-dialog");require("@radix-ui/react-avatar");require("../../packages/ui/src/components/badge.cjs");const ue=require("lucide-react");require("../../packages/ui/src/components/checkbox.cjs");require("@radix-ui/react-collapsible");require("cmdk");require("@radix-ui/react-dialog");require("@radix-ui/react-dropdown-menu");require("../../packages/ui/src/components/input-otp.cjs");require("../../packages/ui/src/components/radio-group.cjs");require("../../packages/ui/src/components/sidebar.cjs");require("@radix-ui/react-slider");require("../../packages/ui/src/components/tabs.cjs");require("../../packages/ui/src/components/toggle.cjs");const le=require("./TimePicker.cjs"),S=require("react-device-detect"),H=require("date-fns"),fe=require("date-fns/locale"),me=require("../../constants/common.cjs"),Ie=require("../FloatLabel.cjs"),ke=require("../Button/Button.cjs"),Ce=require("../Input/Input.cjs");function Ve(c){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(c){for(const l in c)if(l!=="default"){const v=Object.getOwnPropertyDescriptor(c,l);Object.defineProperty(a,l,v.get?v:{enumerable:!0,get:()=>c[l]})}}return a.default=c,Object.freeze(a)}const D=Ve(Oe);function $e(c,a=me.DATE_FORMAT,l){return c?H.format(c,a,l?{locale:l}:void 0):""}const j=(c,a=me.DATE_FORMAT)=>{const l=H.parse(c,a,new Date);return H.isValid(l)?l:void 0};function Le(c){return c.replace(/dd|MM|yyyy/g,a=>{switch(a){case"dd":case"MM":return"99";case"yyyy":return"9999";default:return a}}).replace(/d|M|y/g,a=>{switch(a){case"d":case"M":return"9";case"y":return"9";default:return a}})}function Ae({label:c,value:a,placeholder:l,onChange:v,onSelect:f,calendarClassName:ge,side:be="bottom",align:we="end",format:O="dd/MM/yyyy",language:ve="vi",mask:C,closeOnSelect:he=!1,showOutsideDays:qe=!0,calendarConfig:V,timeConfig:ee,desktopMode:I="popover",mobileMode:re="drawer",children:$,separator:pe=i.jsx(ue.MoveRight,{className:"ds:size-5"}),showTime:x=!1,timeFormat:h="HH:mm",hideDate:te=!1,numberOfMonths:De=1,variant:je="default",color:xe="primary",...n}){const oe=D.useId();let g,L;typeof O=="string"?(g=O,L=O):(g=O.input,L=O.output);let A;C===!0?A=Le(g):typeof C=="string"&&(A=C);const se=a?.from?j(a.from,g):void 0,ye=a?.to?j(a.to,g):void 0,Me={from:se,to:ye},[ne,k]=D.useState(!1),[s,m]=D.useState(Me),[Te,E]=D.useState(se||new Date),[F,q]=D.useState(a?.from||""),[R,p]=D.useState(a?.to||""),[_,B]=D.useState(void 0),[U,Y]=D.useState(void 0),K=D.useRef(null),G=D.useRef(null),ze=!!(F.trim()||R.trim()),J=V?.locale?V?.locale:ve==="en"?fe.enUS:fe.vi,t=e=>{if(!e)return"";let r=$e(e,L,J);return x&&(r+=` ${H.format(e,h)}`),r},Fe=e=>{m(e);const r=t(e?.from),o=t(e?.to);q(r),p(o),f?.(e,{from:r,to:o})},Re=e=>{if(q(e),e.trim()===""){q(""),p("");const b={from:void 0,to:void 0};m(b),f?.(b,b);return}let r;x?r=j(e,`${g} ${h}`):r=j(e,g);const o={from:r,to:s?.to};r?(m(o),E(r),B(r),f?.(o,{from:t(r),to:t(s?.to)})):(m(o),f?.(o,{from:t(s?.from),to:t(s?.to)}))},Ne=e=>{if(p(e),e.trim()===""){q(""),p("");const b={from:void 0,to:void 0};m(b),f?.(b,b);return}let r;x?r=j(e,`${g} ${h}`):r=j(e,g);const o={from:s?.from,to:r};r?(m(o),Y(r),f?.(o,{from:t(s?.from),to:t(r)})):(m(o),f?.(o,{from:t(s?.from),to:void 0}))},Pe=e=>{if(e){B(e);const r=new Date(s?.from||new Date);r.setHours(e.getHours(),e.getMinutes(),e.getSeconds(),0);const o={from:r,to:s?.to};m(o),q(t(r)),f?.(o,{from:t(r),to:t(s?.to)}),v?.(o,{from:t(r),to:t(s?.to)})}},He=e=>{if(e){Y(e);const r=new Date(s?.to||new Date);r.setHours(e.getHours(),e.getMinutes(),e.getSeconds(),0);const o={from:s?.from,to:r};m(o),p(t(r)),f?.(o,{from:t(s?.from),to:t(r)}),v?.(o,{from:t(s?.from),to:t(r)})}},ie=$?$({fromValue:F,toValue:R,range:s,onSelect:Fe,onFromChange:Re,onToChange:Ne}):i.jsxs(ke.default,{variant:"ghost",className:"ds:!p-1 ds:!leading-0 ds:h-auto ds:rounded ds:hover:bg-accent ds:transition-colors",size:n?.size,children:[i.jsx(ue.CalendarIcon,{className:z.cn({"ds:size-3":n.size==="xs"||n.size==="sm","ds:size-3.5":!n.size||n.size==="normal","ds:size-4":n.size==="lg"||n.size==="xl"})}),i.jsx("span",{className:"ds:sr-only",children:"Select date range"})]}),ae=i.jsxs("div",{className:z.cn("ds:flex ds:items-stretch",x&&!te?"ds:gap-0":""),children:[!te&&i.jsx(Se.Calendar,{...V,mode:"range",selected:s,captionLayout:"dropdown",month:Te,onMonthChange:E,numberOfMonths:S.isMobile?1:De||1,variant:je,color:xe,onSelect:e=>{let r=e;if(x){const d=_,u=U;r={from:e?.from?new Date(e.from.getFullYear(),e.from.getMonth(),e.from.getDate(),d?.getHours()||0,d?.getMinutes()||0,d?.getSeconds()||0):void 0,to:e?.to?new Date(e.to.getFullYear(),e.to.getMonth(),e.to.getDate(),u?.getHours()||0,u?.getMinutes()||0,u?.getSeconds()||0):void 0}}m(r);const o=t(r?.from),b=t(r?.to);q(o),p(b),f?.(r,{from:o,to:b}),v?.(r,{from:o,to:b}),he&&r?.from&&r?.to&&!x&&k(!1)},locale:J,formatters:{formatMonthDropdown:e=>e.toLocaleString(J.code,{month:"short"})},showOutsideDays:qe,className:z.cn("ds:mx-auto",{"ds:[--cell-size:clamp(0px,calc(100vw/7.5),52px)] ds:mb-8 ds:bg-transparent":S.isMobile||I==="drawer","ds:[--cell-size:clamp(0px,calc(100vw/7.5),34px)]":!S.isMobile&&I!=="drawer"},ge)}),x&&i.jsxs("div",{className:"ds:flex ds:gap-0 ds:border-l ds:border-border",children:[i.jsx(le.TimePicker,{...ee?.[0],value:_?H.format(_,h):void 0,onSelect:Pe,format:h,showHours:!0,showMinutes:!0,showSeconds:h==="HH:mm:ss",standalone:!1}),i.jsx("div",{className:"ds:border-l ds:border-border"}),i.jsx(le.TimePicker,{...ee?.[1],value:U?H.format(U,h):void 0,onSelect:He,format:h,showHours:!0,showMinutes:!0,showSeconds:h==="HH:mm:ss",standalone:!1})]})]}),Q=i.jsxs(Z.Popover,{open:ne,onOpenChange:k,children:[i.jsx(Z.PopoverTrigger,{asChild:!0,disabled:n.disabled,children:ie}),i.jsx(Z.PopoverContent,{className:z.cn("ds:w-auto ds:overflow-hidden ds:p-0","ds:backdrop-blur ds:bg-background/50"),side:be,align:we,children:ae})]}),W=i.jsxs(P.Drawer,{open:ne,onOpenChange:k,children:[i.jsx(P.DrawerTrigger,{asChild:!0,children:ie}),i.jsxs(P.DrawerContent,{className:z.cn("ds:w-auto ds:overflow-hidden ds:p-0","ds:backdrop-blur ds:bg-background"),children:[i.jsxs(P.DrawerHeader,{className:"ds:sr-only",children:[i.jsx(P.DrawerTitle,{children:"Select date range"}),i.jsx(P.DrawerDescription,{children:"Set your date range"})]}),ae]})]});if($)return(S.isMobile?re:I)==="drawer"?W:Q;const de=(e,r,o,b)=>{const d=e==="from";return i.jsx(Ce.default,{...n,...b,ref:d?K:G,id:oe,size:n.isFloatLabel?n.size?n.size:"xl":n.size,className:n.className,inputClassName:z.cn("ds:border-0 ds:focus:ring-0 ds:rounded-none ds:hover:bg-transparent ds:active:bg-transparent ds:focus-visible:ring-0 ds:focus-visible:border-0 ds:shadow-none",d?"ds:pr-0":""),label:n.isFloatLabel&&typeof c=="object"?d?c?.from||"":c?.to||"":"",placeholder:typeof l=="object"?d?l?.from||"":l?.to||"":l,clearable:!d,value:r,mask:A,onChange:u=>{const y=u.target.value;if(o(y),y.trim()===""){q(""),p("");const M={from:void 0,to:void 0};m(M),f?.(M,M),v?.(M,M);return}let w;x?w=j(y,`${g} ${h}`):w=j(y,g);const N=d?{from:w,to:s?.to}:{from:s?.from,to:w};if(w){m(N),d&&E(w),d?B(w):Y(w);const M=t(d?w:s?.from),ce=t(d?s?.to:w);f?.(N,{from:M,to:ce}),v?.(N,{from:d?y:F,to:d?R:y})}else f?.(N,{from:t(s?.from),to:d?t(s?.to):void 0}),v?.(N,{from:t(s?.from),to:d?t(s?.to):void 0})},onClear:d?void 0:()=>{q(""),p("");const u={from:void 0,to:void 0};m(u),f?.(u,u),v?.(u,u)},onBlur:()=>{const u=document.activeElement;u!==K.current&&u!==G.current&&setTimeout(()=>{const y=document.activeElement;if(y!==K.current&&y!==G.current){const w=T=>{if(T.trim()==="")return!0;let X;return x?X=j(T,`${g} ${h}`):X=j(T,g),!!X},N=w(F),M=w(R);if(!N||!M||F.trim()&&!R.trim()||!F.trim()&&R.trim()){q(""),p("");const T={from:void 0,to:void 0};m(T),f?.(T,T),v?.(T,T)}}},100)},onKeyDown:u=>{u.key==="ArrowDown"&&(u.preventDefault(),k(!0))}})};return i.jsxs("div",{className:z.cn("ds:group ds:relative ds:flex ds:items-center ds:border ds:rounded-md ds:focus-within:ring-2 ds:focus-within:ring-offset-2 ds:bg-background ds:transition-[color,box-shadow]",{"ds:border-input ds:focus-within:ring-ring":!n.state,"ds:border-success ds:focus-within:ring-success":n.state==="success","ds:border-warning ds:focus-within:ring-warning":n.state==="warning","ds:border-error ds:focus-within:ring-error":n.state==="error"}),children:[de("from",F,q),i.jsx("span",{className:z.cn("ds:text-muted-foreground ds:select-none ds:pl-2",{"ds:opacity-30":n.disabled}),children:pe}),de("to",R,p,{suffixIcon:S.isMobile?re==="drawer"?W:Q:I==="drawer"?W:Q}),n.isFloatLabel&&typeof c=="string"&&i.jsx(Ie.FloatingLabel,{htmlFor:oe,size:n.size,infoTooltip:n.infoTooltip,className:"ds:z-10",shouldFloat:ze,children:c})]})}exports.RangePicker=Ae;
|
|
2
2
|
//# sourceMappingURL=RangePicker.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RangePicker.cjs","sources":["../../../../src/components/DatePicker/RangePicker.tsx"],"sourcesContent":["import * as React from \"react\";\nimport {\n CalendarDayButton as SCalendarDayButton,\n type CalendarDayButtonProps as SCalendarDayButtonProps,\n Calendar,\n type CalendarColor,\n} from \"@dsui/ui/components/calendar\";\nimport {\n Popover,\n PopoverContent,\n PopoverTrigger,\n} from \"@dsui/ui/components/popover\";\nimport {\n Drawer,\n DrawerContent,\n DrawerDescription,\n DrawerHeader,\n DrawerTitle,\n DrawerTrigger,\n} from \"@dsui/ui/components/drawer\";\nimport { cn } from \"@dsui/ui/index\";\nimport { Input, type InputProps } from \"../Input\";\nimport { Button } from \"../Button\";\nimport { TimePicker } from \"./TimePicker\";\nimport { type DatePickerProps } from \"./DatePicker\";\nimport { CalendarIcon, MoveRight } from \"lucide-react\";\nimport { isMobile } from \"react-device-detect\";\nimport { format as dfFormat, parse, isValid, type Locale } from \"date-fns\";\nimport { vi, enUS } from \"date-fns/locale\";\nimport { DATE_FORMAT } from \"@/constants/common\";\nimport { FloatingLabel } from \"@/components/FloatLabel\";\n\nexport type DateRange = {\n from?: Date | undefined;\n to?: Date | undefined;\n};\n\nexport type DateRangeText = { from?: string; to?: string } | null;\n\nfunction formatDate(\n date: Date | undefined,\n outputFormat: string = DATE_FORMAT,\n locale?: Locale\n) {\n if (!date) return \"\";\n\n return dfFormat(date, outputFormat, locale ? { locale } : undefined);\n}\n\nconst parseDate = (\n str: string,\n inputFormat: string = DATE_FORMAT\n): Date | undefined => {\n const date = parse(str, inputFormat, new Date());\n return isValid(date) ? date : undefined;\n};\n\nfunction generateMaskFromFormat(format: string): string {\n return format\n .replace(/dd|MM|yyyy/g, (match) => {\n switch (match) {\n case \"dd\":\n case \"MM\":\n return \"99\";\n case \"yyyy\":\n return \"9999\";\n default:\n return match;\n }\n })\n .replace(/d|M|y/g, (match) => {\n switch (match) {\n case \"d\":\n case \"M\":\n return \"9\";\n case \"y\":\n return \"9\";\n default:\n return match;\n }\n });\n}\n\nexport type FormatType = string | { input: string; output: string };\n\nexport type RangePickerRenderProps = {\n fromValue: string;\n toValue: string;\n range?: DateRange;\n onSelect: (range?: DateRange) => void;\n onFromChange: (text: string) => void;\n onToChange: (text: string) => void;\n};\n\nexport type TimeConfig = Omit<\n React.ComponentProps<typeof TimePicker>,\n \"value\" | \"onSelect\" | \"format\"\n>;\n\nexport type RangePickerProps = Omit<\n DatePickerProps,\n \"value\" | \"onChange\" | \"onSelect\" | \"children\" | \"label\" | \"placeholder\"\n> & {\n label?: string | DateRangeText;\n placeholder?: string | DateRangeText;\n value?: DateRangeText;\n onChange?: (value?: DateRange, text?: DateRangeText) => void;\n onSelect?: (value?: DateRange, text?: DateRangeText) => void;\n children?: (props: RangePickerRenderProps) => React.ReactNode;\n separator?: React.ReactNode;\n timeConfig?: [TimeConfig, TimeConfig];\n numberOfMonths?: number;\n variant?: \"default\" | \"rounded\";\n color?: CalendarColor;\n};\n\nexport function RangePicker({\n label,\n value,\n placeholder,\n onChange,\n onSelect,\n calendarClassName,\n side = \"bottom\",\n align = \"end\",\n format = \"dd/MM/yyyy\",\n language = \"vi\",\n mask,\n closeOnSelect = false,\n showOutsideDays = true,\n calendarConfig,\n timeConfig,\n desktopMode = \"popover\",\n mobileMode = \"drawer\",\n children,\n separator = <MoveRight className=\"ds:size-5\" />,\n showTime = false,\n timeFormat = \"HH:mm\",\n hideDate = false,\n numberOfMonths = 1,\n variant = \"default\",\n color = \"primary\",\n ...props\n}: RangePickerProps) {\n const inputId = React.useId();\n\n let inputFormat: string;\n let outputFormat: string;\n if (typeof format === \"string\") {\n inputFormat = format;\n outputFormat = format;\n } else {\n inputFormat = format.input;\n outputFormat = format.output;\n }\n\n // Determine the mask to use\n let maskToUse: string | undefined;\n if (mask === true) {\n maskToUse = generateMaskFromFormat(inputFormat);\n } else if (typeof mask === \"string\") {\n maskToUse = mask;\n }\n\n const initialFromDate = value?.from\n ? parseDate(value.from, inputFormat)\n : undefined;\n const initialToDate = value?.to\n ? parseDate(value.to, inputFormat)\n : undefined;\n const initialRange: DateRange = {\n from: initialFromDate,\n to: initialToDate,\n };\n\n const [open, setOpen] = React.useState(false);\n const [range, setRange] = React.useState<DateRange | undefined>(initialRange);\n const [month, setMonth] = React.useState<Date | undefined>(\n initialFromDate || new Date()\n );\n const [fromInputValue, setFromInputValue] = React.useState(value?.from || \"\");\n const [toInputValue, setToInputValue] = React.useState(value?.to || \"\");\n const [fromTime, setFromTime] = React.useState<Date | undefined>(undefined);\n const [toTime, setToTime] = React.useState<Date | undefined>(undefined);\n const fromInputRef = React.useRef<HTMLInputElement>(null);\n const toInputRef = React.useRef<HTMLInputElement>(null);\n\n const shouldFloat = !!(fromInputValue.trim() || toInputValue.trim());\n\n const _locale: Locale = calendarConfig?.locale\n ? (calendarConfig?.locale as Locale)\n : language === \"en\"\n ? enUS\n : vi;\n\n // Helper to format date-time based on showTime and timeFormat\n const formatDateTimeValue = (d: Date | undefined): string => {\n if (!d) return \"\";\n let result = formatDate(d, outputFormat, _locale);\n if (showTime) {\n result += ` ${dfFormat(d, timeFormat)}`;\n }\n return result;\n };\n\n // Helper functions for render props\n const handleSelectForRenderProp = (range?: DateRange) => {\n setRange(range);\n const fromFormatted = formatDateTimeValue(range?.from);\n const toFormatted = formatDateTimeValue(range?.to);\n setFromInputValue(fromFormatted);\n setToInputValue(toFormatted);\n onSelect?.(range, { from: fromFormatted, to: toFormatted });\n };\n\n const handleFromChangeForRenderProp = (text: string) => {\n setFromInputValue(text);\n\n // If the input is cleared (empty), clear both fields\n if (text.trim() === \"\") {\n setFromInputValue(\"\");\n setToInputValue(\"\");\n const newRange: DateRange = { from: undefined, to: undefined };\n setRange(newRange);\n onSelect?.(newRange, newRange as DateRangeText);\n return;\n }\n\n // Try to parse based on showTime\n let parsedDate: Date | undefined;\n if (showTime) {\n parsedDate = parseDate(text, `${inputFormat} ${timeFormat}`);\n } else {\n parsedDate = parseDate(text, inputFormat);\n }\n const newRange: DateRange = { from: parsedDate, to: range?.to };\n if (parsedDate) {\n setRange(newRange);\n setMonth(parsedDate);\n setFromTime(parsedDate);\n onSelect?.(newRange, {\n from: formatDateTimeValue(parsedDate),\n to: formatDateTimeValue(range?.to),\n });\n } else {\n setRange(newRange);\n onSelect?.(newRange, {\n from: formatDateTimeValue(range?.from),\n to: formatDateTimeValue(range?.to),\n });\n }\n };\n\n const handleToChangeForRenderProp = (text: string) => {\n setToInputValue(text);\n\n // If the input is cleared (empty), clear both fields\n if (text.trim() === \"\") {\n setFromInputValue(\"\");\n setToInputValue(\"\");\n const newRange: DateRange = { from: undefined, to: undefined };\n setRange(newRange);\n onSelect?.(newRange, newRange as DateRangeText);\n return;\n }\n\n // Try to parse based on showTime\n let parsedDate: Date | undefined;\n if (showTime) {\n parsedDate = parseDate(text, `${inputFormat} ${timeFormat}`);\n } else {\n parsedDate = parseDate(text, inputFormat);\n }\n const newRange: DateRange = {\n from: range?.from,\n to: parsedDate,\n };\n if (parsedDate) {\n setRange(newRange);\n setToTime(parsedDate);\n onSelect?.(newRange, {\n from: formatDateTimeValue(range?.from),\n to: formatDateTimeValue(parsedDate),\n });\n } else {\n setRange(newRange);\n onSelect?.(newRange, {\n from: formatDateTimeValue(range?.from),\n to: undefined,\n });\n }\n };\n\n const handleTimeChangeFrom = (date?: Date) => {\n if (date) {\n setFromTime(date);\n // Merge: keep date (year, month, day) from existing range.from, take time (hours, minutes, seconds) from TimePicker\n const mergedDate = new Date(range?.from || new Date());\n mergedDate.setHours(\n date.getHours(),\n date.getMinutes(),\n date.getSeconds(),\n 0\n );\n\n const newRange: DateRange = {\n from: mergedDate,\n to: range?.to,\n };\n setRange(newRange);\n setFromInputValue(formatDateTimeValue(mergedDate));\n onSelect?.(newRange, {\n from: formatDateTimeValue(mergedDate),\n to: formatDateTimeValue(range?.to),\n });\n onChange?.(newRange, {\n from: formatDateTimeValue(mergedDate),\n to: formatDateTimeValue(range?.to),\n });\n }\n };\n\n const handleTimeChangeTo = (date?: Date) => {\n if (date) {\n setToTime(date);\n // Merge: keep date (year, month, day) from existing range.to, take time (hours, minutes, seconds) from TimePicker\n const mergedDate = new Date(range?.to || new Date());\n mergedDate.setHours(\n date.getHours(),\n date.getMinutes(),\n date.getSeconds(),\n 0\n );\n\n const newRange: DateRange = {\n from: range?.from,\n to: mergedDate,\n };\n setRange(newRange);\n setToInputValue(formatDateTimeValue(mergedDate));\n onSelect?.(newRange, {\n from: formatDateTimeValue(range?.from),\n to: formatDateTimeValue(mergedDate),\n });\n onChange?.(newRange, {\n from: formatDateTimeValue(range?.from),\n to: formatDateTimeValue(mergedDate),\n });\n }\n };\n\n // Determine trigger component\n const triggerComponent = children ? (\n children({\n fromValue: fromInputValue,\n toValue: toInputValue,\n range,\n onSelect: handleSelectForRenderProp,\n onFromChange: handleFromChangeForRenderProp,\n onToChange: handleToChangeForRenderProp,\n })\n ) : (\n <Button\n variant=\"ghost\"\n className=\"ds:!p-1 ds:!leading-0 ds:h-auto ds:rounded ds:hover:bg-accent ds:transition-colors\"\n size={props?.size}\n >\n <CalendarIcon\n className={cn({\n \"ds:size-3\": props.size === \"xs\" || props.size === \"sm\",\n \"ds:size-3.5\": !props.size || props.size === \"normal\",\n \"ds:size-4\": props.size === \"lg\" || props.size === \"xl\",\n })}\n />\n <span className=\"ds:sr-only\">Select date range</span>\n </Button>\n );\n\n const calendarSelection = (\n <div\n className={cn(\"ds:flex ds:items-stretch\", showTime && !hideDate ? \"ds:gap-0\" : \"\")}\n >\n {!hideDate && (\n <Calendar\n {...calendarConfig}\n mode=\"range\"\n selected={range as any}\n captionLayout=\"dropdown\"\n month={month}\n onMonthChange={setMonth}\n numberOfMonths={isMobile ? 1 : numberOfMonths || 1}\n variant={variant}\n color={color}\n onSelect={(selectedRange) => {\n // Preserve time from TimePicker values if showTime is enabled\n let preservedRange = selectedRange;\n if (showTime) {\n // Get current time from TimePicker state\n const fromTimeObj = fromTime;\n const toTimeObj = toTime;\n\n preservedRange = {\n from: selectedRange?.from\n ? new Date(\n selectedRange.from.getFullYear(),\n selectedRange.from.getMonth(),\n selectedRange.from.getDate(),\n fromTimeObj?.getHours() || 0,\n fromTimeObj?.getMinutes() || 0,\n fromTimeObj?.getSeconds() || 0\n )\n : undefined,\n to: selectedRange?.to\n ? new Date(\n selectedRange.to.getFullYear(),\n selectedRange.to.getMonth(),\n selectedRange.to.getDate(),\n toTimeObj?.getHours() || 0,\n toTimeObj?.getMinutes() || 0,\n toTimeObj?.getSeconds() || 0\n )\n : undefined,\n };\n }\n setRange(preservedRange);\n const fromFormatted = formatDateTimeValue(preservedRange?.from);\n const toFormatted = formatDateTimeValue(preservedRange?.to);\n setFromInputValue(fromFormatted);\n setToInputValue(toFormatted);\n onSelect?.(preservedRange, {\n from: fromFormatted,\n to: toFormatted,\n });\n onChange?.(preservedRange, {\n from: fromFormatted,\n to: toFormatted,\n });\n if (\n closeOnSelect &&\n preservedRange?.from &&\n preservedRange?.to &&\n !showTime\n ) {\n setOpen(false);\n }\n }}\n locale={_locale}\n formatters={{\n formatMonthDropdown: (date) =>\n date.toLocaleString(_locale.code, { month: \"short\" }),\n }}\n showOutsideDays={showOutsideDays}\n className={cn(\n \"ds:mx-auto\",\n {\n \"ds:[--cell-size:clamp(0px,calc(100vw/7.5),52px)] ds:mb-8 ds:bg-transparent\":\n isMobile || desktopMode === \"drawer\",\n \"ds:[--cell-size:clamp(0px,calc(100vw/7.5),34px)]\":\n !isMobile && desktopMode !== \"drawer\",\n },\n calendarClassName\n )}\n />\n )}\n {showTime && (\n <div className=\"ds:flex ds:gap-0 ds:border-l ds:border-border\">\n <TimePicker\n {...timeConfig?.[0]}\n value={fromTime ? dfFormat(fromTime, timeFormat) : undefined}\n onSelect={handleTimeChangeFrom}\n format={timeFormat}\n showHours\n showMinutes\n showSeconds={timeFormat === \"HH:mm:ss\"}\n standalone={false}\n />\n <div className=\"ds:border-l ds:border-border\" />\n <TimePicker\n {...timeConfig?.[1]}\n value={toTime ? dfFormat(toTime, timeFormat) : undefined}\n onSelect={handleTimeChangeTo}\n format={timeFormat}\n showHours\n showMinutes\n showSeconds={timeFormat === \"HH:mm:ss\"}\n standalone={false}\n />\n </div>\n )}\n </div>\n );\n\n const popPicker = (\n <Popover open={open} onOpenChange={setOpen}>\n <PopoverTrigger asChild disabled={props.disabled}>\n {triggerComponent}\n </PopoverTrigger>\n <PopoverContent\n className={cn(\n \"ds:w-auto ds:overflow-hidden ds:p-0\",\n \"ds:backdrop-blur ds:bg-background/50\"\n )}\n side={side}\n align={align}\n >\n {calendarSelection}\n </PopoverContent>\n </Popover>\n );\n\n const drawPicker = (\n <Drawer open={open} onOpenChange={setOpen}>\n <DrawerTrigger asChild>{triggerComponent}</DrawerTrigger>\n <DrawerContent\n className={cn(\n \"ds:w-auto ds:overflow-hidden ds:p-0\",\n \"ds:backdrop-blur ds:bg-background\"\n )}\n >\n <DrawerHeader className=\"ds:sr-only\">\n <DrawerTitle>Select date range</DrawerTitle>\n <DrawerDescription>Set your date range</DrawerDescription>\n </DrawerHeader>\n {calendarSelection}\n </DrawerContent>\n </Drawer>\n );\n\n // If children is provided, use render prop pattern with picker\n if (children) {\n const mode = isMobile ? mobileMode : desktopMode;\n return mode === \"drawer\" ? drawPicker : popPicker;\n }\n\n // Helper function to render range input\n const renderRangeInput = (\n type: \"from\" | \"to\",\n inputValue: string,\n setInputValue: (value: string) => void,\n additionalProps?: Partial<InputProps>\n ) => {\n const isFrom = type === \"from\";\n\n return (\n <Input\n {...props}\n {...additionalProps}\n ref={isFrom ? fromInputRef : toInputRef}\n id={inputId}\n size={\n props.isFloatLabel ? (props.size ? props.size : \"xl\") : props.size\n }\n className={cn(\n props.className,\n \"ds:relative ds:peer ds:border-0 ds:focus:ring-0 ds:rounded-none ds:hover:bg-transparent ds:active:bg-transparent ds:focus-visible:ring-0 ds:focus-visible:border-0\",\n isFrom ? \"ds:pr-0\" : \"\"\n )}\n label={\n props.isFloatLabel && typeof label === \"object\"\n ? isFrom\n ? label?.from || \"\"\n : label?.to || \"\"\n : \"\"\n }\n placeholder={\n typeof placeholder === \"object\"\n ? isFrom\n ? placeholder?.from || \"\"\n : placeholder?.to || \"\"\n : placeholder\n }\n clearable={!isFrom}\n value={inputValue}\n mask={maskToUse}\n onChange={(e) => {\n const inputValue = e.target.value;\n setInputValue(inputValue);\n\n // If the input is cleared (empty), clear both fields\n if (inputValue.trim() === \"\") {\n setFromInputValue(\"\");\n setToInputValue(\"\");\n const newRange: DateRange = { from: undefined, to: undefined };\n setRange(newRange);\n onSelect?.(newRange, newRange as DateRangeText);\n onChange?.(newRange, newRange as DateRangeText);\n return;\n }\n\n // Try to parse based on showTime\n let date: Date | undefined;\n if (showTime) {\n date = parseDate(inputValue, `${inputFormat} ${timeFormat}`);\n } else {\n date = parseDate(inputValue, inputFormat);\n }\n const newRange: DateRange = isFrom\n ? { from: date, to: range?.to }\n : { from: range?.from, to: date };\n\n if (date) {\n setRange(newRange);\n if (isFrom) setMonth(date);\n // Update time state if time was parsed\n if (isFrom) {\n setFromTime(date);\n // setFromInputValue(formatDateTimeValue(date)); // Sync input value\n } else {\n setToTime(date);\n // setToInputValue(formatDateTimeValue(date)); // Sync input value\n }\n const fromFormatted = formatDateTimeValue(\n isFrom ? date : range?.from\n );\n const toFormatted = formatDateTimeValue(isFrom ? range?.to : date);\n onSelect?.(newRange, { from: fromFormatted, to: toFormatted });\n onChange?.(newRange, {\n from: isFrom ? inputValue : fromInputValue,\n to: isFrom ? toInputValue : inputValue,\n });\n\n // If from input and date is valid, auto-focus to to input if to is empty\n // if (isFrom && toInputRef.current && !toInputValue.trim()) {\n // requestAnimationFrame(() => toInputRef.current?.focus());\n // }\n } else {\n onSelect?.(newRange, {\n from: formatDateTimeValue(range?.from),\n to: isFrom ? formatDateTimeValue(range?.to) : undefined,\n });\n onChange?.(newRange, {\n from: formatDateTimeValue(range?.from),\n to: isFrom ? formatDateTimeValue(range?.to) : undefined,\n });\n }\n }}\n onClear={\n !isFrom\n ? () => {\n setFromInputValue(\"\");\n setToInputValue(\"\");\n const newRange: DateRange = { from: undefined, to: undefined };\n setRange(newRange);\n onSelect?.(newRange, newRange as DateRangeText);\n onChange?.(newRange, newRange as DateRangeText);\n }\n : undefined\n }\n onBlur={() => {\n // Check if blurring out of the entire range picker group\n const activeElement = document.activeElement;\n if (\n activeElement !== fromInputRef.current &&\n activeElement !== toInputRef.current\n ) {\n // Delay validation by 100ms\n setTimeout(() => {\n // Check again if still blurred out of the group\n const currentActiveElement = document.activeElement;\n if (\n currentActiveElement !== fromInputRef.current &&\n currentActiveElement !== toInputRef.current\n ) {\n // Blurred out of the group, validate both inputs\n const validateInput = (val: string) => {\n if (val.trim() === \"\") return true; // empty is valid (will clear)\n let parsed: Date | undefined;\n if (showTime) {\n parsed = parseDate(val, `${inputFormat} ${timeFormat}`);\n } else {\n parsed = parseDate(val, inputFormat);\n }\n return !!parsed;\n };\n\n const fromValid = validateInput(fromInputValue);\n const toValid = validateInput(toInputValue);\n\n // Clear if either is invalid, or if only one has value\n const shouldClear =\n !fromValid ||\n !toValid ||\n (fromInputValue.trim() && !toInputValue.trim()) ||\n (!fromInputValue.trim() && toInputValue.trim());\n\n if (shouldClear) {\n // If either is invalid, clear both\n setFromInputValue(\"\");\n setToInputValue(\"\");\n const newRange: DateRange = {\n from: undefined,\n to: undefined,\n };\n setRange(newRange);\n onSelect?.(newRange, newRange as DateRangeText);\n onChange?.(newRange, newRange as DateRangeText);\n }\n }\n }, 100);\n }\n }}\n onKeyDown={(e) => {\n if (e.key === \"ArrowDown\") {\n e.preventDefault();\n setOpen(true);\n }\n }}\n />\n );\n };\n\n // Default input rendering with two inputs\n return (\n <div\n className={cn(\n \"ds:group ds:relative ds:flex ds:items-center ds:border ds:rounded-md ds:focus-within:ring-2 ds:focus-within:ring-offset-2 ds:bg-background ds:transition-[color,box-shadow]\",\n {\n \"ds:border-input ds:focus-within:ring-ring\": !props.state,\n \"ds:border-success ds:focus-within:ring-success\": props.state === \"success\",\n \"ds:border-warning ds:focus-within:ring-warning\": props.state === \"warning\",\n \"ds:border-error ds:focus-within:ring-error\": props.state === \"error\",\n }\n )}\n >\n {renderRangeInput(\"from\", fromInputValue, setFromInputValue)}\n <span\n className={cn(\"ds:text-muted-foreground ds:select-none ds:pl-2\", {\n \"ds:opacity-30\": props.disabled,\n })}\n >\n {separator}\n </span>\n {renderRangeInput(\"to\", toInputValue, setToInputValue, {\n suffixIcon: isMobile\n ? mobileMode === \"drawer\"\n ? drawPicker\n : popPicker\n : desktopMode === \"drawer\"\n ? drawPicker\n : popPicker,\n })}\n {props.isFloatLabel && typeof label === \"string\" && (\n <FloatingLabel\n htmlFor={inputId}\n size={props.size}\n infoTooltip={props.infoTooltip}\n className=\"ds:z-10\"\n shouldFloat={shouldFloat}\n >\n {label}\n </FloatingLabel>\n )}\n </div>\n );\n}\n"],"names":["formatDate","date","outputFormat","DATE_FORMAT","locale","dfFormat","parseDate","str","inputFormat","parse","isValid","generateMaskFromFormat","format","match","RangePicker","label","value","placeholder","onChange","onSelect","calendarClassName","side","align","language","mask","closeOnSelect","showOutsideDays","calendarConfig","timeConfig","desktopMode","mobileMode","children","separator","jsx","MoveRight","showTime","timeFormat","hideDate","numberOfMonths","variant","color","props","inputId","React","maskToUse","initialFromDate","initialToDate","initialRange","open","setOpen","range","setRange","month","setMonth","fromInputValue","setFromInputValue","toInputValue","setToInputValue","fromTime","setFromTime","toTime","setToTime","fromInputRef","toInputRef","shouldFloat","_locale","enUS","vi","formatDateTimeValue","d","result","handleSelectForRenderProp","fromFormatted","toFormatted","handleFromChangeForRenderProp","text","newRange","parsedDate","handleToChangeForRenderProp","handleTimeChangeFrom","mergedDate","handleTimeChangeTo","triggerComponent","jsxs","Button","CalendarIcon","cn","calendarSelection","Calendar","isMobile","selectedRange","preservedRange","fromTimeObj","toTimeObj","TimePicker","popPicker","Popover","PopoverTrigger","PopoverContent","drawPicker","Drawer","DrawerTrigger","DrawerContent","DrawerHeader","DrawerTitle","DrawerDescription","renderRangeInput","type","inputValue","setInputValue","additionalProps","isFrom","Input","e","activeElement","currentActiveElement","validateInput","val","parsed","fromValid","toValid","FloatingLabel"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"RangePicker.cjs","sources":["../../../../src/components/DatePicker/RangePicker.tsx"],"sourcesContent":["import * as React from \"react\";\nimport {\n CalendarDayButton as SCalendarDayButton,\n type CalendarDayButtonProps as SCalendarDayButtonProps,\n Calendar,\n type CalendarColor,\n} from \"@dsui/ui/components/calendar\";\nimport {\n Popover,\n PopoverContent,\n PopoverTrigger,\n} from \"@dsui/ui/components/popover\";\nimport {\n Drawer,\n DrawerContent,\n DrawerDescription,\n DrawerHeader,\n DrawerTitle,\n DrawerTrigger,\n} from \"@dsui/ui/components/drawer\";\nimport { cn } from \"@dsui/ui/index\";\nimport { Input, type InputProps } from \"../Input\";\nimport { Button } from \"../Button\";\nimport { TimePicker } from \"./TimePicker\";\nimport { type DatePickerProps } from \"./DatePicker\";\nimport { CalendarIcon, MoveRight } from \"lucide-react\";\nimport { isMobile } from \"react-device-detect\";\nimport { format as dfFormat, parse, isValid, type Locale } from \"date-fns\";\nimport { vi, enUS } from \"date-fns/locale\";\nimport { DATE_FORMAT } from \"@/constants/common\";\nimport { FloatingLabel } from \"@/components/FloatLabel\";\n\nexport type DateRange = {\n from?: Date | undefined;\n to?: Date | undefined;\n};\n\nexport type DateRangeText = { from?: string; to?: string } | null;\n\nfunction formatDate(\n date: Date | undefined,\n outputFormat: string = DATE_FORMAT,\n locale?: Locale\n) {\n if (!date) return \"\";\n\n return dfFormat(date, outputFormat, locale ? { locale } : undefined);\n}\n\nconst parseDate = (\n str: string,\n inputFormat: string = DATE_FORMAT\n): Date | undefined => {\n const date = parse(str, inputFormat, new Date());\n return isValid(date) ? date : undefined;\n};\n\nfunction generateMaskFromFormat(format: string): string {\n return format\n .replace(/dd|MM|yyyy/g, (match) => {\n switch (match) {\n case \"dd\":\n case \"MM\":\n return \"99\";\n case \"yyyy\":\n return \"9999\";\n default:\n return match;\n }\n })\n .replace(/d|M|y/g, (match) => {\n switch (match) {\n case \"d\":\n case \"M\":\n return \"9\";\n case \"y\":\n return \"9\";\n default:\n return match;\n }\n });\n}\n\nexport type FormatType = string | { input: string; output: string };\n\nexport type RangePickerRenderProps = {\n fromValue: string;\n toValue: string;\n range?: DateRange;\n onSelect: (range?: DateRange) => void;\n onFromChange: (text: string) => void;\n onToChange: (text: string) => void;\n};\n\nexport type TimeConfig = Omit<\n React.ComponentProps<typeof TimePicker>,\n \"value\" | \"onSelect\" | \"format\"\n>;\n\nexport type RangePickerProps = Omit<\n DatePickerProps,\n \"value\" | \"onChange\" | \"onSelect\" | \"children\" | \"label\" | \"placeholder\"\n> & {\n label?: string | DateRangeText;\n placeholder?: string | DateRangeText;\n value?: DateRangeText;\n onChange?: (value?: DateRange, text?: DateRangeText) => void;\n onSelect?: (value?: DateRange, text?: DateRangeText) => void;\n children?: (props: RangePickerRenderProps) => React.ReactNode;\n separator?: React.ReactNode;\n timeConfig?: [TimeConfig, TimeConfig];\n numberOfMonths?: number;\n variant?: \"default\" | \"rounded\";\n color?: CalendarColor;\n};\n\nexport function RangePicker({\n label,\n value,\n placeholder,\n onChange,\n onSelect,\n calendarClassName,\n side = \"bottom\",\n align = \"end\",\n format = \"dd/MM/yyyy\",\n language = \"vi\",\n mask,\n closeOnSelect = false,\n showOutsideDays = true,\n calendarConfig,\n timeConfig,\n desktopMode = \"popover\",\n mobileMode = \"drawer\",\n children,\n separator = <MoveRight className=\"ds:size-5\" />,\n showTime = false,\n timeFormat = \"HH:mm\",\n hideDate = false,\n numberOfMonths = 1,\n variant = \"default\",\n color = \"primary\",\n ...props\n}: RangePickerProps) {\n const inputId = React.useId();\n\n let inputFormat: string;\n let outputFormat: string;\n if (typeof format === \"string\") {\n inputFormat = format;\n outputFormat = format;\n } else {\n inputFormat = format.input;\n outputFormat = format.output;\n }\n\n // Determine the mask to use\n let maskToUse: string | undefined;\n if (mask === true) {\n maskToUse = generateMaskFromFormat(inputFormat);\n } else if (typeof mask === \"string\") {\n maskToUse = mask;\n }\n\n const initialFromDate = value?.from\n ? parseDate(value.from, inputFormat)\n : undefined;\n const initialToDate = value?.to\n ? parseDate(value.to, inputFormat)\n : undefined;\n const initialRange: DateRange = {\n from: initialFromDate,\n to: initialToDate,\n };\n\n const [open, setOpen] = React.useState(false);\n const [range, setRange] = React.useState<DateRange | undefined>(initialRange);\n const [month, setMonth] = React.useState<Date | undefined>(\n initialFromDate || new Date()\n );\n const [fromInputValue, setFromInputValue] = React.useState(value?.from || \"\");\n const [toInputValue, setToInputValue] = React.useState(value?.to || \"\");\n const [fromTime, setFromTime] = React.useState<Date | undefined>(undefined);\n const [toTime, setToTime] = React.useState<Date | undefined>(undefined);\n const fromInputRef = React.useRef<HTMLInputElement>(null);\n const toInputRef = React.useRef<HTMLInputElement>(null);\n\n const shouldFloat = !!(fromInputValue.trim() || toInputValue.trim());\n\n const _locale: Locale = calendarConfig?.locale\n ? (calendarConfig?.locale as Locale)\n : language === \"en\"\n ? enUS\n : vi;\n\n // Helper to format date-time based on showTime and timeFormat\n const formatDateTimeValue = (d: Date | undefined): string => {\n if (!d) return \"\";\n let result = formatDate(d, outputFormat, _locale);\n if (showTime) {\n result += ` ${dfFormat(d, timeFormat)}`;\n }\n return result;\n };\n\n // Helper functions for render props\n const handleSelectForRenderProp = (range?: DateRange) => {\n setRange(range);\n const fromFormatted = formatDateTimeValue(range?.from);\n const toFormatted = formatDateTimeValue(range?.to);\n setFromInputValue(fromFormatted);\n setToInputValue(toFormatted);\n onSelect?.(range, { from: fromFormatted, to: toFormatted });\n };\n\n const handleFromChangeForRenderProp = (text: string) => {\n setFromInputValue(text);\n\n // If the input is cleared (empty), clear both fields\n if (text.trim() === \"\") {\n setFromInputValue(\"\");\n setToInputValue(\"\");\n const newRange: DateRange = { from: undefined, to: undefined };\n setRange(newRange);\n onSelect?.(newRange, newRange as DateRangeText);\n return;\n }\n\n // Try to parse based on showTime\n let parsedDate: Date | undefined;\n if (showTime) {\n parsedDate = parseDate(text, `${inputFormat} ${timeFormat}`);\n } else {\n parsedDate = parseDate(text, inputFormat);\n }\n const newRange: DateRange = { from: parsedDate, to: range?.to };\n if (parsedDate) {\n setRange(newRange);\n setMonth(parsedDate);\n setFromTime(parsedDate);\n onSelect?.(newRange, {\n from: formatDateTimeValue(parsedDate),\n to: formatDateTimeValue(range?.to),\n });\n } else {\n setRange(newRange);\n onSelect?.(newRange, {\n from: formatDateTimeValue(range?.from),\n to: formatDateTimeValue(range?.to),\n });\n }\n };\n\n const handleToChangeForRenderProp = (text: string) => {\n setToInputValue(text);\n\n // If the input is cleared (empty), clear both fields\n if (text.trim() === \"\") {\n setFromInputValue(\"\");\n setToInputValue(\"\");\n const newRange: DateRange = { from: undefined, to: undefined };\n setRange(newRange);\n onSelect?.(newRange, newRange as DateRangeText);\n return;\n }\n\n // Try to parse based on showTime\n let parsedDate: Date | undefined;\n if (showTime) {\n parsedDate = parseDate(text, `${inputFormat} ${timeFormat}`);\n } else {\n parsedDate = parseDate(text, inputFormat);\n }\n const newRange: DateRange = {\n from: range?.from,\n to: parsedDate,\n };\n if (parsedDate) {\n setRange(newRange);\n setToTime(parsedDate);\n onSelect?.(newRange, {\n from: formatDateTimeValue(range?.from),\n to: formatDateTimeValue(parsedDate),\n });\n } else {\n setRange(newRange);\n onSelect?.(newRange, {\n from: formatDateTimeValue(range?.from),\n to: undefined,\n });\n }\n };\n\n const handleTimeChangeFrom = (date?: Date) => {\n if (date) {\n setFromTime(date);\n // Merge: keep date (year, month, day) from existing range.from, take time (hours, minutes, seconds) from TimePicker\n const mergedDate = new Date(range?.from || new Date());\n mergedDate.setHours(\n date.getHours(),\n date.getMinutes(),\n date.getSeconds(),\n 0\n );\n\n const newRange: DateRange = {\n from: mergedDate,\n to: range?.to,\n };\n setRange(newRange);\n setFromInputValue(formatDateTimeValue(mergedDate));\n onSelect?.(newRange, {\n from: formatDateTimeValue(mergedDate),\n to: formatDateTimeValue(range?.to),\n });\n onChange?.(newRange, {\n from: formatDateTimeValue(mergedDate),\n to: formatDateTimeValue(range?.to),\n });\n }\n };\n\n const handleTimeChangeTo = (date?: Date) => {\n if (date) {\n setToTime(date);\n // Merge: keep date (year, month, day) from existing range.to, take time (hours, minutes, seconds) from TimePicker\n const mergedDate = new Date(range?.to || new Date());\n mergedDate.setHours(\n date.getHours(),\n date.getMinutes(),\n date.getSeconds(),\n 0\n );\n\n const newRange: DateRange = {\n from: range?.from,\n to: mergedDate,\n };\n setRange(newRange);\n setToInputValue(formatDateTimeValue(mergedDate));\n onSelect?.(newRange, {\n from: formatDateTimeValue(range?.from),\n to: formatDateTimeValue(mergedDate),\n });\n onChange?.(newRange, {\n from: formatDateTimeValue(range?.from),\n to: formatDateTimeValue(mergedDate),\n });\n }\n };\n\n // Determine trigger component\n const triggerComponent = children ? (\n children({\n fromValue: fromInputValue,\n toValue: toInputValue,\n range,\n onSelect: handleSelectForRenderProp,\n onFromChange: handleFromChangeForRenderProp,\n onToChange: handleToChangeForRenderProp,\n })\n ) : (\n <Button\n variant=\"ghost\"\n className=\"ds:!p-1 ds:!leading-0 ds:h-auto ds:rounded ds:hover:bg-accent ds:transition-colors\"\n size={props?.size}\n >\n <CalendarIcon\n className={cn({\n \"ds:size-3\": props.size === \"xs\" || props.size === \"sm\",\n \"ds:size-3.5\": !props.size || props.size === \"normal\",\n \"ds:size-4\": props.size === \"lg\" || props.size === \"xl\",\n })}\n />\n <span className=\"ds:sr-only\">Select date range</span>\n </Button>\n );\n\n const calendarSelection = (\n <div\n className={cn(\"ds:flex ds:items-stretch\", showTime && !hideDate ? \"ds:gap-0\" : \"\")}\n >\n {!hideDate && (\n <Calendar\n {...calendarConfig}\n mode=\"range\"\n selected={range as any}\n captionLayout=\"dropdown\"\n month={month}\n onMonthChange={setMonth}\n numberOfMonths={isMobile ? 1 : numberOfMonths || 1}\n variant={variant}\n color={color}\n onSelect={(selectedRange) => {\n // Preserve time from TimePicker values if showTime is enabled\n let preservedRange = selectedRange;\n if (showTime) {\n // Get current time from TimePicker state\n const fromTimeObj = fromTime;\n const toTimeObj = toTime;\n\n preservedRange = {\n from: selectedRange?.from\n ? new Date(\n selectedRange.from.getFullYear(),\n selectedRange.from.getMonth(),\n selectedRange.from.getDate(),\n fromTimeObj?.getHours() || 0,\n fromTimeObj?.getMinutes() || 0,\n fromTimeObj?.getSeconds() || 0\n )\n : undefined,\n to: selectedRange?.to\n ? new Date(\n selectedRange.to.getFullYear(),\n selectedRange.to.getMonth(),\n selectedRange.to.getDate(),\n toTimeObj?.getHours() || 0,\n toTimeObj?.getMinutes() || 0,\n toTimeObj?.getSeconds() || 0\n )\n : undefined,\n };\n }\n setRange(preservedRange);\n const fromFormatted = formatDateTimeValue(preservedRange?.from);\n const toFormatted = formatDateTimeValue(preservedRange?.to);\n setFromInputValue(fromFormatted);\n setToInputValue(toFormatted);\n onSelect?.(preservedRange, {\n from: fromFormatted,\n to: toFormatted,\n });\n onChange?.(preservedRange, {\n from: fromFormatted,\n to: toFormatted,\n });\n if (\n closeOnSelect &&\n preservedRange?.from &&\n preservedRange?.to &&\n !showTime\n ) {\n setOpen(false);\n }\n }}\n locale={_locale}\n formatters={{\n formatMonthDropdown: (date) =>\n date.toLocaleString(_locale.code, { month: \"short\" }),\n }}\n showOutsideDays={showOutsideDays}\n className={cn(\n \"ds:mx-auto\",\n {\n \"ds:[--cell-size:clamp(0px,calc(100vw/7.5),52px)] ds:mb-8 ds:bg-transparent\":\n isMobile || desktopMode === \"drawer\",\n \"ds:[--cell-size:clamp(0px,calc(100vw/7.5),34px)]\":\n !isMobile && desktopMode !== \"drawer\",\n },\n calendarClassName\n )}\n />\n )}\n {showTime && (\n <div className=\"ds:flex ds:gap-0 ds:border-l ds:border-border\">\n <TimePicker\n {...timeConfig?.[0]}\n value={fromTime ? dfFormat(fromTime, timeFormat) : undefined}\n onSelect={handleTimeChangeFrom}\n format={timeFormat}\n showHours\n showMinutes\n showSeconds={timeFormat === \"HH:mm:ss\"}\n standalone={false}\n />\n <div className=\"ds:border-l ds:border-border\" />\n <TimePicker\n {...timeConfig?.[1]}\n value={toTime ? dfFormat(toTime, timeFormat) : undefined}\n onSelect={handleTimeChangeTo}\n format={timeFormat}\n showHours\n showMinutes\n showSeconds={timeFormat === \"HH:mm:ss\"}\n standalone={false}\n />\n </div>\n )}\n </div>\n );\n\n const popPicker = (\n <Popover open={open} onOpenChange={setOpen}>\n <PopoverTrigger asChild disabled={props.disabled}>\n {triggerComponent}\n </PopoverTrigger>\n <PopoverContent\n className={cn(\n \"ds:w-auto ds:overflow-hidden ds:p-0\",\n \"ds:backdrop-blur ds:bg-background/50\"\n )}\n side={side}\n align={align}\n >\n {calendarSelection}\n </PopoverContent>\n </Popover>\n );\n\n const drawPicker = (\n <Drawer open={open} onOpenChange={setOpen}>\n <DrawerTrigger asChild>{triggerComponent}</DrawerTrigger>\n <DrawerContent\n className={cn(\n \"ds:w-auto ds:overflow-hidden ds:p-0\",\n \"ds:backdrop-blur ds:bg-background\"\n )}\n >\n <DrawerHeader className=\"ds:sr-only\">\n <DrawerTitle>Select date range</DrawerTitle>\n <DrawerDescription>Set your date range</DrawerDescription>\n </DrawerHeader>\n {calendarSelection}\n </DrawerContent>\n </Drawer>\n );\n\n // If children is provided, use render prop pattern with picker\n if (children) {\n const mode = isMobile ? mobileMode : desktopMode;\n return mode === \"drawer\" ? drawPicker : popPicker;\n }\n\n // Helper function to render range input\n const renderRangeInput = (\n type: \"from\" | \"to\",\n inputValue: string,\n setInputValue: (value: string) => void,\n additionalProps?: Partial<InputProps>\n ) => {\n const isFrom = type === \"from\";\n\n return (\n <Input\n {...props}\n {...additionalProps}\n ref={isFrom ? fromInputRef : toInputRef}\n id={inputId}\n size={\n props.isFloatLabel ? (props.size ? props.size : \"xl\") : props.size\n }\n className={props.className}\n inputClassName={cn(\n \"ds:border-0 ds:focus:ring-0 ds:rounded-none ds:hover:bg-transparent ds:active:bg-transparent ds:focus-visible:ring-0 ds:focus-visible:border-0 ds:shadow-none\",\n isFrom ? \"ds:pr-0\" : \"\"\n )}\n label={\n props.isFloatLabel && typeof label === \"object\"\n ? isFrom\n ? label?.from || \"\"\n : label?.to || \"\"\n : \"\"\n }\n placeholder={\n typeof placeholder === \"object\"\n ? isFrom\n ? placeholder?.from || \"\"\n : placeholder?.to || \"\"\n : placeholder\n }\n clearable={!isFrom}\n value={inputValue}\n mask={maskToUse}\n onChange={(e) => {\n const inputValue = e.target.value;\n setInputValue(inputValue);\n\n // If the input is cleared (empty), clear both fields\n if (inputValue.trim() === \"\") {\n setFromInputValue(\"\");\n setToInputValue(\"\");\n const newRange: DateRange = { from: undefined, to: undefined };\n setRange(newRange);\n onSelect?.(newRange, newRange as DateRangeText);\n onChange?.(newRange, newRange as DateRangeText);\n return;\n }\n\n // Try to parse based on showTime\n let date: Date | undefined;\n if (showTime) {\n date = parseDate(inputValue, `${inputFormat} ${timeFormat}`);\n } else {\n date = parseDate(inputValue, inputFormat);\n }\n const newRange: DateRange = isFrom\n ? { from: date, to: range?.to }\n : { from: range?.from, to: date };\n\n if (date) {\n setRange(newRange);\n if (isFrom) setMonth(date);\n // Update time state if time was parsed\n if (isFrom) {\n setFromTime(date);\n // setFromInputValue(formatDateTimeValue(date)); // Sync input value\n } else {\n setToTime(date);\n // setToInputValue(formatDateTimeValue(date)); // Sync input value\n }\n const fromFormatted = formatDateTimeValue(\n isFrom ? date : range?.from\n );\n const toFormatted = formatDateTimeValue(isFrom ? range?.to : date);\n onSelect?.(newRange, { from: fromFormatted, to: toFormatted });\n onChange?.(newRange, {\n from: isFrom ? inputValue : fromInputValue,\n to: isFrom ? toInputValue : inputValue,\n });\n\n // If from input and date is valid, auto-focus to to input if to is empty\n // if (isFrom && toInputRef.current && !toInputValue.trim()) {\n // requestAnimationFrame(() => toInputRef.current?.focus());\n // }\n } else {\n onSelect?.(newRange, {\n from: formatDateTimeValue(range?.from),\n to: isFrom ? formatDateTimeValue(range?.to) : undefined,\n });\n onChange?.(newRange, {\n from: formatDateTimeValue(range?.from),\n to: isFrom ? formatDateTimeValue(range?.to) : undefined,\n });\n }\n }}\n onClear={\n !isFrom\n ? () => {\n setFromInputValue(\"\");\n setToInputValue(\"\");\n const newRange: DateRange = { from: undefined, to: undefined };\n setRange(newRange);\n onSelect?.(newRange, newRange as DateRangeText);\n onChange?.(newRange, newRange as DateRangeText);\n }\n : undefined\n }\n onBlur={() => {\n // Check if blurring out of the entire range picker group\n const activeElement = document.activeElement;\n if (\n activeElement !== fromInputRef.current &&\n activeElement !== toInputRef.current\n ) {\n // Delay validation by 100ms\n setTimeout(() => {\n // Check again if still blurred out of the group\n const currentActiveElement = document.activeElement;\n if (\n currentActiveElement !== fromInputRef.current &&\n currentActiveElement !== toInputRef.current\n ) {\n // Blurred out of the group, validate both inputs\n const validateInput = (val: string) => {\n if (val.trim() === \"\") return true; // empty is valid (will clear)\n let parsed: Date | undefined;\n if (showTime) {\n parsed = parseDate(val, `${inputFormat} ${timeFormat}`);\n } else {\n parsed = parseDate(val, inputFormat);\n }\n return !!parsed;\n };\n\n const fromValid = validateInput(fromInputValue);\n const toValid = validateInput(toInputValue);\n\n // Clear if either is invalid, or if only one has value\n const shouldClear =\n !fromValid ||\n !toValid ||\n (fromInputValue.trim() && !toInputValue.trim()) ||\n (!fromInputValue.trim() && toInputValue.trim());\n\n if (shouldClear) {\n // If either is invalid, clear both\n setFromInputValue(\"\");\n setToInputValue(\"\");\n const newRange: DateRange = {\n from: undefined,\n to: undefined,\n };\n setRange(newRange);\n onSelect?.(newRange, newRange as DateRangeText);\n onChange?.(newRange, newRange as DateRangeText);\n }\n }\n }, 100);\n }\n }}\n onKeyDown={(e) => {\n if (e.key === \"ArrowDown\") {\n e.preventDefault();\n setOpen(true);\n }\n }}\n />\n );\n };\n\n // Default input rendering with two inputs\n return (\n <div\n className={cn(\n \"ds:group ds:relative ds:flex ds:items-center ds:border ds:rounded-md ds:focus-within:ring-2 ds:focus-within:ring-offset-2 ds:bg-background ds:transition-[color,box-shadow]\",\n {\n \"ds:border-input ds:focus-within:ring-ring\": !props.state,\n \"ds:border-success ds:focus-within:ring-success\": props.state === \"success\",\n \"ds:border-warning ds:focus-within:ring-warning\": props.state === \"warning\",\n \"ds:border-error ds:focus-within:ring-error\": props.state === \"error\",\n }\n )}\n >\n {renderRangeInput(\"from\", fromInputValue, setFromInputValue)}\n <span\n className={cn(\"ds:text-muted-foreground ds:select-none ds:pl-2\", {\n \"ds:opacity-30\": props.disabled,\n })}\n >\n {separator}\n </span>\n {renderRangeInput(\"to\", toInputValue, setToInputValue, {\n suffixIcon: isMobile\n ? mobileMode === \"drawer\"\n ? drawPicker\n : popPicker\n : desktopMode === \"drawer\"\n ? drawPicker\n : popPicker,\n })}\n {props.isFloatLabel && typeof label === \"string\" && (\n <FloatingLabel\n htmlFor={inputId}\n size={props.size}\n infoTooltip={props.infoTooltip}\n className=\"ds:z-10\"\n shouldFloat={shouldFloat}\n >\n {label}\n </FloatingLabel>\n )}\n </div>\n );\n}\n"],"names":["formatDate","date","outputFormat","DATE_FORMAT","locale","dfFormat","parseDate","str","inputFormat","parse","isValid","generateMaskFromFormat","format","match","RangePicker","label","value","placeholder","onChange","onSelect","calendarClassName","side","align","language","mask","closeOnSelect","showOutsideDays","calendarConfig","timeConfig","desktopMode","mobileMode","children","separator","jsx","MoveRight","showTime","timeFormat","hideDate","numberOfMonths","variant","color","props","inputId","React","maskToUse","initialFromDate","initialToDate","initialRange","open","setOpen","range","setRange","month","setMonth","fromInputValue","setFromInputValue","toInputValue","setToInputValue","fromTime","setFromTime","toTime","setToTime","fromInputRef","toInputRef","shouldFloat","_locale","enUS","vi","formatDateTimeValue","d","result","handleSelectForRenderProp","fromFormatted","toFormatted","handleFromChangeForRenderProp","text","newRange","parsedDate","handleToChangeForRenderProp","handleTimeChangeFrom","mergedDate","handleTimeChangeTo","triggerComponent","jsxs","Button","CalendarIcon","cn","calendarSelection","Calendar","isMobile","selectedRange","preservedRange","fromTimeObj","toTimeObj","TimePicker","popPicker","Popover","PopoverTrigger","PopoverContent","drawPicker","Drawer","DrawerTrigger","DrawerContent","DrawerHeader","DrawerTitle","DrawerDescription","renderRangeInput","type","inputValue","setInputValue","additionalProps","isFrom","Input","e","activeElement","currentActiveElement","validateInput","val","parsed","fromValid","toValid","FloatingLabel"],"mappings":"+pEAuCA,SAASA,GACPC,EACAC,EAAuBC,GAAAA,YACvBC,EACA,CACA,OAAKH,EAEEI,EAAAA,OAASJ,EAAMC,EAAcE,EAAS,CAAE,OAAAA,CAAA,EAAW,MAAS,EAFjD,EAGpB,CAEA,MAAME,EAAY,CAChBC,EACAC,EAAsBL,iBACD,CACrB,MAAMF,EAAOQ,EAAAA,MAAMF,EAAKC,EAAa,IAAI,IAAM,EAC/C,OAAOE,UAAQT,CAAI,EAAIA,EAAO,MAChC,EAEA,SAASU,GAAuBC,EAAwB,CACtD,OAAOA,EACJ,QAAQ,cAAgBC,GAAU,CACjC,OAAQA,EAAA,CACN,IAAK,KACL,IAAK,KACH,MAAO,KACT,IAAK,OACH,MAAO,OACT,QACE,OAAOA,CAAA,CAEb,CAAC,EACA,QAAQ,SAAWA,GAAU,CAC5B,OAAQA,EAAA,CACN,IAAK,IACL,IAAK,IACH,MAAO,IACT,IAAK,IACH,MAAO,IACT,QACE,OAAOA,CAAA,CAEb,CAAC,CACL,CAmCO,SAASC,GAAY,CAC1B,MAAAC,EACA,MAAAC,EACA,YAAAC,EACA,SAAAC,EACA,SAAAC,EACA,kBAAAC,GACA,KAAAC,GAAO,SACP,MAAAC,GAAQ,MACR,OAAAV,EAAS,aACT,SAAAW,GAAW,KACX,KAAAC,EACA,cAAAC,GAAgB,GAChB,gBAAAC,GAAkB,GAClB,eAAAC,EACA,WAAAC,GACA,YAAAC,EAAc,UACd,WAAAC,GAAa,SACb,SAAAC,EACA,UAAAC,GAAYC,EAAAA,IAACC,GAAAA,UAAA,CAAU,UAAU,WAAA,CAAY,EAC7C,SAAAC,EAAW,GACX,WAAAC,EAAa,QACb,SAAAC,GAAW,GACX,eAAAC,GAAiB,EACjB,QAAAC,GAAU,UACV,MAAAC,GAAQ,UACR,GAAGC,CACL,EAAqB,CACnB,MAAMC,GAAUC,EAAM,MAAA,EAEtB,IAAInC,EACAN,EACA,OAAOU,GAAW,UACpBJ,EAAcI,EACdV,EAAeU,IAEfJ,EAAcI,EAAO,MACrBV,EAAeU,EAAO,QAIxB,IAAIgC,EACApB,IAAS,GACXoB,EAAYjC,GAAuBH,CAAW,EACrC,OAAOgB,GAAS,WACzBoB,EAAYpB,GAGd,MAAMqB,GAAkB7B,GAAO,KAC3BV,EAAUU,EAAM,KAAMR,CAAW,EACjC,OACEsC,GAAgB9B,GAAO,GACzBV,EAAUU,EAAM,GAAIR,CAAW,EAC/B,OACEuC,GAA0B,CAC9B,KAAMF,GACN,GAAIC,EAAA,EAGA,CAACE,GAAMC,CAAO,EAAIN,EAAM,SAAS,EAAK,EACtC,CAACO,EAAOC,CAAQ,EAAIR,EAAM,SAAgCI,EAAY,EACtE,CAACK,GAAOC,CAAQ,EAAIV,EAAM,SAC9BE,QAAuB,IAAK,EAExB,CAACS,EAAgBC,CAAiB,EAAIZ,EAAM,SAAS3B,GAAO,MAAQ,EAAE,EACtE,CAACwC,EAAcC,CAAe,EAAId,EAAM,SAAS3B,GAAO,IAAM,EAAE,EAChE,CAAC0C,EAAUC,CAAW,EAAIhB,EAAM,SAA2B,MAAS,EACpE,CAACiB,EAAQC,CAAS,EAAIlB,EAAM,SAA2B,MAAS,EAChEmB,EAAenB,EAAM,OAAyB,IAAI,EAClDoB,EAAapB,EAAM,OAAyB,IAAI,EAEhDqB,GAAc,CAAC,EAAEV,EAAe,KAAA,GAAUE,EAAa,QAEvDS,EAAkBtC,GAAgB,OACnCA,GAAgB,OACjBJ,KAAa,KACX2C,GAAAA,KACAC,GAAAA,GAGAC,EAAuBC,GAAgC,CAC3D,GAAI,CAACA,EAAG,MAAO,GACf,IAAIC,EAAStE,GAAWqE,EAAGnE,EAAc+D,CAAO,EAChD,OAAI9B,IACFmC,GAAU,IAAIjE,EAAAA,OAASgE,EAAGjC,CAAU,CAAC,IAEhCkC,CACT,EAGMC,GAA6BrB,GAAsB,CACvDC,EAASD,CAAK,EACd,MAAMsB,EAAgBJ,EAAoBlB,GAAO,IAAI,EAC/CuB,EAAcL,EAAoBlB,GAAO,EAAE,EACjDK,EAAkBiB,CAAa,EAC/Bf,EAAgBgB,CAAW,EAC3BtD,IAAW+B,EAAO,CAAE,KAAMsB,EAAe,GAAIC,EAAa,CAC5D,EAEMC,GAAiCC,GAAiB,CAItD,GAHApB,EAAkBoB,CAAI,EAGlBA,EAAK,KAAA,IAAW,GAAI,CACtBpB,EAAkB,EAAE,EACpBE,EAAgB,EAAE,EAClB,MAAMmB,EAAsB,CAAE,KAAM,OAAW,GAAI,MAAA,EACnDzB,EAASyB,CAAQ,EACjBzD,IAAWyD,EAAUA,CAAyB,EAC9C,MACF,CAGA,IAAIC,EACA1C,EACF0C,EAAavE,EAAUqE,EAAM,GAAGnE,CAAW,IAAI4B,CAAU,EAAE,EAE3DyC,EAAavE,EAAUqE,EAAMnE,CAAW,EAE1C,MAAMoE,EAAsB,CAAE,KAAMC,EAAY,GAAI3B,GAAO,EAAA,EACvD2B,GACF1B,EAASyB,CAAQ,EACjBvB,EAASwB,CAAU,EACnBlB,EAAYkB,CAAU,EACtB1D,IAAWyD,EAAU,CACnB,KAAMR,EAAoBS,CAAU,EACpC,GAAIT,EAAoBlB,GAAO,EAAE,CAAA,CAClC,IAEDC,EAASyB,CAAQ,EACjBzD,IAAWyD,EAAU,CACnB,KAAMR,EAAoBlB,GAAO,IAAI,EACrC,GAAIkB,EAAoBlB,GAAO,EAAE,CAAA,CAClC,EAEL,EAEM4B,GAA+BH,GAAiB,CAIpD,GAHAlB,EAAgBkB,CAAI,EAGhBA,EAAK,KAAA,IAAW,GAAI,CACtBpB,EAAkB,EAAE,EACpBE,EAAgB,EAAE,EAClB,MAAMmB,EAAsB,CAAE,KAAM,OAAW,GAAI,MAAA,EACnDzB,EAASyB,CAAQ,EACjBzD,IAAWyD,EAAUA,CAAyB,EAC9C,MACF,CAGA,IAAIC,EACA1C,EACF0C,EAAavE,EAAUqE,EAAM,GAAGnE,CAAW,IAAI4B,CAAU,EAAE,EAE3DyC,EAAavE,EAAUqE,EAAMnE,CAAW,EAE1C,MAAMoE,EAAsB,CAC1B,KAAM1B,GAAO,KACb,GAAI2B,CAAA,EAEFA,GACF1B,EAASyB,CAAQ,EACjBf,EAAUgB,CAAU,EACpB1D,IAAWyD,EAAU,CACnB,KAAMR,EAAoBlB,GAAO,IAAI,EACrC,GAAIkB,EAAoBS,CAAU,CAAA,CACnC,IAED1B,EAASyB,CAAQ,EACjBzD,IAAWyD,EAAU,CACnB,KAAMR,EAAoBlB,GAAO,IAAI,EACrC,GAAI,MAAA,CACL,EAEL,EAEM6B,GAAwB9E,GAAgB,CAC5C,GAAIA,EAAM,CACR0D,EAAY1D,CAAI,EAEhB,MAAM+E,EAAa,IAAI,KAAK9B,GAAO,MAAQ,IAAI,IAAM,EACrD8B,EAAW,SACT/E,EAAK,SAAA,EACLA,EAAK,WAAA,EACLA,EAAK,WAAA,EACL,CAAA,EAGF,MAAM2E,EAAsB,CAC1B,KAAMI,EACN,GAAI9B,GAAO,EAAA,EAEbC,EAASyB,CAAQ,EACjBrB,EAAkBa,EAAoBY,CAAU,CAAC,EACjD7D,IAAWyD,EAAU,CACnB,KAAMR,EAAoBY,CAAU,EACpC,GAAIZ,EAAoBlB,GAAO,EAAE,CAAA,CAClC,EACDhC,IAAW0D,EAAU,CACnB,KAAMR,EAAoBY,CAAU,EACpC,GAAIZ,EAAoBlB,GAAO,EAAE,CAAA,CAClC,CACH,CACF,EAEM+B,GAAsBhF,GAAgB,CAC1C,GAAIA,EAAM,CACR4D,EAAU5D,CAAI,EAEd,MAAM+E,EAAa,IAAI,KAAK9B,GAAO,IAAM,IAAI,IAAM,EACnD8B,EAAW,SACT/E,EAAK,SAAA,EACLA,EAAK,WAAA,EACLA,EAAK,WAAA,EACL,CAAA,EAGF,MAAM2E,EAAsB,CAC1B,KAAM1B,GAAO,KACb,GAAI8B,CAAA,EAEN7B,EAASyB,CAAQ,EACjBnB,EAAgBW,EAAoBY,CAAU,CAAC,EAC/C7D,IAAWyD,EAAU,CACnB,KAAMR,EAAoBlB,GAAO,IAAI,EACrC,GAAIkB,EAAoBY,CAAU,CAAA,CACnC,EACD9D,IAAW0D,EAAU,CACnB,KAAMR,EAAoBlB,GAAO,IAAI,EACrC,GAAIkB,EAAoBY,CAAU,CAAA,CACnC,CACH,CACF,EAGME,GAAmBnD,EACvBA,EAAS,CACP,UAAWuB,EACX,QAASE,EACT,MAAAN,EACA,SAAUqB,GACV,aAAcG,GACd,WAAYI,EAAA,CACb,EAEDK,EAAAA,KAACC,GAAAA,QAAA,CACC,QAAQ,QACR,UAAU,qFACV,KAAM3C,GAAO,KAEb,SAAA,CAAAR,EAAAA,IAACoD,GAAAA,aAAA,CACC,UAAWC,EAAAA,GAAG,CACZ,YAAa7C,EAAM,OAAS,MAAQA,EAAM,OAAS,KACnD,cAAe,CAACA,EAAM,MAAQA,EAAM,OAAS,SAC7C,YAAaA,EAAM,OAAS,MAAQA,EAAM,OAAS,IAAA,CACpD,CAAA,CAAA,EAEHR,EAAAA,IAAC,OAAA,CAAK,UAAU,aAAa,SAAA,mBAAA,CAAiB,CAAA,CAAA,CAAA,EAI5CsD,GACJJ,EAAAA,KAAC,MAAA,CACC,UAAWG,EAAAA,GAAG,2BAA4BnD,GAAY,CAACE,GAAW,WAAa,EAAE,EAEhF,SAAA,CAAA,CAACA,IACAJ,EAAAA,IAACuD,GAAAA,SAAA,CACE,GAAG7D,EACJ,KAAK,QACL,SAAUuB,EACV,cAAc,WACd,MAAAE,GACA,cAAeC,EACf,eAAgBoC,EAAAA,SAAW,EAAInD,IAAkB,EACjD,QAAAC,GACA,MAAAC,GACA,SAAWkD,GAAkB,CAE3B,IAAIC,EAAiBD,EACrB,GAAIvD,EAAU,CAEZ,MAAMyD,EAAclC,EACdmC,EAAYjC,EAElB+B,EAAiB,CACf,KAAMD,GAAe,KACjB,IAAI,KACFA,EAAc,KAAK,YAAA,EACnBA,EAAc,KAAK,SAAA,EACnBA,EAAc,KAAK,QAAA,EACnBE,GAAa,YAAc,EAC3BA,GAAa,cAAgB,EAC7BA,GAAa,cAAgB,CAAA,EAE/B,OACJ,GAAIF,GAAe,GACf,IAAI,KACFA,EAAc,GAAG,YAAA,EACjBA,EAAc,GAAG,SAAA,EACjBA,EAAc,GAAG,QAAA,EACjBG,GAAW,YAAc,EACzBA,GAAW,cAAgB,EAC3BA,GAAW,cAAgB,CAAA,EAE7B,MAAA,CAER,CACA1C,EAASwC,CAAc,EACvB,MAAMnB,EAAgBJ,EAAoBuB,GAAgB,IAAI,EACxDlB,EAAcL,EAAoBuB,GAAgB,EAAE,EAC1DpC,EAAkBiB,CAAa,EAC/Bf,EAAgBgB,CAAW,EAC3BtD,IAAWwE,EAAgB,CACzB,KAAMnB,EACN,GAAIC,CAAA,CACL,EACDvD,IAAWyE,EAAgB,CACzB,KAAMnB,EACN,GAAIC,CAAA,CACL,EAEChD,IACAkE,GAAgB,MAChBA,GAAgB,IAChB,CAACxD,GAEDc,EAAQ,EAAK,CAEjB,EACA,OAAQgB,EACR,WAAY,CACV,oBAAsBhE,GACpBA,EAAK,eAAegE,EAAQ,KAAM,CAAE,MAAO,OAAA,CAAS,CAAA,EAExD,gBAAAvC,GACA,UAAW4D,EAAAA,GACT,aACA,CACE,6EACEG,EAAAA,UAAY5D,IAAgB,SAC9B,mDACE,CAAC4D,EAAAA,UAAY5D,IAAgB,QAAA,EAEjCT,EAAA,CACF,CAAA,EAGHe,GACCgD,EAAAA,KAAC,MAAA,CAAI,UAAU,gDACb,SAAA,CAAAlD,EAAAA,IAAC6D,GAAAA,WAAA,CACE,GAAGlE,KAAa,CAAC,EAClB,MAAO8B,EAAWrD,EAAAA,OAASqD,EAAUtB,CAAU,EAAI,OACnD,SAAU2C,GACV,OAAQ3C,EACR,UAAS,GACT,YAAW,GACX,YAAaA,IAAe,WAC5B,WAAY,EAAA,CAAA,EAEdH,EAAAA,IAAC,MAAA,CAAI,UAAU,8BAAA,CAA+B,EAC9CA,EAAAA,IAAC6D,GAAAA,WAAA,CACE,GAAGlE,KAAa,CAAC,EAClB,MAAOgC,EAASvD,EAAAA,OAASuD,EAAQxB,CAAU,EAAI,OAC/C,SAAU6C,GACV,OAAQ7C,EACR,UAAS,GACT,YAAW,GACX,YAAaA,IAAe,WAC5B,WAAY,EAAA,CAAA,CACd,CAAA,CACF,CAAA,CAAA,CAAA,EAKA2D,EACJZ,EAAAA,KAACa,EAAAA,QAAA,CAAQ,KAAAhD,GAAY,aAAcC,EACjC,SAAA,CAAAhB,MAACgE,EAAAA,gBAAe,QAAO,GAAC,SAAUxD,EAAM,SACrC,SAAAyC,GACH,EACAjD,EAAAA,IAACiE,EAAAA,eAAA,CACC,UAAWZ,EAAAA,GACT,sCACA,sCAAA,EAEF,KAAAjE,GACA,MAAAC,GAEC,SAAAiE,EAAA,CAAA,CACH,EACF,EAGIY,EACJhB,EAAAA,KAACiB,EAAAA,OAAA,CAAO,KAAApD,GAAY,aAAcC,EAChC,SAAA,CAAAhB,EAAAA,IAACoE,EAAAA,cAAA,CAAc,QAAO,GAAE,SAAAnB,GAAiB,EACzCC,EAAAA,KAACmB,EAAAA,cAAA,CACC,UAAWhB,EAAAA,GACT,sCACA,mCAAA,EAGF,SAAA,CAAAH,EAAAA,KAACoB,EAAAA,aAAA,CAAa,UAAU,aACtB,SAAA,CAAAtE,EAAAA,IAACuE,EAAAA,aAAY,SAAA,mBAAA,CAAiB,EAC9BvE,EAAAA,IAACwE,EAAAA,mBAAkB,SAAA,qBAAA,CAAmB,CAAA,EACxC,EACClB,EAAA,CAAA,CAAA,CACH,EACF,EAIF,GAAIxD,EAEF,OADa0D,WAAW3D,GAAaD,KACrB,SAAWsE,EAAaJ,EAI1C,MAAMW,GAAmB,CACvBC,EACAC,EACAC,EACAC,IACG,CACH,MAAMC,EAASJ,IAAS,OAExB,OACE1E,EAAAA,IAAC+E,GAAAA,QAAA,CACE,GAAGvE,EACH,GAAGqE,EACJ,IAAKC,EAASjD,EAAeC,EAC7B,GAAIrB,GACJ,KACED,EAAM,aAAgBA,EAAM,KAAOA,EAAM,KAAO,KAAQA,EAAM,KAEhE,UAAWA,EAAM,UACjB,eAAgB6C,EAAAA,GACd,gKACAyB,EAAS,UAAY,EAAA,EAEvB,MACEtE,EAAM,cAAgB,OAAO1B,GAAU,SACnCgG,EACEhG,GAAO,MAAQ,GACfA,GAAO,IAAM,GACf,GAEN,YACE,OAAOE,GAAgB,SACnB8F,EACE9F,GAAa,MAAQ,GACrBA,GAAa,IAAM,GACrBA,EAEN,UAAW,CAAC8F,EACZ,MAAOH,EACP,KAAMhE,EACN,SAAWqE,GAAM,CACf,MAAML,EAAaK,EAAE,OAAO,MAI5B,GAHAJ,EAAcD,CAAU,EAGpBA,EAAW,KAAA,IAAW,GAAI,CAC5BrD,EAAkB,EAAE,EACpBE,EAAgB,EAAE,EAClB,MAAMmB,EAAsB,CAAE,KAAM,OAAW,GAAI,MAAA,EACnDzB,EAASyB,CAAQ,EACjBzD,IAAWyD,EAAUA,CAAyB,EAC9C1D,IAAW0D,EAAUA,CAAyB,EAC9C,MACF,CAGA,IAAI3E,EACAkC,EACFlC,EAAOK,EAAUsG,EAAY,GAAGpG,CAAW,IAAI4B,CAAU,EAAE,EAE3DnC,EAAOK,EAAUsG,EAAYpG,CAAW,EAE1C,MAAMoE,EAAsBmC,EACxB,CAAE,KAAM9G,EAAM,GAAIiD,GAAO,EAAA,EACzB,CAAE,KAAMA,GAAO,KAAM,GAAIjD,CAAA,EAE7B,GAAIA,EAAM,CACRkD,EAASyB,CAAQ,EACbmC,KAAiB9G,CAAI,EAErB8G,EACFpD,EAAY1D,CAAI,EAGhB4D,EAAU5D,CAAI,EAGhB,MAAMuE,EAAgBJ,EACpB2C,EAAS9G,EAAOiD,GAAO,IAAA,EAEnBuB,GAAcL,EAAoB2C,EAAS7D,GAAO,GAAKjD,CAAI,EACjEkB,IAAWyD,EAAU,CAAE,KAAMJ,EAAe,GAAIC,GAAa,EAC7DvD,IAAW0D,EAAU,CACnB,KAAMmC,EAASH,EAAatD,EAC5B,GAAIyD,EAASvD,EAAeoD,CAAA,CAC7B,CAMH,MACEzF,IAAWyD,EAAU,CACnB,KAAMR,EAAoBlB,GAAO,IAAI,EACrC,GAAI6D,EAAS3C,EAAoBlB,GAAO,EAAE,EAAI,MAAA,CAC/C,EACDhC,IAAW0D,EAAU,CACnB,KAAMR,EAAoBlB,GAAO,IAAI,EACrC,GAAI6D,EAAS3C,EAAoBlB,GAAO,EAAE,EAAI,MAAA,CAC/C,CAEL,EACA,QACG6D,EASG,OARA,IAAM,CACJxD,EAAkB,EAAE,EACpBE,EAAgB,EAAE,EAClB,MAAMmB,EAAsB,CAAE,KAAM,OAAW,GAAI,MAAA,EACnDzB,EAASyB,CAAQ,EACjBzD,IAAWyD,EAAUA,CAAyB,EAC9C1D,IAAW0D,EAAUA,CAAyB,CAChD,EAGN,OAAQ,IAAM,CAEZ,MAAMsC,EAAgB,SAAS,cAE7BA,IAAkBpD,EAAa,SAC/BoD,IAAkBnD,EAAW,SAG7B,WAAW,IAAM,CAEf,MAAMoD,EAAuB,SAAS,cACtC,GACEA,IAAyBrD,EAAa,SACtCqD,IAAyBpD,EAAW,QACpC,CAEA,MAAMqD,EAAiBC,GAAgB,CACrC,GAAIA,EAAI,SAAW,GAAI,MAAO,GAC9B,IAAIC,EACJ,OAAInF,EACFmF,EAAShH,EAAU+G,EAAK,GAAG7G,CAAW,IAAI4B,CAAU,EAAE,EAEtDkF,EAAShH,EAAU+G,EAAK7G,CAAW,EAE9B,CAAC,CAAC8G,CACX,EAEMC,EAAYH,EAAc9D,CAAc,EACxCkE,EAAUJ,EAAc5D,CAAY,EAS1C,GALE,CAAC+D,GACD,CAACC,GACAlE,EAAe,KAAA,GAAU,CAACE,EAAa,QACvC,CAACF,EAAe,KAAA,GAAUE,EAAa,KAAA,EAEzB,CAEfD,EAAkB,EAAE,EACpBE,EAAgB,EAAE,EAClB,MAAMmB,EAAsB,CAC1B,KAAM,OACN,GAAI,MAAA,EAENzB,EAASyB,CAAQ,EACjBzD,IAAWyD,EAAUA,CAAyB,EAC9C1D,IAAW0D,EAAUA,CAAyB,CAChD,CACF,CACF,EAAG,GAAG,CAEV,EACA,UAAYqC,GAAM,CACZA,EAAE,MAAQ,cACZA,EAAE,eAAA,EACFhE,EAAQ,EAAI,EAEhB,CAAA,CAAA,CAGN,EAGA,OACEkC,EAAAA,KAAC,MAAA,CACC,UAAWG,EAAAA,GACT,8KACA,CACE,4CAA6C,CAAC7C,EAAM,MACpD,iDAAkDA,EAAM,QAAU,UAClE,iDAAkDA,EAAM,QAAU,UAClE,6CAA8CA,EAAM,QAAU,OAAA,CAChE,EAGD,SAAA,CAAAiE,GAAiB,OAAQpD,EAAgBC,CAAiB,EAC3DtB,EAAAA,IAAC,OAAA,CACC,UAAWqD,EAAAA,GAAG,kDAAmD,CAC/D,gBAAiB7C,EAAM,QAAA,CACxB,EAEA,SAAAT,EAAA,CAAA,EAEF0E,GAAiB,KAAMlD,EAAcC,EAAiB,CACrD,WAAYgC,EAAAA,SACR3D,KAAe,SACbqE,EACAJ,EACFlE,IAAgB,SACdsE,EACAJ,CAAA,CACP,EACAtD,EAAM,cAAgB,OAAO1B,GAAU,UACtCkB,EAAAA,IAACwF,GAAAA,cAAA,CACC,QAAS/E,GACT,KAAMD,EAAM,KACZ,YAAaA,EAAM,YACnB,UAAU,UACV,YAAAuB,GAEC,SAAAjD,CAAA,CAAA,CACH,CAAA,CAAA,CAIR"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),r=require("react"),
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),r=require("react"),W=require("../../packages/ui/src/components/input.cjs"),a=require("../../packages/ui/src/lib/utils.cjs"),Y=require("../FloatLabel.cjs"),m=require("lucide-react"),Z=require("use-mask-input"),F=require("../Tooltip/Tooltip.cjs"),$=require("../../packages/ui/src/components/label.cjs"),D=r.forwardRef(({className:_,label:v,helperText:p,state:N,size:l,isFloatLabel:c,type:d,mask:f,maskOptions:E,maxLength:x,showCharCount:M,infoTooltip:j,clearable:b,onClear:P,prefixIcon:o,suffixIcon:i,placeholder:B=" ",required:w,inputClassName:H,...e},O)=>{const[g,R]=r.useState(()=>typeof e.value=="string"?e.value.length:typeof e.defaultValue=="string"?e.defaultValue.length:0),T=t=>{R(t.target.value.length),e.onChange&&e.onChange(t)},U=()=>{if(n.current){n.current.value="",R(0);const t={target:n.current,currentTarget:n.current};e.onChange?.(t),P&&P()}},C=r.useId(),n=r.useRef(null),X=r.useCallback(t=>{if(n&&(n.current=t),f&&t){const u=Z.withMask(f,E);typeof u=="function"&&u(t)}},[f,E]);r.useImperativeHandle(O,()=>n.current);const[V,A]=r.useState(!1),G={default:"ds:text-muted-foreground",success:"ds:text-success",warning:"ds:text-warning",error:"ds:text-error"},y=c?l==="xl"||l==="lg"?l:"xl":l||"normal",k=(()=>{const t={xs:{prefix:"ds:pl-8",suffix:"ds:pr-8"},sm:{prefix:"ds:pl-9",suffix:"ds:pr-9"},normal:{prefix:"ds:pl-10",suffix:"ds:pr-10"},lg:{prefix:"ds:pl-11",suffix:"ds:pr-11"},xl:{prefix:"ds:pl-12",suffix:"ds:pr-12"}};return t[y]||t.normal})(),q={xs:"ds:size-3",sm:"ds:size-3.5",normal:"ds:size-4",lg:"ds:size-4",xl:"ds:size-4"}[y]||"ds:size-4",J=()=>{const t=d==="number"||d==="password"||d==="datetime"||b&&(g>0||e?.value);return t&&i?d==="password"&&b&&(g>0||e?.value)?"ds:pr-20":"ds:pr-16":t?d==="password"&&b&&(g>0||e?.value)?"ds:pr-16":"ds:pr-10":i?k.suffix:""},I=(()=>{const t={xs:{left:"ds:left-2.5",right:"ds:right-2.5"},sm:{left:"ds:left-3",right:"ds:right-3"},normal:{left:"ds:left-3",right:"ds:right-3"},lg:{left:"ds:left-3.5",right:"ds:right-3.5"},xl:{left:"ds:left-4",right:"ds:right-4"}};return t[y]||t.normal})(),K=()=>{if(n.current){const t=Number(e.step||1),u=e.max?Number(e.max):1/0,z=Number(n.current.value||0),S=Math.min(z+t,u);n.current.value=String(S);const h=new Event("input",{bubbles:!0});n.current.dispatchEvent(h),e.onChange?.(h)}},Q=()=>{if(n.current){const t=Number(e.step||1),u=e.min?Number(e.min):-1/0,z=Number(n.current.value||0),S=Math.max(z-t,u);n.current.value=String(S);const h=new Event("input",{bubbles:!0});n.current.dispatchEvent(h),e.onChange?.(h)}};return s.jsx("div",{className:_,children:s.jsxs("div",{className:a.cn("ds:flex ds:flex-col ds:gap-1.5 ds:relative ds:flex-auto",{"ds:floating-label ds:relative":c}),children:[!c&&v&&s.jsxs($.Label,{htmlFor:C,className:"ds:flex ds:gap-2 ds:text-sm ds:font-medium ds:leading-none ds:peer-disabled:cursor-not-allowed ds:peer-disabled:opacity-70",children:[s.jsxs("span",{children:[v,w&&s.jsx("span",{className:"ds:text-error ds:ml-0.5",children:"*"})]}),j&&s.jsx(F.Tooltip,{content:j,children:s.jsx(m.Info,{className:"ds:size-3.5 ds:min-w-3.5"})})]}),s.jsxs("div",{className:"ds:relative",children:[o&&s.jsx("div",{className:a.cn("ds:absolute ds:top-1/2 ds:-translate-y-1/2 ds:text-muted-foreground ds:leading-0",I.left),children:r.isValidElement(o)?r.cloneElement(o,{className:a.cn(q,o.props?.className)}):o}),s.jsx(W.Input,{ref:X,id:C,className:a.cn("ds:peer",{"ds:pt-5 ds:pb-1":c&&l!=="lg","ds:[&::-webkit-outer-spin-button]:appearance-none ds:[&::-webkit-inner-spin-button]:appearance-none ds:[-moz-appearance:textfield] ds:pr-8":d==="number"},o&&k.prefix,f&&"ds:placeholder:text-slate-400 ds:placeholder:opacity-100",J(),H),state:N,size:c?l==="xl"||l==="lg"?l:"xl":l,type:d==="password"?V?"text":"password":d,placeholder:B,maxLength:x,onChange:T,required:w,...e}),c&&s.jsx(Y.FloatingLabel,{htmlFor:C,size:l,infoTooltip:j,required:w,children:v}),d==="number"&&s.jsxs("div",{className:"ds:absolute ds:right-1 ds:top-0 ds:h-full ds:flex ds:flex-col ds:gap-0.5",children:[s.jsx("button",{type:"button",onClick:K,disabled:e.disabled,className:a.cn("ds:h-1/2 ds:w-6 ds:flex ds:items-center ds:justify-center ds:rounded ds:cursor-pointer ds:hover:scale-150 ds:transition-transform","ds:disabled:opacity-50 ds:disabled:cursor-not-allowed ds:disabled:hover:bg-transparent"),tabIndex:-1,children:s.jsx(m.ChevronUp,{className:"ds:size-3"})}),s.jsx("button",{type:"button",onClick:Q,disabled:e.disabled,className:a.cn("ds:h-1/2 ds:w-6 ds:flex ds:items-center ds:justify-center ds:rounded ds:cursor-pointer ds:hover:scale-150 ds:transition-transform","ds:disabled:opacity-50 ds:disabled:cursor-not-allowed ds:disabled:hover:bg-transparent"),tabIndex:-1,children:s.jsx(m.ChevronDown,{className:"ds:size-3"})})]}),b&&(g>0||e?.value)&&!e.disabled&&d!=="number"&&s.jsx("button",{type:"button",tabIndex:-1,className:a.cn("ds:absolute ds:top-1/2 ds:-translate-y-1/2 ds:p-1 ds:rounded ds:hover:bg-accent ds:transition-colors ds:cursor-pointer",d==="password"?i?"ds:right-14":"ds:right-10":i?"ds:right-10":"ds:right-2"),onClick:U,disabled:e.disabled,children:s.jsx(m.X,{className:"ds:size-4"})}),d==="password"&&s.jsx("button",{type:"button",tabIndex:-1,className:a.cn("ds:absolute ds:top-1/2 ds:-translate-y-1/2 ds:p-1 ds:rounded ds:hover:bg-accent ds:transition-colors",i?"ds:right-10":"ds:right-2"),onClick:()=>A(t=>!t),disabled:e.disabled,children:V?s.jsx(m.EyeOff,{className:"ds:size-4"}):s.jsx(m.Eye,{className:"ds:size-4"})}),i&&s.jsx("div",{className:a.cn("ds:absolute ds:top-1/2 ds:-translate-y-1/2 ds:text-muted-foreground ds:leading-0",I.right),children:r.isValidElement(i)?r.cloneElement(i,{className:a.cn(q,i.props?.className)}):i})]}),(p||M&&typeof x=="number")&&s.jsxs("div",{className:"ds:flex ds:items-center ds:justify-between ds:text-xs ds:gap-2",children:[p&&s.jsx("p",{className:a.cn("ds:text-xs",N?G?.[N]:""),children:p}),M&&typeof x=="number"&&s.jsxs("span",{className:"ds:ml-auto ds:text-muted-foreground",children:[g," / ",x]})]})]})})});D.displayName="Input";exports.default=D;
|
|
2
2
|
//# sourceMappingURL=Input.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.cjs","sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import React, { type ChangeEvent } from \"react\";\nimport {\n Input as SInput,\n type InputProps as SInputProps,\n} from \"@dsui/ui/components/input\";\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport { FloatingLabel } from \"@/components/FloatLabel\";\nimport { Eye, EyeOff, ChevronDown, ChevronUp, Info, X } from \"lucide-react\";\nimport { withMask, type Options } from \"use-mask-input\";\nimport { Tooltip } from \"../Tooltip/Tooltip\";\nimport { Label } from \"../Label\";\n\n// Re-export base input props to avoid external dependency issues\nexport type BaseInputProps = Omit<React.ComponentProps<\"input\">, \"size\"> & {\n size?: \"normal\" | \"sm\" | \"xs\" | \"lg\" | \"xl\";\n state?: \"default\" | \"success\" | \"error\" | \"warning\";\n};\n\nexport type InputProps = BaseInputProps & {\n label?: string;\n helperText?: React.ReactNode;\n isFloatLabel?: boolean;\n mask?: string;\n maskOptions?: {\n placeholder?: string;\n inputFormat?: string;\n outputFormat?: string;\n showMaskOnHover?: boolean;\n showMaskOnFocus?: boolean;\n separate?: boolean;\n } & Options;\n maxLength?: number;\n showCharCount?: boolean;\n infoTooltip?: React.ReactNode;\n clearable?: boolean;\n onClear?: () => void;\n prefixIcon?: React.ReactNode;\n suffixIcon?: React.ReactNode;\n required?: boolean;\n};\n\nconst Input = React.forwardRef<HTMLInputElement, InputProps>(\n (\n {\n className,\n label,\n helperText,\n state,\n size,\n isFloatLabel,\n type,\n mask,\n maskOptions,\n maxLength,\n showCharCount,\n infoTooltip,\n clearable,\n onClear,\n prefixIcon,\n suffixIcon,\n placeholder = \" \",\n required,\n ...props\n },\n ref\n ) => {\n // Character count state\n const [charCount, setCharCount] = React.useState(() => {\n if (typeof props.value === \"string\") return props.value.length;\n if (typeof props.defaultValue === \"string\")\n return props.defaultValue.length;\n return 0;\n });\n\n const handleInput = (e: React.ChangeEvent<HTMLInputElement>) => {\n setCharCount(e.target.value.length);\n if (props.onChange) props.onChange(e);\n };\n\n const handleClear = () => {\n if (innerRef.current) {\n innerRef.current.value = \"\";\n setCharCount(0);\n const event = {\n target: innerRef.current,\n currentTarget: innerRef.current,\n } as React.ChangeEvent<HTMLInputElement>;\n props.onChange?.(event);\n if (onClear) onClear();\n }\n };\n\n const inputId = React.useId();\n const innerRef = React.useRef<HTMLInputElement>(null);\n\n // Combine refs\n const combinedRef = React.useCallback(\n (element: HTMLInputElement | null) => {\n // Set innerRef\n if (innerRef) {\n (\n innerRef as React.MutableRefObject<HTMLInputElement | null>\n ).current = element;\n }\n\n // Apply mask if provided\n if (mask && element) {\n const maskRefCallback = withMask(mask, maskOptions);\n if (typeof maskRefCallback === \"function\") {\n maskRefCallback(element);\n }\n }\n },\n [mask, maskOptions]\n );\n\n // Expose ref to parent\n React.useImperativeHandle(ref, () => innerRef.current!);\n\n const [showPassword, setShowPassword] = React.useState(false);\n\n // State\n const helperTextStyles = {\n default: \"ds:text-muted-foreground\",\n success: \"ds:text-success\",\n warning: \"ds:text-warning\",\n error: \"ds:text-error\",\n };\n\n // Calculate current size\n const currentSize = isFloatLabel\n ? size === \"xl\" || size === \"lg\"\n ? size\n : \"xl\"\n : size || \"normal\";\n\n // Calculate padding based on size and icons\n const getPadding = () => {\n const sizeMap = {\n xs: { prefix: \"ds:pl-8\", suffix: \"ds:pr-8\" },\n sm: { prefix: \"ds:pl-9\", suffix: \"ds:pr-9\" },\n normal: { prefix: \"ds:pl-10\", suffix: \"ds:pr-10\" },\n lg: { prefix: \"ds:pl-11\", suffix: \"ds:pr-11\" },\n xl: { prefix: \"ds:pl-12\", suffix: \"ds:pr-12\" },\n };\n\n return sizeMap[currentSize as keyof typeof sizeMap] || sizeMap.normal;\n };\n\n const padding = getPadding();\n\n // Get icon size class based on current size\n const getIconSizeClass = () => {\n const sizeMap = {\n xs: \"ds:size-3\",\n sm: \"ds:size-3.5\",\n normal: \"ds:size-4\",\n lg: \"ds:size-4\",\n xl: \"ds:size-4\",\n };\n return sizeMap[currentSize as keyof typeof sizeMap] || \"ds:size-4\";\n };\n\n const iconSizeClass = getIconSizeClass();\n\n // Calculate right padding considering built-in icons\n const getRightPadding = () => {\n const hasBuiltInSuffix =\n type === \"number\" ||\n type === \"password\" ||\n type === \"datetime\" ||\n (clearable && (charCount > 0 || props?.value));\n\n if (hasBuiltInSuffix && suffixIcon) {\n return type === \"password\" &&\n clearable &&\n (charCount > 0 || props?.value)\n ? \"ds:pr-20\" // password + clear + custom icon\n : \"ds:pr-16\"; // one built-in + custom icon\n }\n\n if (hasBuiltInSuffix) {\n return type === \"password\" &&\n clearable &&\n (charCount > 0 || props?.value)\n ? \"ds:pr-16\" // password + clear\n : \"ds:pr-10\"; // single built-in icon\n }\n\n if (suffixIcon) {\n return padding.suffix;\n }\n\n return \"\";\n };\n\n // Icon position calculations\n const getIconPosition = () => {\n const sizeMap = {\n xs: { left: \"ds:left-2.5\", right: \"ds:right-2.5\" },\n sm: { left: \"ds:left-3\", right: \"ds:right-3\" },\n normal: { left: \"ds:left-3\", right: \"ds:right-3\" },\n lg: { left: \"ds:left-3.5\", right: \"ds:right-3.5\" },\n xl: { left: \"ds:left-4\", right: \"ds:right-4\" },\n };\n\n return sizeMap[currentSize as keyof typeof sizeMap] || sizeMap.normal;\n };\n\n const iconPosition = getIconPosition();\n\n /* Spinner Button Handlers */\n const handleIncrement = () => {\n if (innerRef.current) {\n const step = Number(props.step || 1);\n const max = props.max ? Number(props.max) : Infinity;\n const currentValue = Number(innerRef.current.value || 0);\n const newValue = Math.min(currentValue + step, max);\n\n innerRef.current.value = String(newValue);\n const event = new Event(\"input\", { bubbles: true });\n innerRef.current.dispatchEvent(event);\n props.onChange?.(event as unknown as ChangeEvent<HTMLInputElement>);\n }\n };\n\n const handleDecrement = () => {\n if (innerRef.current) {\n const step = Number(props.step || 1);\n const min = props.min ? Number(props.min) : -Infinity;\n const currentValue = Number(innerRef.current.value || 0);\n const newValue = Math.max(currentValue - step, min);\n\n innerRef.current.value = String(newValue);\n const event = new Event(\"input\", { bubbles: true });\n innerRef.current.dispatchEvent(event);\n props.onChange?.(event as unknown as ChangeEvent<HTMLInputElement>);\n }\n };\n /* End Spinner Button Handlers */\n\n return (\n <div className={className}>\n <div\n className={cn(\"ds:flex ds:flex-col ds:gap-1.5 ds:relative ds:flex-auto\", {\n \"ds:floating-label ds:relative\": isFloatLabel,\n })}\n >\n {!isFloatLabel && label && (\n <Label\n htmlFor={inputId}\n className=\"ds:flex ds:gap-2 ds:text-sm ds:font-medium ds:leading-none ds:peer-disabled:cursor-not-allowed ds:peer-disabled:opacity-70\"\n >\n <span>\n {label}\n {required && <span className=\"ds:text-error ds:ml-0.5\">*</span>}\n </span>\n {infoTooltip && (\n <Tooltip content={infoTooltip}>\n <Info className=\"ds:size-3.5 ds:min-w-3.5\" />\n </Tooltip>\n )}\n </Label>\n )}\n\n <div className=\"ds:relative\">\n {/* Prefix Icon */}\n {prefixIcon && (\n <div\n className={cn(\n \"ds:absolute ds:top-1/2 ds:-translate-y-1/2 ds:text-muted-foreground ds:leading-0\",\n iconPosition.left\n )}\n >\n {React.isValidElement(prefixIcon)\n ? React.cloneElement(prefixIcon, {\n className: cn(\n iconSizeClass,\n (prefixIcon.props as any)?.className\n ),\n } as Partial<unknown>)\n : prefixIcon}\n </div>\n )}\n\n <SInput\n ref={combinedRef}\n id={inputId}\n className={cn(\n \"ds:peer\",\n {\n \"ds:pt-5 ds:pb-1\": isFloatLabel && size !== \"lg\",\n \"ds:[&::-webkit-outer-spin-button]:appearance-none ds:[&::-webkit-inner-spin-button]:appearance-none ds:[-moz-appearance:textfield] ds:pr-8\":\n type === \"number\",\n // \"[-webkit-text-fill-color:var(--foreground)]\": mask,\n },\n prefixIcon && padding.prefix,\n mask && \"ds:placeholder:text-slate-400 ds:placeholder:opacity-100\",\n getRightPadding()\n // className,\n )}\n state={state}\n size={\n isFloatLabel\n ? size === \"xl\" || size === \"lg\"\n ? size\n : \"xl\"\n : size\n }\n type={\n type === \"password\"\n ? showPassword\n ? \"text\"\n : \"password\"\n : type\n }\n placeholder={placeholder}\n maxLength={maxLength}\n onChange={handleInput}\n required={required}\n {...props}\n />\n {isFloatLabel && (\n <FloatingLabel\n htmlFor={inputId}\n size={size}\n infoTooltip={infoTooltip}\n required={required}\n >\n {label}\n </FloatingLabel>\n )}\n\n {/* Spinner Buttons */}\n {type === \"number\" && (\n <div className=\"ds:absolute ds:right-1 ds:top-0 ds:h-full ds:flex ds:flex-col ds:gap-0.5\">\n <button\n type=\"button\"\n onClick={handleIncrement}\n disabled={props.disabled}\n className={cn(\n \"ds:h-1/2 ds:w-6 ds:flex ds:items-center ds:justify-center ds:rounded ds:cursor-pointer ds:hover:scale-150 ds:transition-transform\",\n \"ds:disabled:opacity-50 ds:disabled:cursor-not-allowed ds:disabled:hover:bg-transparent\"\n )}\n tabIndex={-1}\n >\n <ChevronUp className=\"ds:size-3\" />\n </button>\n <button\n type=\"button\"\n onClick={handleDecrement}\n disabled={props.disabled}\n className={cn(\n \"ds:h-1/2 ds:w-6 ds:flex ds:items-center ds:justify-center ds:rounded ds:cursor-pointer ds:hover:scale-150 ds:transition-transform\",\n \"ds:disabled:opacity-50 ds:disabled:cursor-not-allowed ds:disabled:hover:bg-transparent\"\n )}\n tabIndex={-1}\n >\n <ChevronDown className=\"ds:size-3\" />\n </button>\n </div>\n )}\n\n {/* Clear Button */}\n {clearable &&\n (charCount > 0 || props?.value) &&\n !props.disabled &&\n type !== \"number\" && (\n <button\n type=\"button\"\n tabIndex={-1}\n className={cn(\n \"ds:absolute ds:top-1/2 ds:-translate-y-1/2 ds:p-1 ds:rounded ds:hover:bg-accent ds:transition-colors ds:cursor-pointer\",\n type === \"password\"\n ? suffixIcon\n ? \"ds:right-14\"\n : \"ds:right-10\"\n : suffixIcon\n ? \"ds:right-10\"\n : \"ds:right-2\"\n )}\n onClick={handleClear}\n disabled={props.disabled}\n >\n <X className=\"ds:size-4\" />\n </button>\n )}\n\n {/* Show/Hide Password Button */}\n {type === \"password\" && (\n <button\n type=\"button\"\n tabIndex={-1}\n className={cn(\n \"ds:absolute ds:top-1/2 ds:-translate-y-1/2 ds:p-1 ds:rounded ds:hover:bg-accent ds:transition-colors\",\n suffixIcon ? \"ds:right-10\" : \"ds:right-2\"\n )}\n onClick={() => setShowPassword((prev) => !prev)}\n disabled={props.disabled}\n >\n {showPassword ? (\n <EyeOff className=\"ds:size-4\" />\n ) : (\n <Eye className=\"ds:size-4\" />\n )}\n </button>\n )}\n\n {/* Suffix Icon */}\n {suffixIcon && (\n <div\n className={cn(\n \"ds:absolute ds:top-1/2 ds:-translate-y-1/2 ds:text-muted-foreground ds:leading-0\",\n iconPosition.right\n )}\n >\n {React.isValidElement(suffixIcon)\n ? React.cloneElement(suffixIcon, {\n className: cn(\n iconSizeClass,\n (suffixIcon.props as any)?.className\n ),\n } as Partial<unknown>)\n : suffixIcon}\n </div>\n )}\n </div>\n\n {(helperText || (showCharCount && typeof maxLength === \"number\")) && (\n <div className=\"ds:flex ds:items-center ds:justify-between ds:text-xs ds:gap-2\">\n {helperText && (\n <p\n className={cn(\n \"ds:text-xs\",\n state ? helperTextStyles?.[state] : \"\"\n )}\n >\n {helperText}\n </p>\n )}\n {showCharCount && typeof maxLength === \"number\" && (\n <span className=\"ds:ml-auto ds:text-muted-foreground\">\n {charCount} / {maxLength}\n </span>\n )}\n </div>\n )}\n </div>\n </div>\n );\n }\n);\n\nInput.displayName = \"Input\";\nexport default Input;\n"],"names":["Input","React","className","label","helperText","state","size","isFloatLabel","type","mask","maskOptions","maxLength","showCharCount","infoTooltip","clearable","onClear","prefixIcon","suffixIcon","placeholder","required","props","ref","charCount","setCharCount","handleInput","e","handleClear","innerRef","event","inputId","combinedRef","element","maskRefCallback","withMask","showPassword","setShowPassword","helperTextStyles","currentSize","padding","sizeMap","iconSizeClass","getRightPadding","hasBuiltInSuffix","iconPosition","handleIncrement","step","max","currentValue","newValue","handleDecrement","min","jsx","jsxs","cn","Label","Tooltip","Info","SInput","FloatingLabel","ChevronUp","ChevronDown","X","prev","EyeOff","Eye"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Input.cjs","sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import React, { type ChangeEvent } from \"react\";\nimport {\n Input as SInput,\n type InputProps as SInputProps,\n} from \"@dsui/ui/components/input\";\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport { FloatingLabel } from \"@/components/FloatLabel\";\nimport { Eye, EyeOff, ChevronDown, ChevronUp, Info, X } from \"lucide-react\";\nimport { withMask, type Options } from \"use-mask-input\";\nimport { Tooltip } from \"../Tooltip/Tooltip\";\nimport { Label } from \"../Label\";\n\n// Re-export base input props to avoid external dependency issues\nexport type BaseInputProps = Omit<React.ComponentProps<\"input\">, \"size\"> & {\n size?: \"normal\" | \"sm\" | \"xs\" | \"lg\" | \"xl\";\n state?: \"default\" | \"success\" | \"error\" | \"warning\";\n};\n\nexport type InputProps = BaseInputProps & {\n label?: string;\n helperText?: React.ReactNode;\n isFloatLabel?: boolean;\n mask?: string;\n maskOptions?: {\n placeholder?: string;\n inputFormat?: string;\n outputFormat?: string;\n showMaskOnHover?: boolean;\n showMaskOnFocus?: boolean;\n separate?: boolean;\n } & Options;\n maxLength?: number;\n showCharCount?: boolean;\n infoTooltip?: React.ReactNode;\n clearable?: boolean;\n onClear?: () => void;\n prefixIcon?: React.ReactNode;\n suffixIcon?: React.ReactNode;\n required?: boolean;\n inputClassName?: string;\n};\n\nconst Input = React.forwardRef<HTMLInputElement, InputProps>(\n (\n {\n className,\n label,\n helperText,\n state,\n size,\n isFloatLabel,\n type,\n mask,\n maskOptions,\n maxLength,\n showCharCount,\n infoTooltip,\n clearable,\n onClear,\n prefixIcon,\n suffixIcon,\n placeholder = \" \",\n required,\n inputClassName,\n ...props\n },\n ref\n ) => {\n // Character count state\n const [charCount, setCharCount] = React.useState(() => {\n if (typeof props.value === \"string\") return props.value.length;\n if (typeof props.defaultValue === \"string\")\n return props.defaultValue.length;\n return 0;\n });\n\n const handleInput = (e: React.ChangeEvent<HTMLInputElement>) => {\n setCharCount(e.target.value.length);\n if (props.onChange) props.onChange(e);\n };\n\n const handleClear = () => {\n if (innerRef.current) {\n innerRef.current.value = \"\";\n setCharCount(0);\n const event = {\n target: innerRef.current,\n currentTarget: innerRef.current,\n } as React.ChangeEvent<HTMLInputElement>;\n props.onChange?.(event);\n if (onClear) onClear();\n }\n };\n\n const inputId = React.useId();\n const innerRef = React.useRef<HTMLInputElement>(null);\n\n // Combine refs\n const combinedRef = React.useCallback(\n (element: HTMLInputElement | null) => {\n // Set innerRef\n if (innerRef) {\n (\n innerRef as React.MutableRefObject<HTMLInputElement | null>\n ).current = element;\n }\n\n // Apply mask if provided\n if (mask && element) {\n const maskRefCallback = withMask(mask, maskOptions);\n if (typeof maskRefCallback === \"function\") {\n maskRefCallback(element);\n }\n }\n },\n [mask, maskOptions]\n );\n\n // Expose ref to parent\n React.useImperativeHandle(ref, () => innerRef.current!);\n\n const [showPassword, setShowPassword] = React.useState(false);\n\n // State\n const helperTextStyles = {\n default: \"ds:text-muted-foreground\",\n success: \"ds:text-success\",\n warning: \"ds:text-warning\",\n error: \"ds:text-error\",\n };\n\n // Calculate current size\n const currentSize = isFloatLabel\n ? size === \"xl\" || size === \"lg\"\n ? size\n : \"xl\"\n : size || \"normal\";\n\n // Calculate padding based on size and icons\n const getPadding = () => {\n const sizeMap = {\n xs: { prefix: \"ds:pl-8\", suffix: \"ds:pr-8\" },\n sm: { prefix: \"ds:pl-9\", suffix: \"ds:pr-9\" },\n normal: { prefix: \"ds:pl-10\", suffix: \"ds:pr-10\" },\n lg: { prefix: \"ds:pl-11\", suffix: \"ds:pr-11\" },\n xl: { prefix: \"ds:pl-12\", suffix: \"ds:pr-12\" },\n };\n\n return sizeMap[currentSize as keyof typeof sizeMap] || sizeMap.normal;\n };\n\n const padding = getPadding();\n\n // Get icon size class based on current size\n const getIconSizeClass = () => {\n const sizeMap = {\n xs: \"ds:size-3\",\n sm: \"ds:size-3.5\",\n normal: \"ds:size-4\",\n lg: \"ds:size-4\",\n xl: \"ds:size-4\",\n };\n return sizeMap[currentSize as keyof typeof sizeMap] || \"ds:size-4\";\n };\n\n const iconSizeClass = getIconSizeClass();\n\n // Calculate right padding considering built-in icons\n const getRightPadding = () => {\n const hasBuiltInSuffix =\n type === \"number\" ||\n type === \"password\" ||\n type === \"datetime\" ||\n (clearable && (charCount > 0 || props?.value));\n\n if (hasBuiltInSuffix && suffixIcon) {\n return type === \"password\" &&\n clearable &&\n (charCount > 0 || props?.value)\n ? \"ds:pr-20\" // password + clear + custom icon\n : \"ds:pr-16\"; // one built-in + custom icon\n }\n\n if (hasBuiltInSuffix) {\n return type === \"password\" &&\n clearable &&\n (charCount > 0 || props?.value)\n ? \"ds:pr-16\" // password + clear\n : \"ds:pr-10\"; // single built-in icon\n }\n\n if (suffixIcon) {\n return padding.suffix;\n }\n\n return \"\";\n };\n\n // Icon position calculations\n const getIconPosition = () => {\n const sizeMap = {\n xs: { left: \"ds:left-2.5\", right: \"ds:right-2.5\" },\n sm: { left: \"ds:left-3\", right: \"ds:right-3\" },\n normal: { left: \"ds:left-3\", right: \"ds:right-3\" },\n lg: { left: \"ds:left-3.5\", right: \"ds:right-3.5\" },\n xl: { left: \"ds:left-4\", right: \"ds:right-4\" },\n };\n\n return sizeMap[currentSize as keyof typeof sizeMap] || sizeMap.normal;\n };\n\n const iconPosition = getIconPosition();\n\n /* Spinner Button Handlers */\n const handleIncrement = () => {\n if (innerRef.current) {\n const step = Number(props.step || 1);\n const max = props.max ? Number(props.max) : Infinity;\n const currentValue = Number(innerRef.current.value || 0);\n const newValue = Math.min(currentValue + step, max);\n\n innerRef.current.value = String(newValue);\n const event = new Event(\"input\", { bubbles: true });\n innerRef.current.dispatchEvent(event);\n props.onChange?.(event as unknown as ChangeEvent<HTMLInputElement>);\n }\n };\n\n const handleDecrement = () => {\n if (innerRef.current) {\n const step = Number(props.step || 1);\n const min = props.min ? Number(props.min) : -Infinity;\n const currentValue = Number(innerRef.current.value || 0);\n const newValue = Math.max(currentValue - step, min);\n\n innerRef.current.value = String(newValue);\n const event = new Event(\"input\", { bubbles: true });\n innerRef.current.dispatchEvent(event);\n props.onChange?.(event as unknown as ChangeEvent<HTMLInputElement>);\n }\n };\n /* End Spinner Button Handlers */\n\n return (\n <div className={className}>\n <div\n className={cn(\"ds:flex ds:flex-col ds:gap-1.5 ds:relative ds:flex-auto\", {\n \"ds:floating-label ds:relative\": isFloatLabel,\n })}\n >\n {!isFloatLabel && label && (\n <Label\n htmlFor={inputId}\n className=\"ds:flex ds:gap-2 ds:text-sm ds:font-medium ds:leading-none ds:peer-disabled:cursor-not-allowed ds:peer-disabled:opacity-70\"\n >\n <span>\n {label}\n {required && <span className=\"ds:text-error ds:ml-0.5\">*</span>}\n </span>\n {infoTooltip && (\n <Tooltip content={infoTooltip}>\n <Info className=\"ds:size-3.5 ds:min-w-3.5\" />\n </Tooltip>\n )}\n </Label>\n )}\n\n <div className=\"ds:relative\">\n {/* Prefix Icon */}\n {prefixIcon && (\n <div\n className={cn(\n \"ds:absolute ds:top-1/2 ds:-translate-y-1/2 ds:text-muted-foreground ds:leading-0\",\n iconPosition.left\n )}\n >\n {React.isValidElement(prefixIcon)\n ? React.cloneElement(prefixIcon, {\n className: cn(\n iconSizeClass,\n (prefixIcon.props as any)?.className\n ),\n } as Partial<unknown>)\n : prefixIcon}\n </div>\n )}\n\n <SInput\n ref={combinedRef}\n id={inputId}\n className={cn(\n \"ds:peer\",\n {\n \"ds:pt-5 ds:pb-1\": isFloatLabel && size !== \"lg\",\n \"ds:[&::-webkit-outer-spin-button]:appearance-none ds:[&::-webkit-inner-spin-button]:appearance-none ds:[-moz-appearance:textfield] ds:pr-8\":\n type === \"number\",\n // \"[-webkit-text-fill-color:var(--foreground)]\": mask,\n },\n prefixIcon && padding.prefix,\n mask && \"ds:placeholder:text-slate-400 ds:placeholder:opacity-100\",\n getRightPadding(),\n inputClassName,\n )}\n state={state}\n size={\n isFloatLabel\n ? size === \"xl\" || size === \"lg\"\n ? size\n : \"xl\"\n : size\n }\n type={\n type === \"password\"\n ? showPassword\n ? \"text\"\n : \"password\"\n : type\n }\n placeholder={placeholder}\n maxLength={maxLength}\n onChange={handleInput}\n required={required}\n {...props}\n />\n {isFloatLabel && (\n <FloatingLabel\n htmlFor={inputId}\n size={size}\n infoTooltip={infoTooltip}\n required={required}\n >\n {label}\n </FloatingLabel>\n )}\n\n {/* Spinner Buttons */}\n {type === \"number\" && (\n <div className=\"ds:absolute ds:right-1 ds:top-0 ds:h-full ds:flex ds:flex-col ds:gap-0.5\">\n <button\n type=\"button\"\n onClick={handleIncrement}\n disabled={props.disabled}\n className={cn(\n \"ds:h-1/2 ds:w-6 ds:flex ds:items-center ds:justify-center ds:rounded ds:cursor-pointer ds:hover:scale-150 ds:transition-transform\",\n \"ds:disabled:opacity-50 ds:disabled:cursor-not-allowed ds:disabled:hover:bg-transparent\"\n )}\n tabIndex={-1}\n >\n <ChevronUp className=\"ds:size-3\" />\n </button>\n <button\n type=\"button\"\n onClick={handleDecrement}\n disabled={props.disabled}\n className={cn(\n \"ds:h-1/2 ds:w-6 ds:flex ds:items-center ds:justify-center ds:rounded ds:cursor-pointer ds:hover:scale-150 ds:transition-transform\",\n \"ds:disabled:opacity-50 ds:disabled:cursor-not-allowed ds:disabled:hover:bg-transparent\"\n )}\n tabIndex={-1}\n >\n <ChevronDown className=\"ds:size-3\" />\n </button>\n </div>\n )}\n\n {/* Clear Button */}\n {clearable &&\n (charCount > 0 || props?.value) &&\n !props.disabled &&\n type !== \"number\" && (\n <button\n type=\"button\"\n tabIndex={-1}\n className={cn(\n \"ds:absolute ds:top-1/2 ds:-translate-y-1/2 ds:p-1 ds:rounded ds:hover:bg-accent ds:transition-colors ds:cursor-pointer\",\n type === \"password\"\n ? suffixIcon\n ? \"ds:right-14\"\n : \"ds:right-10\"\n : suffixIcon\n ? \"ds:right-10\"\n : \"ds:right-2\"\n )}\n onClick={handleClear}\n disabled={props.disabled}\n >\n <X className=\"ds:size-4\" />\n </button>\n )}\n\n {/* Show/Hide Password Button */}\n {type === \"password\" && (\n <button\n type=\"button\"\n tabIndex={-1}\n className={cn(\n \"ds:absolute ds:top-1/2 ds:-translate-y-1/2 ds:p-1 ds:rounded ds:hover:bg-accent ds:transition-colors\",\n suffixIcon ? \"ds:right-10\" : \"ds:right-2\"\n )}\n onClick={() => setShowPassword((prev) => !prev)}\n disabled={props.disabled}\n >\n {showPassword ? (\n <EyeOff className=\"ds:size-4\" />\n ) : (\n <Eye className=\"ds:size-4\" />\n )}\n </button>\n )}\n\n {/* Suffix Icon */}\n {suffixIcon && (\n <div\n className={cn(\n \"ds:absolute ds:top-1/2 ds:-translate-y-1/2 ds:text-muted-foreground ds:leading-0\",\n iconPosition.right\n )}\n >\n {React.isValidElement(suffixIcon)\n ? React.cloneElement(suffixIcon, {\n className: cn(\n iconSizeClass,\n (suffixIcon.props as any)?.className\n ),\n } as Partial<unknown>)\n : suffixIcon}\n </div>\n )}\n </div>\n\n {(helperText || (showCharCount && typeof maxLength === \"number\")) && (\n <div className=\"ds:flex ds:items-center ds:justify-between ds:text-xs ds:gap-2\">\n {helperText && (\n <p\n className={cn(\n \"ds:text-xs\",\n state ? helperTextStyles?.[state] : \"\"\n )}\n >\n {helperText}\n </p>\n )}\n {showCharCount && typeof maxLength === \"number\" && (\n <span className=\"ds:ml-auto ds:text-muted-foreground\">\n {charCount} / {maxLength}\n </span>\n )}\n </div>\n )}\n </div>\n </div>\n );\n }\n);\n\nInput.displayName = \"Input\";\nexport default Input;\n"],"names":["Input","React","className","label","helperText","state","size","isFloatLabel","type","mask","maskOptions","maxLength","showCharCount","infoTooltip","clearable","onClear","prefixIcon","suffixIcon","placeholder","required","inputClassName","props","ref","charCount","setCharCount","handleInput","e","handleClear","innerRef","event","inputId","combinedRef","element","maskRefCallback","withMask","showPassword","setShowPassword","helperTextStyles","currentSize","padding","sizeMap","iconSizeClass","getRightPadding","hasBuiltInSuffix","iconPosition","handleIncrement","step","max","currentValue","newValue","handleDecrement","min","jsx","jsxs","cn","Label","Tooltip","Info","SInput","FloatingLabel","ChevronUp","ChevronDown","X","prev","EyeOff","Eye"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("@tanstack/react-table"),b=require("./data-table-pagination.cjs");require("@radix-ui/react-slot");require("../../packages/ui/src/components/button.cjs");require("../../packages/ui/src/components/button-group.cjs");require("../../packages/ui/src/components/input.cjs");require("../../packages/ui/src/components/textarea.cjs");require("@radix-ui/react-label");const c=require("../../packages/ui/src/lib/utils.cjs");require("../../packages/ui/src/components/select.cjs");require("../../packages/ui/src/components/combobox.cjs");require("@radix-ui/react-tooltip");require("react");require("lucide-react");require("react-day-picker");require("../../packages/ui/src/components/popover.cjs");require("@radix-ui/react-separator");require("../../packages/ui/src/components/switch.cjs");require("vaul");require("@radix-ui/react-scroll-area");require("../../packages/ui/src/components/tree-view.cjs");require("@radix-ui/react-alert-dialog");require("@radix-ui/react-avatar");require("../../packages/ui/src/components/badge.cjs");require("../../packages/ui/src/components/checkbox.cjs");require("@radix-ui/react-collapsible");require("cmdk");require("@radix-ui/react-dialog");require("@radix-ui/react-dropdown-menu");require("../../packages/ui/src/components/input-otp.cjs");require("../../packages/ui/src/components/radio-group.cjs");require("../../packages/ui/src/components/sidebar.cjs");require("@radix-ui/react-slider");require("../../packages/ui/src/components/tabs.cjs");require("../../packages/ui/src/components/toggle.cjs");const l=require("../../packages/ui/src/components/table.cjs"),a=require("../../utils/data-table.cjs"),g=require("./data-table-column-header.cjs");function j({table:s,actionBar:u,children:q,className:m,pagination:n=!0,sticky:T,bordered:f,loading:d,footer:o,...x}){return e.jsxs("div",{className:c.cn("ds:flex ds:w-full ds:flex-col ds:gap-2.5 ds:relative",m),...x,children:[q,d&&e.jsx("div",{className:"ds:absolute ds:inset-0 ds:bg-background/50 ds:flex ds:items-center ds:justify-center ds:z-20",children:"Loading..."}),e.jsx("div",{className:c.cn("ds:overflow-auto ds:rounded-md ds:border ds-border-border",d&&"ds:blur-sm"),children:e.jsxs(l.Table,{children:[e.jsx(l.TableHeader,{children:s.getHeaderGroups().map(i=>e.jsx(l.TableRow,{children:i.headers.map(r=>e.jsx(l.TableHead,{colSpan:r.colSpan,style:{...a.getCommonPinningStyles({column:r.column})},children:r.isPlaceholder?null:r.column.columnDef.header?typeof r.column.columnDef.header=="function"?t.flexRender(r.column.columnDef.header,r.getContext()):e.jsx(g.DataTableColumnHeader,{column:r.column}):null},r.id))},i.id))}),e.jsx(l.TableBody,{children:s.getRowModel().rows?.length?s.getRowModel().rows.map(i=>e.jsx(l.TableRow,{"data-state":i.getIsSelected()&&"selected",children:i.getVisibleCells().map(r=>e.jsx(l.TableCell,{style:{...a.getCommonPinningStyles({column:r.column})},children:t.flexRender(r.column.columnDef.cell,r.getContext())},r.id))},i.id)):e.jsx(l.TableRow,{children:e.jsx(l.TableCell,{colSpan:s.getAllColumns().length,className:"ds:h-24 ds:text-center",children:"No results."})})}),o&&e.jsx("tfoot",{children:e.jsx(l.TableRow,{children:e.jsx(l.TableCell,{colSpan:s.getAllColumns().length,children:o(s.getRowModel().rows.map(i=>i.original))})})})]})}),e.jsxs("div",{className:"ds:flex ds:flex-col ds:gap-2.5",children:[n&&e.jsx(b.DataTablePagination,{table:s,...n===!0?{}:n}),u&&s.getFilteredSelectedRowModel().rows.length>0&&u]})]})}exports.DataTable=j;
|
|
2
2
|
//# sourceMappingURL=data-table.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"data-table.cjs","sources":["../../../../src/components/Table/data-table.tsx"],"sourcesContent":["import { flexRender, type Table as TanstackTable } from \"@tanstack/react-table\";\nimport type * as React from \"react\";\n\nimport { DataTablePagination } from \"./data-table-pagination\";\nimport {\n cn,\n Table,\n TableBody,\n TableCell,\n TableHead,\n TableHeader,\n TableRow,\n} from \"@dsui/ui\";\nimport { getCommonPinningStyles } from \"@/utils/data-table\";\nimport { DataTableColumnHeader } from \"./data-table-column-header\";\n\nexport interface DataTableProps<TData> extends React.ComponentProps<\"div\"> {\n table: TanstackTable<TData>;\n actionBar?: React.ReactNode;\n pagination?:\n | boolean\n | Omit<React.ComponentProps<typeof DataTablePagination<TData>>, \"table\">;\n sticky?: boolean | { offsetHeader?: number; offsetScroll?: number };\n bordered?: boolean;\n loading?: boolean;\n footer?: (currentPageData: TData[]) => React.ReactNode;\n}\n\nexport function DataTable<TData>({\n table,\n actionBar,\n children,\n className,\n pagination = true,\n sticky,\n bordered,\n loading,\n footer,\n ...props\n}: DataTableProps<TData>) {\n return (\n <div\n className={cn(\"ds:flex ds:w-full ds:flex-col ds:gap-2.5 ds:relative\"
|
|
1
|
+
{"version":3,"file":"data-table.cjs","sources":["../../../../src/components/Table/data-table.tsx"],"sourcesContent":["import { flexRender, type Table as TanstackTable } from \"@tanstack/react-table\";\nimport type * as React from \"react\";\n\nimport { DataTablePagination } from \"./data-table-pagination\";\nimport {\n cn,\n Table,\n TableBody,\n TableCell,\n TableHead,\n TableHeader,\n TableRow,\n} from \"@dsui/ui\";\nimport { getCommonPinningStyles } from \"@/utils/data-table\";\nimport { DataTableColumnHeader } from \"./data-table-column-header\";\n\nexport interface DataTableProps<TData> extends React.ComponentProps<\"div\"> {\n table: TanstackTable<TData>;\n actionBar?: React.ReactNode;\n pagination?:\n | boolean\n | Omit<React.ComponentProps<typeof DataTablePagination<TData>>, \"table\">;\n sticky?: boolean | { offsetHeader?: number; offsetScroll?: number };\n bordered?: boolean;\n loading?: boolean;\n footer?: (currentPageData: TData[]) => React.ReactNode;\n}\n\nexport function DataTable<TData>({\n table,\n actionBar,\n children,\n className,\n pagination = true,\n sticky,\n bordered,\n loading,\n footer,\n ...props\n}: DataTableProps<TData>) {\n return (\n <div\n className={cn(\n \"ds:flex ds:w-full ds:flex-col ds:gap-2.5 ds:relative\",\n className\n )}\n {...props}\n >\n {children}\n {loading && (\n <div className=\"ds:absolute ds:inset-0 ds:bg-background/50 ds:flex ds:items-center ds:justify-center ds:z-20\">\n Loading...\n </div>\n )}\n <div\n className={cn(\n \"ds:overflow-auto ds:rounded-md ds:border ds-border-border\",\n loading && \"ds:blur-sm\"\n )}\n >\n <Table>\n <TableHeader>\n {table.getHeaderGroups().map((headerGroup) => (\n <TableRow key={headerGroup.id}>\n {headerGroup.headers.map((header) => (\n <TableHead\n key={header.id}\n colSpan={header.colSpan}\n style={{\n ...getCommonPinningStyles({ column: header.column }),\n }}\n >\n {header.isPlaceholder ? null : header.column.columnDef\n .header ? (\n typeof header.column.columnDef.header === \"function\" ? (\n flexRender(\n header.column.columnDef.header,\n header.getContext()\n )\n ) : (\n <DataTableColumnHeader column={header.column} />\n )\n ) : null}\n </TableHead>\n ))}\n </TableRow>\n ))}\n </TableHeader>\n <TableBody>\n {table.getRowModel().rows?.length ? (\n table.getRowModel().rows.map((row) => (\n <TableRow\n key={row.id}\n data-state={row.getIsSelected() && \"selected\"}\n >\n {row.getVisibleCells().map((cell) => (\n <TableCell\n key={cell.id}\n style={{\n ...getCommonPinningStyles({ column: cell.column }),\n }}\n >\n {flexRender(\n cell.column.columnDef.cell,\n cell.getContext()\n )}\n </TableCell>\n ))}\n </TableRow>\n ))\n ) : (\n <TableRow>\n <TableCell\n colSpan={table.getAllColumns().length}\n className=\"ds:h-24 ds:text-center\"\n >\n No results.\n </TableCell>\n </TableRow>\n )}\n </TableBody>\n {footer && (\n <tfoot>\n <TableRow>\n <TableCell colSpan={table.getAllColumns().length}>\n {footer(table.getRowModel().rows.map((row) => row.original))}\n </TableCell>\n </TableRow>\n </tfoot>\n )}\n </Table>\n </div>\n <div className=\"ds:flex ds:flex-col ds:gap-2.5\">\n {pagination && (\n <DataTablePagination\n table={table}\n {...(pagination === true ? {} : pagination)}\n />\n )}\n {actionBar &&\n table.getFilteredSelectedRowModel().rows.length > 0 &&\n actionBar}\n </div>\n </div>\n );\n}\n"],"names":["DataTable","table","actionBar","children","className","pagination","sticky","bordered","loading","footer","props","jsxs","cn","jsx","Table","TableHeader","headerGroup","TableRow","header","TableHead","getCommonPinningStyles","flexRender","DataTableColumnHeader","TableBody","row","cell","TableCell","DataTablePagination"],"mappings":"kwDA4BO,SAASA,EAAiB,CAAA,MAC/BC,EACA,UAAAC,EACA,SAAAC,EACA,UAAAC,EACA,WAAAC,EAAa,GACb,OAAAC,EACA,SAAAC,EACA,QAAAC,EACA,OAAAC,EACA,GAAGC,CACL,EAA0B,CACxB,OACEC,EAAAA,KAAC,MAAA,CACC,UAAWC,EAAAA,GACT,uDACAR,CAAA,EAED,GAAGM,EAEH,SAAA,CAAAP,EACAK,GACCK,EAAAA,IAAC,MAAA,CAAI,UAAU,+FAA+F,SAAA,aAE9G,EAEFA,EAAAA,IAAC,MAAA,CACC,UAAWD,EAAAA,GACT,4DACAJ,GAAW,YAAA,EAGb,gBAACM,QAAA,CACC,SAAA,CAAAD,EAAAA,IAACE,EAAAA,YAAA,CACE,SAAAd,EAAM,gBAAA,EAAkB,IAAKe,GAC5BH,EAAAA,IAACI,EAAAA,SAAA,CACE,SAAAD,EAAY,QAAQ,IAAKE,GACxBL,EAAAA,IAACM,EAAAA,UAAA,CAEC,QAASD,EAAO,QAChB,MAAO,CACL,GAAGE,yBAAuB,CAAE,OAAQF,EAAO,OAAQ,CAAA,EAGpD,SAAAA,EAAO,cAAgB,KAAOA,EAAO,OAAO,UACxC,OACH,OAAOA,EAAO,OAAO,UAAU,QAAW,WACxCG,EAAAA,WACEH,EAAO,OAAO,UAAU,OACxBA,EAAO,WAAA,CAAW,EAGpBL,EAAAA,IAACS,EAAAA,sBAAA,CAAsB,OAAQJ,EAAO,OAAQ,EAE9C,IAAA,EAhBCA,EAAO,EAAA,CAkBf,GArBYF,EAAY,EAsB3B,CACD,CAAA,CACH,EACAH,EAAAA,IAACU,EAAAA,UAAA,CACE,SAAAtB,EAAM,YAAA,EAAc,MAAM,OACzBA,EAAM,YAAA,EAAc,KAAK,IAAKuB,GAC5BX,EAAAA,IAACI,EAAAA,SAAA,CAEC,aAAYO,EAAI,cAAA,GAAmB,WAElC,SAAAA,EAAI,gBAAA,EAAkB,IAAKC,GAC1BZ,EAAAA,IAACa,EAAAA,UAAA,CAEC,MAAO,CACL,GAAGN,yBAAuB,CAAE,OAAQK,EAAK,OAAQ,CAAA,EAGlD,SAAAJ,EAAAA,WACCI,EAAK,OAAO,UAAU,KACtBA,EAAK,WAAA,CAAW,CAClB,EARKA,EAAK,EAAA,CAUb,CAAA,EAfID,EAAI,EAAA,CAiBZ,EAEDX,EAAAA,IAACI,WAAA,CACC,SAAAJ,EAAAA,IAACa,EAAAA,UAAA,CACC,QAASzB,EAAM,cAAA,EAAgB,OAC/B,UAAU,yBACX,SAAA,aAAA,CAAA,EAGH,CAAA,CAEJ,EACCQ,GACCI,EAAAA,IAAC,QAAA,CACC,SAAAA,EAAAA,IAACI,EAAAA,SAAA,CACC,eAACS,EAAAA,UAAA,CAAU,QAASzB,EAAM,cAAA,EAAgB,OACvC,WAAOA,EAAM,YAAA,EAAc,KAAK,IAAKuB,GAAQA,EAAI,QAAQ,CAAC,CAAA,CAC7D,CAAA,CACF,CAAA,CACF,CAAA,CAAA,CAEJ,CAAA,CAAA,EAEFb,EAAAA,KAAC,MAAA,CAAI,UAAU,iCACZ,SAAA,CAAAN,GACCQ,EAAAA,IAACc,EAAAA,oBAAA,CAAA,MACC1B,EACC,GAAII,IAAe,GAAO,GAAKA,CAAA,CAAA,EAGnCH,GACCD,EAAM,4BAAA,EAA8B,KAAK,OAAS,GAClDC,CAAA,CAAA,CACJ,CAAA,CAAA,CAAA,CAGN"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),c=require("@radix-ui/react-alert-dialog"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),c=require("@radix-ui/react-alert-dialog"),o=require("../lib/utils.cjs");require("./button.cjs");function g(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const l in t)if(l!=="default"){const r=Object.getOwnPropertyDescriptor(t,l);Object.defineProperty(e,l,r.get?r:{enumerable:!0,get:()=>t[l]})}}return e.default=t,Object.freeze(e)}const s=g(c);function u({...t}){return a.jsx(s.Root,{"data-slot":"alert-dialog",...t})}function f({...t}){return a.jsx(s.Trigger,{"data-slot":"alert-dialog-trigger",...t})}function i({...t}){return a.jsx(s.Portal,{"data-slot":"alert-dialog-portal",...t})}function n({className:t,backdropFilter:e,overlay:l="dark",...r}){const d=l==="dark"?"bg-black/50":"bg-white/50";return a.jsx(s.Overlay,{"data-slot":"alert-dialog-overlay",className:o.cn("ds:data-[state=open]:animate-in ds:data-[state=closed]:animate-out ds:data-[state=closed]:fade-out-0 ds:data-[state=open]:fade-in-0 ds:fixed ds:inset-0 ds:z-50",d,t),style:e?{backdropFilter:`blur(${e}px)`}:void 0,...r})}function m({className:t,noDefaultAnimation:e,backdropFilter:l,overlay:r,...d}){return a.jsxs(i,{children:[a.jsx(n,{backdropFilter:l,overlay:r}),a.jsx(s.Content,{"data-slot":"alert-dialog-content",className:o.cn("ds:bg-background ds:data-[state=closed]:animate-out ds:data-[state=closed]:fade-out-0 ds:data-[state=open]:fade-in-0 ds:data-[state=closed]:zoom-out-95 ds:data-[state=open]:zoom-in-95 ds:fixed ds:top-[50%] ds:left-[50%] ds:z-50 ds:grid ds:w-full ds:max-w-[calc(100%-2rem)] ds:translate-x-[-50%] ds:translate-y-[-50%] ds:gap-4 ds:rounded-lg ds:border ds:border-border ds:p-6 ds:shadow-lg ds:duration-200 ds:sm:max-w-lg",{"ds:data-[state=open]:animate-in":!e},t),...d})]})}function x({className:t,...e}){return a.jsx("div",{"data-slot":"alert-dialog-header",className:o.cn("ds:flex ds:flex-col ds:gap-2 ds:text-center ds:sm:text-left",t),...e})}function D({className:t,...e}){return a.jsx("div",{"data-slot":"alert-dialog-footer",className:o.cn("ds:flex ds:flex-col-reverse ds:gap-2 ds:sm:flex-row ds:sm:justify-end",t),...e})}function p({className:t,...e}){return a.jsx(s.Title,{"data-slot":"alert-dialog-title",className:o.cn("ds:text-lg ds:font-semibold",t),...e})}function A({className:t,...e}){return a.jsx(s.Description,{"data-slot":"alert-dialog-description",className:o.cn("ds:text-muted-foreground ds:text-sm",t),...e})}exports.AlertDialog=u;exports.AlertDialogContent=m;exports.AlertDialogDescription=A;exports.AlertDialogFooter=D;exports.AlertDialogHeader=x;exports.AlertDialogOverlay=n;exports.AlertDialogPortal=i;exports.AlertDialogTitle=p;exports.AlertDialogTrigger=f;
|
|
2
2
|
//# sourceMappingURL=alert-dialog.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alert-dialog.cjs","sources":["../../../../../../../../packages/ui/src/components/alert-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport * as AlertDialogPrimitive from \"@radix-ui/react-alert-dialog\";\n\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport { buttonVariants } from \"@dsui/ui/components/button\";\n\nfunction AlertDialog({\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Root>) {\n return <AlertDialogPrimitive.Root data-slot=\"alert-dialog\" {...props} />;\n}\n\nfunction AlertDialogTrigger({\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Trigger>) {\n return (\n <AlertDialogPrimitive.Trigger data-slot=\"alert-dialog-trigger\" {...props} />\n );\n}\n\nfunction AlertDialogPortal({\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Portal>) {\n return (\n <AlertDialogPrimitive.Portal data-slot=\"alert-dialog-portal\" {...props} />\n );\n}\n\nfunction AlertDialogOverlay({\n className,\n backdropFilter,\n overlay = \"dark\",\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Overlay> & {\n backdropFilter?: number;\n overlay?: \"dark\" | \"light\";\n}) {\n const overlayClass = overlay === \"dark\" ? \"bg-black/50\" : \"bg-white/50\";\n return (\n <AlertDialogPrimitive.Overlay\n data-slot=\"alert-dialog-overlay\"\n className={cn(\n \"ds:data-[state=open]:animate-in ds:data-[state=closed]:animate-out ds:data-[state=closed]:fade-out-0 ds:data-[state=open]:fade-in-0 ds:fixed ds:inset-0 ds:z-50\",\n overlayClass,\n className\n )}\n style={\n backdropFilter\n ? { backdropFilter: `blur(${backdropFilter}px)` }\n : undefined\n }\n {...props}\n />\n );\n}\n\nfunction AlertDialogContent({\n className,\n noDefaultAnimation,\n backdropFilter,\n overlay,\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Content> & {\n noDefaultAnimation?: boolean;\n backdropFilter?: number;\n overlay?: \"dark\" | \"light\";\n}) {\n return (\n <AlertDialogPortal>\n <AlertDialogOverlay backdropFilter={backdropFilter} overlay={overlay} />\n <AlertDialogPrimitive.Content\n data-slot=\"alert-dialog-content\"\n className={cn(\n \"ds:bg-background ds:data-[state=closed]:animate-out ds:data-[state=closed]:fade-out-0 ds:data-[state=open]:fade-in-0 ds:data-[state=closed]:zoom-out-95 ds:data-[state=open]:zoom-in-95 ds:fixed ds:top-[50%] ds:left-[50%] ds:z-50 ds:grid ds:w-full ds:max-w-[calc(100%-2rem)] ds:translate-x-[-50%] ds:translate-y-[-50%] ds:gap-4 ds:rounded-lg ds:border ds:p-6 ds:shadow-lg ds:duration-200 ds:sm:max-w-lg\",\n {\n \"ds:data-[state=open]:animate-in\": !noDefaultAnimation,\n },\n className\n )}\n {...props}\n />\n </AlertDialogPortal>\n );\n}\n\nfunction AlertDialogHeader({\n className,\n ...props\n}: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"alert-dialog-header\"\n className={cn(\"ds:flex ds:flex-col ds:gap-2 ds:text-center ds:sm:text-left\", className)}\n {...props}\n />\n );\n}\n\nfunction AlertDialogFooter({\n className,\n ...props\n}: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"alert-dialog-footer\"\n className={cn(\n \"ds:flex ds:flex-col-reverse ds:gap-2 ds:sm:flex-row ds:sm:justify-end\",\n className\n )}\n {...props}\n />\n );\n}\n\nfunction AlertDialogTitle({\n className,\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Title>) {\n return (\n <AlertDialogPrimitive.Title\n data-slot=\"alert-dialog-title\"\n className={cn(\"ds:text-lg ds:font-semibold\", className)}\n {...props}\n />\n );\n}\n\nfunction AlertDialogDescription({\n className,\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Description>) {\n return (\n <AlertDialogPrimitive.Description\n data-slot=\"alert-dialog-description\"\n className={cn(\"ds:text-muted-foreground ds:text-sm\", className)}\n {...props}\n />\n );\n}\n\nfunction AlertDialogAction({\n className,\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Action>) {\n return (\n <AlertDialogPrimitive.Action\n className={cn(buttonVariants(), className)}\n {...props}\n />\n );\n}\n\nfunction AlertDialogCancel({\n className,\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Cancel>) {\n return (\n <AlertDialogPrimitive.Cancel\n className={cn(buttonVariants({ variant: \"outline\" }), className)}\n {...props}\n />\n );\n}\n\nexport {\n AlertDialog,\n AlertDialogPortal,\n AlertDialogOverlay,\n AlertDialogTrigger,\n AlertDialogContent,\n AlertDialogHeader,\n AlertDialogFooter,\n AlertDialogTitle,\n AlertDialogDescription,\n AlertDialogAction,\n AlertDialogCancel,\n};\n"],"names":["AlertDialog","props","AlertDialogPrimitive","AlertDialogTrigger","AlertDialogPortal","AlertDialogOverlay","className","backdropFilter","overlay","overlayClass","jsx","cn","AlertDialogContent","noDefaultAnimation","AlertDialogHeader","AlertDialogFooter","AlertDialogTitle","AlertDialogDescription"],"mappings":"+eAQA,SAASA,EAAY,CACnB,GAAGC,CACL,EAA2D,CACzD,aAAQC,EAAqB,KAArB,CAA0B,YAAU,eAAgB,GAAGD,EAAO,CACxE,CAEA,SAASE,EAAmB,CAC1B,GAAGF,CACL,EAA8D,CAC5D,aACGC,EAAqB,QAArB,CAA6B,YAAU,uBAAwB,GAAGD,EAAO,CAE9E,CAEA,SAASG,EAAkB,CACzB,GAAGH,CACL,EAA6D,CAC3D,aACGC,EAAqB,OAArB,CAA4B,YAAU,sBAAuB,GAAGD,EAAO,CAE5E,CAEA,SAASI,EAAmB,CAC1B,UAAAC,EACA,eAAAC,EACA,QAAAC,EAAU,OACV,GAAGP,CACL,EAGG,CACD,MAAMQ,EAAeD,IAAY,OAAS,cAAgB,cAC1D,OACEE,EAAAA,IAACR,EAAqB,QAArB,CACC,YAAU,uBACV,UAAWS,EAAAA,GACT,kKACAF,EACAH,CAAA,EAEF,MACEC,EACI,CAAE,eAAgB,QAAQA,CAAc,OACxC,OAEL,GAAGN,CAAA,CAAA,CAGV,CAEA,SAASW,EAAmB,CAC1B,UAAAN,EACA,mBAAAO,EACA,eAAAN,EACA,QAAAC,EACA,GAAGP,CACL,EAIG,CACD,cACGG,EAAA,CACC,SAAA,CAAAM,EAAAA,IAACL,EAAA,CAAmB,eAAAE,EAAgC,QAAAC,CAAA,CAAkB,EACtEE,EAAAA,IAACR,EAAqB,QAArB,CACC,YAAU,uBACV,UAAWS,EAAAA,GACT,
|
|
1
|
+
{"version":3,"file":"alert-dialog.cjs","sources":["../../../../../../../../packages/ui/src/components/alert-dialog.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport * as AlertDialogPrimitive from \"@radix-ui/react-alert-dialog\";\n\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport { buttonVariants } from \"@dsui/ui/components/button\";\n\nfunction AlertDialog({\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Root>) {\n return <AlertDialogPrimitive.Root data-slot=\"alert-dialog\" {...props} />;\n}\n\nfunction AlertDialogTrigger({\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Trigger>) {\n return (\n <AlertDialogPrimitive.Trigger data-slot=\"alert-dialog-trigger\" {...props} />\n );\n}\n\nfunction AlertDialogPortal({\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Portal>) {\n return (\n <AlertDialogPrimitive.Portal data-slot=\"alert-dialog-portal\" {...props} />\n );\n}\n\nfunction AlertDialogOverlay({\n className,\n backdropFilter,\n overlay = \"dark\",\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Overlay> & {\n backdropFilter?: number;\n overlay?: \"dark\" | \"light\";\n}) {\n const overlayClass = overlay === \"dark\" ? \"bg-black/50\" : \"bg-white/50\";\n return (\n <AlertDialogPrimitive.Overlay\n data-slot=\"alert-dialog-overlay\"\n className={cn(\n \"ds:data-[state=open]:animate-in ds:data-[state=closed]:animate-out ds:data-[state=closed]:fade-out-0 ds:data-[state=open]:fade-in-0 ds:fixed ds:inset-0 ds:z-50\",\n overlayClass,\n className\n )}\n style={\n backdropFilter\n ? { backdropFilter: `blur(${backdropFilter}px)` }\n : undefined\n }\n {...props}\n />\n );\n}\n\nfunction AlertDialogContent({\n className,\n noDefaultAnimation,\n backdropFilter,\n overlay,\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Content> & {\n noDefaultAnimation?: boolean;\n backdropFilter?: number;\n overlay?: \"dark\" | \"light\";\n}) {\n return (\n <AlertDialogPortal>\n <AlertDialogOverlay backdropFilter={backdropFilter} overlay={overlay} />\n <AlertDialogPrimitive.Content\n data-slot=\"alert-dialog-content\"\n className={cn(\n \"ds:bg-background ds:data-[state=closed]:animate-out ds:data-[state=closed]:fade-out-0 ds:data-[state=open]:fade-in-0 ds:data-[state=closed]:zoom-out-95 ds:data-[state=open]:zoom-in-95 ds:fixed ds:top-[50%] ds:left-[50%] ds:z-50 ds:grid ds:w-full ds:max-w-[calc(100%-2rem)] ds:translate-x-[-50%] ds:translate-y-[-50%] ds:gap-4 ds:rounded-lg ds:border ds:border-border ds:p-6 ds:shadow-lg ds:duration-200 ds:sm:max-w-lg\",\n {\n \"ds:data-[state=open]:animate-in\": !noDefaultAnimation,\n },\n className\n )}\n {...props}\n />\n </AlertDialogPortal>\n );\n}\n\nfunction AlertDialogHeader({\n className,\n ...props\n}: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"alert-dialog-header\"\n className={cn(\"ds:flex ds:flex-col ds:gap-2 ds:text-center ds:sm:text-left\", className)}\n {...props}\n />\n );\n}\n\nfunction AlertDialogFooter({\n className,\n ...props\n}: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"alert-dialog-footer\"\n className={cn(\n \"ds:flex ds:flex-col-reverse ds:gap-2 ds:sm:flex-row ds:sm:justify-end\",\n className\n )}\n {...props}\n />\n );\n}\n\nfunction AlertDialogTitle({\n className,\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Title>) {\n return (\n <AlertDialogPrimitive.Title\n data-slot=\"alert-dialog-title\"\n className={cn(\"ds:text-lg ds:font-semibold\", className)}\n {...props}\n />\n );\n}\n\nfunction AlertDialogDescription({\n className,\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Description>) {\n return (\n <AlertDialogPrimitive.Description\n data-slot=\"alert-dialog-description\"\n className={cn(\"ds:text-muted-foreground ds:text-sm\", className)}\n {...props}\n />\n );\n}\n\nfunction AlertDialogAction({\n className,\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Action>) {\n return (\n <AlertDialogPrimitive.Action\n className={cn(buttonVariants(), className)}\n {...props}\n />\n );\n}\n\nfunction AlertDialogCancel({\n className,\n ...props\n}: React.ComponentProps<typeof AlertDialogPrimitive.Cancel>) {\n return (\n <AlertDialogPrimitive.Cancel\n className={cn(buttonVariants({ variant: \"outline\" }), className)}\n {...props}\n />\n );\n}\n\nexport {\n AlertDialog,\n AlertDialogPortal,\n AlertDialogOverlay,\n AlertDialogTrigger,\n AlertDialogContent,\n AlertDialogHeader,\n AlertDialogFooter,\n AlertDialogTitle,\n AlertDialogDescription,\n AlertDialogAction,\n AlertDialogCancel,\n};\n"],"names":["AlertDialog","props","AlertDialogPrimitive","AlertDialogTrigger","AlertDialogPortal","AlertDialogOverlay","className","backdropFilter","overlay","overlayClass","jsx","cn","AlertDialogContent","noDefaultAnimation","AlertDialogHeader","AlertDialogFooter","AlertDialogTitle","AlertDialogDescription"],"mappings":"+eAQA,SAASA,EAAY,CACnB,GAAGC,CACL,EAA2D,CACzD,aAAQC,EAAqB,KAArB,CAA0B,YAAU,eAAgB,GAAGD,EAAO,CACxE,CAEA,SAASE,EAAmB,CAC1B,GAAGF,CACL,EAA8D,CAC5D,aACGC,EAAqB,QAArB,CAA6B,YAAU,uBAAwB,GAAGD,EAAO,CAE9E,CAEA,SAASG,EAAkB,CACzB,GAAGH,CACL,EAA6D,CAC3D,aACGC,EAAqB,OAArB,CAA4B,YAAU,sBAAuB,GAAGD,EAAO,CAE5E,CAEA,SAASI,EAAmB,CAC1B,UAAAC,EACA,eAAAC,EACA,QAAAC,EAAU,OACV,GAAGP,CACL,EAGG,CACD,MAAMQ,EAAeD,IAAY,OAAS,cAAgB,cAC1D,OACEE,EAAAA,IAACR,EAAqB,QAArB,CACC,YAAU,uBACV,UAAWS,EAAAA,GACT,kKACAF,EACAH,CAAA,EAEF,MACEC,EACI,CAAE,eAAgB,QAAQA,CAAc,OACxC,OAEL,GAAGN,CAAA,CAAA,CAGV,CAEA,SAASW,EAAmB,CAC1B,UAAAN,EACA,mBAAAO,EACA,eAAAN,EACA,QAAAC,EACA,GAAGP,CACL,EAIG,CACD,cACGG,EAAA,CACC,SAAA,CAAAM,EAAAA,IAACL,EAAA,CAAmB,eAAAE,EAAgC,QAAAC,CAAA,CAAkB,EACtEE,EAAAA,IAACR,EAAqB,QAArB,CACC,YAAU,uBACV,UAAWS,EAAAA,GACT,oaACA,CACE,kCAAmC,CAACE,CAAA,EAEtCP,CAAA,EAED,GAAGL,CAAA,CAAA,CACN,EACF,CAEJ,CAEA,SAASa,EAAkB,CACzB,UAAAR,EACA,GAAGL,CACL,EAAgC,CAC9B,OACES,EAAAA,IAAC,MAAA,CACC,YAAU,sBACV,UAAWC,EAAAA,GAAG,8DAA+DL,CAAS,EACrF,GAAGL,CAAA,CAAA,CAGV,CAEA,SAASc,EAAkB,CACzB,UAAAT,EACA,GAAGL,CACL,EAAgC,CAC9B,OACES,EAAAA,IAAC,MAAA,CACC,YAAU,sBACV,UAAWC,EAAAA,GACT,wEACAL,CAAA,EAED,GAAGL,CAAA,CAAA,CAGV,CAEA,SAASe,EAAiB,CACxB,UAAAV,EACA,GAAGL,CACL,EAA4D,CAC1D,OACES,EAAAA,IAACR,EAAqB,MAArB,CACC,YAAU,qBACV,UAAWS,EAAAA,GAAG,8BAA+BL,CAAS,EACrD,GAAGL,CAAA,CAAA,CAGV,CAEA,SAASgB,EAAuB,CAC9B,UAAAX,EACA,GAAGL,CACL,EAAkE,CAChE,OACES,EAAAA,IAACR,EAAqB,YAArB,CACC,YAAU,2BACV,UAAWS,EAAAA,GAAG,sCAAuCL,CAAS,EAC7D,GAAGL,CAAA,CAAA,CAGV"}
|