@xanui/core 1.2.23 → 1.2.25

package/hooks/useTransition/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../src/hooks/useTransition/index.ts"],"sourcesContent":["import { ReactElement, cloneElement, Children, useState, useEffect, useId } from 'react';\nimport { animationEases } from '../useAnimation';\nimport { css } from '../../css';\nimport { formatCSSProp } from 'oncss';\nimport { CSSProps } from '../../css/types';\nimport * as variants from './variants'\nimport classNames from 'pretty-class';\n\n\nexport type UseTransitionVariantTypes = keyof typeof variants\nexport type UseTransitionState = \"open\" | \"opened\" | \"close\" | \"closed\"\n\nexport type UseTransitionVariant = (rect: DOMRect) => ({ from: CSSProps, to: CSSProps })\n\nexport type UseTransitionProps = {\n   open: boolean;\n   variant: UseTransitionVariant | UseTransitionVariantTypes;\n   ease?: string;\n   easing?: keyof typeof animationEases;\n   duration?: number;\n   delay?: number;\n   disableInitialTransition?: boolean;\n   exitOnUnmount?: boolean;\n   onOpen?: () => void;\n   onOpened?: () => void;\n   onClose?: () => void;\n   onClosed?: () => void;\n   onState?: (state: UseTransitionState) => void;\n}\n\n\nconst getVariant = (rect: any, variant: UseTransitionProps['variant']) => {\n   let fn = typeof variant === 'string' ? variants[variant] : variant\n   if (!fn) throw new Error(`Transition variant \"${variant}\" not found.`)\n   return fn(rect)\n}\n\nconst useTransition = ({ open, ...props }: UseTransitionProps) => {\n   let {\n      disableInitialTransition = false,\n      variant = \"fade\",\n      duration = 400,\n      delay,\n      ease,\n      easing,\n      exitOnUnmount = true,\n      onOpen,\n      onOpened,\n      onClose,\n      onClosed,\n      onState\n   } = props\n   let _ease = ease || (animationEases as any)[easing as any] || animationEases.easeBounceOut\n   const id = useId().replace(/:/g, \"\")\n\n   const [state, setState] = useState({\n      initial: false,\n      classname: \"\",\n      variant: variant,\n      rect: null as DOMRect | null,\n      stage: open ? \"open\" : \"closed\",\n      unmounted: false,\n   })\n\n   const getEle = () => document.querySelector(`.${id}`) as HTMLElement;\n   const getBoundary = () => state.rect || getEle()?.getBoundingClientRect() || new DOMRect(0, 0, 0, 0);\n\n   useEffect(() => {\n      if (exitOnUnmount && state.stage === 'closed') {\n         if (!open) {\n            setState(s => ({\n               ...s,\n               initial: false,\n               classname: \"\",\n               unmounted: true,\n               variant: variant,\n            }))\n         } else {\n            setState(s => ({\n               ...s,\n               variant: variant,\n               classname: css({ visibility: \"hidden\" }).classname,\n               stage: \"open\",\n            }))\n         }\n      }\n   }, [open, state.stage, exitOnUnmount, variant])\n\n   // initial effect\n   useEffect(() => {\n      const ele = getEle()\n      if (!ele) return\n      if (exitOnUnmount && state.stage === 'closed') return\n\n      const rect = getBoundary();\n      let { from } = getVariant(rect, state.variant)\n      if (open && !state.initial) {\n         setState(s => ({\n            ...s,\n            classname: (!disableInitialTransition || state.unmounted) ? css(from).classname : \"\",\n            initial: true,\n            rect: rect,\n         }))\n\n         ele.ontransitionstart = () => {\n            const isOpen = Array.from(ele.classList).includes(\"xui-transition-open\");\n            (onOpen && isOpen) && onOpen();\n            (onClose && !isOpen) && onClose()\n            onState && onState(isOpen ? \"open\" : \"close\")\n            setState(s => ({\n               ...s,\n               stage: isOpen ? \"open\" : \"close\"\n            }))\n         }\n\n         ele.ontransitionend = () => {\n            const isOpen = Array.from(ele.classList).includes(\"xui-transition-open\");\n            (onOpened && isOpen) && onOpened();\n            (onClosed && !isOpen) && onClosed();\n            onState && onState(isOpen ? \"opened\" : \"closed\")\n            setState(s => ({\n               ...s,\n               stage: isOpen ? \"opened\" : \"closed\"\n            }))\n         }\n      } else if (!state.initial) {\n         setState(s => ({\n            ...s,\n            classname: css(from).classname,\n            rect: rect,\n         }))\n      }\n   }, [open, state.initial, state.stage, exitOnUnmount])\n\n\n   useEffect(() => {\n      if (state.initial) {\n         let _variant = state.variant !== variant ? variant : state.variant\n         const { from, to } = getVariant(state.rect, _variant)\n         let _css: CSSProps = open ? to : from\n         let trans = ` ${duration}ms ${_ease} ${delay || 0}ms`\n         let _ = {\n            ..._css,\n            transition: Object.keys(_css || {}).map(k => formatCSSProp(k)).join(trans + \", \") + trans,\n         }\n         setState(s => ({\n            ...s,\n            classname: css(_).classname,\n            variant: _variant\n         }))\n      }\n   }, [open, state.initial, variant])\n\n   return {\n      exited: exitOnUnmount && state.stage === 'closed',\n      classname: classNames(\n         id,\n         state.classname,\n         `xui-transition-${open ? \"open\" : \"close\"}`,\n         `xui-transition-${state.stage}`,\n      )\n   }\n}\n\n\nexport default useTransition"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.mjs","sources":["../../../src/hooks/useTransition/index.ts"],"sourcesContent":["import { useState, useEffect, useId } from 'react';\nimport { animationEases } from '../useAnimation';\nimport { css } from '../../css';\nimport { formatCSSProp } from 'oncss';\nimport { CSSProps } from '../../css/types';\nimport * as variants from './variants'\n\nexport type UseTransitionVariantTypes = keyof typeof variants\nexport type UseTransitionState = \"open\" | \"opened\" | \"close\" | \"closed\"\n\nexport type UseTransitionVariant = (rect: DOMRect) => ({ from: CSSProps, to: CSSProps })\n\nexport type UseTransitionProps = {\n   open: boolean;\n   variant: UseTransitionVariant | UseTransitionVariantTypes;\n   ease?: string;\n   easing?: keyof typeof animationEases;\n   duration?: number;\n   delay?: number;\n   disableInitialTransition?: boolean;\n   exitOnUnmount?: boolean;\n   onOpen?: () => void;\n   onOpened?: () => void;\n   onClose?: () => void;\n   onClosed?: () => void;\n   onState?: (state: UseTransitionState) => void;\n}\n\n\nconst getVariant = (rect: DOMRect | null, variant: UseTransitionProps['variant']) => {\n   let fn = typeof variant === 'string' ? variants[variant] : variant\n   if (!fn) throw new Error(`Transition variant \"${variant}\" not found.`)\n   return fn(rect as DOMRect);\n}\n\nconst useTransition = ({ open, ...props }: UseTransitionProps) => {\n   let {\n      disableInitialTransition = false,\n      variant = \"fade\",\n      duration = 400,\n      delay,\n      ease,\n      easing,\n      exitOnUnmount = false,\n      onOpen,\n      onOpened,\n      onClose,\n      onClosed,\n      onState\n   } = props\n   let _ease = ease || (animationEases as any)[easing as any] || animationEases.bounce\n   const id = \"xui-transition-\" + useId()\n   const [state, setState] = useState({\n      initial: false,\n      classname: \"\",\n      variant: variant,\n      rect: null as DOMRect | null,\n      stage: open ? \"open\" : \"closed\",\n      unmounted: false,\n   })\n\n   const getEle = () => document.querySelector(`[data-transition=\"${id}\"]`) as HTMLElement;\n   const getBoundary = () => state.rect || getEle()?.getBoundingClientRect() || new DOMRect(0, 0, 0, 0);\n\n   useEffect(() => {\n      if (exitOnUnmount && state.stage === 'closed') {\n         if (!open) {\n            setState(s => ({\n               ...s,\n               initial: false,\n               classname: \"\",\n               unmounted: true,\n               variant: variant,\n            }))\n         } else {\n            setState(s => ({\n               ...s,\n               variant: variant,\n               classname: css({ visibility: \"hidden\" }, { selector: \"#\" }).classname,\n               stage: \"open\",\n            }))\n         }\n      }\n   }, [open, state.stage, exitOnUnmount, variant])\n\n   // initial effect\n   useEffect(() => {\n      const ele = getEle()\n      if (!ele) return\n      if (exitOnUnmount && state.stage === 'closed') return\n\n      const rect = getBoundary();\n      let { from } = getVariant(rect, state.variant)\n      if (open && !state.initial) {\n         setState(s => ({\n            ...s,\n            classname: (!disableInitialTransition || state.unmounted) ? css(from, { selector: \"#\" }).classname : \"\",\n            initial: true,\n            rect: rect,\n         }))\n         let stimer: any = null\n         let etimer: any = null\n         ele.ontransitionstart = () => {\n            clearTimeout(stimer)\n            stimer = setTimeout(() => {\n               const isOpen = ele.getAttribute('data-transition-state') === 'open';\n               (onOpen && isOpen) && onOpen();\n               (onClose && !isOpen) && onClose()\n               onState && onState(isOpen ? \"open\" : \"close\")\n               setState(s => ({\n                  ...s,\n                  stage: isOpen ? \"open\" : \"close\"\n               }))\n            }, 1)\n         }\n\n         ele.ontransitionend = () => {\n            clearTimeout(etimer)\n            etimer = setTimeout(() => {\n               const isOpen = ele.getAttribute('data-transition-state') === 'open';\n               (onOpened && isOpen) && onOpened();\n               (onClosed && !isOpen) && onClosed();\n               onState && onState(isOpen ? \"opened\" : \"closed\")\n               setState(s => ({\n                  ...s,\n                  stage: isOpen ? \"opened\" : \"closed\"\n               }))\n            }, 1)\n         }\n      } else if (!state.initial) {\n         setState(s => ({\n            ...s,\n            classname: css(from, { selector: \"#\" }).classname,\n            rect: rect,\n         }))\n      }\n   }, [open, state.initial, state.stage, exitOnUnmount])\n\n\n   useEffect(() => {\n      if (state.initial) {\n         let _variant = state.variant !== variant ? variant : state.variant\n         const { from, to } = getVariant(state.rect, _variant)\n         let _css: CSSProps = open ? to : from\n         let trans = ` ${duration}ms ${_ease} ${delay || 0}ms`\n         let _ = {\n            ..._css,\n            transition: Object.keys(_css || {}).map(k => formatCSSProp(k)).join(trans + \", \") + trans,\n         }\n         setState(s => ({\n            ...s,\n            classname: css(_, { selector: \"#\" }).classname,\n            variant: _variant\n         }))\n      }\n   }, [open, state.initial, variant])\n\n   return {\n      exited: exitOnUnmount && state.stage === 'closed',\n      props: {\n         'id': state.classname,\n         'data-transition': id,\n         'data-transition-state': open ? 'open' : 'close',\n      }\n   }\n}\n\n\nexport default useTransition"],"names":[],"mappings":"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"}

