lizaui 8.3.9 → 8.5.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 +1 -1
- package/dist/calendar/index.es.js +1 -1
- package/dist/chunks/{button-DaAJ3J_i.js → button-DFrxQHAW.js} +2 -2
- package/dist/chunks/{button-DaAJ3J_i.js.map → button-DFrxQHAW.js.map} +1 -1
- package/dist/chunks/{button-DJYse8Dw.js → button-uo4_Xad_.js} +2 -2
- package/dist/chunks/{button-DJYse8Dw.js.map → button-uo4_Xad_.js.map} +1 -1
- 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-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-VJ2Qvmen.js → index-ybbFyaIJ.js} +4 -4
- package/dist/chunks/{index-VJ2Qvmen.js.map → index-ybbFyaIJ.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-BwqigcJy.js → scroll-area-B0mWCpSW.js} +2 -2
- package/dist/chunks/{scroll-area-BwqigcJy.js.map → scroll-area-B0mWCpSW.js.map} +1 -1
- package/dist/chunks/{scroll-area-1okMO4N6.js → scroll-area-CNrVfRxh.js} +3 -3
- package/dist/chunks/{scroll-area-1okMO4N6.js.map → scroll-area-CNrVfRxh.js.map} +1 -1
- package/dist/chunks/{select-B6a8A7js.js → select-DET3MySD.js} +3 -3
- package/dist/chunks/{select-B6a8A7js.js.map → select-DET3MySD.js.map} +1 -1
- package/dist/chunks/{select-CFefk2Xz.js → select-DGSPwoy8.js} +2 -2
- package/dist/chunks/{select-CFefk2Xz.js.map → select-DGSPwoy8.js.map} +1 -1
- package/dist/chunks/{textarea-BPsle-xc.js → textarea-BYbersWf.js} +32 -31
- package/dist/chunks/{textarea-BPsle-xc.js.map → textarea-BYbersWf.js.map} +1 -1
- package/dist/chunks/{textarea-C2i9A3jn.js → textarea-D9X4fUkV.js} +12 -12
- package/dist/chunks/{textarea-C2i9A3jn.js.map → textarea-D9X4fUkV.js.map} +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 +15 -14
- package/dist/modal/index.es.js.map +1 -1
- package/dist/pagination/index.cjs.js +1 -1
- package/dist/pagination/index.es.js +3 -3
- package/dist/phone-input/index.cjs.js +14 -1
- package/dist/phone-input/index.cjs.js.map +1 -1
- package/dist/phone-input/index.es.js +3332 -137
- package/dist/phone-input/index.es.js.map +1 -1
- package/dist/ripple/index.cjs.js +1 -1
- package/dist/ripple/index.es.js +1 -1
- package/dist/table/index.cjs.js +1 -1
- package/dist/table/index.cjs.js.map +1 -1
- package/dist/table/index.es.js +11 -11
- package/dist/table/index.es.js.map +1 -1
- package/dist/time-input/index.cjs.js +1 -1
- package/dist/time-input/index.es.js +2 -2
- package/dist/ui/index.cjs.js +1 -1
- package/dist/ui/index.es.js +8 -8
- package/package.json +1 -1
- package/dist/chunks/ripple-DMI95LHg.js +0 -68
- package/dist/chunks/ripple-DieNd7XQ.js +0 -2
package/dist/modal/index.cjs.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../chunks/jsx-runtime-BjzqJBtL.js"),z=require("react-dom"),i=require("react"),o=require("../chunks/utils-CxdrMFeI.js"),A=require("../chunks/button-DFrxQHAW.js"),m=require("../chunks/index-nwdlcB7h.js"),v=require("../chunks/index-lrI_r1ww.js"),h=require("../chunks/features-animation-BoXKk5t2.js"),x={ease:[.36,.66,.4,1]},y={scaleInOut:{enter:{transform:"scale(1)",opacity:1,transition:{duration:.4,ease:x.ease}},exit:{transform:"scale(1.03)",opacity:0,transition:{duration:.3,ease:x.ease}}},fade:{enter:{opacity:1,transition:{duration:.4,ease:x.ease}},exit:{opacity:0,transition:{duration:.3,ease:x.ease}}}},L=m.cva("",{variants:{backdrop:{transparent:"bg-transparent",opaque:"bg-black/50",blur:"backdrop-blur-md backdrop-saturate-150 bg-overlay/30"}},defaultVariants:{backdrop:"opaque"}}),P=m.cva("",{variants:{size:{xs:"max-w-xs",sm:"max-w-sm",md:"max-w-md",lg:"max-w-lg",xl:"max-w-xl","2xl":"max-w-2xl","3xl":"max-w-3xl","4xl":"max-w-4xl","5xl":"max-w-5xl",full:"my-0 mx-0 sm:mx-0 sm:my-0 max-w-full h-[100dvh] min-h-[100dvh] !rounded-none"}},defaultVariants:{size:"md"}}),O=m.cva("",{variants:{radius:{none:"rounded-none",sm:"rounded-sm",md:"rounded-md",lg:"rounded-lg"}},defaultVariants:{radius:"lg"}}),T=m.cva("",{variants:{placement:{center:"fixed top-[50%] left-[50%] translate-x-[-50%] translate-y-[-50%]",top:"fixed top-0 left-[50%] translate-x-[-50%] sm:mt-8",bottom:"fixed bottom-0 left-[50%] translate-x-[-50%] sm:mb-8"}},defaultVariants:{placement:"center"}}),B=m.cva("",{variants:{shadow:{none:"shadow-none",sm:"shadow-sm",md:"shadow-md",lg:"shadow-lg"}},defaultVariants:{shadow:"md"}}),j=i.forwardRef(({modalId:n,isShow:t,isVisible:a,children:s,style:l,classNameOverlay:u="",styleContainer:c,onClickOutside:d,classNameDialog:w="modal-custom-dialog",classNameContent:b="",backdrop:R="opaque",size:E="md",isKeyboardDismissDisabled:f=!1,shadow:N="md",radius:M="lg",placement:k="center"},q)=>{const I=i.useRef(null);if(i.useEffect(()=>(typeof window<"u"&&a&&document.body.classList.add("modal-open"),()=>{typeof window<"u"&&document.body.classList.remove("modal-open")}),[a]),i.useEffect(()=>{const r=V=>{V.key==="Escape"&&!f&&d?.()};return t&&document.addEventListener("keydown",r),()=>{document.removeEventListener("keydown",r)}},[t,f,d]),typeof window>"u")return null;const p=document.getElementById("modal-root");return p?z.createPortal(e.jsxRuntimeExports.jsx(v.AnimatePresence,{children:t&&e.jsxRuntimeExports.jsx(v.LazyMotion,{features:()=>Promise.resolve().then(()=>require("../chunks/index-CL73JQgs.js")).then(r=>r.domAnimation),children:e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(h.m.div,{initial:"exit",animate:"enter",exit:"exit",variants:y.fade,className:o.cn("fixed inset-0 z-50",L({backdrop:R}),u),onClick:d,"aria-hidden":!t,role:"dialog","aria-modal":"true",tabIndex:-1,ref:I},"modal-overlay"),e.jsxRuntimeExports.jsx(h.m.div,{initial:"exit",animate:"enter",exit:"exit",variants:y.scaleInOut,ref:q,id:n,onClick:r=>r.stopPropagation(),className:o.cn(" z-50 w-full rounded-lg shadow-lg bg-content1",T({placement:k}),P({size:E}),O({radius:M}),B({shadow:N}),w),style:l,children:e.jsxRuntimeExports.jsx("div",{className:o.cn("modal-custom-content w-full flex flex-col max-h-[calc(100vh_-_4rem)]",b),style:c,children:s})},"modal-content")]})})}),p):null});j.displayName="ModalPortalComponent";const C=({title:n,showCloseButton:t=!0,disabled:a=!1,onClick:s,className:l,styled:u,children:c,...d})=>e.jsxRuntimeExports.jsxs("div",{className:o.cn("modal-custom-header-container w-full"),style:u,children:[e.jsxRuntimeExports.jsx("div",{className:o.cn("w-full flex py-4 px-6 flex-initial text-large font-semibold",l),...d,children:c||e.jsxRuntimeExports.jsx("header",{className:"modal-custom-title text-lg leading-none font-semibold",children:n})}),t&&e.jsxRuntimeExports.jsx("div",{className:"absolute top-2.5 right-2.5 disabled:pointer-events-none z-10",children:e.jsxRuntimeExports.jsxs(A.Button,{isIconOnly:!0,variant:"light",radius:"full","aria-label":"Close",onClick:s,disabled:a,className:"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",children:[e.jsxRuntimeExports.jsxs("svg",{width:"20",height:"20",fill:"currentColor",role:"img","aria-hidden":"true",children:[e.jsxRuntimeExports.jsx("path",{fill:"none",d:"M0 0h21v21H0z"}),e.jsxRuntimeExports.jsx("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"})]}),e.jsxRuntimeExports.jsx("span",{className:"sr-only",children:"Close"})]})})]}),g=i.forwardRef(({children:n,className:t="",styled:a,height:s},l)=>e.jsxRuntimeExports.jsx("div",{className:o.cn("modal-custom-body flex flex-1 flex-col gap-3 px-6 overflow-y-auto",t),ref:l,style:{...a,height:s?`${s}px`:"auto"},children:n}));g.displayName="ModalBodyPortalComponent";const S=({children:n,className:t,styled:a})=>e.jsxRuntimeExports.jsx("div",{className:o.cn("modal-custom-footer flex flex-col-reverse px-6 py-3 gap-2 sm:flex-row sm:justify-end mt-auto",t),style:a,children:n});exports.Modal=j;exports.ModalBody=g;exports.ModalFooter=S;exports.ModalHeader=C;
|
|
2
2
|
//# sourceMappingURL=index.cjs.js.map
|
|
@@ -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":"0YAgCaA,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,QAAA,QAAA,EAAA,KAAA,IAAA,QAAO,6BAAe,CAAA,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"}
|
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
|
|
2
|
+
import R from "react-dom";
|
|
3
|
+
import { forwardRef as y, useRef as z, useEffect as p } from "react";
|
|
4
4
|
import { c as n } from "../chunks/utils-CvyT6Z0O.js";
|
|
5
|
-
import { B as A } from "../chunks/button-
|
|
6
|
-
import { AnimatePresence as E, LazyMotion as _, m as h } from "framer-motion";
|
|
5
|
+
import { B as A } from "../chunks/button-uo4_Xad_.js";
|
|
7
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("../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-
|
|
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
|
|
@@ -3,9 +3,9 @@ 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
5
|
import { c as f } from "../chunks/clsx-OuTLNxxd.js";
|
|
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-
|
|
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-DET3MySD.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
10
|
const m = f(
|
|
11
11
|
{
|