lizaui 8.2.9 → 8.4.9
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/button/index.cjs.js +1 -1
- package/dist/button/index.es.js +1 -1
- package/dist/calendar/index.cjs.js +2 -2
- package/dist/calendar/index.cjs.js.map +1 -1
- package/dist/calendar/index.es.js +9 -9
- package/dist/checkbox/index.cjs.js +1 -1
- package/dist/checkbox/index.es.js +1 -1
- package/dist/chip/index.cjs.js +1 -1
- package/dist/chip/index.cjs.js.map +1 -1
- package/dist/chip/index.es.js +2 -2
- package/dist/chunks/bundle-mjs-2oQ8XDAz.js +2748 -0
- package/dist/chunks/bundle-mjs-2oQ8XDAz.js.map +1 -0
- package/dist/chunks/bundle-mjs-8z5d_e-8.js +2 -0
- package/dist/chunks/bundle-mjs-8z5d_e-8.js.map +1 -0
- package/dist/chunks/button-DFrxQHAW.js +2 -0
- package/dist/chunks/{button-OdZ6El_t.js.map → button-DFrxQHAW.js.map} +1 -1
- package/dist/chunks/{button-CSuKvE1x.js → button-uo4_Xad_.js} +4 -4
- package/dist/chunks/{button-CSuKvE1x.js.map → button-uo4_Xad_.js.map} +1 -1
- package/dist/chunks/{checkbox-BhW9i0pm.js → checkbox-BvvZL9H4.js} +3 -3
- package/dist/chunks/{checkbox-BhW9i0pm.js.map → checkbox-BvvZL9H4.js.map} +1 -1
- package/dist/chunks/checkbox-w969v4lK.js +2 -0
- package/dist/chunks/{checkbox-CWDPVAn2.js.map → checkbox-w969v4lK.js.map} +1 -1
- package/dist/chunks/clsx-C11secjj.js +2 -0
- package/dist/chunks/clsx-C11secjj.js.map +1 -0
- package/dist/chunks/clsx-OuTLNxxd.js +17 -0
- package/dist/chunks/clsx-OuTLNxxd.js.map +1 -0
- package/dist/chunks/features-animation-BRAvwYFN.js +3437 -0
- package/dist/chunks/features-animation-BRAvwYFN.js.map +1 -0
- package/dist/chunks/features-animation-BoXKk5t2.js +2 -0
- package/dist/chunks/features-animation-BoXKk5t2.js.map +1 -0
- package/dist/chunks/index-BbDfYVLO.js +174 -0
- package/dist/chunks/index-BbDfYVLO.js.map +1 -0
- package/dist/chunks/index-CL73JQgs.js +2 -0
- package/dist/chunks/index-CL73JQgs.js.map +1 -0
- package/dist/chunks/{index-BOQuZ0gG.js → index-D29mdTf5.js} +2 -2
- package/dist/chunks/{index-BOQuZ0gG.js.map → index-D29mdTf5.js.map} +1 -1
- package/dist/chunks/index-DC9BfnBH.js +208 -0
- package/dist/chunks/index-DC9BfnBH.js.map +1 -0
- package/dist/chunks/index-lrI_r1ww.js +10 -0
- package/dist/chunks/index-lrI_r1ww.js.map +1 -0
- package/dist/chunks/index-nwdlcB7h.js +2 -0
- package/dist/chunks/{index-BxK4T-v8.js.map → index-nwdlcB7h.js.map} +1 -1
- package/dist/chunks/label-error-B8Rq-HGY.js +2 -0
- package/dist/chunks/{label-error-Ax74Uy3M.js.map → label-error-B8Rq-HGY.js.map} +1 -1
- package/dist/chunks/label-error-BOE4Qj5S.js +10 -0
- package/dist/chunks/{label-error-DGQqDKTV.js.map → label-error-BOE4Qj5S.js.map} +1 -1
- package/dist/chunks/proxy-BwQyOw8U.js +2 -0
- package/dist/chunks/proxy-BwQyOw8U.js.map +1 -0
- package/dist/chunks/proxy-kv_Ue2k_.js +1346 -0
- package/dist/chunks/proxy-kv_Ue2k_.js.map +1 -0
- package/dist/chunks/ripple-CzU7YM2G.js +69 -0
- package/dist/chunks/{ripple-DMI95LHg.js.map → ripple-CzU7YM2G.js.map} +1 -1
- package/dist/chunks/ripple-SBteSEo3.js +2 -0
- package/dist/chunks/{ripple-DieNd7XQ.js.map → ripple-SBteSEo3.js.map} +1 -1
- package/dist/chunks/{scroll-area-C8l3z7wv.js → scroll-area-B0mWCpSW.js} +2 -2
- package/dist/chunks/{scroll-area-C8l3z7wv.js.map → scroll-area-B0mWCpSW.js.map} +1 -1
- package/dist/chunks/{scroll-area-zt_z9PRo.js → scroll-area-CE7quLQL.js} +3 -3
- package/dist/chunks/{scroll-area-zt_z9PRo.js.map → scroll-area-CE7quLQL.js.map} +1 -1
- package/dist/chunks/{select-qaP_vaF3.js → select-BwMqXSzv.js} +3 -3
- package/dist/chunks/{select-qaP_vaF3.js.map → select-BwMqXSzv.js.map} +1 -1
- package/dist/chunks/{select-CC7ump6t.js → select-DGSPwoy8.js} +2 -2
- package/dist/chunks/{select-CC7ump6t.js.map → select-DGSPwoy8.js.map} +1 -1
- package/dist/chunks/{textarea-BIy5pTb5.js → textarea-BYbersWf.js} +38 -37
- package/dist/chunks/{textarea-BIy5pTb5.js.map → textarea-BYbersWf.js.map} +1 -1
- package/dist/chunks/{textarea-Cklud2kp.js → textarea-D9X4fUkV.js} +12 -12
- package/dist/chunks/{textarea-Cklud2kp.js.map → textarea-D9X4fUkV.js.map} +1 -1
- package/dist/chunks/tooltip-BPp8Maa7.js +2 -0
- package/dist/chunks/{tooltip-DGFz59KW.js.map → tooltip-BPp8Maa7.js.map} +1 -1
- package/dist/chunks/{tooltip-B-5G3VVC.js → tooltip-Bf9DqrJk.js} +3 -3
- package/dist/chunks/{tooltip-B-5G3VVC.js.map → tooltip-Bf9DqrJk.js.map} +1 -1
- package/dist/chunks/tv-CGkrzbji.js +2 -0
- package/dist/chunks/tv-CGkrzbji.js.map +1 -0
- package/dist/chunks/tv-DQO4decF.js +268 -0
- package/dist/chunks/tv-DQO4decF.js.map +1 -0
- package/dist/chunks/utils-CvyT6Z0O.js +9 -0
- package/dist/chunks/{utils-B6yFEsav.js.map → utils-CvyT6Z0O.js.map} +1 -1
- package/dist/chunks/utils-CxdrMFeI.js +2 -0
- package/dist/chunks/{utils-IjLH3w2e.js.map → utils-CxdrMFeI.js.map} +1 -1
- package/dist/chunks/v4-BysszJq8.js +31 -0
- package/dist/chunks/v4-BysszJq8.js.map +1 -0
- package/dist/chunks/v4-CqdK_b8Y.js +2 -0
- package/dist/chunks/v4-CqdK_b8Y.js.map +1 -0
- package/dist/divider/index.cjs.js +1 -1
- package/dist/divider/index.es.js +1 -1
- package/dist/modal/index.cjs.js +1 -1
- package/dist/modal/index.cjs.js.map +1 -1
- package/dist/modal/index.es.js +17 -16
- package/dist/modal/index.es.js.map +1 -1
- package/dist/pagination/index.cjs.js +1 -1
- package/dist/pagination/index.cjs.js.map +1 -1
- package/dist/pagination/index.es.js +18 -18
- package/dist/phone-input/index.cjs.js +1 -1
- package/dist/phone-input/index.cjs.js.map +1 -1
- package/dist/phone-input/index.es.js +35 -35
- package/dist/ripple/index.cjs.js +1 -1
- package/dist/ripple/index.es.js +1 -1
- package/dist/select-input/index.cjs.js +2 -2
- package/dist/select-input/index.cjs.js.map +1 -1
- package/dist/select-input/index.es.js +5 -5
- package/dist/table/index.cjs.js +1 -1
- package/dist/table/index.cjs.js.map +1 -1
- package/dist/table/index.es.js +17 -17
- package/dist/table/index.es.js.map +1 -1
- package/dist/time-input/index.cjs.js +2 -2
- package/dist/time-input/index.cjs.js.map +1 -1
- package/dist/time-input/index.es.js +5 -5
- package/dist/tooltip/index.cjs.js +1 -1
- package/dist/tooltip/index.es.js +1 -1
- package/dist/ui/index.cjs.js +1 -1
- package/dist/ui/index.es.js +10 -10
- package/package.json +1 -1
- package/dist/chunks/button-OdZ6El_t.js +0 -2
- package/dist/chunks/checkbox-CWDPVAn2.js +0 -2
- package/dist/chunks/index-BxK4T-v8.js +0 -2
- package/dist/chunks/label-error-Ax74Uy3M.js +0 -2
- package/dist/chunks/label-error-DGQqDKTV.js +0 -10
- package/dist/chunks/ripple-DMI95LHg.js +0 -68
- package/dist/chunks/ripple-DieNd7XQ.js +0 -2
- package/dist/chunks/tooltip-DGFz59KW.js +0 -2
- package/dist/chunks/tv-3Bk5oRI_.js +0 -39
- package/dist/chunks/tv-3Bk5oRI_.js.map +0 -1
- package/dist/chunks/tv-CLzaSzqw.js +0 -2
- package/dist/chunks/tv-CLzaSzqw.js.map +0 -1
- package/dist/chunks/utils-B6yFEsav.js +0 -9
- package/dist/chunks/utils-IjLH3w2e.js +0 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs.js","sources":["../../src/components/transition/transition-utils.ts","../../src/components/modal/modal.tsx"],"sourcesContent":["import type { Target, TargetAndTransition, Transition } from \"framer-motion\";\n\ntype WithMotionState<P> = Partial<Record<\"enter\" | \"exit\", P>>;\n\nexport type TransitionConfig = WithMotionState<Transition>;\n\nexport type TransitionEndConfig = WithMotionState<Target>;\n\nexport type TransitionProperties = {\n\t/**\n\t * Custom `transition` definition for `enter` and `exit`\n\t */\n\ttransition?: TransitionConfig;\n\t/**\n\t * Custom `transitionEnd` definition for `enter` and `exit`\n\t */\n\ttransitionEnd?: TransitionEndConfig;\n};\n\ntype TargetResolver<P = {}> = (props: P & TransitionProperties) => TargetAndTransition;\n\ntype Variant<P = {}> = TargetAndTransition | TargetResolver<P>;\n\nexport type Variants<P = {}> = Record<\n\tstring,\n\t{\n\t\tenter: Variant<P>;\n\t\texit: Variant<P>;\n\t\tinitial?: Variant<P>;\n\t}\n>;\n\nexport const TRANSITION_EASINGS = {\n\tease: [0.36, 0.66, 0.4, 1],\n\teaseIn: [0.4, 0, 1, 1],\n\teaseOut: [0, 0, 0.2, 1],\n\teaseInOut: [0.4, 0, 0.2, 1],\n\tspring: [0.155, 1.105, 0.295, 1.12],\n\tspringOut: [0.57, -0.15, 0.62, 0.07],\n\tsoftSpring: [0.16, 1.11, 0.3, 1.02],\n} as const;\n\nexport const TRANSITION_DEFAULTS = {\n\tenter: {\n\t\tduration: 0.2,\n\t\tease: TRANSITION_EASINGS.easeOut,\n\t},\n\texit: {\n\t\tduration: 0.1,\n\t\tease: TRANSITION_EASINGS.easeIn,\n\t},\n} as const;\n\nexport const TRANSITION_VARIANTS: Variants = {\n\tscaleSpring: {\n\t\tenter: {\n\t\t\ttransform: \"scale(1)\",\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\ttype: \"spring\",\n\t\t\t\tbounce: 0,\n\t\t\t\tduration: 0.2,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\ttransform: \"scale(0.85)\",\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\ttype: \"easeOut\" as any,\n\t\t\t\tduration: 0.15,\n\t\t\t},\n\t\t},\n\t},\n\tscaleSpringOpacity: {\n\t\tinitial: {\n\t\t\topacity: 0,\n\t\t\ttransform: \"scale(0.8)\",\n\t\t},\n\t\tenter: {\n\t\t\topacity: 1,\n\t\t\ttransform: \"scale(1)\",\n\t\t\ttransition: {\n\t\t\t\ttype: \"spring\",\n\t\t\t\tbounce: 0,\n\t\t\t\tduration: 0.3,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\topacity: 0,\n\t\t\ttransform: \"scale(0.96)\",\n\t\t\ttransition: {\n\t\t\t\ttype: \"easeOut\" as any,\n\t\t\t\tbounce: 0,\n\t\t\t\tduration: 0.15,\n\t\t\t},\n\t\t},\n\t},\n\tscale: {\n\t\tenter: { scale: 1 },\n\t\texit: { scale: 0.95 },\n\t},\n\tscaleFadeIn: {\n\t\tenter: {\n\t\t\ttransform: \"scale(1)\",\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.25,\n\t\t\t\tease: TRANSITION_EASINGS.easeIn,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\ttransform: \"scale(0.95)\",\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.2,\n\t\t\t\tease: TRANSITION_EASINGS.easeOut,\n\t\t\t},\n\t\t},\n\t},\n\tscaleInOut: {\n\t\tenter: {\n\t\t\ttransform: \"scale(1)\",\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.4,\n\t\t\t\tease: TRANSITION_EASINGS.ease,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\ttransform: \"scale(1.03)\",\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.3,\n\t\t\t\tease: TRANSITION_EASINGS.ease,\n\t\t\t},\n\t\t},\n\t},\n\tfade: {\n\t\tenter: {\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.4,\n\t\t\t\tease: TRANSITION_EASINGS.ease,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.3,\n\t\t\t\tease: TRANSITION_EASINGS.ease,\n\t\t\t},\n\t\t},\n\t},\n\tcollapse: {\n\t\tenter: {\n\t\t\topacity: 1,\n\t\t\theight: \"auto\",\n\t\t\ttransition: {\n\t\t\t\theight: {\n\t\t\t\t\ttype: \"spring\",\n\t\t\t\t\tbounce: 0,\n\t\t\t\t\tduration: 0.3,\n\t\t\t\t},\n\t\t\t\topacity: {\n\t\t\t\t\tease: \"ease\" as any,\n\t\t\t\t\tduration: 0.4,\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\topacity: 0,\n\t\t\theight: 0,\n\t\t\ttransition: {\n\t\t\t\tease: \"ease\" as any,\n\t\t\t\tduration: 0.3,\n\t\t\t},\n\t\t},\n\t},\n};\n","\"use client\";\n\nimport ReactDOM from \"react-dom\";\nimport { forwardRef, type Ref, useEffect, useRef } from \"react\";\nimport type { ModalBodyType, ModalFooterType, ModalHeaderType, ModalType } from \"./modal.type\";\nimport { cn } from \"@/lib/utils\";\nimport { Button } from \"../button\";\nimport { AnimatePresence } from \"framer-motion\";\nimport { LazyMotion, m } from \"framer-motion\";\nimport { TRANSITION_VARIANTS } from \"../transition/transition-utils\";\nimport { cva } from \"class-variance-authority\";\n\nconst backdropVariants = cva(\"\", {\n\tvariants: {\n\t\tbackdrop: {\n\t\t\ttransparent: \"bg-transparent\",\n\t\t\topaque: \"bg-black/50\",\n\t\t\tblur: \"backdrop-blur-md backdrop-saturate-150 bg-overlay/30\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tbackdrop: \"opaque\",\n\t},\n});\n\nconst sizeVariants = cva(\"\", {\n\tvariants: {\n\t\tsize: {\n\t\t\t\"xs\": \"max-w-xs\",\n\t\t\t\"sm\": \"max-w-sm\",\n\t\t\t\"md\": \"max-w-md\",\n\t\t\t\"lg\": \"max-w-lg\",\n\t\t\t\"xl\": \"max-w-xl\",\n\t\t\t\"2xl\": \"max-w-2xl\",\n\t\t\t\"3xl\": \"max-w-3xl\",\n\t\t\t\"4xl\": \"max-w-4xl\",\n\t\t\t\"5xl\": \"max-w-5xl\",\n\t\t\t\"full\": \"my-0 mx-0 sm:mx-0 sm:my-0 max-w-full h-[100dvh] min-h-[100dvh] !rounded-none\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tsize: \"md\",\n\t},\n});\n\nconst radiusVariants = cva(\"\", {\n\tvariants: {\n\t\tradius: {\n\t\t\tnone: \"rounded-none\",\n\t\t\tsm: \"rounded-sm\",\n\t\t\tmd: \"rounded-md\",\n\t\t\tlg: \"rounded-lg\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tradius: \"lg\",\n\t},\n});\n\nconst placementVariants = cva(\"\", {\n\tvariants: {\n\t\tplacement: {\n\t\t\tcenter: \"fixed top-[50%] left-[50%] translate-x-[-50%] translate-y-[-50%]\",\n\t\t\ttop: \"fixed top-0 left-[50%] translate-x-[-50%] sm:mt-8\",\n bottom: \"fixed bottom-0 left-[50%] translate-x-[-50%] sm:mb-8\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tplacement: \"center\",\n\t},\n});\n\nconst shadowVariants = cva(\"\", {\n\tvariants: {\n\t\tshadow: {\n\t\t\tnone: \"shadow-none\",\n\t\t\tsm: \"shadow-sm\",\n\t\t\tmd: \"shadow-md\",\n\t\t\tlg: \"shadow-lg\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tshadow: \"md\",\n\t},\n});\n\nexport const Modal = forwardRef(\n\t(\n\t\t{\n\t\t\tmodalId,\n\t\t\tisShow,\n\t\t\tisVisible,\n\t\t\tchildren,\n\t\t\tstyle,\n\t\t\tclassNameOverlay = \"\",\n\t\t\tstyleContainer,\n\t\t\tonClickOutside,\n\t\t\tclassNameDialog = \"modal-custom-dialog\",\n\t\t\tclassNameContent = \"\",\n\t\t\tbackdrop = \"opaque\",\n\t\t\tsize = \"md\",\n\t\t\tisKeyboardDismissDisabled = false,\n\t\t\tshadow = \"md\",\n\t\t\tradius = \"lg\",\n placement = \"center\",\n\t\t}: ModalType,\n\t\tref: Ref<HTMLDivElement>,\n\t) => {\n\t\tconst modalOverlayRef = useRef<HTMLDivElement>(null);\n\t\tuseEffect(() => {\n\t\t\tif (typeof window !== \"undefined\" && isVisible) {\n\t\t\t\tdocument.body.classList.add(\"modal-open\");\n\t\t\t}\n\t\t\treturn () => {\n\t\t\t\tif (typeof window !== \"undefined\") {\n\t\t\t\t\tdocument.body.classList.remove(\"modal-open\");\n\t\t\t\t}\n\t\t\t};\n\t\t}, [isVisible]);\n\n\t\tuseEffect(() => {\n\t\t\tconst handleKeyDown = (e: KeyboardEvent) => {\n\t\t\t\tif (e.key === \"Escape\" && !isKeyboardDismissDisabled) {\n\t\t\t\t\tonClickOutside?.();\n\t\t\t\t}\n\t\t\t};\n\n\t\t\tif (isShow) {\n\t\t\t\tdocument.addEventListener(\"keydown\", handleKeyDown);\n\t\t\t}\n\n\t\t\treturn () => {\n\t\t\t\tdocument.removeEventListener(\"keydown\", handleKeyDown);\n\t\t\t};\n\t\t}, [isShow, isKeyboardDismissDisabled, onClickOutside]);\n\n\t\tif (typeof window === \"undefined\") return null;\n\n\t\tconst modalRoot = document.getElementById(\"modal-root\");\n\t\tif (!modalRoot) return null;\n\n\t\treturn ReactDOM.createPortal(\n\t\t\t<AnimatePresence>\n\t\t\t\t{isShow && (\n\t\t\t\t\t<LazyMotion features={() => import(\"framer-motion\").then((res) => res.domAnimation)}>\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<m.div\n\t\t\t\t\t\t\t\tkey=\"modal-overlay\"\n\t\t\t\t\t\t\t\tinitial=\"exit\"\n\t\t\t\t\t\t\t\tanimate=\"enter\"\n\t\t\t\t\t\t\t\texit=\"exit\"\n\t\t\t\t\t\t\t\tvariants={TRANSITION_VARIANTS.fade}\n\t\t\t\t\t\t\t\tclassName={cn(\"fixed inset-0 z-50\", backdropVariants({ backdrop }), classNameOverlay)}\n\t\t\t\t\t\t\t\tonClick={onClickOutside}\n\t\t\t\t\t\t\t\taria-hidden={!isShow}\n\t\t\t\t\t\t\t\trole=\"dialog\"\n\t\t\t\t\t\t\t\taria-modal=\"true\"\n\t\t\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\t\t\tref={modalOverlayRef}\n\t\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t\t<m.div\n\t\t\t\t\t\t\t\tkey=\"modal-content\"\n\t\t\t\t\t\t\t\tinitial=\"exit\"\n\t\t\t\t\t\t\t\tanimate=\"enter\"\n\t\t\t\t\t\t\t\texit=\"exit\"\n\t\t\t\t\t\t\t\tvariants={TRANSITION_VARIANTS.scaleInOut}\n\t\t\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\t\t\tid={modalId}\n\t\t\t\t\t\t\t\tonClick={(e) => e.stopPropagation()}\n\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\" z-50 w-full rounded-lg shadow-lg bg-content1\",\n placementVariants({ placement }),\n\t\t\t\t\t\t\t\t\tsizeVariants({ size }),\n\t\t\t\t\t\t\t\t\tradiusVariants({ radius }),\n\t\t\t\t\t\t\t\t\tshadowVariants({ shadow }),\n\t\t\t\t\t\t\t\t\tclassNameDialog,\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\tstyle={style}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<div className={cn(\"modal-custom-content w-full flex flex-col max-h-[calc(100vh_-_4rem)]\", classNameContent)} style={styleContainer}>\n\t\t\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</m.div>\n\t\t\t\t\t\t</>\n\t\t\t\t\t</LazyMotion>\n\t\t\t\t)}\n\t\t\t</AnimatePresence>,\n\t\t\tmodalRoot,\n\t\t);\n\t},\n);\nModal.displayName = \"ModalPortalComponent\";\n\nexport const ModalHeader = ({ title, showCloseButton = true, disabled = false, onClick, className, styled, children, ...props }: ModalHeaderType) => {\n\treturn (\n\t\t<div className={cn(\"modal-custom-header-container w-full\")} style={styled}>\n\t\t\t<div className={cn(\"w-full flex py-4 px-6 flex-initial text-large font-semibold\", className)} {...props}>\n\t\t\t\t{children || <header className=\"modal-custom-title text-lg leading-none font-semibold\">{title}</header>}\n\t\t\t</div>\n\n\t\t\t{showCloseButton && (\n\t\t\t\t<div className=\"absolute top-2.5 right-2.5 disabled:pointer-events-none z-10\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tisIconOnly\n\t\t\t\t\t\tvariant=\"light\"\n\t\t\t\t\t\tradius=\"full\"\n\t\t\t\t\t\taria-label=\"Close\"\n\t\t\t\t\t\tonClick={onClick}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tclassName=\"p-0 w-[36px] h-[36px] min-w-auto bg-default-100 hover:bg-default-200 text-default-500 hover:text-default-600 dark:bg-default-100 dark:hover:bg-default-200 dark:text-default-500 dark:hover:text-default-600 disabled:opacity-50 disabled:pointer-events-none\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<svg width=\"20\" height=\"20\" fill=\"currentColor\" role=\"img\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t<path fill=\"none\" d=\"M0 0h21v21H0z\"></path>\n\t\t\t\t\t\t\t<path d=\"m12.12 10 4.07-4.06a1.5 1.5 0 1 0-2.11-2.12L10 7.88 5.94 3.81a1.5 1.5 0 1 0-2.12 2.12L7.88 10l-4.07 4.06a1.5 1.5 0 0 0 0 2.12 1.51 1.51 0 0 0 2.13 0L10 12.12l4.06 4.07a1.45 1.45 0 0 0 1.06.44 1.5 1.5 0 0 0 1.06-2.56Z\"></path>\n\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t<span className=\"sr-only\">Close</span>\n\t\t\t\t\t</Button>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nexport const ModalBody = forwardRef(({ children, className = \"\", styled, height }: ModalBodyType, ref: Ref<HTMLDivElement>) => {\n\treturn (\n\t\t<div\n\t\t\tclassName={cn(\"modal-custom-body flex flex-1 flex-col gap-3 px-6 overflow-y-auto\", className)}\n\t\t\tref={ref}\n\t\t\tstyle={{ ...styled, height: height ? `${height}px` : \"auto\" }}\n\t\t>\n\t\t\t{children}\n\t\t</div>\n\t);\n});\nModalBody.displayName = \"ModalBodyPortalComponent\";\n\nexport const ModalFooter = ({ children, className, styled }: ModalFooterType) => {\n\treturn (\n\t\t<div\n\t\t\tclassName={cn(\"modal-custom-footer flex flex-col-reverse px-6 py-3 gap-2 sm:flex-row sm:justify-end mt-auto\", className)}\n\t\t\tstyle={styled}\n\t\t>\n\t\t\t{children}\n\t\t</div>\n\t);\n};\n"],"names":["TRANSITION_EASINGS","TRANSITION_VARIANTS","backdropVariants","cva","sizeVariants","radiusVariants","placementVariants","shadowVariants","Modal","forwardRef","modalId","isShow","isVisible","children","style","classNameOverlay","styleContainer","onClickOutside","classNameDialog","classNameContent","backdrop","size","isKeyboardDismissDisabled","shadow","radius","placement","ref","modalOverlayRef","useRef","useEffect","handleKeyDown","e","modalRoot","ReactDOM","AnimatePresence","jsx","LazyMotion","res","jsxs","Fragment","m","cn","ModalHeader","title","showCloseButton","disabled","onClick","className","styled","props","Button","ModalBody","height","ModalFooter"],"mappings":"ixBAgCaA,EAAqB,CACjC,KAAM,CAAC,IAAM,IAAM,GAAK,CAAC,CAO1B,EAaaC,EAAgC,CAkE5C,WAAY,CACX,MAAO,CACN,UAAW,WACX,QAAS,EACT,WAAY,CACX,SAAU,GACV,KAAMD,EAAmB,IAAA,CAC1B,EAED,KAAM,CACL,UAAW,cACX,QAAS,EACT,WAAY,CACX,SAAU,GACV,KAAMA,EAAmB,IAAA,CAC1B,CACD,EAED,KAAM,CACL,MAAO,CACN,QAAS,EACT,WAAY,CACX,SAAU,GACV,KAAMA,EAAmB,IAAA,CAC1B,EAED,KAAM,CACL,QAAS,EACT,WAAY,CACX,SAAU,GACV,KAAMA,EAAmB,IAAA,CAC1B,CACD,CA2BF,ECtKME,EAAmBC,EAAAA,IAAI,GAAI,CAChC,SAAU,CACT,SAAU,CACT,YAAa,iBACb,OAAQ,cACR,KAAM,sDAAA,CACP,EAED,gBAAiB,CAChB,SAAU,QAAA,CAEZ,CAAC,EAEKC,EAAeD,EAAAA,IAAI,GAAI,CAC5B,SAAU,CACT,KAAM,CACL,GAAM,WACN,GAAM,WACN,GAAM,WACN,GAAM,WACN,GAAM,WACN,MAAO,YACP,MAAO,YACP,MAAO,YACP,MAAO,YACP,KAAQ,8EAAA,CACT,EAED,gBAAiB,CAChB,KAAM,IAAA,CAER,CAAC,EAEKE,EAAiBF,EAAAA,IAAI,GAAI,CAC9B,SAAU,CACT,OAAQ,CACP,KAAM,eACN,GAAI,aACJ,GAAI,aACJ,GAAI,YAAA,CACL,EAED,gBAAiB,CAChB,OAAQ,IAAA,CAEV,CAAC,EAEKG,EAAoBH,EAAAA,IAAI,GAAI,CACjC,SAAU,CACT,UAAW,CACV,OAAQ,mEACR,IAAK,oDACI,OAAQ,sDAAA,CAClB,EAED,gBAAiB,CAChB,UAAW,QAAA,CAEb,CAAC,EAEKI,EAAiBJ,EAAAA,IAAI,GAAI,CAC9B,SAAU,CACT,OAAQ,CACP,KAAM,cACN,GAAI,YACJ,GAAI,YACJ,GAAI,WAAA,CACL,EAED,gBAAiB,CAChB,OAAQ,IAAA,CAEV,CAAC,EAEYK,EAAQC,EAAAA,WACpB,CACC,CACC,QAAAC,EACA,OAAAC,EACA,UAAAC,EACA,SAAAC,EACA,MAAAC,EACA,iBAAAC,EAAmB,GACnB,eAAAC,EACA,eAAAC,EACA,gBAAAC,EAAkB,sBAClB,iBAAAC,EAAmB,GACnB,SAAAC,EAAW,SACX,KAAAC,EAAO,KACP,0BAAAC,EAA4B,GAC5B,OAAAC,EAAS,KACT,OAAAC,EAAS,KACA,UAAAC,EAAY,QAAA,EAEtBC,IACI,CACJ,MAAMC,EAAkBC,EAAAA,OAAuB,IAAI,EA4BnD,GA3BAC,EAAAA,UAAU,KACL,OAAO,OAAW,KAAejB,GACpC,SAAS,KAAK,UAAU,IAAI,YAAY,EAElC,IAAM,CACR,OAAO,OAAW,KACrB,SAAS,KAAK,UAAU,OAAO,YAAY,CAE7C,GACE,CAACA,CAAS,CAAC,EAEdiB,EAAAA,UAAU,IAAM,CACf,MAAMC,EAAiBC,GAAqB,CACvCA,EAAE,MAAQ,UAAY,CAACT,GAC1BL,IAAA,CAEF,EAEA,OAAIN,GACH,SAAS,iBAAiB,UAAWmB,CAAa,EAG5C,IAAM,CACZ,SAAS,oBAAoB,UAAWA,CAAa,CACtD,CACD,EAAG,CAACnB,EAAQW,EAA2BL,CAAc,CAAC,EAElD,OAAO,OAAW,IAAa,OAAO,KAE1C,MAAMe,EAAY,SAAS,eAAe,YAAY,EACtD,OAAKA,EAEEC,EAAS,qCACdC,EAAAA,gBAAA,CACC,SAAAvB,GACAwB,EAAAA,kBAAAA,IAACC,EAAAA,WAAA,CAAW,SAAU,IAAM,OAAO,eAAe,EAAE,KAAMC,GAAQA,EAAI,YAAY,EACjF,SAAAC,EAAAA,kBAAAA,KAAAC,6BAAA,CACC,SAAA,CAAAJ,EAAAA,kBAAAA,IAACK,EAAAA,EAAE,IAAF,CAEA,QAAQ,OACR,QAAQ,QACR,KAAK,OACL,SAAUvC,EAAoB,KAC9B,UAAWwC,EAAAA,GAAG,qBAAsBvC,EAAiB,CAAE,SAAAkB,CAAA,CAAU,EAAGL,CAAgB,EACpF,QAASE,EACT,cAAa,CAACN,EACd,KAAK,SACL,aAAW,OACX,SAAU,GACV,IAAKgB,CAAA,EAXD,eAAA,EAcLQ,EAAAA,kBAAAA,IAACK,EAAAA,EAAE,IAAF,CAEA,QAAQ,OACR,QAAQ,QACR,KAAK,OACL,SAAUvC,EAAoB,WAC9B,IAAAyB,EACA,GAAIhB,EACJ,QAAUqB,GAAMA,EAAE,gBAAA,EAClB,UAAWU,EAAAA,GACV,gDAC2BnC,EAAkB,CAAE,UAAAmB,EAAW,EAC1DrB,EAAa,CAAE,KAAAiB,EAAM,EACrBhB,EAAe,CAAE,OAAAmB,EAAQ,EACzBjB,EAAe,CAAE,OAAAgB,EAAQ,EACzBL,CAAA,EAED,MAAAJ,EAEA,SAAAqB,EAAAA,kBAAAA,IAAC,OAAI,UAAWM,EAAAA,GAAG,uEAAwEtB,CAAgB,EAAG,MAAOH,EACnH,SAAAH,CAAA,CACF,CAAA,EApBI,eAAA,CAqBL,CAAA,CACD,EACD,EAEF,EACAmB,CAAA,EAjDsB,IAmDxB,CACD,EACAxB,EAAM,YAAc,uBAEb,MAAMkC,EAAc,CAAC,CAAE,MAAAC,EAAO,gBAAAC,EAAkB,GAAM,SAAAC,EAAW,GAAO,QAAAC,EAAS,UAAAC,EAAW,OAAAC,EAAQ,SAAAnC,EAAU,GAAGoC,8BAErH,MAAA,CAAI,UAAWR,EAAAA,GAAG,sCAAsC,EAAG,MAAOO,EAClE,SAAA,CAAAb,wBAAC,MAAA,CAAI,UAAWM,EAAAA,GAAG,8DAA+DM,CAAS,EAAI,GAAGE,EAChG,SAAApC,GAAYsB,EAAAA,kBAAAA,IAAC,SAAA,CAAO,UAAU,wDAAyD,WAAM,EAC/F,EAECS,GACAT,EAAAA,kBAAAA,IAAC,MAAA,CAAI,UAAU,+DACd,SAAAG,EAAAA,kBAAAA,KAACY,EAAAA,OAAA,CACA,WAAU,GACV,QAAQ,QACR,OAAO,OACP,aAAW,QACX,QAAAJ,EACA,SAAAD,EACA,UAAU,gQAEV,SAAA,CAAAP,EAAAA,kBAAAA,KAAC,MAAA,CAAI,MAAM,KAAK,OAAO,KAAK,KAAK,eAAe,KAAK,MAAM,cAAY,OACtE,SAAA,CAAAH,EAAAA,kBAAAA,IAAC,OAAA,CAAK,KAAK,OAAO,EAAE,gBAAgB,EACpCA,EAAAA,kBAAAA,IAAC,OAAA,CAAK,EAAE,0NAAA,CAA2N,CAAA,EACpO,EACAA,EAAAA,kBAAAA,IAAC,OAAA,CAAK,UAAU,UAAU,SAAA,OAAA,CAAK,CAAA,CAAA,CAAA,CAChC,CACD,CAAA,EAEF,EAIWgB,EAAY1C,EAAAA,WAAW,CAAC,CAAE,SAAAI,EAAU,UAAAkC,EAAY,GAAI,OAAAC,EAAQ,OAAAI,CAAA,EAAyB1B,IAEhGS,EAAAA,kBAAAA,IAAC,MAAA,CACA,UAAWM,EAAAA,GAAG,oEAAqEM,CAAS,EAC5F,IAAArB,EACA,MAAO,CAAE,GAAGsB,EAAQ,OAAQI,EAAS,GAAGA,CAAM,KAAO,MAAA,EAEpD,SAAAvC,CAAA,CAAA,CAGH,EACDsC,EAAU,YAAc,2BAEjB,MAAME,EAAc,CAAC,CAAE,SAAAxC,EAAU,UAAAkC,EAAW,OAAAC,KAEjDb,EAAAA,kBAAAA,IAAC,MAAA,CACA,UAAWM,EAAAA,GAAG,gGAAiGM,CAAS,EACxH,MAAOC,EAEN,SAAAnC,CAAA,CAAA"}
|
|
1
|
+
{"version":3,"file":"index.cjs.js","sources":["../../src/components/transition/transition-utils.ts","../../src/components/modal/modal.tsx"],"sourcesContent":["import type { Target, TargetAndTransition, Transition } from \"framer-motion\";\n\ntype WithMotionState<P> = Partial<Record<\"enter\" | \"exit\", P>>;\n\nexport type TransitionConfig = WithMotionState<Transition>;\n\nexport type TransitionEndConfig = WithMotionState<Target>;\n\nexport type TransitionProperties = {\n\t/**\n\t * Custom `transition` definition for `enter` and `exit`\n\t */\n\ttransition?: TransitionConfig;\n\t/**\n\t * Custom `transitionEnd` definition for `enter` and `exit`\n\t */\n\ttransitionEnd?: TransitionEndConfig;\n};\n\ntype TargetResolver<P = {}> = (props: P & TransitionProperties) => TargetAndTransition;\n\ntype Variant<P = {}> = TargetAndTransition | TargetResolver<P>;\n\nexport type Variants<P = {}> = Record<\n\tstring,\n\t{\n\t\tenter: Variant<P>;\n\t\texit: Variant<P>;\n\t\tinitial?: Variant<P>;\n\t}\n>;\n\nexport const TRANSITION_EASINGS = {\n\tease: [0.36, 0.66, 0.4, 1],\n\teaseIn: [0.4, 0, 1, 1],\n\teaseOut: [0, 0, 0.2, 1],\n\teaseInOut: [0.4, 0, 0.2, 1],\n\tspring: [0.155, 1.105, 0.295, 1.12],\n\tspringOut: [0.57, -0.15, 0.62, 0.07],\n\tsoftSpring: [0.16, 1.11, 0.3, 1.02],\n} as const;\n\nexport const TRANSITION_DEFAULTS = {\n\tenter: {\n\t\tduration: 0.2,\n\t\tease: TRANSITION_EASINGS.easeOut,\n\t},\n\texit: {\n\t\tduration: 0.1,\n\t\tease: TRANSITION_EASINGS.easeIn,\n\t},\n} as const;\n\nexport const TRANSITION_VARIANTS: Variants = {\n\tscaleSpring: {\n\t\tenter: {\n\t\t\ttransform: \"scale(1)\",\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\ttype: \"spring\",\n\t\t\t\tbounce: 0,\n\t\t\t\tduration: 0.2,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\ttransform: \"scale(0.85)\",\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\ttype: \"easeOut\" as any,\n\t\t\t\tduration: 0.15,\n\t\t\t},\n\t\t},\n\t},\n\tscaleSpringOpacity: {\n\t\tinitial: {\n\t\t\topacity: 0,\n\t\t\ttransform: \"scale(0.8)\",\n\t\t},\n\t\tenter: {\n\t\t\topacity: 1,\n\t\t\ttransform: \"scale(1)\",\n\t\t\ttransition: {\n\t\t\t\ttype: \"spring\",\n\t\t\t\tbounce: 0,\n\t\t\t\tduration: 0.3,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\topacity: 0,\n\t\t\ttransform: \"scale(0.96)\",\n\t\t\ttransition: {\n\t\t\t\ttype: \"easeOut\" as any,\n\t\t\t\tbounce: 0,\n\t\t\t\tduration: 0.15,\n\t\t\t},\n\t\t},\n\t},\n\tscale: {\n\t\tenter: { scale: 1 },\n\t\texit: { scale: 0.95 },\n\t},\n\tscaleFadeIn: {\n\t\tenter: {\n\t\t\ttransform: \"scale(1)\",\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.25,\n\t\t\t\tease: TRANSITION_EASINGS.easeIn,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\ttransform: \"scale(0.95)\",\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.2,\n\t\t\t\tease: TRANSITION_EASINGS.easeOut,\n\t\t\t},\n\t\t},\n\t},\n\tscaleInOut: {\n\t\tenter: {\n\t\t\ttransform: \"scale(1)\",\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.4,\n\t\t\t\tease: TRANSITION_EASINGS.ease,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\ttransform: \"scale(1.03)\",\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.3,\n\t\t\t\tease: TRANSITION_EASINGS.ease,\n\t\t\t},\n\t\t},\n\t},\n\tfade: {\n\t\tenter: {\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.4,\n\t\t\t\tease: TRANSITION_EASINGS.ease,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.3,\n\t\t\t\tease: TRANSITION_EASINGS.ease,\n\t\t\t},\n\t\t},\n\t},\n\tcollapse: {\n\t\tenter: {\n\t\t\topacity: 1,\n\t\t\theight: \"auto\",\n\t\t\ttransition: {\n\t\t\t\theight: {\n\t\t\t\t\ttype: \"spring\",\n\t\t\t\t\tbounce: 0,\n\t\t\t\t\tduration: 0.3,\n\t\t\t\t},\n\t\t\t\topacity: {\n\t\t\t\t\tease: \"ease\" as any,\n\t\t\t\t\tduration: 0.4,\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\topacity: 0,\n\t\t\theight: 0,\n\t\t\ttransition: {\n\t\t\t\tease: \"ease\" as any,\n\t\t\t\tduration: 0.3,\n\t\t\t},\n\t\t},\n\t},\n};\n","\"use client\";\n\nimport ReactDOM from \"react-dom\";\nimport { forwardRef, type Ref, useEffect, useRef } from \"react\";\nimport type { ModalBodyType, ModalFooterType, ModalHeaderType, ModalType } from \"./modal.type\";\nimport { cn } from \"@/lib/utils\";\nimport { Button } from \"../button\";\nimport { AnimatePresence } from \"framer-motion\";\nimport { LazyMotion, m } from \"framer-motion\";\nimport { TRANSITION_VARIANTS } from \"../transition/transition-utils\";\nimport { cva } from \"class-variance-authority\";\n\nconst backdropVariants = cva(\"\", {\n\tvariants: {\n\t\tbackdrop: {\n\t\t\ttransparent: \"bg-transparent\",\n\t\t\topaque: \"bg-black/50\",\n\t\t\tblur: \"backdrop-blur-md backdrop-saturate-150 bg-overlay/30\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tbackdrop: \"opaque\",\n\t},\n});\n\nconst sizeVariants = cva(\"\", {\n\tvariants: {\n\t\tsize: {\n\t\t\t\"xs\": \"max-w-xs\",\n\t\t\t\"sm\": \"max-w-sm\",\n\t\t\t\"md\": \"max-w-md\",\n\t\t\t\"lg\": \"max-w-lg\",\n\t\t\t\"xl\": \"max-w-xl\",\n\t\t\t\"2xl\": \"max-w-2xl\",\n\t\t\t\"3xl\": \"max-w-3xl\",\n\t\t\t\"4xl\": \"max-w-4xl\",\n\t\t\t\"5xl\": \"max-w-5xl\",\n\t\t\t\"full\": \"my-0 mx-0 sm:mx-0 sm:my-0 max-w-full h-[100dvh] min-h-[100dvh] !rounded-none\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tsize: \"md\",\n\t},\n});\n\nconst radiusVariants = cva(\"\", {\n\tvariants: {\n\t\tradius: {\n\t\t\tnone: \"rounded-none\",\n\t\t\tsm: \"rounded-sm\",\n\t\t\tmd: \"rounded-md\",\n\t\t\tlg: \"rounded-lg\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tradius: \"lg\",\n\t},\n});\n\nconst placementVariants = cva(\"\", {\n\tvariants: {\n\t\tplacement: {\n\t\t\tcenter: \"fixed top-[50%] left-[50%] translate-x-[-50%] translate-y-[-50%]\",\n\t\t\ttop: \"fixed top-0 left-[50%] translate-x-[-50%] sm:mt-8\",\n bottom: \"fixed bottom-0 left-[50%] translate-x-[-50%] sm:mb-8\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tplacement: \"center\",\n\t},\n});\n\nconst shadowVariants = cva(\"\", {\n\tvariants: {\n\t\tshadow: {\n\t\t\tnone: \"shadow-none\",\n\t\t\tsm: \"shadow-sm\",\n\t\t\tmd: \"shadow-md\",\n\t\t\tlg: \"shadow-lg\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tshadow: \"md\",\n\t},\n});\n\nexport const Modal = forwardRef(\n\t(\n\t\t{\n\t\t\tmodalId,\n\t\t\tisShow,\n\t\t\tisVisible,\n\t\t\tchildren,\n\t\t\tstyle,\n\t\t\tclassNameOverlay = \"\",\n\t\t\tstyleContainer,\n\t\t\tonClickOutside,\n\t\t\tclassNameDialog = \"modal-custom-dialog\",\n\t\t\tclassNameContent = \"\",\n\t\t\tbackdrop = \"opaque\",\n\t\t\tsize = \"md\",\n\t\t\tisKeyboardDismissDisabled = false,\n\t\t\tshadow = \"md\",\n\t\t\tradius = \"lg\",\n placement = \"center\",\n\t\t}: ModalType,\n\t\tref: Ref<HTMLDivElement>,\n\t) => {\n\t\tconst modalOverlayRef = useRef<HTMLDivElement>(null);\n\t\tuseEffect(() => {\n\t\t\tif (typeof window !== \"undefined\" && isVisible) {\n\t\t\t\tdocument.body.classList.add(\"modal-open\");\n\t\t\t}\n\t\t\treturn () => {\n\t\t\t\tif (typeof window !== \"undefined\") {\n\t\t\t\t\tdocument.body.classList.remove(\"modal-open\");\n\t\t\t\t}\n\t\t\t};\n\t\t}, [isVisible]);\n\n\t\tuseEffect(() => {\n\t\t\tconst handleKeyDown = (e: KeyboardEvent) => {\n\t\t\t\tif (e.key === \"Escape\" && !isKeyboardDismissDisabled) {\n\t\t\t\t\tonClickOutside?.();\n\t\t\t\t}\n\t\t\t};\n\n\t\t\tif (isShow) {\n\t\t\t\tdocument.addEventListener(\"keydown\", handleKeyDown);\n\t\t\t}\n\n\t\t\treturn () => {\n\t\t\t\tdocument.removeEventListener(\"keydown\", handleKeyDown);\n\t\t\t};\n\t\t}, [isShow, isKeyboardDismissDisabled, onClickOutside]);\n\n\t\tif (typeof window === \"undefined\") return null;\n\n\t\tconst modalRoot = document.getElementById(\"modal-root\");\n\t\tif (!modalRoot) return null;\n\n\t\treturn ReactDOM.createPortal(\n\t\t\t<AnimatePresence>\n\t\t\t\t{isShow && (\n\t\t\t\t\t<LazyMotion features={() => import(\"framer-motion\").then((res) => res.domAnimation)}>\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<m.div\n\t\t\t\t\t\t\t\tkey=\"modal-overlay\"\n\t\t\t\t\t\t\t\tinitial=\"exit\"\n\t\t\t\t\t\t\t\tanimate=\"enter\"\n\t\t\t\t\t\t\t\texit=\"exit\"\n\t\t\t\t\t\t\t\tvariants={TRANSITION_VARIANTS.fade}\n\t\t\t\t\t\t\t\tclassName={cn(\"fixed inset-0 z-50\", backdropVariants({ backdrop }), classNameOverlay)}\n\t\t\t\t\t\t\t\tonClick={onClickOutside}\n\t\t\t\t\t\t\t\taria-hidden={!isShow}\n\t\t\t\t\t\t\t\trole=\"dialog\"\n\t\t\t\t\t\t\t\taria-modal=\"true\"\n\t\t\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\t\t\tref={modalOverlayRef}\n\t\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t\t<m.div\n\t\t\t\t\t\t\t\tkey=\"modal-content\"\n\t\t\t\t\t\t\t\tinitial=\"exit\"\n\t\t\t\t\t\t\t\tanimate=\"enter\"\n\t\t\t\t\t\t\t\texit=\"exit\"\n\t\t\t\t\t\t\t\tvariants={TRANSITION_VARIANTS.scaleInOut}\n\t\t\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\t\t\tid={modalId}\n\t\t\t\t\t\t\t\tonClick={(e) => e.stopPropagation()}\n\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\" z-50 w-full rounded-lg shadow-lg bg-content1\",\n placementVariants({ placement }),\n\t\t\t\t\t\t\t\t\tsizeVariants({ size }),\n\t\t\t\t\t\t\t\t\tradiusVariants({ radius }),\n\t\t\t\t\t\t\t\t\tshadowVariants({ shadow }),\n\t\t\t\t\t\t\t\t\tclassNameDialog,\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\tstyle={style}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<div className={cn(\"modal-custom-content w-full flex flex-col max-h-[calc(100vh_-_4rem)]\", classNameContent)} style={styleContainer}>\n\t\t\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</m.div>\n\t\t\t\t\t\t</>\n\t\t\t\t\t</LazyMotion>\n\t\t\t\t)}\n\t\t\t</AnimatePresence>,\n\t\t\tmodalRoot,\n\t\t);\n\t},\n);\nModal.displayName = \"ModalPortalComponent\";\n\nexport const ModalHeader = ({ title, showCloseButton = true, disabled = false, onClick, className, styled, children, ...props }: ModalHeaderType) => {\n\treturn (\n\t\t<div className={cn(\"modal-custom-header-container w-full\")} style={styled}>\n\t\t\t<div className={cn(\"w-full flex py-4 px-6 flex-initial text-large font-semibold\", className)} {...props}>\n\t\t\t\t{children || <header className=\"modal-custom-title text-lg leading-none font-semibold\">{title}</header>}\n\t\t\t</div>\n\n\t\t\t{showCloseButton && (\n\t\t\t\t<div className=\"absolute top-2.5 right-2.5 disabled:pointer-events-none z-10\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tisIconOnly\n\t\t\t\t\t\tvariant=\"light\"\n\t\t\t\t\t\tradius=\"full\"\n\t\t\t\t\t\taria-label=\"Close\"\n\t\t\t\t\t\tonClick={onClick}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tclassName=\"p-0 w-[36px] h-[36px] min-w-auto bg-default-100 hover:bg-default-200 text-default-500 hover:text-default-600 dark:bg-default-100 dark:hover:bg-default-200 dark:text-default-500 dark:hover:text-default-600 disabled:opacity-50 disabled:pointer-events-none\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<svg width=\"20\" height=\"20\" fill=\"currentColor\" role=\"img\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t<path fill=\"none\" d=\"M0 0h21v21H0z\"></path>\n\t\t\t\t\t\t\t<path d=\"m12.12 10 4.07-4.06a1.5 1.5 0 1 0-2.11-2.12L10 7.88 5.94 3.81a1.5 1.5 0 1 0-2.12 2.12L7.88 10l-4.07 4.06a1.5 1.5 0 0 0 0 2.12 1.51 1.51 0 0 0 2.13 0L10 12.12l4.06 4.07a1.45 1.45 0 0 0 1.06.44 1.5 1.5 0 0 0 1.06-2.56Z\"></path>\n\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t<span className=\"sr-only\">Close</span>\n\t\t\t\t\t</Button>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nexport const ModalBody = forwardRef(({ children, className = \"\", styled, height }: ModalBodyType, ref: Ref<HTMLDivElement>) => {\n\treturn (\n\t\t<div\n\t\t\tclassName={cn(\"modal-custom-body flex flex-1 flex-col gap-3 px-6 overflow-y-auto\", className)}\n\t\t\tref={ref}\n\t\t\tstyle={{ ...styled, height: height ? `${height}px` : \"auto\" }}\n\t\t>\n\t\t\t{children}\n\t\t</div>\n\t);\n});\nModalBody.displayName = \"ModalBodyPortalComponent\";\n\nexport const ModalFooter = ({ children, className, styled }: ModalFooterType) => {\n\treturn (\n\t\t<div\n\t\t\tclassName={cn(\"modal-custom-footer flex flex-col-reverse px-6 py-3 gap-2 sm:flex-row sm:justify-end mt-auto\", className)}\n\t\t\tstyle={styled}\n\t\t>\n\t\t\t{children}\n\t\t</div>\n\t);\n};\n"],"names":["TRANSITION_EASINGS","TRANSITION_VARIANTS","backdropVariants","cva","sizeVariants","radiusVariants","placementVariants","shadowVariants","Modal","forwardRef","modalId","isShow","isVisible","children","style","classNameOverlay","styleContainer","onClickOutside","classNameDialog","classNameContent","backdrop","size","isKeyboardDismissDisabled","shadow","radius","placement","ref","modalOverlayRef","useRef","useEffect","handleKeyDown","e","modalRoot","ReactDOM","AnimatePresence","jsx","LazyMotion","res","jsxs","Fragment","m","cn","ModalHeader","title","showCloseButton","disabled","onClick","className","styled","props","Button","ModalBody","height","ModalFooter"],"mappings":"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"}
|
package/dist/modal/index.es.js
CHANGED
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import { j as e } from "../chunks/jsx-runtime-Cl_4eDuT.js";
|
|
2
|
-
import
|
|
3
|
-
import { forwardRef as y, useRef as
|
|
4
|
-
import { c as n } from "../chunks/utils-
|
|
5
|
-
import { B as A } from "../chunks/button-
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
2
|
+
import R from "react-dom";
|
|
3
|
+
import { forwardRef as y, useRef as z, useEffect as p } from "react";
|
|
4
|
+
import { c as n } from "../chunks/utils-CvyT6Z0O.js";
|
|
5
|
+
import { B as A } from "../chunks/button-uo4_Xad_.js";
|
|
6
|
+
import { c as i } from "../chunks/index-D29mdTf5.js";
|
|
7
|
+
import { A as E, L as _ } from "../chunks/index-DC9BfnBH.js";
|
|
8
|
+
import { m as h } from "../chunks/features-animation-BRAvwYFN.js";
|
|
8
9
|
const m = {
|
|
9
10
|
ease: [0.36, 0.66, 0.4, 1]
|
|
10
11
|
}, v = {
|
|
@@ -125,20 +126,20 @@ const m = {
|
|
|
125
126
|
radius: k = "lg",
|
|
126
127
|
placement: I = "center"
|
|
127
128
|
}, V) => {
|
|
128
|
-
const
|
|
129
|
+
const L = z(null);
|
|
129
130
|
if (p(() => (typeof window < "u" && t && document.body.classList.add("modal-open"), () => {
|
|
130
131
|
typeof window < "u" && document.body.classList.remove("modal-open");
|
|
131
132
|
}), [t]), p(() => {
|
|
132
|
-
const s = (
|
|
133
|
-
|
|
133
|
+
const s = (M) => {
|
|
134
|
+
M.key === "Escape" && !u && d?.();
|
|
134
135
|
};
|
|
135
136
|
return a && document.addEventListener("keydown", s), () => {
|
|
136
137
|
document.removeEventListener("keydown", s);
|
|
137
138
|
};
|
|
138
139
|
}, [a, u, d]), typeof window > "u") return null;
|
|
139
140
|
const f = document.getElementById("modal-root");
|
|
140
|
-
return f ?
|
|
141
|
-
/* @__PURE__ */ e.jsx(E, { children: a && /* @__PURE__ */ e.jsx(_, { features: () => import("
|
|
141
|
+
return f ? R.createPortal(
|
|
142
|
+
/* @__PURE__ */ e.jsx(E, { children: a && /* @__PURE__ */ e.jsx(_, { features: () => import("../chunks/index-BbDfYVLO.js").then((s) => s.domAnimation), children: /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
|
|
142
143
|
/* @__PURE__ */ e.jsx(
|
|
143
144
|
h.div,
|
|
144
145
|
{
|
|
@@ -152,7 +153,7 @@ const m = {
|
|
|
152
153
|
role: "dialog",
|
|
153
154
|
"aria-modal": "true",
|
|
154
155
|
tabIndex: -1,
|
|
155
|
-
ref:
|
|
156
|
+
ref: L
|
|
156
157
|
},
|
|
157
158
|
"modal-overlay"
|
|
158
159
|
),
|
|
@@ -185,7 +186,7 @@ const m = {
|
|
|
185
186
|
}
|
|
186
187
|
);
|
|
187
188
|
q.displayName = "ModalPortalComponent";
|
|
188
|
-
const
|
|
189
|
+
const Q = ({ title: o, showCloseButton: a = !0, disabled: t = !1, onClick: l, className: r, styled: c, children: x, ...d }) => /* @__PURE__ */ e.jsxs("div", { className: n("modal-custom-header-container w-full"), style: c, children: [
|
|
189
190
|
/* @__PURE__ */ e.jsx("div", { className: n("w-full flex py-4 px-6 flex-initial text-large font-semibold", r), ...d, children: x || /* @__PURE__ */ e.jsx("header", { className: "modal-custom-title text-lg leading-none font-semibold", children: o }) }),
|
|
190
191
|
a && /* @__PURE__ */ e.jsx("div", { className: "absolute top-2.5 right-2.5 disabled:pointer-events-none z-10", children: /* @__PURE__ */ e.jsxs(
|
|
191
192
|
A,
|
|
@@ -216,7 +217,7 @@ const K = ({ title: o, showCloseButton: a = !0, disabled: t = !1, onClick: l, cl
|
|
|
216
217
|
}
|
|
217
218
|
));
|
|
218
219
|
F.displayName = "ModalBodyPortalComponent";
|
|
219
|
-
const
|
|
220
|
+
const U = ({ children: o, className: a, styled: t }) => /* @__PURE__ */ e.jsx(
|
|
220
221
|
"div",
|
|
221
222
|
{
|
|
222
223
|
className: n("modal-custom-footer flex flex-col-reverse px-6 py-3 gap-2 sm:flex-row sm:justify-end mt-auto", a),
|
|
@@ -227,7 +228,7 @@ const Q = ({ children: o, className: a, styled: t }) => /* @__PURE__ */ e.jsx(
|
|
|
227
228
|
export {
|
|
228
229
|
q as Modal,
|
|
229
230
|
F as ModalBody,
|
|
230
|
-
|
|
231
|
-
|
|
231
|
+
U as ModalFooter,
|
|
232
|
+
Q as ModalHeader
|
|
232
233
|
};
|
|
233
234
|
//# sourceMappingURL=index.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.es.js","sources":["../../src/components/transition/transition-utils.ts","../../src/components/modal/modal.tsx"],"sourcesContent":["import type { Target, TargetAndTransition, Transition } from \"framer-motion\";\n\ntype WithMotionState<P> = Partial<Record<\"enter\" | \"exit\", P>>;\n\nexport type TransitionConfig = WithMotionState<Transition>;\n\nexport type TransitionEndConfig = WithMotionState<Target>;\n\nexport type TransitionProperties = {\n\t/**\n\t * Custom `transition` definition for `enter` and `exit`\n\t */\n\ttransition?: TransitionConfig;\n\t/**\n\t * Custom `transitionEnd` definition for `enter` and `exit`\n\t */\n\ttransitionEnd?: TransitionEndConfig;\n};\n\ntype TargetResolver<P = {}> = (props: P & TransitionProperties) => TargetAndTransition;\n\ntype Variant<P = {}> = TargetAndTransition | TargetResolver<P>;\n\nexport type Variants<P = {}> = Record<\n\tstring,\n\t{\n\t\tenter: Variant<P>;\n\t\texit: Variant<P>;\n\t\tinitial?: Variant<P>;\n\t}\n>;\n\nexport const TRANSITION_EASINGS = {\n\tease: [0.36, 0.66, 0.4, 1],\n\teaseIn: [0.4, 0, 1, 1],\n\teaseOut: [0, 0, 0.2, 1],\n\teaseInOut: [0.4, 0, 0.2, 1],\n\tspring: [0.155, 1.105, 0.295, 1.12],\n\tspringOut: [0.57, -0.15, 0.62, 0.07],\n\tsoftSpring: [0.16, 1.11, 0.3, 1.02],\n} as const;\n\nexport const TRANSITION_DEFAULTS = {\n\tenter: {\n\t\tduration: 0.2,\n\t\tease: TRANSITION_EASINGS.easeOut,\n\t},\n\texit: {\n\t\tduration: 0.1,\n\t\tease: TRANSITION_EASINGS.easeIn,\n\t},\n} as const;\n\nexport const TRANSITION_VARIANTS: Variants = {\n\tscaleSpring: {\n\t\tenter: {\n\t\t\ttransform: \"scale(1)\",\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\ttype: \"spring\",\n\t\t\t\tbounce: 0,\n\t\t\t\tduration: 0.2,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\ttransform: \"scale(0.85)\",\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\ttype: \"easeOut\" as any,\n\t\t\t\tduration: 0.15,\n\t\t\t},\n\t\t},\n\t},\n\tscaleSpringOpacity: {\n\t\tinitial: {\n\t\t\topacity: 0,\n\t\t\ttransform: \"scale(0.8)\",\n\t\t},\n\t\tenter: {\n\t\t\topacity: 1,\n\t\t\ttransform: \"scale(1)\",\n\t\t\ttransition: {\n\t\t\t\ttype: \"spring\",\n\t\t\t\tbounce: 0,\n\t\t\t\tduration: 0.3,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\topacity: 0,\n\t\t\ttransform: \"scale(0.96)\",\n\t\t\ttransition: {\n\t\t\t\ttype: \"easeOut\" as any,\n\t\t\t\tbounce: 0,\n\t\t\t\tduration: 0.15,\n\t\t\t},\n\t\t},\n\t},\n\tscale: {\n\t\tenter: { scale: 1 },\n\t\texit: { scale: 0.95 },\n\t},\n\tscaleFadeIn: {\n\t\tenter: {\n\t\t\ttransform: \"scale(1)\",\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.25,\n\t\t\t\tease: TRANSITION_EASINGS.easeIn,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\ttransform: \"scale(0.95)\",\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.2,\n\t\t\t\tease: TRANSITION_EASINGS.easeOut,\n\t\t\t},\n\t\t},\n\t},\n\tscaleInOut: {\n\t\tenter: {\n\t\t\ttransform: \"scale(1)\",\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.4,\n\t\t\t\tease: TRANSITION_EASINGS.ease,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\ttransform: \"scale(1.03)\",\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.3,\n\t\t\t\tease: TRANSITION_EASINGS.ease,\n\t\t\t},\n\t\t},\n\t},\n\tfade: {\n\t\tenter: {\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.4,\n\t\t\t\tease: TRANSITION_EASINGS.ease,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.3,\n\t\t\t\tease: TRANSITION_EASINGS.ease,\n\t\t\t},\n\t\t},\n\t},\n\tcollapse: {\n\t\tenter: {\n\t\t\topacity: 1,\n\t\t\theight: \"auto\",\n\t\t\ttransition: {\n\t\t\t\theight: {\n\t\t\t\t\ttype: \"spring\",\n\t\t\t\t\tbounce: 0,\n\t\t\t\t\tduration: 0.3,\n\t\t\t\t},\n\t\t\t\topacity: {\n\t\t\t\t\tease: \"ease\" as any,\n\t\t\t\t\tduration: 0.4,\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\topacity: 0,\n\t\t\theight: 0,\n\t\t\ttransition: {\n\t\t\t\tease: \"ease\" as any,\n\t\t\t\tduration: 0.3,\n\t\t\t},\n\t\t},\n\t},\n};\n","\"use client\";\n\nimport ReactDOM from \"react-dom\";\nimport { forwardRef, type Ref, useEffect, useRef } from \"react\";\nimport type { ModalBodyType, ModalFooterType, ModalHeaderType, ModalType } from \"./modal.type\";\nimport { cn } from \"@/lib/utils\";\nimport { Button } from \"../button\";\nimport { AnimatePresence } from \"framer-motion\";\nimport { LazyMotion, m } from \"framer-motion\";\nimport { TRANSITION_VARIANTS } from \"../transition/transition-utils\";\nimport { cva } from \"class-variance-authority\";\n\nconst backdropVariants = cva(\"\", {\n\tvariants: {\n\t\tbackdrop: {\n\t\t\ttransparent: \"bg-transparent\",\n\t\t\topaque: \"bg-black/50\",\n\t\t\tblur: \"backdrop-blur-md backdrop-saturate-150 bg-overlay/30\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tbackdrop: \"opaque\",\n\t},\n});\n\nconst sizeVariants = cva(\"\", {\n\tvariants: {\n\t\tsize: {\n\t\t\t\"xs\": \"max-w-xs\",\n\t\t\t\"sm\": \"max-w-sm\",\n\t\t\t\"md\": \"max-w-md\",\n\t\t\t\"lg\": \"max-w-lg\",\n\t\t\t\"xl\": \"max-w-xl\",\n\t\t\t\"2xl\": \"max-w-2xl\",\n\t\t\t\"3xl\": \"max-w-3xl\",\n\t\t\t\"4xl\": \"max-w-4xl\",\n\t\t\t\"5xl\": \"max-w-5xl\",\n\t\t\t\"full\": \"my-0 mx-0 sm:mx-0 sm:my-0 max-w-full h-[100dvh] min-h-[100dvh] !rounded-none\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tsize: \"md\",\n\t},\n});\n\nconst radiusVariants = cva(\"\", {\n\tvariants: {\n\t\tradius: {\n\t\t\tnone: \"rounded-none\",\n\t\t\tsm: \"rounded-sm\",\n\t\t\tmd: \"rounded-md\",\n\t\t\tlg: \"rounded-lg\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tradius: \"lg\",\n\t},\n});\n\nconst placementVariants = cva(\"\", {\n\tvariants: {\n\t\tplacement: {\n\t\t\tcenter: \"fixed top-[50%] left-[50%] translate-x-[-50%] translate-y-[-50%]\",\n\t\t\ttop: \"fixed top-0 left-[50%] translate-x-[-50%] sm:mt-8\",\n bottom: \"fixed bottom-0 left-[50%] translate-x-[-50%] sm:mb-8\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tplacement: \"center\",\n\t},\n});\n\nconst shadowVariants = cva(\"\", {\n\tvariants: {\n\t\tshadow: {\n\t\t\tnone: \"shadow-none\",\n\t\t\tsm: \"shadow-sm\",\n\t\t\tmd: \"shadow-md\",\n\t\t\tlg: \"shadow-lg\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tshadow: \"md\",\n\t},\n});\n\nexport const Modal = forwardRef(\n\t(\n\t\t{\n\t\t\tmodalId,\n\t\t\tisShow,\n\t\t\tisVisible,\n\t\t\tchildren,\n\t\t\tstyle,\n\t\t\tclassNameOverlay = \"\",\n\t\t\tstyleContainer,\n\t\t\tonClickOutside,\n\t\t\tclassNameDialog = \"modal-custom-dialog\",\n\t\t\tclassNameContent = \"\",\n\t\t\tbackdrop = \"opaque\",\n\t\t\tsize = \"md\",\n\t\t\tisKeyboardDismissDisabled = false,\n\t\t\tshadow = \"md\",\n\t\t\tradius = \"lg\",\n placement = \"center\",\n\t\t}: ModalType,\n\t\tref: Ref<HTMLDivElement>,\n\t) => {\n\t\tconst modalOverlayRef = useRef<HTMLDivElement>(null);\n\t\tuseEffect(() => {\n\t\t\tif (typeof window !== \"undefined\" && isVisible) {\n\t\t\t\tdocument.body.classList.add(\"modal-open\");\n\t\t\t}\n\t\t\treturn () => {\n\t\t\t\tif (typeof window !== \"undefined\") {\n\t\t\t\t\tdocument.body.classList.remove(\"modal-open\");\n\t\t\t\t}\n\t\t\t};\n\t\t}, [isVisible]);\n\n\t\tuseEffect(() => {\n\t\t\tconst handleKeyDown = (e: KeyboardEvent) => {\n\t\t\t\tif (e.key === \"Escape\" && !isKeyboardDismissDisabled) {\n\t\t\t\t\tonClickOutside?.();\n\t\t\t\t}\n\t\t\t};\n\n\t\t\tif (isShow) {\n\t\t\t\tdocument.addEventListener(\"keydown\", handleKeyDown);\n\t\t\t}\n\n\t\t\treturn () => {\n\t\t\t\tdocument.removeEventListener(\"keydown\", handleKeyDown);\n\t\t\t};\n\t\t}, [isShow, isKeyboardDismissDisabled, onClickOutside]);\n\n\t\tif (typeof window === \"undefined\") return null;\n\n\t\tconst modalRoot = document.getElementById(\"modal-root\");\n\t\tif (!modalRoot) return null;\n\n\t\treturn ReactDOM.createPortal(\n\t\t\t<AnimatePresence>\n\t\t\t\t{isShow && (\n\t\t\t\t\t<LazyMotion features={() => import(\"framer-motion\").then((res) => res.domAnimation)}>\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<m.div\n\t\t\t\t\t\t\t\tkey=\"modal-overlay\"\n\t\t\t\t\t\t\t\tinitial=\"exit\"\n\t\t\t\t\t\t\t\tanimate=\"enter\"\n\t\t\t\t\t\t\t\texit=\"exit\"\n\t\t\t\t\t\t\t\tvariants={TRANSITION_VARIANTS.fade}\n\t\t\t\t\t\t\t\tclassName={cn(\"fixed inset-0 z-50\", backdropVariants({ backdrop }), classNameOverlay)}\n\t\t\t\t\t\t\t\tonClick={onClickOutside}\n\t\t\t\t\t\t\t\taria-hidden={!isShow}\n\t\t\t\t\t\t\t\trole=\"dialog\"\n\t\t\t\t\t\t\t\taria-modal=\"true\"\n\t\t\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\t\t\tref={modalOverlayRef}\n\t\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t\t<m.div\n\t\t\t\t\t\t\t\tkey=\"modal-content\"\n\t\t\t\t\t\t\t\tinitial=\"exit\"\n\t\t\t\t\t\t\t\tanimate=\"enter\"\n\t\t\t\t\t\t\t\texit=\"exit\"\n\t\t\t\t\t\t\t\tvariants={TRANSITION_VARIANTS.scaleInOut}\n\t\t\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\t\t\tid={modalId}\n\t\t\t\t\t\t\t\tonClick={(e) => e.stopPropagation()}\n\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\" z-50 w-full rounded-lg shadow-lg bg-content1\",\n placementVariants({ placement }),\n\t\t\t\t\t\t\t\t\tsizeVariants({ size }),\n\t\t\t\t\t\t\t\t\tradiusVariants({ radius }),\n\t\t\t\t\t\t\t\t\tshadowVariants({ shadow }),\n\t\t\t\t\t\t\t\t\tclassNameDialog,\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\tstyle={style}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<div className={cn(\"modal-custom-content w-full flex flex-col max-h-[calc(100vh_-_4rem)]\", classNameContent)} style={styleContainer}>\n\t\t\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</m.div>\n\t\t\t\t\t\t</>\n\t\t\t\t\t</LazyMotion>\n\t\t\t\t)}\n\t\t\t</AnimatePresence>,\n\t\t\tmodalRoot,\n\t\t);\n\t},\n);\nModal.displayName = \"ModalPortalComponent\";\n\nexport const ModalHeader = ({ title, showCloseButton = true, disabled = false, onClick, className, styled, children, ...props }: ModalHeaderType) => {\n\treturn (\n\t\t<div className={cn(\"modal-custom-header-container w-full\")} style={styled}>\n\t\t\t<div className={cn(\"w-full flex py-4 px-6 flex-initial text-large font-semibold\", className)} {...props}>\n\t\t\t\t{children || <header className=\"modal-custom-title text-lg leading-none font-semibold\">{title}</header>}\n\t\t\t</div>\n\n\t\t\t{showCloseButton && (\n\t\t\t\t<div className=\"absolute top-2.5 right-2.5 disabled:pointer-events-none z-10\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tisIconOnly\n\t\t\t\t\t\tvariant=\"light\"\n\t\t\t\t\t\tradius=\"full\"\n\t\t\t\t\t\taria-label=\"Close\"\n\t\t\t\t\t\tonClick={onClick}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tclassName=\"p-0 w-[36px] h-[36px] min-w-auto bg-default-100 hover:bg-default-200 text-default-500 hover:text-default-600 dark:bg-default-100 dark:hover:bg-default-200 dark:text-default-500 dark:hover:text-default-600 disabled:opacity-50 disabled:pointer-events-none\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<svg width=\"20\" height=\"20\" fill=\"currentColor\" role=\"img\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t<path fill=\"none\" d=\"M0 0h21v21H0z\"></path>\n\t\t\t\t\t\t\t<path d=\"m12.12 10 4.07-4.06a1.5 1.5 0 1 0-2.11-2.12L10 7.88 5.94 3.81a1.5 1.5 0 1 0-2.12 2.12L7.88 10l-4.07 4.06a1.5 1.5 0 0 0 0 2.12 1.51 1.51 0 0 0 2.13 0L10 12.12l4.06 4.07a1.45 1.45 0 0 0 1.06.44 1.5 1.5 0 0 0 1.06-2.56Z\"></path>\n\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t<span className=\"sr-only\">Close</span>\n\t\t\t\t\t</Button>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nexport const ModalBody = forwardRef(({ children, className = \"\", styled, height }: ModalBodyType, ref: Ref<HTMLDivElement>) => {\n\treturn (\n\t\t<div\n\t\t\tclassName={cn(\"modal-custom-body flex flex-1 flex-col gap-3 px-6 overflow-y-auto\", className)}\n\t\t\tref={ref}\n\t\t\tstyle={{ ...styled, height: height ? `${height}px` : \"auto\" }}\n\t\t>\n\t\t\t{children}\n\t\t</div>\n\t);\n});\nModalBody.displayName = \"ModalBodyPortalComponent\";\n\nexport const ModalFooter = ({ children, className, styled }: ModalFooterType) => {\n\treturn (\n\t\t<div\n\t\t\tclassName={cn(\"modal-custom-footer flex flex-col-reverse px-6 py-3 gap-2 sm:flex-row sm:justify-end mt-auto\", className)}\n\t\t\tstyle={styled}\n\t\t>\n\t\t\t{children}\n\t\t</div>\n\t);\n};\n"],"names":["TRANSITION_EASINGS","TRANSITION_VARIANTS","backdropVariants","cva","sizeVariants","radiusVariants","placementVariants","shadowVariants","Modal","forwardRef","modalId","isShow","isVisible","children","style","classNameOverlay","styleContainer","onClickOutside","classNameDialog","classNameContent","backdrop","size","isKeyboardDismissDisabled","shadow","radius","placement","ref","modalOverlayRef","useRef","useEffect","handleKeyDown","e","modalRoot","ReactDOM","AnimatePresence","jsx","LazyMotion","res","jsxs","Fragment","m","cn","ModalHeader","title","showCloseButton","disabled","onClick","className","styled","props","Button","ModalBody","height","ModalFooter"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.es.js","sources":["../../src/components/transition/transition-utils.ts","../../src/components/modal/modal.tsx"],"sourcesContent":["import type { Target, TargetAndTransition, Transition } from \"framer-motion\";\n\ntype WithMotionState<P> = Partial<Record<\"enter\" | \"exit\", P>>;\n\nexport type TransitionConfig = WithMotionState<Transition>;\n\nexport type TransitionEndConfig = WithMotionState<Target>;\n\nexport type TransitionProperties = {\n\t/**\n\t * Custom `transition` definition for `enter` and `exit`\n\t */\n\ttransition?: TransitionConfig;\n\t/**\n\t * Custom `transitionEnd` definition for `enter` and `exit`\n\t */\n\ttransitionEnd?: TransitionEndConfig;\n};\n\ntype TargetResolver<P = {}> = (props: P & TransitionProperties) => TargetAndTransition;\n\ntype Variant<P = {}> = TargetAndTransition | TargetResolver<P>;\n\nexport type Variants<P = {}> = Record<\n\tstring,\n\t{\n\t\tenter: Variant<P>;\n\t\texit: Variant<P>;\n\t\tinitial?: Variant<P>;\n\t}\n>;\n\nexport const TRANSITION_EASINGS = {\n\tease: [0.36, 0.66, 0.4, 1],\n\teaseIn: [0.4, 0, 1, 1],\n\teaseOut: [0, 0, 0.2, 1],\n\teaseInOut: [0.4, 0, 0.2, 1],\n\tspring: [0.155, 1.105, 0.295, 1.12],\n\tspringOut: [0.57, -0.15, 0.62, 0.07],\n\tsoftSpring: [0.16, 1.11, 0.3, 1.02],\n} as const;\n\nexport const TRANSITION_DEFAULTS = {\n\tenter: {\n\t\tduration: 0.2,\n\t\tease: TRANSITION_EASINGS.easeOut,\n\t},\n\texit: {\n\t\tduration: 0.1,\n\t\tease: TRANSITION_EASINGS.easeIn,\n\t},\n} as const;\n\nexport const TRANSITION_VARIANTS: Variants = {\n\tscaleSpring: {\n\t\tenter: {\n\t\t\ttransform: \"scale(1)\",\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\ttype: \"spring\",\n\t\t\t\tbounce: 0,\n\t\t\t\tduration: 0.2,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\ttransform: \"scale(0.85)\",\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\ttype: \"easeOut\" as any,\n\t\t\t\tduration: 0.15,\n\t\t\t},\n\t\t},\n\t},\n\tscaleSpringOpacity: {\n\t\tinitial: {\n\t\t\topacity: 0,\n\t\t\ttransform: \"scale(0.8)\",\n\t\t},\n\t\tenter: {\n\t\t\topacity: 1,\n\t\t\ttransform: \"scale(1)\",\n\t\t\ttransition: {\n\t\t\t\ttype: \"spring\",\n\t\t\t\tbounce: 0,\n\t\t\t\tduration: 0.3,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\topacity: 0,\n\t\t\ttransform: \"scale(0.96)\",\n\t\t\ttransition: {\n\t\t\t\ttype: \"easeOut\" as any,\n\t\t\t\tbounce: 0,\n\t\t\t\tduration: 0.15,\n\t\t\t},\n\t\t},\n\t},\n\tscale: {\n\t\tenter: { scale: 1 },\n\t\texit: { scale: 0.95 },\n\t},\n\tscaleFadeIn: {\n\t\tenter: {\n\t\t\ttransform: \"scale(1)\",\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.25,\n\t\t\t\tease: TRANSITION_EASINGS.easeIn,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\ttransform: \"scale(0.95)\",\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.2,\n\t\t\t\tease: TRANSITION_EASINGS.easeOut,\n\t\t\t},\n\t\t},\n\t},\n\tscaleInOut: {\n\t\tenter: {\n\t\t\ttransform: \"scale(1)\",\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.4,\n\t\t\t\tease: TRANSITION_EASINGS.ease,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\ttransform: \"scale(1.03)\",\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.3,\n\t\t\t\tease: TRANSITION_EASINGS.ease,\n\t\t\t},\n\t\t},\n\t},\n\tfade: {\n\t\tenter: {\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.4,\n\t\t\t\tease: TRANSITION_EASINGS.ease,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.3,\n\t\t\t\tease: TRANSITION_EASINGS.ease,\n\t\t\t},\n\t\t},\n\t},\n\tcollapse: {\n\t\tenter: {\n\t\t\topacity: 1,\n\t\t\theight: \"auto\",\n\t\t\ttransition: {\n\t\t\t\theight: {\n\t\t\t\t\ttype: \"spring\",\n\t\t\t\t\tbounce: 0,\n\t\t\t\t\tduration: 0.3,\n\t\t\t\t},\n\t\t\t\topacity: {\n\t\t\t\t\tease: \"ease\" as any,\n\t\t\t\t\tduration: 0.4,\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\topacity: 0,\n\t\t\theight: 0,\n\t\t\ttransition: {\n\t\t\t\tease: \"ease\" as any,\n\t\t\t\tduration: 0.3,\n\t\t\t},\n\t\t},\n\t},\n};\n","\"use client\";\n\nimport ReactDOM from \"react-dom\";\nimport { forwardRef, type Ref, useEffect, useRef } from \"react\";\nimport type { ModalBodyType, ModalFooterType, ModalHeaderType, ModalType } from \"./modal.type\";\nimport { cn } from \"@/lib/utils\";\nimport { Button } from \"../button\";\nimport { AnimatePresence } from \"framer-motion\";\nimport { LazyMotion, m } from \"framer-motion\";\nimport { TRANSITION_VARIANTS } from \"../transition/transition-utils\";\nimport { cva } from \"class-variance-authority\";\n\nconst backdropVariants = cva(\"\", {\n\tvariants: {\n\t\tbackdrop: {\n\t\t\ttransparent: \"bg-transparent\",\n\t\t\topaque: \"bg-black/50\",\n\t\t\tblur: \"backdrop-blur-md backdrop-saturate-150 bg-overlay/30\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tbackdrop: \"opaque\",\n\t},\n});\n\nconst sizeVariants = cva(\"\", {\n\tvariants: {\n\t\tsize: {\n\t\t\t\"xs\": \"max-w-xs\",\n\t\t\t\"sm\": \"max-w-sm\",\n\t\t\t\"md\": \"max-w-md\",\n\t\t\t\"lg\": \"max-w-lg\",\n\t\t\t\"xl\": \"max-w-xl\",\n\t\t\t\"2xl\": \"max-w-2xl\",\n\t\t\t\"3xl\": \"max-w-3xl\",\n\t\t\t\"4xl\": \"max-w-4xl\",\n\t\t\t\"5xl\": \"max-w-5xl\",\n\t\t\t\"full\": \"my-0 mx-0 sm:mx-0 sm:my-0 max-w-full h-[100dvh] min-h-[100dvh] !rounded-none\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tsize: \"md\",\n\t},\n});\n\nconst radiusVariants = cva(\"\", {\n\tvariants: {\n\t\tradius: {\n\t\t\tnone: \"rounded-none\",\n\t\t\tsm: \"rounded-sm\",\n\t\t\tmd: \"rounded-md\",\n\t\t\tlg: \"rounded-lg\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tradius: \"lg\",\n\t},\n});\n\nconst placementVariants = cva(\"\", {\n\tvariants: {\n\t\tplacement: {\n\t\t\tcenter: \"fixed top-[50%] left-[50%] translate-x-[-50%] translate-y-[-50%]\",\n\t\t\ttop: \"fixed top-0 left-[50%] translate-x-[-50%] sm:mt-8\",\n bottom: \"fixed bottom-0 left-[50%] translate-x-[-50%] sm:mb-8\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tplacement: \"center\",\n\t},\n});\n\nconst shadowVariants = cva(\"\", {\n\tvariants: {\n\t\tshadow: {\n\t\t\tnone: \"shadow-none\",\n\t\t\tsm: \"shadow-sm\",\n\t\t\tmd: \"shadow-md\",\n\t\t\tlg: \"shadow-lg\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tshadow: \"md\",\n\t},\n});\n\nexport const Modal = forwardRef(\n\t(\n\t\t{\n\t\t\tmodalId,\n\t\t\tisShow,\n\t\t\tisVisible,\n\t\t\tchildren,\n\t\t\tstyle,\n\t\t\tclassNameOverlay = \"\",\n\t\t\tstyleContainer,\n\t\t\tonClickOutside,\n\t\t\tclassNameDialog = \"modal-custom-dialog\",\n\t\t\tclassNameContent = \"\",\n\t\t\tbackdrop = \"opaque\",\n\t\t\tsize = \"md\",\n\t\t\tisKeyboardDismissDisabled = false,\n\t\t\tshadow = \"md\",\n\t\t\tradius = \"lg\",\n placement = \"center\",\n\t\t}: ModalType,\n\t\tref: Ref<HTMLDivElement>,\n\t) => {\n\t\tconst modalOverlayRef = useRef<HTMLDivElement>(null);\n\t\tuseEffect(() => {\n\t\t\tif (typeof window !== \"undefined\" && isVisible) {\n\t\t\t\tdocument.body.classList.add(\"modal-open\");\n\t\t\t}\n\t\t\treturn () => {\n\t\t\t\tif (typeof window !== \"undefined\") {\n\t\t\t\t\tdocument.body.classList.remove(\"modal-open\");\n\t\t\t\t}\n\t\t\t};\n\t\t}, [isVisible]);\n\n\t\tuseEffect(() => {\n\t\t\tconst handleKeyDown = (e: KeyboardEvent) => {\n\t\t\t\tif (e.key === \"Escape\" && !isKeyboardDismissDisabled) {\n\t\t\t\t\tonClickOutside?.();\n\t\t\t\t}\n\t\t\t};\n\n\t\t\tif (isShow) {\n\t\t\t\tdocument.addEventListener(\"keydown\", handleKeyDown);\n\t\t\t}\n\n\t\t\treturn () => {\n\t\t\t\tdocument.removeEventListener(\"keydown\", handleKeyDown);\n\t\t\t};\n\t\t}, [isShow, isKeyboardDismissDisabled, onClickOutside]);\n\n\t\tif (typeof window === \"undefined\") return null;\n\n\t\tconst modalRoot = document.getElementById(\"modal-root\");\n\t\tif (!modalRoot) return null;\n\n\t\treturn ReactDOM.createPortal(\n\t\t\t<AnimatePresence>\n\t\t\t\t{isShow && (\n\t\t\t\t\t<LazyMotion features={() => import(\"framer-motion\").then((res) => res.domAnimation)}>\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<m.div\n\t\t\t\t\t\t\t\tkey=\"modal-overlay\"\n\t\t\t\t\t\t\t\tinitial=\"exit\"\n\t\t\t\t\t\t\t\tanimate=\"enter\"\n\t\t\t\t\t\t\t\texit=\"exit\"\n\t\t\t\t\t\t\t\tvariants={TRANSITION_VARIANTS.fade}\n\t\t\t\t\t\t\t\tclassName={cn(\"fixed inset-0 z-50\", backdropVariants({ backdrop }), classNameOverlay)}\n\t\t\t\t\t\t\t\tonClick={onClickOutside}\n\t\t\t\t\t\t\t\taria-hidden={!isShow}\n\t\t\t\t\t\t\t\trole=\"dialog\"\n\t\t\t\t\t\t\t\taria-modal=\"true\"\n\t\t\t\t\t\t\t\ttabIndex={-1}\n\t\t\t\t\t\t\t\tref={modalOverlayRef}\n\t\t\t\t\t\t\t/>\n\n\t\t\t\t\t\t\t<m.div\n\t\t\t\t\t\t\t\tkey=\"modal-content\"\n\t\t\t\t\t\t\t\tinitial=\"exit\"\n\t\t\t\t\t\t\t\tanimate=\"enter\"\n\t\t\t\t\t\t\t\texit=\"exit\"\n\t\t\t\t\t\t\t\tvariants={TRANSITION_VARIANTS.scaleInOut}\n\t\t\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\t\t\tid={modalId}\n\t\t\t\t\t\t\t\tonClick={(e) => e.stopPropagation()}\n\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\" z-50 w-full rounded-lg shadow-lg bg-content1\",\n placementVariants({ placement }),\n\t\t\t\t\t\t\t\t\tsizeVariants({ size }),\n\t\t\t\t\t\t\t\t\tradiusVariants({ radius }),\n\t\t\t\t\t\t\t\t\tshadowVariants({ shadow }),\n\t\t\t\t\t\t\t\t\tclassNameDialog,\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\tstyle={style}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<div className={cn(\"modal-custom-content w-full flex flex-col max-h-[calc(100vh_-_4rem)]\", classNameContent)} style={styleContainer}>\n\t\t\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</m.div>\n\t\t\t\t\t\t</>\n\t\t\t\t\t</LazyMotion>\n\t\t\t\t)}\n\t\t\t</AnimatePresence>,\n\t\t\tmodalRoot,\n\t\t);\n\t},\n);\nModal.displayName = \"ModalPortalComponent\";\n\nexport const ModalHeader = ({ title, showCloseButton = true, disabled = false, onClick, className, styled, children, ...props }: ModalHeaderType) => {\n\treturn (\n\t\t<div className={cn(\"modal-custom-header-container w-full\")} style={styled}>\n\t\t\t<div className={cn(\"w-full flex py-4 px-6 flex-initial text-large font-semibold\", className)} {...props}>\n\t\t\t\t{children || <header className=\"modal-custom-title text-lg leading-none font-semibold\">{title}</header>}\n\t\t\t</div>\n\n\t\t\t{showCloseButton && (\n\t\t\t\t<div className=\"absolute top-2.5 right-2.5 disabled:pointer-events-none z-10\">\n\t\t\t\t\t<Button\n\t\t\t\t\t\tisIconOnly\n\t\t\t\t\t\tvariant=\"light\"\n\t\t\t\t\t\tradius=\"full\"\n\t\t\t\t\t\taria-label=\"Close\"\n\t\t\t\t\t\tonClick={onClick}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\tclassName=\"p-0 w-[36px] h-[36px] min-w-auto bg-default-100 hover:bg-default-200 text-default-500 hover:text-default-600 dark:bg-default-100 dark:hover:bg-default-200 dark:text-default-500 dark:hover:text-default-600 disabled:opacity-50 disabled:pointer-events-none\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<svg width=\"20\" height=\"20\" fill=\"currentColor\" role=\"img\" aria-hidden=\"true\">\n\t\t\t\t\t\t\t<path fill=\"none\" d=\"M0 0h21v21H0z\"></path>\n\t\t\t\t\t\t\t<path d=\"m12.12 10 4.07-4.06a1.5 1.5 0 1 0-2.11-2.12L10 7.88 5.94 3.81a1.5 1.5 0 1 0-2.12 2.12L7.88 10l-4.07 4.06a1.5 1.5 0 0 0 0 2.12 1.51 1.51 0 0 0 2.13 0L10 12.12l4.06 4.07a1.45 1.45 0 0 0 1.06.44 1.5 1.5 0 0 0 1.06-2.56Z\"></path>\n\t\t\t\t\t\t</svg>\n\t\t\t\t\t\t<span className=\"sr-only\">Close</span>\n\t\t\t\t\t</Button>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nexport const ModalBody = forwardRef(({ children, className = \"\", styled, height }: ModalBodyType, ref: Ref<HTMLDivElement>) => {\n\treturn (\n\t\t<div\n\t\t\tclassName={cn(\"modal-custom-body flex flex-1 flex-col gap-3 px-6 overflow-y-auto\", className)}\n\t\t\tref={ref}\n\t\t\tstyle={{ ...styled, height: height ? `${height}px` : \"auto\" }}\n\t\t>\n\t\t\t{children}\n\t\t</div>\n\t);\n});\nModalBody.displayName = \"ModalBodyPortalComponent\";\n\nexport const ModalFooter = ({ children, className, styled }: ModalFooterType) => {\n\treturn (\n\t\t<div\n\t\t\tclassName={cn(\"modal-custom-footer flex flex-col-reverse px-6 py-3 gap-2 sm:flex-row sm:justify-end mt-auto\", className)}\n\t\t\tstyle={styled}\n\t\t>\n\t\t\t{children}\n\t\t</div>\n\t);\n};\n"],"names":["TRANSITION_EASINGS","TRANSITION_VARIANTS","backdropVariants","cva","sizeVariants","radiusVariants","placementVariants","shadowVariants","Modal","forwardRef","modalId","isShow","isVisible","children","style","classNameOverlay","styleContainer","onClickOutside","classNameDialog","classNameContent","backdrop","size","isKeyboardDismissDisabled","shadow","radius","placement","ref","modalOverlayRef","useRef","useEffect","handleKeyDown","e","modalRoot","ReactDOM","AnimatePresence","jsx","LazyMotion","res","jsxs","Fragment","m","cn","ModalHeader","title","showCloseButton","disabled","onClick","className","styled","props","Button","ModalBody","height","ModalFooter"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../chunks/jsx-runtime-BjzqJBtL.js"),p=require("
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../chunks/jsx-runtime-BjzqJBtL.js"),p=require("../chunks/bundle-mjs-8z5d_e-8.js"),R=require("../chunks/index-CeBD7F1N.js"),h=require("react"),g=require("../chunks/clsx-C11secjj.js");require("../chunks/textarea-D9X4fUkV.js");const m=require("../chunks/select-DGSPwoy8.js");require("../chunks/button-DFrxQHAW.js");const j=({className:u,color:e="primary",active:t,children:o,text:r,onClick:l})=>{const c=g.clsx({"bg-primary":e==="primary"&&t,"bg-success":e==="success"&&t,"bg-danger":e==="danger"&&t,"bg-warning":e==="warning"&&t,"bg-default":e==="default"&&t,"dark:hover:bg-default-200 dark:hover:text-default-800":!t}),d=p.twMerge(g.clsx("text-sm",{"group-hover:text-primary-500 dark:group-hover:text-default-800":e==="primary"&&!t,"group-hover:text-success-500 dark:group-hover:text-default-800":e==="success"&&!t,"group-hover:text-danger-500 dark:group-hover:text-default-800":e==="danger"&&!t,"group-hover:text-warning-500 dark:group-hover:text-default-800":e==="warning"&&!t,"group-hover:text-default-500 dark:group-hover:text-default-800":e==="default"&&!t,"text-default-foreground":t&&e==="default","text-primary-foreground":t&&e==="primary","text-success-foreground":t&&e==="success","text-danger-foreground":t&&e==="danger","text-warning-foreground":t&&e==="warning"}));return s.jsxRuntimeExports.jsx("div",{className:p.twMerge("w-[33px] h-[32px] flex items-center justify-center group ",c,u),onClick:l,children:o||s.jsxRuntimeExports.jsx("p",{className:d,children:r})})},y=({page:u,total:e,siblings:t=1})=>{if(7+t>=e)return Array.from({length:e},(n,x)=>x+1);const r=Math.max(u-t,1),l=Math.min(u+t,e),c=r>2,d=l<e-2;if(!c&&d){const n=3+2*t;return[...Array.from({length:n},(i,f)=>f+1),"...",e]}else if(c&&!d){const n=3+2*t;return[1,"...",...Array.from({length:n},(i,f)=>e-n+f+1)]}else return[1,"...",...Array.from({length:l-r+1},(x,i)=>r+i),"...",e]},k=u=>u.map(e=>({id:e,name:e})),v=({className:u,color:e="primary",total:t,limit:o=20,page:r=1,siblings:l=1,isLimitSelect:c=!0,dataLimit:d=[10,15,20,50,100,200],onChange:n,translate:x={selectLimit:"Limites",rowPerPage:"Filas por pagina",of:"de"}})=>{const i=Math.ceil(t/o),f=y({page:r,siblings:l,total:i}),b=k(d),w=a=>{a!=="..."&&n&&n({limit:o,page:Number(a)})},E=()=>{r!==1&&n&&n({limit:o,page:r-1})},P=()=>{r===i||i===0||n&&n({limit:o,page:r+1})},N=a=>{n&&n({page:r,limit:a?Number(a):20})};return s.jsxRuntimeExports.jsxs("div",{className:p.twMerge("flex justify-between gap-x-2 items-center",u),children:[c?s.jsxRuntimeExports.jsxs("div",{className:"flex items-center gap-x-2.5",children:[s.jsxRuntimeExports.jsx("div",{children:s.jsxRuntimeExports.jsxs("span",{className:"text-sm text-default-500",children:[x?.rowPerPage||"Filas por pagina",":"]})}),s.jsxRuntimeExports.jsxs(m.Select,{value:o?.toString(),onValueChange:N,children:[s.jsxRuntimeExports.jsx(m.SelectTrigger,{className:"min-w-20",children:s.jsxRuntimeExports.jsx(m.SelectValue,{placeholder:"Select limit"})}),s.jsxRuntimeExports.jsx(m.SelectContent,{children:s.jsxRuntimeExports.jsxs(m.SelectGroup,{children:[s.jsxRuntimeExports.jsx(m.SelectLabel,{children:x?.selectLimit||"Limites"}),b.map(a=>s.jsxRuntimeExports.jsx(m.SelectItem,{value:a.id?.toString(),children:a.name},a.id))]})})]}),s.jsxRuntimeExports.jsxs("div",{className:"text-sm text-default-500",children:[s.jsxRuntimeExports.jsx("span",{className:"text-default-500",children:`${r} - ${o}`})," ",x?.of||"de"," ",s.jsxRuntimeExports.jsx("span",{className:"text-default-500",children:t})]})]}):null,i>1&&s.jsxRuntimeExports.jsxs("div",{className:"flex flex-nowrap h-fit max-w-fit relative items-center overflow-visible gap-0 border border-divider rounded-lg cursor-pointer dark:bg-default-100",children:[s.jsxRuntimeExports.jsx(j,{className:g.clsx(r===1&&"cursor-no-drop","rounded-tl-lg rounded-bl-lg "),onClick:E,children:s.jsxRuntimeExports.jsx(R.IoIosArrowBack,{className:p.twMerge("fill-default-500",g.clsx(r===1&&"fill-default-300"))})}),f.map((a,S)=>s.jsxRuntimeExports.jsx(j,{text:a,active:r===a,color:e,onClick:()=>w(a),className:"border-l border-divider "},S)),s.jsxRuntimeExports.jsx(j,{className:g.clsx("border-l border-divider rounded-tr-lg rounded-br-lg ",(r===i||i===0)&&"cursor-no-drop"),onClick:P,children:s.jsxRuntimeExports.jsx(R.IoIosArrowBack,{className:p.twMerge("fill-default-500 transform rotate-180 ",g.clsx((r===i||i===0)&&"fill-default-300"))})})]})]})},I=({initialPage:u=1,initialLimit:e=20})=>{const[t,o]=h.useState(u),[r,l]=h.useState(e);return{handleSetPagination:h.useCallback(({page:d,limit:n})=>{d!==t&&o(d),n!==r&&l(n)},[r,t]),page:t,limit:r}};exports.Pagination=v;exports.usePagination=I;
|
|
2
2
|
//# sourceMappingURL=index.cjs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs.js","sources":["../../src/components/pagination/pagination-item.tsx","../../src/components/pagination/function/index.ts","../../src/components/pagination/pagination.tsx","../../src/components/pagination/hook/use-pagination.tsx"],"sourcesContent":["import { twMerge } from \"tailwind-merge\";\nimport { type PaginationItemProps } from \"./interface/pagination.interface\";\nimport clsx from \"clsx\";\n\nexport const PaginationItem = ({ className, color = \"primary\", active, children, text, onClick }: PaginationItemProps) => {\n\tconst bgClass = clsx(\n\t\t{\n\t\t\t\"bg-primary\": color === \"primary\" && active,\n\t\t\t\"bg-success\": color === \"success\" && active,\n\t\t\t\"bg-danger\": color === \"danger\" && active,\n\t\t\t\"bg-warning\": color === \"warning\" && active,\n\t\t\t\"bg-default\": color === \"default\" && active,\n \"dark:hover:bg-default-200 dark:hover:text-default-800\": !active,\n\t\t},\n\t);\n\tconst colorClass = twMerge(\n\t\tclsx(\"text-sm\", {\n\t\t\t\"group-hover:text-primary-500 dark:group-hover:text-default-800\": color === \"primary\" && !active,\n\t\t\t\"group-hover:text-success-500 dark:group-hover:text-default-800\": color === \"success\" && !active,\n\t\t\t\"group-hover:text-danger-500 dark:group-hover:text-default-800\": color === \"danger\" && !active,\n\t\t\t\"group-hover:text-warning-500 dark:group-hover:text-default-800\": color === \"warning\" && !active,\n\t\t\t\"group-hover:text-default-500 dark:group-hover:text-default-800\": color === \"default\" && !active,\n\n\t\t\t\"text-default-foreground\": active && color === \"default\",\n\t\t\t\"text-primary-foreground\": active && color === \"primary\",\n\t\t\t\"text-success-foreground\": active && color === \"success\",\n\t\t\t\"text-danger-foreground\": active && color === \"danger\",\n\t\t\t\"text-warning-foreground\": active && color === \"warning\",\n\t\t}),\n\t);\n\n\treturn (\n\t\t<div className={twMerge(\"w-[33px] h-[32px] flex items-center justify-center group \", bgClass, className)} onClick={onClick}>\n\t\t\t{children || <p className={colorClass}>{text}</p>}\n\t\t</div>\n\t);\n};\n","import { type PaginationValueProps } from \"../interface/pagination-share.interface\";\n\nexport const FormatPagePagination = ({\n\tpage,\n\ttotal,\n\tsiblings = 1,\n}: PaginationValueProps) => {\n\tconst totalPageNoInArray = 7 + siblings;\n\n\tif (totalPageNoInArray >= total) {\n\t\treturn Array.from({ length: total }, (_, i) => i + 1);\n\t}\n\n\tconst leftSiblingsIndex = Math.max(page - siblings, 1);\n\tconst rightSiblingsIndex = Math.min(page + siblings, total);\n\n\tconst showLeftDots = leftSiblingsIndex > 2;\n\tconst showRightDots = rightSiblingsIndex < total - 2;\n\n\tif (!showLeftDots && showRightDots) {\n\t\tconst leftItemsCount = 3 + 2 * siblings;\n\t\tconst leftRange = Array.from({ length: leftItemsCount }, (_, i) => i + 1);\n\t\treturn [...leftRange, \"...\", total];\n\t} else if (showLeftDots && !showRightDots) {\n\t\tconst rightItemsCount = 3 + 2 * siblings;\n\t\tconst rightRange = Array.from(\n\t\t\t{ length: rightItemsCount },\n\t\t\t(_, i) => total - rightItemsCount + i + 1\n\t\t);\n\t\treturn [1, \"...\", ...rightRange];\n\t} else {\n\t\tconst middleRange = Array.from(\n\t\t\t{ length: rightSiblingsIndex - leftSiblingsIndex + 1 },\n\t\t\t(_, i) => leftSiblingsIndex + i\n\t\t);\n\t\treturn [1, \"...\", ...middleRange, \"...\", total];\n\t}\n};\n\nexport const FormatLimitPagination = (data: number[]) => {\n\treturn data.map((el) => {\n\t\treturn {\n\t\t\tid: el,\n\t\t\tname: el,\n\t\t};\n\t});\n};\n","import { twMerge } from \"tailwind-merge\";\nimport { IoIosArrowBack } from \"react-icons/io\";\nimport { PaginationItem } from \"./pagination-item\";\nimport { type PaginationProps } from \"./interface/pagination.interface\";\nimport { FormatLimitPagination, FormatPagePagination } from \"./function\";\nimport clsx from \"clsx\";\nimport { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectTrigger, SelectValue } from \"../ui\";\n\nexport const Pagination = ({\n\tclassName,\n\tcolor = \"primary\",\n\n\ttotal,\n\tlimit = 20,\n\tpage = 1,\n\tsiblings = 1,\n\tisLimitSelect = true,\n\tdataLimit = [10, 15, 20, 50, 100, 200],\n\tonChange,\n\ttranslate = {\n\t\tselectLimit: \"Limites\",\n\t\trowPerPage: \"Filas por pagina\",\n\t\tof: \"de\",\n\t},\n}: PaginationProps) => {\n\tconst totalPagination = Math.ceil(total / limit);\n\n\tconst dataPageFormat = FormatPagePagination({\n\t\tlimit,\n\t\tpage,\n\t\tsiblings,\n\t\ttotal: totalPagination,\n\t});\n\tconst dataLimitFormat = FormatLimitPagination(dataLimit);\n\n\tconst handleChange = (value: number | string | null) => {\n\t\tif (value === \"...\") return;\n\t\tif (onChange)\n\t\t\tonChange({\n\t\t\t\tlimit,\n\t\t\t\tpage: Number(value),\n\t\t\t});\n\t};\n\n\tconst handlePrev = () => {\n\t\tif (page === 1) return;\n\n\t\tif (onChange)\n\t\t\tonChange({\n\t\t\t\tlimit,\n\t\t\t\tpage: page - 1,\n\t\t\t});\n\t};\n\n\tconst handleNext = () => {\n\t\tif (page === totalPagination || totalPagination === 0) return;\n\n\t\tif (onChange)\n\t\t\tonChange({\n\t\t\t\tlimit,\n\t\t\t\tpage: page + 1,\n\t\t\t});\n\t};\n\n\tconst handleChangeSelect = (value: string) => {\n\t\tif (onChange)\n\t\t\tonChange({\n\t\t\t\tpage,\n\t\t\t\tlimit: value ? Number(value) : 20,\n\t\t\t});\n\t};\n\n\treturn (\n\t\t<div className={twMerge(\"flex justify-between gap-x-2 items-center\", className)}>\n\t\t\t{isLimitSelect ? (\n\t\t\t\t<div className=\"flex items-center gap-x-2.5\">\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<span className=\"text-sm text-default-500\">{translate?.rowPerPage || \"Filas por pagina\"}:</span>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<Select value={limit?.toString()} onValueChange={handleChangeSelect}>\n\t\t\t\t\t\t<SelectTrigger className=\"min-w-20\">\n\t\t\t\t\t\t\t<SelectValue placeholder=\"Select limit\" />\n\t\t\t\t\t\t</SelectTrigger>\n\t\t\t\t\t\t<SelectContent>\n\t\t\t\t\t\t\t<SelectGroup>\n\t\t\t\t\t\t\t\t<SelectLabel>{translate?.selectLimit || \"Limites\"}</SelectLabel>\n\t\t\t\t\t\t\t\t{dataLimitFormat.map((item) => (\n\t\t\t\t\t\t\t\t\t<SelectItem key={item.id} value={item.id?.toString()}>\n\t\t\t\t\t\t\t\t\t\t{item.name}\n\t\t\t\t\t\t\t\t\t</SelectItem>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</SelectGroup>\n\t\t\t\t\t\t</SelectContent>\n\t\t\t\t\t</Select>\n\n\t\t\t\t\t<div className=\"text-sm text-default-500\">\n\t\t\t\t\t\t<span className=\"text-default-500\">{`${page} - ${limit}`}</span> {translate?.of || \"de\"}{\" \"}\n\t\t\t\t\t\t<span className=\"text-default-500\">{total}</span>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t) : null}\n\n\t\t\t{totalPagination > 1 && (\n\t\t\t\t<div className=\"flex flex-nowrap h-fit max-w-fit relative items-center overflow-visible gap-0 border border-divider rounded-lg cursor-pointer dark:bg-default-100\">\n\t\t\t\t\t<PaginationItem className={clsx(page === 1 && \"cursor-no-drop\", \"rounded-tl-lg rounded-bl-lg \")} onClick={handlePrev}>\n\t\t\t\t\t\t<IoIosArrowBack className={twMerge(\"fill-default-500\", clsx(page === 1 && \"fill-default-300\"))} />\n\t\t\t\t\t</PaginationItem>\n\n\t\t\t\t\t{dataPageFormat.map((el, i) => (\n\t\t\t\t\t\t<PaginationItem\n\t\t\t\t\t\t\tkey={i}\n\t\t\t\t\t\t\ttext={el}\n\t\t\t\t\t\t\tactive={page === el}\n\t\t\t\t\t\t\tcolor={color}\n\t\t\t\t\t\t\tonClick={() => handleChange(el)}\n\t\t\t\t\t\t\tclassName=\"border-l border-divider \"\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\n\t\t\t\t\t<PaginationItem\n\t\t\t\t\t\tclassName={clsx(\n\t\t\t\t\t\t\t\"border-l border-divider rounded-tr-lg rounded-br-lg \",\n\t\t\t\t\t\t\t(page === totalPagination || totalPagination === 0) && \"cursor-no-drop\",\n\t\t\t\t\t\t)}\n\t\t\t\t\t\tonClick={handleNext}\n\t\t\t\t\t>\n\t\t\t\t\t\t<IoIosArrowBack\n\t\t\t\t\t\t\tclassName={twMerge(\n\t\t\t\t\t\t\t\t\"fill-default-500 transform rotate-180 \",\n\t\t\t\t\t\t\t\tclsx((page === totalPagination || totalPagination === 0) && \"fill-default-300\"),\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</PaginationItem>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n","import { useCallback, useState } from \"react\";\nimport { type PaginationHookProps, type UsePaginationProps } from \"../interface/pagination.interface\";\nimport { type PaginationSetValueProps } from \"../interface/pagination-share.interface\";\n\nexport const usePagination = ({ initialPage = 1, initialLimit = 20 }: UsePaginationProps): PaginationHookProps => {\n\tconst [pageCurrent, setPageCurrent] = useState<number>(initialPage);\n\tconst [limitCurrent, setLimitCurrent] = useState<number>(initialLimit);\n\n\tconst handleSetPagination = useCallback(\n\t\t({ page, limit }: PaginationSetValueProps) => {\n\t\t\tif (page !== pageCurrent) setPageCurrent(page);\n\t\t\tif (limit !== limitCurrent) setLimitCurrent(limit);\n\t\t},\n\t\t[limitCurrent, pageCurrent],\n\t);\n\n\treturn {\n\t\thandleSetPagination,\n\t\tpage: pageCurrent,\n\t\tlimit: limitCurrent,\n\t};\n};\n"],"names":["PaginationItem","className","color","active","children","text","onClick","bgClass","clsx","colorClass","twMerge","jsx","FormatPagePagination","page","total","siblings","_","i","leftSiblingsIndex","rightSiblingsIndex","showLeftDots","showRightDots","leftItemsCount","rightItemsCount","FormatLimitPagination","data","el","Pagination","limit","isLimitSelect","dataLimit","onChange","translate","totalPagination","dataPageFormat","dataLimitFormat","handleChange","value","handlePrev","handleNext","handleChangeSelect","jsxs","Select","SelectTrigger","SelectValue","SelectContent","SelectGroup","SelectLabel","item","SelectItem","IoIosArrowBack","usePagination","initialPage","initialLimit","pageCurrent","setPageCurrent","useState","limitCurrent","setLimitCurrent","useCallback"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.cjs.js","sources":["../../src/components/pagination/pagination-item.tsx","../../src/components/pagination/function/index.ts","../../src/components/pagination/pagination.tsx","../../src/components/pagination/hook/use-pagination.tsx"],"sourcesContent":["import { twMerge } from \"tailwind-merge\";\nimport { type PaginationItemProps } from \"./interface/pagination.interface\";\nimport clsx from \"clsx\";\n\nexport const PaginationItem = ({ className, color = \"primary\", active, children, text, onClick }: PaginationItemProps) => {\n\tconst bgClass = clsx(\n\t\t{\n\t\t\t\"bg-primary\": color === \"primary\" && active,\n\t\t\t\"bg-success\": color === \"success\" && active,\n\t\t\t\"bg-danger\": color === \"danger\" && active,\n\t\t\t\"bg-warning\": color === \"warning\" && active,\n\t\t\t\"bg-default\": color === \"default\" && active,\n \"dark:hover:bg-default-200 dark:hover:text-default-800\": !active,\n\t\t},\n\t);\n\tconst colorClass = twMerge(\n\t\tclsx(\"text-sm\", {\n\t\t\t\"group-hover:text-primary-500 dark:group-hover:text-default-800\": color === \"primary\" && !active,\n\t\t\t\"group-hover:text-success-500 dark:group-hover:text-default-800\": color === \"success\" && !active,\n\t\t\t\"group-hover:text-danger-500 dark:group-hover:text-default-800\": color === \"danger\" && !active,\n\t\t\t\"group-hover:text-warning-500 dark:group-hover:text-default-800\": color === \"warning\" && !active,\n\t\t\t\"group-hover:text-default-500 dark:group-hover:text-default-800\": color === \"default\" && !active,\n\n\t\t\t\"text-default-foreground\": active && color === \"default\",\n\t\t\t\"text-primary-foreground\": active && color === \"primary\",\n\t\t\t\"text-success-foreground\": active && color === \"success\",\n\t\t\t\"text-danger-foreground\": active && color === \"danger\",\n\t\t\t\"text-warning-foreground\": active && color === \"warning\",\n\t\t}),\n\t);\n\n\treturn (\n\t\t<div className={twMerge(\"w-[33px] h-[32px] flex items-center justify-center group \", bgClass, className)} onClick={onClick}>\n\t\t\t{children || <p className={colorClass}>{text}</p>}\n\t\t</div>\n\t);\n};\n","import { type PaginationValueProps } from \"../interface/pagination-share.interface\";\n\nexport const FormatPagePagination = ({\n\tpage,\n\ttotal,\n\tsiblings = 1,\n}: PaginationValueProps) => {\n\tconst totalPageNoInArray = 7 + siblings;\n\n\tif (totalPageNoInArray >= total) {\n\t\treturn Array.from({ length: total }, (_, i) => i + 1);\n\t}\n\n\tconst leftSiblingsIndex = Math.max(page - siblings, 1);\n\tconst rightSiblingsIndex = Math.min(page + siblings, total);\n\n\tconst showLeftDots = leftSiblingsIndex > 2;\n\tconst showRightDots = rightSiblingsIndex < total - 2;\n\n\tif (!showLeftDots && showRightDots) {\n\t\tconst leftItemsCount = 3 + 2 * siblings;\n\t\tconst leftRange = Array.from({ length: leftItemsCount }, (_, i) => i + 1);\n\t\treturn [...leftRange, \"...\", total];\n\t} else if (showLeftDots && !showRightDots) {\n\t\tconst rightItemsCount = 3 + 2 * siblings;\n\t\tconst rightRange = Array.from(\n\t\t\t{ length: rightItemsCount },\n\t\t\t(_, i) => total - rightItemsCount + i + 1\n\t\t);\n\t\treturn [1, \"...\", ...rightRange];\n\t} else {\n\t\tconst middleRange = Array.from(\n\t\t\t{ length: rightSiblingsIndex - leftSiblingsIndex + 1 },\n\t\t\t(_, i) => leftSiblingsIndex + i\n\t\t);\n\t\treturn [1, \"...\", ...middleRange, \"...\", total];\n\t}\n};\n\nexport const FormatLimitPagination = (data: number[]) => {\n\treturn data.map((el) => {\n\t\treturn {\n\t\t\tid: el,\n\t\t\tname: el,\n\t\t};\n\t});\n};\n","import { twMerge } from \"tailwind-merge\";\nimport { IoIosArrowBack } from \"react-icons/io\";\nimport { PaginationItem } from \"./pagination-item\";\nimport { type PaginationProps } from \"./interface/pagination.interface\";\nimport { FormatLimitPagination, FormatPagePagination } from \"./function\";\nimport clsx from \"clsx\";\nimport { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectTrigger, SelectValue } from \"../ui\";\n\nexport const Pagination = ({\n\tclassName,\n\tcolor = \"primary\",\n\n\ttotal,\n\tlimit = 20,\n\tpage = 1,\n\tsiblings = 1,\n\tisLimitSelect = true,\n\tdataLimit = [10, 15, 20, 50, 100, 200],\n\tonChange,\n\ttranslate = {\n\t\tselectLimit: \"Limites\",\n\t\trowPerPage: \"Filas por pagina\",\n\t\tof: \"de\",\n\t},\n}: PaginationProps) => {\n\tconst totalPagination = Math.ceil(total / limit);\n\n\tconst dataPageFormat = FormatPagePagination({\n\t\tlimit,\n\t\tpage,\n\t\tsiblings,\n\t\ttotal: totalPagination,\n\t});\n\tconst dataLimitFormat = FormatLimitPagination(dataLimit);\n\n\tconst handleChange = (value: number | string | null) => {\n\t\tif (value === \"...\") return;\n\t\tif (onChange)\n\t\t\tonChange({\n\t\t\t\tlimit,\n\t\t\t\tpage: Number(value),\n\t\t\t});\n\t};\n\n\tconst handlePrev = () => {\n\t\tif (page === 1) return;\n\n\t\tif (onChange)\n\t\t\tonChange({\n\t\t\t\tlimit,\n\t\t\t\tpage: page - 1,\n\t\t\t});\n\t};\n\n\tconst handleNext = () => {\n\t\tif (page === totalPagination || totalPagination === 0) return;\n\n\t\tif (onChange)\n\t\t\tonChange({\n\t\t\t\tlimit,\n\t\t\t\tpage: page + 1,\n\t\t\t});\n\t};\n\n\tconst handleChangeSelect = (value: string) => {\n\t\tif (onChange)\n\t\t\tonChange({\n\t\t\t\tpage,\n\t\t\t\tlimit: value ? Number(value) : 20,\n\t\t\t});\n\t};\n\n\treturn (\n\t\t<div className={twMerge(\"flex justify-between gap-x-2 items-center\", className)}>\n\t\t\t{isLimitSelect ? (\n\t\t\t\t<div className=\"flex items-center gap-x-2.5\">\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<span className=\"text-sm text-default-500\">{translate?.rowPerPage || \"Filas por pagina\"}:</span>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<Select value={limit?.toString()} onValueChange={handleChangeSelect}>\n\t\t\t\t\t\t<SelectTrigger className=\"min-w-20\">\n\t\t\t\t\t\t\t<SelectValue placeholder=\"Select limit\" />\n\t\t\t\t\t\t</SelectTrigger>\n\t\t\t\t\t\t<SelectContent>\n\t\t\t\t\t\t\t<SelectGroup>\n\t\t\t\t\t\t\t\t<SelectLabel>{translate?.selectLimit || \"Limites\"}</SelectLabel>\n\t\t\t\t\t\t\t\t{dataLimitFormat.map((item) => (\n\t\t\t\t\t\t\t\t\t<SelectItem key={item.id} value={item.id?.toString()}>\n\t\t\t\t\t\t\t\t\t\t{item.name}\n\t\t\t\t\t\t\t\t\t</SelectItem>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</SelectGroup>\n\t\t\t\t\t\t</SelectContent>\n\t\t\t\t\t</Select>\n\n\t\t\t\t\t<div className=\"text-sm text-default-500\">\n\t\t\t\t\t\t<span className=\"text-default-500\">{`${page} - ${limit}`}</span> {translate?.of || \"de\"}{\" \"}\n\t\t\t\t\t\t<span className=\"text-default-500\">{total}</span>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t) : null}\n\n\t\t\t{totalPagination > 1 && (\n\t\t\t\t<div className=\"flex flex-nowrap h-fit max-w-fit relative items-center overflow-visible gap-0 border border-divider rounded-lg cursor-pointer dark:bg-default-100\">\n\t\t\t\t\t<PaginationItem className={clsx(page === 1 && \"cursor-no-drop\", \"rounded-tl-lg rounded-bl-lg \")} onClick={handlePrev}>\n\t\t\t\t\t\t<IoIosArrowBack className={twMerge(\"fill-default-500\", clsx(page === 1 && \"fill-default-300\"))} />\n\t\t\t\t\t</PaginationItem>\n\n\t\t\t\t\t{dataPageFormat.map((el, i) => (\n\t\t\t\t\t\t<PaginationItem\n\t\t\t\t\t\t\tkey={i}\n\t\t\t\t\t\t\ttext={el}\n\t\t\t\t\t\t\tactive={page === el}\n\t\t\t\t\t\t\tcolor={color}\n\t\t\t\t\t\t\tonClick={() => handleChange(el)}\n\t\t\t\t\t\t\tclassName=\"border-l border-divider \"\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\n\t\t\t\t\t<PaginationItem\n\t\t\t\t\t\tclassName={clsx(\n\t\t\t\t\t\t\t\"border-l border-divider rounded-tr-lg rounded-br-lg \",\n\t\t\t\t\t\t\t(page === totalPagination || totalPagination === 0) && \"cursor-no-drop\",\n\t\t\t\t\t\t)}\n\t\t\t\t\t\tonClick={handleNext}\n\t\t\t\t\t>\n\t\t\t\t\t\t<IoIosArrowBack\n\t\t\t\t\t\t\tclassName={twMerge(\n\t\t\t\t\t\t\t\t\"fill-default-500 transform rotate-180 \",\n\t\t\t\t\t\t\t\tclsx((page === totalPagination || totalPagination === 0) && \"fill-default-300\"),\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</PaginationItem>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n","import { useCallback, useState } from \"react\";\nimport { type PaginationHookProps, type UsePaginationProps } from \"../interface/pagination.interface\";\nimport { type PaginationSetValueProps } from \"../interface/pagination-share.interface\";\n\nexport const usePagination = ({ initialPage = 1, initialLimit = 20 }: UsePaginationProps): PaginationHookProps => {\n\tconst [pageCurrent, setPageCurrent] = useState<number>(initialPage);\n\tconst [limitCurrent, setLimitCurrent] = useState<number>(initialLimit);\n\n\tconst handleSetPagination = useCallback(\n\t\t({ page, limit }: PaginationSetValueProps) => {\n\t\t\tif (page !== pageCurrent) setPageCurrent(page);\n\t\t\tif (limit !== limitCurrent) setLimitCurrent(limit);\n\t\t},\n\t\t[limitCurrent, pageCurrent],\n\t);\n\n\treturn {\n\t\thandleSetPagination,\n\t\tpage: pageCurrent,\n\t\tlimit: limitCurrent,\n\t};\n};\n"],"names":["PaginationItem","className","color","active","children","text","onClick","bgClass","clsx","colorClass","twMerge","jsx","FormatPagePagination","page","total","siblings","_","i","leftSiblingsIndex","rightSiblingsIndex","showLeftDots","showRightDots","leftItemsCount","rightItemsCount","FormatLimitPagination","data","el","Pagination","limit","isLimitSelect","dataLimit","onChange","translate","totalPagination","dataPageFormat","dataLimitFormat","handleChange","value","handlePrev","handleNext","handleChangeSelect","jsxs","Select","SelectTrigger","SelectValue","SelectContent","SelectGroup","SelectLabel","item","SelectItem","IoIosArrowBack","usePagination","initialPage","initialLimit","pageCurrent","setPageCurrent","useState","limitCurrent","setLimitCurrent","useCallback"],"mappings":"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"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { j as s } from "../chunks/jsx-runtime-Cl_4eDuT.js";
|
|
2
|
-
import {
|
|
2
|
+
import { t as x } from "../chunks/bundle-mjs-2oQ8XDAz.js";
|
|
3
3
|
import { I as p } from "../chunks/index-DK44x_HP.js";
|
|
4
4
|
import { useState as j, useCallback as k } from "react";
|
|
5
|
-
import f from "clsx";
|
|
6
|
-
import "../chunks/textarea-
|
|
7
|
-
import { S as v, a as I, b as C, c as L, d as R, e as A, f as F } from "../chunks/select-
|
|
8
|
-
import "../chunks/button-
|
|
5
|
+
import { c as f } from "../chunks/clsx-OuTLNxxd.js";
|
|
6
|
+
import "../chunks/textarea-BYbersWf.js";
|
|
7
|
+
import { S as v, a as I, b as C, c as L, d as R, e as A, f as F } from "../chunks/select-BwMqXSzv.js";
|
|
8
|
+
import "../chunks/button-uo4_Xad_.js";
|
|
9
9
|
const h = ({ className: o, color: e = "primary", active: r, children: i, text: t, onClick: u }) => {
|
|
10
|
-
const
|
|
10
|
+
const m = f(
|
|
11
11
|
{
|
|
12
12
|
"bg-primary": e === "primary" && r,
|
|
13
13
|
"bg-success": e === "success" && r,
|
|
@@ -30,19 +30,19 @@ const h = ({ className: o, color: e = "primary", active: r, children: i, text: t
|
|
|
30
30
|
"text-warning-foreground": r && e === "warning"
|
|
31
31
|
})
|
|
32
32
|
);
|
|
33
|
-
return /* @__PURE__ */ s.jsx("div", { className: x("w-[33px] h-[32px] flex items-center justify-center group ",
|
|
33
|
+
return /* @__PURE__ */ s.jsx("div", { className: x("w-[33px] h-[32px] flex items-center justify-center group ", m, o), onClick: u, children: i || /* @__PURE__ */ s.jsx("p", { className: l, children: t }) });
|
|
34
34
|
}, M = ({
|
|
35
35
|
page: o,
|
|
36
36
|
total: e,
|
|
37
37
|
siblings: r = 1
|
|
38
38
|
}) => {
|
|
39
39
|
if (7 + r >= e)
|
|
40
|
-
return Array.from({ length: e }, (a,
|
|
41
|
-
const t = Math.max(o - r, 1), u = Math.min(o + r, e),
|
|
42
|
-
if (!
|
|
40
|
+
return Array.from({ length: e }, (a, c) => c + 1);
|
|
41
|
+
const t = Math.max(o - r, 1), u = Math.min(o + r, e), m = t > 2, l = u < e - 2;
|
|
42
|
+
if (!m && l) {
|
|
43
43
|
const a = 3 + 2 * r;
|
|
44
44
|
return [...Array.from({ length: a }, (d, g) => g + 1), "...", e];
|
|
45
|
-
} else if (
|
|
45
|
+
} else if (m && !l) {
|
|
46
46
|
const a = 3 + 2 * r;
|
|
47
47
|
return [1, "...", ...Array.from(
|
|
48
48
|
{ length: a },
|
|
@@ -51,7 +51,7 @@ const h = ({ className: o, color: e = "primary", active: r, children: i, text: t
|
|
|
51
51
|
} else
|
|
52
52
|
return [1, "...", ...Array.from(
|
|
53
53
|
{ length: u - t + 1 },
|
|
54
|
-
(
|
|
54
|
+
(c, d) => t + d
|
|
55
55
|
), "...", e];
|
|
56
56
|
}, _ = (o) => o.map((e) => ({
|
|
57
57
|
id: e,
|
|
@@ -63,10 +63,10 @@ const h = ({ className: o, color: e = "primary", active: r, children: i, text: t
|
|
|
63
63
|
limit: i = 20,
|
|
64
64
|
page: t = 1,
|
|
65
65
|
siblings: u = 1,
|
|
66
|
-
isLimitSelect:
|
|
66
|
+
isLimitSelect: m = !0,
|
|
67
67
|
dataLimit: l = [10, 15, 20, 50, 100, 200],
|
|
68
68
|
onChange: a,
|
|
69
|
-
translate:
|
|
69
|
+
translate: c = {
|
|
70
70
|
selectLimit: "Limites",
|
|
71
71
|
rowPerPage: "Filas por pagina",
|
|
72
72
|
of: "de"
|
|
@@ -98,22 +98,22 @@ const h = ({ className: o, color: e = "primary", active: r, children: i, text: t
|
|
|
98
98
|
});
|
|
99
99
|
};
|
|
100
100
|
return /* @__PURE__ */ s.jsxs("div", { className: x("flex justify-between gap-x-2 items-center", o), children: [
|
|
101
|
-
|
|
101
|
+
m ? /* @__PURE__ */ s.jsxs("div", { className: "flex items-center gap-x-2.5", children: [
|
|
102
102
|
/* @__PURE__ */ s.jsx("div", { children: /* @__PURE__ */ s.jsxs("span", { className: "text-sm text-default-500", children: [
|
|
103
|
-
|
|
103
|
+
c?.rowPerPage || "Filas por pagina",
|
|
104
104
|
":"
|
|
105
105
|
] }) }),
|
|
106
106
|
/* @__PURE__ */ s.jsxs(v, { value: i?.toString(), onValueChange: S, children: [
|
|
107
107
|
/* @__PURE__ */ s.jsx(I, { className: "min-w-20", children: /* @__PURE__ */ s.jsx(C, { placeholder: "Select limit" }) }),
|
|
108
108
|
/* @__PURE__ */ s.jsx(L, { children: /* @__PURE__ */ s.jsxs(R, { children: [
|
|
109
|
-
/* @__PURE__ */ s.jsx(A, { children:
|
|
109
|
+
/* @__PURE__ */ s.jsx(A, { children: c?.selectLimit || "Limites" }),
|
|
110
110
|
b.map((n) => /* @__PURE__ */ s.jsx(F, { value: n.id?.toString(), children: n.name }, n.id))
|
|
111
111
|
] }) })
|
|
112
112
|
] }),
|
|
113
113
|
/* @__PURE__ */ s.jsxs("div", { className: "text-sm text-default-500", children: [
|
|
114
114
|
/* @__PURE__ */ s.jsx("span", { className: "text-default-500", children: `${t} - ${i}` }),
|
|
115
115
|
" ",
|
|
116
|
-
|
|
116
|
+
c?.of || "de",
|
|
117
117
|
" ",
|
|
118
118
|
/* @__PURE__ */ s.jsx("span", { className: "text-default-500", children: r })
|
|
119
119
|
] })
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../chunks/jsx-runtime-BjzqJBtL.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../chunks/jsx-runtime-BjzqJBtL.js"),o=require("react"),a=require("libphonenumber-js"),p=require("../chunks/bundle-mjs-8z5d_e-8.js"),ae=require("../chunks/utils-CxdrMFeI.js");require("../chunks/textarea-D9X4fUkV.js");const ie=require("../chunks/label-error-B8Rq-HGY.js"),D=require("../chunks/scroll-area-B0mWCpSW.js");require("../chunks/button-DFrxQHAW.js");const $=require("../chunks/index-BydcKEwP.js"),z=require("../chunks/index-lrI_r1ww.js"),F=require("../chunks/features-animation-BoXKk5t2.js"),E={PE:{name:"Perú",flag:"🇵🇪"},US:{name:"Estados Unidos",flag:"🇺🇸"},MX:{name:"México",flag:"🇲🇽"},AR:{name:"Argentina",flag:"🇦🇷"},CO:{name:"Colombia",flag:"🇨🇴"},CL:{name:"Chile",flag:"🇨🇱"},BR:{name:"Brasil",flag:"🇧🇷"},BO:{name:"Bolivia",flag:"🇧🇴"},VE:{name:"Venezuela",flag:"🇻🇪"}},le=({id:Y,name:U,label:S="Teléfono",placeholder:J="Ingrese un número de teléfono",required:W=!1,className:X="",classNameContainer:G="",onCountryChange:H,onPhoneChange:q,touched:C,onBlur:K,error:x,value:u,defaultCountry:g="PE",disabled:h=!1})=>{const[r,I]=o.useState({code:g,name:E[g].name,flag:E[g].flag,callingCode:`+${a.getCountryCallingCode(g)}`}),[j,R]=o.useState(!1),[b,d]=o.useState(""),[Q,i]=o.useState(""),[Z,m]=o.useState(!1),[l,_]=o.useState([]),[f,P]=o.useState(""),[ee,y]=o.useState([]),N=o.useRef(null),A=o.useRef(null),M=o.useRef(null),te=o.useId(),T=Y||te,L=u!==void 0;o.useEffect(()=>{const e=Object.keys(E).map(n=>{const s=E[n];return{code:n,name:s.name,flag:s.flag,callingCode:`+${a.getCountryCallingCode(n)}`}});_(e),y(e)},[]),o.useEffect(()=>{const e=n=>{N.current&&!N.current.contains(n.target)&&R(!1)};return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[]),o.useEffect(()=>{if(!L||l.length===0)return;if(u===""||u==null){d(""),i(""),m(!1);return}const e=String(u);let n=l.find(s=>e.startsWith(s.callingCode));if(n||(n=r),n){r.code!==n.code&&I(n);const s=e.replace(n.callingCode,"").replace(/[^\d]/g,"");d(s);const c=new a.AsYouType(n.code).input(s);i(c);const v=a.isValidPhoneNumber(e);m(v)}else d(""),i(""),m(!1)},[u,l,L,r]);const se=(e,n)=>{const s=e.replace(/[^\d]/g,"");if(n?.nativeEvent instanceof InputEvent&&n.nativeEvent.inputType==="deleteContentBackward"&&s.length<4){d(s),i(s);return}const c=new a.AsYouType(r.code).input(s);d(s),i(c);const v=r.callingCode+s,V=a.isValidPhoneNumber(v);m(V),q?.(v,V)},ne=e=>{if(I(e),R(!1),P(""),b){const s=new a.AsYouType(e.code).input(b);i(s);const w=e.callingCode+b,c=a.isValidPhoneNumber(w);m(c),q?.(w,c)}H?.(e),setTimeout(()=>A.current?.focus(),100)},oe=()=>{R(!j),j||setTimeout(()=>M.current?.focus(),100)};o.useEffect(()=>{if(!f.trim())y(l);else{const e=f.toLowerCase(),n=l.filter(s=>s.name.toLowerCase().includes(e)||s.callingCode.includes(f)||s.code.toLowerCase().includes(e));y(n)}},[f,l]);const re=C,O=x,k=re&&O,B=!h&&!!x&&C;return t.jsxRuntimeExports.jsxs("div",{className:p.twMerge("w-full relative flex flex-col",G),children:[S&&t.jsxRuntimeExports.jsxs("label",{htmlFor:T,className:ae.cn("form-control-label block font-normal text-sm text-foreground mb-1",{"text-danger":k}),children:[S," ",W&&t.jsxRuntimeExports.jsx("span",{className:"text-danger",children:"*"})]}),t.jsxRuntimeExports.jsxs("div",{className:p.twMerge("flex w-full min-w-0 transition-[color,box-shadow] outline-none rounded-md h-input-default","bg-white border border-input","disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",k?"border-danger aria-invalid:ring-danger/20":"focus-within:border-primary focus-within:ring-primary/20","focus-within:ring-[3px]"),"aria-invalid":B?"true":"false",children:[t.jsxRuntimeExports.jsxs("div",{className:"relative",ref:N,children:[t.jsxRuntimeExports.jsxs("button",{type:"button",onClick:oe,className:p.twMerge("flex items-center gap-2 px-3 border-r border-input h-input-default","hover:bg-muted/20 focus:outline-none rounded-l-md"),children:[t.jsxRuntimeExports.jsx("span",{className:"text-lg",children:r.flag}),t.jsxRuntimeExports.jsx("span",{className:"text-sm font-medium text-foreground",children:r.callingCode}),t.jsxRuntimeExports.jsx($.ChevronDown,{className:`w-4 h-4 text-muted-foreground transition-transform ${j?"rotate-180":""}`})]}),t.jsxRuntimeExports.jsx(z.AnimatePresence,{children:j&&t.jsxRuntimeExports.jsx(z.LazyMotion,{features:F.domAnimation,children:t.jsxRuntimeExports.jsxs(F.m.div,{initial:{opacity:0,y:-8,scale:.98},animate:{opacity:1,y:0,scale:1,transition:{type:"spring",stiffness:420,damping:28}},exit:{opacity:0,y:-6,scale:.98,transition:{duration:.15,ease:"easeOut"}},style:{transformOrigin:"top center"},className:"absolute top-full left-0 z-50 w-60 mt-1 bg-white border border-input rounded-md shadow-lg max-h-60 overflow-hidden",children:[t.jsxRuntimeExports.jsx("div",{className:"sticky top-0 bg-white border-b border-input p-3",children:t.jsxRuntimeExports.jsxs("div",{className:"relative",children:[t.jsxRuntimeExports.jsx(D.Search,{className:"absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground"}),t.jsxRuntimeExports.jsx("input",{ref:M,type:"text",value:f,onChange:e=>P(e.target.value),placeholder:"Buscar país o código",className:"w-full pl-10 pr-3 py-2 h-9 border border-input rounded-md text-sm focus:outline-none focus:border-primary focus:ring-[3px] focus:ring-primary/20"})]})}),t.jsxRuntimeExports.jsx(D.ScrollArea,{className:"max-h-48 overflow-y-auto pb-5",children:ee.map(e=>t.jsxRuntimeExports.jsxs("button",{type:"button",onClick:()=>ne(e),className:p.twMerge("w-full flex items-center gap-3 px-3 py-1 text-sm transition",r.code===e.code?"bg-primary/5 border-l-2 border-primary":"hover:bg-muted/20"),children:[t.jsxRuntimeExports.jsx("span",{className:"text-lg",children:e.flag}),t.jsxRuntimeExports.jsx("span",{className:"flex-1 text-left",children:e.name}),t.jsxRuntimeExports.jsx("span",{className:"text-muted-foreground",children:e.callingCode}),r.code===e.code&&t.jsxRuntimeExports.jsx($.Check,{className:"w-4 h-4 text-primary"})]},e.code))})]},"country-dropdown")})})]}),t.jsxRuntimeExports.jsx("input",{ref:A,id:T,type:"tel",name:U,value:Q,onChange:e=>se(e.target.value,e),onBlur:K,placeholder:J,disabled:h,...h?{}:{"aria-invalid":B},className:p.twMerge("flex-1 px-3 py-1 h-input-default border-0 rounded-r-md bg-transparent focus:outline-none text-foreground text-sm",X),autoComplete:"tel"})]}),!h&&x&&C&&t.jsxRuntimeExports.jsx(ie.LabelError,{text:x||O||""})]})};exports.PhoneInput=le;
|
|
2
2
|
//# sourceMappingURL=index.cjs.js.map
|