package/hooks/useTransition/variants.d.ts

@@ -6,7 +6,7 @@ declare const slideDown: (rect: DOMRect) => {
         transform: string;
     };
 };
-declare const slideUp: (_arg: DOMRect) => {
+declare const slideUp: (rect: DOMRect) => {
     from: {
         transform: string;
     };
@@ -14,7 +14,7 @@ declare const slideUp: (_arg: DOMRect) => {
         transform: string;
     };
 };
-declare const slideRight: (_arg: DOMRect) => {
+declare const slideRight: (rect: DOMRect) => {
     from: {
         transform: string;
     };
@@ -22,7 +22,7 @@ declare const slideRight: (_arg: DOMRect) => {
         transform: string;
     };
 };
-declare const slideLeft: (_arg: DOMRect) => {
+declare const slideLeft: (rect: DOMRect) => {
     from: {
         transform: string;
     };
@@ -30,7 +30,7 @@ declare const slideLeft: (_arg: DOMRect) => {
         transform: string;
     };
 };
-declare const fade: (_arg: DOMRect) => {
+declare const fade: () => {
     from: {
         opacity: number;
     };
@@ -38,7 +38,7 @@ declare const fade: (_arg: DOMRect) => {
         opacity: number;
     };
 };
-declare const fadeDown: (_arg: DOMRect) => {
+declare const fadeDown: () => {
     from: {
         transform: string;
         opacity: number;
@@ -48,7 +48,7 @@ declare const fadeDown: (_arg: DOMRect) => {
         opacity: number;
     };
 };
-declare const fadeUp: (_arg: DOMRect) => {
+declare const fadeUp: () => {
     from: {
         transform: string;
         opacity: number;
@@ -58,7 +58,7 @@ declare const fadeUp: (_arg: DOMRect) => {
         opacity: number;
     };
 };
-declare const fadeRight: (_arg: DOMRect) => {
+declare const fadeRight: () => {
     from: {
         transform: string;
         opacity: number;
@@ -68,7 +68,7 @@ declare const fadeRight: (_arg: DOMRect) => {
         opacity: number;
     };
 };
-declare const fadeLeft: (_arg: DOMRect) => {
+declare const fadeLeft: () => {
     from: {
         transform: string;
         opacity: number;
@@ -78,7 +78,7 @@ declare const fadeLeft: (_arg: DOMRect) => {
         opacity: number;
     };
 };
-declare const grow: (_arg: DOMRect) => {
+declare const grow: () => {
     from: {
         transform: string;
         opacity: number;
@@ -88,7 +88,7 @@ declare const grow: (_arg: DOMRect) => {
         opacity: number;
     };
 };
-declare const zoom: (_arg: DOMRect) => {
+declare const zoom: () => {
     from: {
         transform: string;
         opacity: number;
@@ -98,7 +98,7 @@ declare const zoom: (_arg: DOMRect) => {
         opacity: number;
     };
 };
-declare const zoomOver: (_arg: DOMRect) => {
+declare const zoomOver: () => {
     from: {
         transform: string;
         opacity: number;
@@ -108,7 +108,7 @@ declare const zoomOver: (_arg: DOMRect) => {
         opacity: number;
     };
 };
-declare const collapsVerticle: (rect: DOMRect) => {
+declare const collapseVertical: (rect: DOMRect) => {
     from: {
         maxHeight: string;
         overflow: string;
@@ -118,7 +118,7 @@ declare const collapsVerticle: (rect: DOMRect) => {
         overflow: string;
     };
 };
-declare const collapsHorizental: (_arg: DOMRect) => {
+declare const collapseHorizontal: (rect: DOMRect) => {
     from: {
         width: string;
         overflow: string;
@@ -129,4 +129,4 @@ declare const collapsHorizental: (_arg: DOMRect) => {
     };
 };
 
-export { collapsHorizental, collapsVerticle, fade, fadeDown, fadeLeft, fadeRight, fadeUp, grow, slideDown, slideLeft, slideRight, slideUp, zoom, zoomOver };
+export { collapseHorizontal, collapseVertical, fade, fadeDown, fadeLeft, fadeRight, fadeUp, grow, slideDown, slideLeft, slideRight, slideUp, zoom, zoomOver };

package/hooks/useTransition/variants.js

@@ -1,44 +1,44 @@
 'use strict';Object.defineProperty(exports,'__esModule',{value:true});const slideDown = (rect) => {
     return {
         from: {
-            transform: `translateY(-${rect.height}px)!important`,
+            transform: `translateY(-${rect.height}px)`,
         },
         to: {
-            transform: `translateY(0)!important`,
+            transform: `translateY(0)`,
         }
     };
 };
-const slideUp = (_arg) => {
+const slideUp = (rect) => {
     return {
         from: {
-            transform: `translateY(${_arg.height}px)!important`,
+            transform: `translateY(${rect.height}px)`,
         },
         to: {
-            transform: `translateY(0)!important`,
+            transform: `translateY(0)`,
         }
     };
 };
-const slideRight = (_arg) => {
+const slideRight = (rect) => {
     return {
         from: {
-            transform: `translateX(-${_arg.width}px)!important`,
+            transform: `translateX(-${rect.width}px)`,
         },
         to: {
-            transform: `translateX(0)!important`,
+            transform: `translateX(0)`,
         }
     };
 };
-const slideLeft = (_arg) => {
+const slideLeft = (rect) => {
     return {
         from: {
-            transform: `translateX(${_arg.width}px)!important`,
+            transform: `translateX(${rect.width}px)`,
         },
         to: {
-            transform: `translateX(0)!important`,
+            transform: `translateX(0)`,
         }
     };
 };
-const fade = (_arg) => {
+const fade = () => {
     return {
         from: {
             opacity: 0
@@ -48,94 +48,94 @@ const fade = (_arg) => {
         }
     };
 };
-const fadeDown = (_arg) => {
+const fadeDown = () => {
     return {
         from: {
-            transform: `translateY(-30px)!important`,
+            transform: `translateY(-30px)`,
             opacity: 0
         },
         to: {
-            transform: `translateY(0)!important`,
+            transform: `translateY(0)`,
             opacity: 1
         }
     };
 };
-const fadeUp = (_arg) => {
+const fadeUp = () => {
     return {
         from: {
-            transform: `translateY(30px)!important`,
+            transform: `translateY(30px)`,
             opacity: 0
         },
         to: {
-            transform: `translateY(0)!important`,
+            transform: `translateY(0)`,
             opacity: 1
         }
     };
 };
-const fadeRight = (_arg) => {
+const fadeRight = () => {
     return {
         from: {
-            transform: `translateX(-30px)!important`,
+            transform: `translateX(-30px)`,
             opacity: 0
         },
         to: {
-            transform: `translateX(0)!important`,
+            transform: `translateX(0)`,
             opacity: 1
         }
     };
 };
-const fadeLeft = (_arg) => {
+const fadeLeft = () => {
     return {
         from: {
-            transform: `translateX(30px)!important`,
+            transform: `translateX(30px)`,
             opacity: 0
         },
         to: {
-            transform: `translateX(0)!important`,
+            transform: `translateX(0)`,
             opacity: 1
         }
     };
 };
-const grow = (_arg) => {
+const grow = () => {
     return {
         from: {
-            transform: "scale(.8, .6)!important",
+            transform: "scale(.8, .6)",
             opacity: 0
         },
         to: {
-            transform: "scale(1)!important",
+            transform: "scale(1)",
             opacity: 1
         }
     };
 };
-const zoom = (_arg) => {
+const zoom = () => {
     return {
         from: {
-            transform: "scale(.8)!important",
+            transform: "scale(.8)",
             opacity: 0
         },
         to: {
-            transform: "scale(1)!important",
+            transform: "scale(1)",
             opacity: 1
         }
     };
 };
-const zoomOver = (_arg) => {
+const zoomOver = () => {
     return {
         from: {
-            transform: "scale(1.2)!important",
+            transform: "scale(1.2)",
             opacity: 0
         },
         to: {
-            transform: "scale(1)!important",
+            transform: "scale(1)",
             opacity: 1
         }
     };
 };
-const collapsVerticle = (rect) => {
+const collapseVertical = (rect) => {
     return {
         from: {
-            maxHeight: 0 + "px!important",
+            maxHeight: 0 + "px",
             overflow: "hidden"
         },
         to: {
@@ -144,15 +144,15 @@ const collapsVerticle = (rect) => {
         }
     };
 };
-const collapsHorizental = (_arg) => {
+const collapseHorizontal = (rect) => {
     return {
         from: {
-            width: 0 + "px!important",
+            width: 0 + "px",
             overflow: "hidden"
         },
         to: {
-            width: (_arg === null || _arg === void 0 ? void 0 : _arg.width) ? (_arg === null || _arg === void 0 ? void 0 : _arg.width) + "px!important" : "auto",
+            width: (rect === null || rect === void 0 ? void 0 : rect.width) ? (rect === null || rect === void 0 ? void 0 : rect.width) + "px" : "auto",
             overflow: "hidden"
         }
     };
-};exports.collapsHorizental=collapsHorizental;exports.collapsVerticle=collapsVerticle;exports.fade=fade;exports.fadeDown=fadeDown;exports.fadeLeft=fadeLeft;exports.fadeRight=fadeRight;exports.fadeUp=fadeUp;exports.grow=grow;exports.slideDown=slideDown;exports.slideLeft=slideLeft;exports.slideRight=slideRight;exports.slideUp=slideUp;exports.zoom=zoom;exports.zoomOver=zoomOver;//# sourceMappingURL=variants.js.map
+};exports.collapseHorizontal=collapseHorizontal;exports.collapseVertical=collapseVertical;exports.fade=fade;exports.fadeDown=fadeDown;exports.fadeLeft=fadeLeft;exports.fadeRight=fadeRight;exports.fadeUp=fadeUp;exports.grow=grow;exports.slideDown=slideDown;exports.slideLeft=slideLeft;exports.slideRight=slideRight;exports.slideUp=slideUp;exports.zoom=zoom;exports.zoomOver=zoomOver;//# sourceMappingURL=variants.js.map

package/hooks/useTransition/variants.js.map

@@ -1 +1 @@
-{"version":3,"file":"variants.js","sources":["../../../src/hooks/useTransition/variants.ts"],"sourcesContent":["\nexport const slideDown = (rect: DOMRect) => {\n\n    return {\n        from: {\n            transform: `translateY(-${rect.height}px)!important`,\n        },\n        to: {\n            transform: `translateY(0)!important`,\n        }\n    }\n}\n\nexport const slideUp = (_arg: DOMRect) => {\n    return {\n        from: {\n            transform: `translateY(${_arg.height}px)!important`,\n        },\n        to: {\n            transform: `translateY(0)!important`,\n        }\n    }\n}\n\nexport const slideRight = (_arg: DOMRect) => {\n    return {\n        from: {\n            transform: `translateX(-${_arg.width}px)!important`,\n        },\n        to: {\n            transform: `translateX(0)!important`,\n        }\n    }\n}\n\nexport const slideLeft = (_arg: DOMRect) => {\n    return {\n        from: {\n            transform: `translateX(${_arg.width}px)!important`,\n        },\n        to: {\n            transform: `translateX(0)!important`,\n        }\n    }\n}\n\nexport const fade = (_arg: DOMRect) => {\n    return {\n        from: {\n            opacity: 0\n        },\n        to: {\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeDown = (_arg: DOMRect) => {\n    return {\n        from: {\n            transform: `translateY(-30px)!important`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateY(0)!important`,\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeUp = (_arg: DOMRect) => {\n    return {\n        from: {\n            transform: `translateY(30px)!important`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateY(0)!important`,\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeRight = (_arg: DOMRect) => {\n    return {\n        from: {\n            transform: `translateX(-30px)!important`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateX(0)!important`,\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeLeft = (_arg: DOMRect) => {\n    return {\n        from: {\n            transform: `translateX(30px)!important`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateX(0)!important`,\n            opacity: 1\n        }\n    }\n}\n\nexport const grow = (_arg: DOMRect) => {\n    return {\n        from: {\n            transform: \"scale(.8, .6)!important\",\n            opacity: 0\n        },\n        to: {\n            transform: \"scale(1)!important\",\n            opacity: 1\n        }\n    }\n}\n\nexport const zoom = (_arg: DOMRect) => {\n    return {\n        from: {\n            transform: \"scale(.8)!important\",\n            opacity: 0\n        },\n        to: {\n            transform: \"scale(1)!important\",\n            opacity: 1\n        }\n    }\n}\n\nexport const zoomOver = (_arg: DOMRect) => {\n    return {\n        from: {\n            transform: \"scale(1.2)!important\",\n            opacity: 0\n        },\n        to: {\n            transform: \"scale(1)!important\",\n            opacity: 1\n        }\n    }\n}\n\nexport const collapsVerticle = (rect: DOMRect) => {\n\n    return {\n        from: {\n            maxHeight: 0 + \"px!important\",\n            overflow: \"hidden\"\n        },\n        to: {\n            maxHeight: rect.height,\n            overflow: \"hidden\"\n        }\n    }\n}\n\n\nexport const collapsHorizental = (_arg: DOMRect) => {\n    return {\n        from: {\n            width: 0 + \"px!important\",\n            overflow: \"hidden\"\n        },\n        to: {\n            width: _arg?.width ? _arg?.width + \"px!important\" : \"auto\",\n            overflow: \"hidden\"\n        }\n    }\n}\n\n\n\n\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"variants.js","sources":["../../../src/hooks/useTransition/variants.ts"],"sourcesContent":["\nexport const slideDown = (rect: DOMRect) => {\n\n    return {\n        from: {\n            transform: `translateY(-${rect.height}px)`,\n        },\n        to: {\n            transform: `translateY(0)`,\n        }\n    }\n}\n\nexport const slideUp = (rect: DOMRect) => {\n    return {\n        from: {\n            transform: `translateY(${rect.height}px)`,\n        },\n        to: {\n            transform: `translateY(0)`,\n        }\n    }\n}\n\nexport const slideRight = (rect: DOMRect) => {\n    return {\n        from: {\n            transform: `translateX(-${rect.width}px)`,\n        },\n        to: {\n            transform: `translateX(0)`,\n        }\n    }\n}\n\nexport const slideLeft = (rect: DOMRect) => {\n    return {\n        from: {\n            transform: `translateX(${rect.width}px)`,\n        },\n        to: {\n            transform: `translateX(0)`,\n        }\n    }\n}\n\nexport const fade = () => {\n    return {\n        from: {\n            opacity: 0\n        },\n        to: {\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeDown = () => {\n    return {\n        from: {\n            transform: `translateY(-30px)`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateY(0)`,\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeUp = () => {\n    return {\n        from: {\n            transform: `translateY(30px)`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateY(0)`,\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeRight = () => {\n    return {\n        from: {\n            transform: `translateX(-30px)`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateX(0)`,\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeLeft = () => {\n    return {\n        from: {\n            transform: `translateX(30px)`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateX(0)`,\n            opacity: 1\n        }\n    }\n}\n\nexport const grow = () => {\n    return {\n        from: {\n            transform: \"scale(.8, .6)\",\n            opacity: 0\n        },\n        to: {\n            transform: \"scale(1)\",\n            opacity: 1\n        }\n    }\n}\n\nexport const zoom = () => {\n    return {\n        from: {\n            transform: \"scale(.8)\",\n            opacity: 0\n        },\n        to: {\n            transform: \"scale(1)\",\n            opacity: 1\n        }\n    }\n}\n\nexport const zoomOver = () => {\n    return {\n        from: {\n            transform: \"scale(1.2)\",\n            opacity: 0\n        },\n        to: {\n            transform: \"scale(1)\",\n            opacity: 1\n        }\n    }\n}\n\nexport const collapseVertical = (rect: DOMRect) => {\n\n    return {\n        from: {\n            maxHeight: 0 + \"px\",\n            overflow: \"hidden\"\n        },\n        to: {\n            maxHeight: rect.height,\n            overflow: \"hidden\"\n        }\n    }\n}\n\n\nexport const collapseHorizontal = (rect: DOMRect) => {\n    return {\n        from: {\n            width: 0 + \"px\",\n            overflow: \"hidden\"\n        },\n        to: {\n            width: rect?.width ? rect?.width + \"px\" : \"auto\",\n            overflow: \"hidden\"\n        }\n    }\n}\n\n\n\n\n"],"names":[],"mappings":"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"}

package/hooks/useTransition/variants.mjs

@@ -1,44 +1,44 @@
 const slideDown = (rect) => {
     return {
         from: {
-            transform: `translateY(-${rect.height}px)!important`,
+            transform: `translateY(-${rect.height}px)`,
         },
         to: {
-            transform: `translateY(0)!important`,
+            transform: `translateY(0)`,
         }
     };
 };
-const slideUp = (_arg) => {
+const slideUp = (rect) => {
     return {
         from: {
-            transform: `translateY(${_arg.height}px)!important`,
+            transform: `translateY(${rect.height}px)`,
         },
         to: {
-            transform: `translateY(0)!important`,
+            transform: `translateY(0)`,
         }
     };
 };
-const slideRight = (_arg) => {
+const slideRight = (rect) => {
     return {
         from: {
-            transform: `translateX(-${_arg.width}px)!important`,
+            transform: `translateX(-${rect.width}px)`,
         },
         to: {
-            transform: `translateX(0)!important`,
+            transform: `translateX(0)`,
         }
     };
 };
-const slideLeft = (_arg) => {
+const slideLeft = (rect) => {
     return {
         from: {
-            transform: `translateX(${_arg.width}px)!important`,
+            transform: `translateX(${rect.width}px)`,
         },
         to: {
-            transform: `translateX(0)!important`,
+            transform: `translateX(0)`,
         }
     };
 };
-const fade = (_arg) => {
+const fade = () => {
     return {
         from: {
             opacity: 0
@@ -48,94 +48,94 @@ const fade = (_arg) => {
         }
     };
 };
-const fadeDown = (_arg) => {
+const fadeDown = () => {
     return {
         from: {
-            transform: `translateY(-30px)!important`,
+            transform: `translateY(-30px)`,
             opacity: 0
         },
         to: {
-            transform: `translateY(0)!important`,
+            transform: `translateY(0)`,
             opacity: 1
         }
     };
 };
-const fadeUp = (_arg) => {
+const fadeUp = () => {
     return {
         from: {
-            transform: `translateY(30px)!important`,
+            transform: `translateY(30px)`,
             opacity: 0
         },
         to: {
-            transform: `translateY(0)!important`,
+            transform: `translateY(0)`,
             opacity: 1
         }
     };
 };
-const fadeRight = (_arg) => {
+const fadeRight = () => {
     return {
         from: {
-            transform: `translateX(-30px)!important`,
+            transform: `translateX(-30px)`,
             opacity: 0
         },
         to: {
-            transform: `translateX(0)!important`,
+            transform: `translateX(0)`,
             opacity: 1
         }
     };
 };
-const fadeLeft = (_arg) => {
+const fadeLeft = () => {
     return {
         from: {
-            transform: `translateX(30px)!important`,
+            transform: `translateX(30px)`,
             opacity: 0
         },
         to: {
-            transform: `translateX(0)!important`,
+            transform: `translateX(0)`,
             opacity: 1
         }
     };
 };
-const grow = (_arg) => {
+const grow = () => {
     return {
         from: {
-            transform: "scale(.8, .6)!important",
+            transform: "scale(.8, .6)",
             opacity: 0
         },
         to: {
-            transform: "scale(1)!important",
+            transform: "scale(1)",
             opacity: 1
         }
     };
 };
-const zoom = (_arg) => {
+const zoom = () => {
     return {
         from: {
-            transform: "scale(.8)!important",
+            transform: "scale(.8)",
             opacity: 0
         },
         to: {
-            transform: "scale(1)!important",
+            transform: "scale(1)",
             opacity: 1
         }
     };
 };
-const zoomOver = (_arg) => {
+const zoomOver = () => {
     return {
         from: {
-            transform: "scale(1.2)!important",
+            transform: "scale(1.2)",
             opacity: 0
         },
         to: {
-            transform: "scale(1)!important",
+            transform: "scale(1)",
             opacity: 1
         }
     };
 };
-const collapsVerticle = (rect) => {
+const collapseVertical = (rect) => {
     return {
         from: {
-            maxHeight: 0 + "px!important",
+            maxHeight: 0 + "px",
             overflow: "hidden"
         },
         to: {
@@ -144,15 +144,15 @@ const collapsVerticle = (rect) => {
         }
     };
 };
-const collapsHorizental = (_arg) => {
+const collapseHorizontal = (rect) => {
     return {
         from: {
-            width: 0 + "px!important",
+            width: 0 + "px",
             overflow: "hidden"
         },
         to: {
-            width: (_arg === null || _arg === void 0 ? void 0 : _arg.width) ? (_arg === null || _arg === void 0 ? void 0 : _arg.width) + "px!important" : "auto",
+            width: (rect === null || rect === void 0 ? void 0 : rect.width) ? (rect === null || rect === void 0 ? void 0 : rect.width) + "px" : "auto",
             overflow: "hidden"
         }
     };
-};export{collapsHorizental,collapsVerticle,fade,fadeDown,fadeLeft,fadeRight,fadeUp,grow,slideDown,slideLeft,slideRight,slideUp,zoom,zoomOver};//# sourceMappingURL=variants.mjs.map
+};export{collapseHorizontal,collapseVertical,fade,fadeDown,fadeLeft,fadeRight,fadeUp,grow,slideDown,slideLeft,slideRight,slideUp,zoom,zoomOver};//# sourceMappingURL=variants.mjs.map

package/hooks/useTransition/variants.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"variants.mjs","sources":["../../../src/hooks/useTransition/variants.ts"],"sourcesContent":["\nexport const slideDown = (rect: DOMRect) => {\n\n    return {\n        from: {\n            transform: `translateY(-${rect.height}px)!important`,\n        },\n        to: {\n            transform: `translateY(0)!important`,\n        }\n    }\n}\n\nexport const slideUp = (_arg: DOMRect) => {\n    return {\n        from: {\n            transform: `translateY(${_arg.height}px)!important`,\n        },\n        to: {\n            transform: `translateY(0)!important`,\n        }\n    }\n}\n\nexport const slideRight = (_arg: DOMRect) => {\n    return {\n        from: {\n            transform: `translateX(-${_arg.width}px)!important`,\n        },\n        to: {\n            transform: `translateX(0)!important`,\n        }\n    }\n}\n\nexport const slideLeft = (_arg: DOMRect) => {\n    return {\n        from: {\n            transform: `translateX(${_arg.width}px)!important`,\n        },\n        to: {\n            transform: `translateX(0)!important`,\n        }\n    }\n}\n\nexport const fade = (_arg: DOMRect) => {\n    return {\n        from: {\n            opacity: 0\n        },\n        to: {\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeDown = (_arg: DOMRect) => {\n    return {\n        from: {\n            transform: `translateY(-30px)!important`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateY(0)!important`,\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeUp = (_arg: DOMRect) => {\n    return {\n        from: {\n            transform: `translateY(30px)!important`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateY(0)!important`,\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeRight = (_arg: DOMRect) => {\n    return {\n        from: {\n            transform: `translateX(-30px)!important`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateX(0)!important`,\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeLeft = (_arg: DOMRect) => {\n    return {\n        from: {\n            transform: `translateX(30px)!important`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateX(0)!important`,\n            opacity: 1\n        }\n    }\n}\n\nexport const grow = (_arg: DOMRect) => {\n    return {\n        from: {\n            transform: \"scale(.8, .6)!important\",\n            opacity: 0\n        },\n        to: {\n            transform: \"scale(1)!important\",\n            opacity: 1\n        }\n    }\n}\n\nexport const zoom = (_arg: DOMRect) => {\n    return {\n        from: {\n            transform: \"scale(.8)!important\",\n            opacity: 0\n        },\n        to: {\n            transform: \"scale(1)!important\",\n            opacity: 1\n        }\n    }\n}\n\nexport const zoomOver = (_arg: DOMRect) => {\n    return {\n        from: {\n            transform: \"scale(1.2)!important\",\n            opacity: 0\n        },\n        to: {\n            transform: \"scale(1)!important\",\n            opacity: 1\n        }\n    }\n}\n\nexport const collapsVerticle = (rect: DOMRect) => {\n\n    return {\n        from: {\n            maxHeight: 0 + \"px!important\",\n            overflow: \"hidden\"\n        },\n        to: {\n            maxHeight: rect.height,\n            overflow: \"hidden\"\n        }\n    }\n}\n\n\nexport const collapsHorizental = (_arg: DOMRect) => {\n    return {\n        from: {\n            width: 0 + \"px!important\",\n            overflow: \"hidden\"\n        },\n        to: {\n            width: _arg?.width ? _arg?.width + \"px!important\" : \"auto\",\n            overflow: \"hidden\"\n        }\n    }\n}\n\n\n\n\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"variants.mjs","sources":["../../../src/hooks/useTransition/variants.ts"],"sourcesContent":["\nexport const slideDown = (rect: DOMRect) => {\n\n    return {\n        from: {\n            transform: `translateY(-${rect.height}px)`,\n        },\n        to: {\n            transform: `translateY(0)`,\n        }\n    }\n}\n\nexport const slideUp = (rect: DOMRect) => {\n    return {\n        from: {\n            transform: `translateY(${rect.height}px)`,\n        },\n        to: {\n            transform: `translateY(0)`,\n        }\n    }\n}\n\nexport const slideRight = (rect: DOMRect) => {\n    return {\n        from: {\n            transform: `translateX(-${rect.width}px)`,\n        },\n        to: {\n            transform: `translateX(0)`,\n        }\n    }\n}\n\nexport const slideLeft = (rect: DOMRect) => {\n    return {\n        from: {\n            transform: `translateX(${rect.width}px)`,\n        },\n        to: {\n            transform: `translateX(0)`,\n        }\n    }\n}\n\nexport const fade = () => {\n    return {\n        from: {\n            opacity: 0\n        },\n        to: {\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeDown = () => {\n    return {\n        from: {\n            transform: `translateY(-30px)`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateY(0)`,\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeUp = () => {\n    return {\n        from: {\n            transform: `translateY(30px)`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateY(0)`,\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeRight = () => {\n    return {\n        from: {\n            transform: `translateX(-30px)`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateX(0)`,\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeLeft = () => {\n    return {\n        from: {\n            transform: `translateX(30px)`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateX(0)`,\n            opacity: 1\n        }\n    }\n}\n\nexport const grow = () => {\n    return {\n        from: {\n            transform: \"scale(.8, .6)\",\n            opacity: 0\n        },\n        to: {\n            transform: \"scale(1)\",\n            opacity: 1\n        }\n    }\n}\n\nexport const zoom = () => {\n    return {\n        from: {\n            transform: \"scale(.8)\",\n            opacity: 0\n        },\n        to: {\n            transform: \"scale(1)\",\n            opacity: 1\n        }\n    }\n}\n\nexport const zoomOver = () => {\n    return {\n        from: {\n            transform: \"scale(1.2)\",\n            opacity: 0\n        },\n        to: {\n            transform: \"scale(1)\",\n            opacity: 1\n        }\n    }\n}\n\nexport const collapseVertical = (rect: DOMRect) => {\n\n    return {\n        from: {\n            maxHeight: 0 + \"px\",\n            overflow: \"hidden\"\n        },\n        to: {\n            maxHeight: rect.height,\n            overflow: \"hidden\"\n        }\n    }\n}\n\n\nexport const collapseHorizontal = (rect: DOMRect) => {\n    return {\n        from: {\n            width: 0 + \"px\",\n            overflow: \"hidden\"\n        },\n        to: {\n            width: rect?.width ? rect?.width + \"px\" : \"auto\",\n            overflow: \"hidden\"\n        }\n    }\n}\n\n\n\n\n"],"names":[],"mappings":"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"}

package/index.d.ts

@@ -5,7 +5,7 @@ export { UseColorTemplateColor, UseColorTemplateType, default as useColorTemplat
 export { default as useBreakpoint } from './breakpoint/useBreakpoint.js';
 export { default as useBreakpointProps, useBreakpointPropsType } from './breakpoint/useBreakpointProps.js';
 export { default as useInterface } from './hooks/useInterface.js';
-export { default as useTransition } from './hooks/useTransition/index.js';
+export { UseTransitionProps, UseTransitionState, UseTransitionVariant, UseTransitionVariantTypes, default as useTransition } from './hooks/useTransition/index.js';
 export { default as Transition, TransitionProps } from './Transition/index.js';
 export { default as AppRoot, AppRootProps, appRootElement } from './AppRoot/index.js';
 export { default as usePortal } from './hooks/usePortal.js';