@xanui/core 1.2.63 → 1.2.65

package/{hooks/useTransition → Transition}/variants.cjs

@@ -1,9 +1,12 @@
 'use strict';
 
+const getY = (rect) => rect ? Math.min(rect.height / 2, 40) : 20;
+const getX = (rect) => rect ? Math.min(rect.width / 2, 40) : 20;
 const slideDown = (rect) => {
+    const y = getY(rect);
     return {
         from: {
-            transform: `translateY(-${rect.height}px)`,
+            transform: `translateY(-${y}px)`,
         },
         to: {
             transform: `translateY(0)`,
@@ -11,9 +14,10 @@ const slideDown = (rect) => {
     };
 };
 const slideUp = (rect) => {
+    const y = getY(rect);
     return {
         from: {
-            transform: `translateY(${rect.height}px)`,
+            transform: `translateY(${y}px)`,
         },
         to: {
             transform: `translateY(0)`,
@@ -21,9 +25,10 @@ const slideUp = (rect) => {
     };
 };
 const slideRight = (rect) => {
+    const x = getX(rect);
     return {
         from: {
-            transform: `translateX(-${rect.width}px)`,
+            transform: `translateX(-${x}px)`,
         },
         to: {
             transform: `translateX(0)`,
@@ -31,15 +36,40 @@ const slideRight = (rect) => {
     };
 };
 const slideLeft = (rect) => {
+    const x = getX(rect);
     return {
         from: {
-            transform: `translateX(${rect.width}px)`,
+            transform: `translateX(${x}px)`,
         },
         to: {
             transform: `translateX(0)`,
         }
     };
 };
+const scaleYDown = () => ({
+    from: {
+        transform: "scaleY(0.8)",
+        opacity: 0,
+        transformOrigin: "top"
+    },
+    to: {
+        transform: "scaleY(1)",
+        opacity: 1,
+        transformOrigin: "top"
+    }
+});
+const scaleYUp = () => ({
+    from: {
+        transform: "scaleY(0.8)",
+        transformOrigin: "bottom",
+        opacity: 0
+    },
+    to: {
+        transform: "scaleY(1)",
+        transformOrigin: "bottom",
+        opacity: 1
+    }
+});
 const fade = () => {
     return {
         from: {
@@ -50,50 +80,54 @@ const fade = () => {
         }
     };
 };
-const fadeDown = () => {
+const fadeDown = (rect) => {
+    const y = getY(rect);
     return {
         from: {
-            transform: `translateY(-30px)`,
+            transform: `translateY(-${y}px) scale(0.98)`,
             opacity: 0
         },
         to: {
-            transform: `translateY(0)`,
+            transform: `translateY(0) scale(1)`,
             opacity: 1
         }
     };
 };
-const fadeUp = () => {
+const fadeUp = (rect) => {
+    const y = getY(rect);
     return {
         from: {
-            transform: `translateY(30px)`,
+            transform: `translateY(${y}px) scale(0.98)`,
             opacity: 0
         },
         to: {
-            transform: `translateY(0)`,
+            transform: `translateY(0) scale(1)`,
             opacity: 1
         }
     };
 };
-const fadeRight = () => {
+const fadeRight = (rect) => {
+    const x = getX(rect);
     return {
         from: {
-            transform: `translateX(-30px)`,
+            transform: `translateX(-${x}px) scale(0.98)`,
             opacity: 0
         },
         to: {
-            transform: `translateX(0)`,
+            transform: `translateX(0) scale(1)`,
             opacity: 1
         }
     };
 };
-const fadeLeft = () => {
+const fadeLeft = (rect) => {
+    const x = getX(rect);
     return {
         from: {
-            transform: `translateX(30px)`,
+            transform: `translateX(${x}px) scale(0.98)`,
             opacity: 0
         },
         to: {
-            transform: `translateX(0)`,
+            transform: `translateX(0) scale(1)`,
             opacity: 1
         }
     };
@@ -114,10 +148,12 @@ const zoom = () => {
     return {
         from: {
             transform: "scale(.8)",
+            transformOrigin: "center",
             opacity: 0
         },
         to: {
             transform: "scale(1)",
+            transformOrigin: "center",
             opacity: 1
         }
     };
@@ -126,10 +162,12 @@ const zoomOver = () => {
     return {
         from: {
             transform: "scale(1.2)",
+            transformOrigin: "center",
             opacity: 0
         },
         to: {
             transform: "scale(1)",
+            transformOrigin: "center",
             opacity: 1
         }
     };
@@ -137,11 +175,11 @@ const zoomOver = () => {
 const collapseVertical = (rect) => {
     return {
         from: {
-            maxHeight: 0 + "px",
+            maxHeight: "0px",
             overflow: "hidden"
         },
         to: {
-            maxHeight: rect.height,
+            maxHeight: rect.height + "px",
             overflow: "hidden"
         }
     };
@@ -149,11 +187,11 @@ const collapseVertical = (rect) => {
 const collapseHorizontal = (rect) => {
     return {
         from: {
-            width: 0 + "px",
+            width: "0px",
             overflow: "hidden"
         },
         to: {
-            width: (rect === null || rect === void 0 ? void 0 : rect.width) ? (rect === null || rect === void 0 ? void 0 : rect.width) + "px" : "auto",
+            width: rect.width + "px",
             overflow: "hidden"
         }
     };
@@ -167,6 +205,8 @@ exports.fadeLeft = fadeLeft;
 exports.fadeRight = fadeRight;
 exports.fadeUp = fadeUp;
 exports.grow = grow;
+exports.scaleYDown = scaleYDown;
+exports.scaleYUp = scaleYUp;
 exports.slideDown = slideDown;
 exports.slideLeft = slideLeft;
 exports.slideRight = slideRight;

package/Transition/variants.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"variants.cjs","sources":["../../src/Transition/variants.ts"],"sourcesContent":["\nconst getY = (rect?: DOMRect) =>\n    rect ? Math.min(rect.height / 2, 40) : 20\n\nconst getX = (rect?: DOMRect) =>\n    rect ? Math.min(rect.width / 2, 40) : 20\n\n\n\nexport const slideDown = (rect?: DOMRect) => {\n    const y = getY(rect)\n\n    return {\n        from: {\n            transform: `translateY(-${y}px)`,\n        },\n        to: {\n            transform: `translateY(0)`,\n        }\n    }\n}\n\nexport const slideUp = (rect?: DOMRect) => {\n    const y = getY(rect)\n\n    return {\n        from: {\n            transform: `translateY(${y}px)`,\n        },\n        to: {\n            transform: `translateY(0)`,\n        }\n    }\n}\n\nexport const slideRight = (rect?: DOMRect) => {\n    const x = getX(rect)\n\n    return {\n        from: {\n            transform: `translateX(-${x}px)`,\n        },\n        to: {\n            transform: `translateX(0)`,\n        }\n    }\n}\n\nexport const slideLeft = (rect?: DOMRect) => {\n    const x = getX(rect)\n\n    return {\n        from: {\n            transform: `translateX(${x}px)`,\n        },\n        to: {\n            transform: `translateX(0)`,\n        }\n    }\n}\n\nexport const scaleYDown = () => ({\n    from: {\n        transform: \"scaleY(0.8)\",\n        opacity: 0,\n        transformOrigin: \"top\"\n    },\n    to: {\n        transform: \"scaleY(1)\",\n        opacity: 1,\n        transformOrigin: \"top\"\n    }\n})\n\nexport const scaleYUp = () => ({\n    from: {\n        transform: \"scaleY(0.8)\",\n        transformOrigin: \"bottom\",\n        opacity: 0\n    },\n    to: {\n        transform: \"scaleY(1)\",\n        transformOrigin: \"bottom\",\n        opacity: 1\n    }\n})\n\nexport const fade = () => {\n    return {\n        from: {\n            opacity: 0\n        },\n        to: {\n            opacity: 1\n        }\n    }\n}\n\n\nexport const fadeDown = (rect?: DOMRect) => {\n    const y = getY(rect)\n\n    return {\n        from: {\n            transform: `translateY(-${y}px) scale(0.98)`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateY(0) scale(1)`,\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeUp = (rect?: DOMRect) => {\n    const y = getY(rect)\n\n    return {\n        from: {\n            transform: `translateY(${y}px) scale(0.98)`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateY(0) scale(1)`,\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeRight = (rect?: DOMRect) => {\n    const x = getX(rect)\n\n    return {\n        from: {\n            transform: `translateX(-${x}px) scale(0.98)`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateX(0) scale(1)`,\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeLeft = (rect?: DOMRect) => {\n    const x = getX(rect)\n\n    return {\n        from: {\n            transform: `translateX(${x}px) scale(0.98)`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateX(0) scale(1)`,\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            transformOrigin: \"center\",\n            opacity: 0\n        },\n        to: {\n            transform: \"scale(1)\",\n            transformOrigin: \"center\",\n            opacity: 1\n        }\n    }\n}\n\nexport const zoomOver = () => {\n    return {\n        from: {\n            transform: \"scale(1.2)\",\n            transformOrigin: \"center\",\n            opacity: 0\n        },\n        to: {\n            transform: \"scale(1)\",\n            transformOrigin: \"center\",\n            opacity: 1\n        }\n    }\n}\n\nexport const collapseVertical = (rect: DOMRect) => {\n    return {\n        from: {\n            maxHeight: \"0px\",\n            overflow: \"hidden\"\n        },\n        to: {\n            maxHeight: rect.height + \"px\",\n            overflow: \"hidden\"\n        }\n    }\n}\n\n\nexport const collapseHorizontal = (rect: DOMRect) => {\n    return {\n        from: {\n            width: \"0px\",\n            overflow: \"hidden\"\n        },\n        to: {\n            width: rect.width + \"px\",\n            overflow: \"hidden\"\n        }\n    }\n}\n\n\n\n\n"],"names":[],"mappings":";;AACA,MAAM,IAAI,GAAG,CAAC,IAAc,KACxB,IAAI,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,EAAE,EAAE,CAAC,GAAG,EAAE;AAE7C,MAAM,IAAI,GAAG,CAAC,IAAc,KACxB,IAAI,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,GAAG,CAAC,EAAE,EAAE,CAAC,GAAG,EAAE;AAIrC,MAAM,SAAS,GAAG,CAAC,IAAc,KAAI;AACxC,IAAA,MAAM,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC;IAEpB,OAAO;AACH,QAAA,IAAI,EAAE;YACF,SAAS,EAAE,CAAA,YAAA,EAAe,CAAC,CAAA,GAAA,CAAK;AACnC,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,CAAA,aAAA,CAAe;AAC7B;KACJ;AACL;AAEO,MAAM,OAAO,GAAG,CAAC,IAAc,KAAI;AACtC,IAAA,MAAM,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC;IAEpB,OAAO;AACH,QAAA,IAAI,EAAE;YACF,SAAS,EAAE,CAAA,WAAA,EAAc,CAAC,CAAA,GAAA,CAAK;AAClC,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,CAAA,aAAA,CAAe;AAC7B;KACJ;AACL;AAEO,MAAM,UAAU,GAAG,CAAC,IAAc,KAAI;AACzC,IAAA,MAAM,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC;IAEpB,OAAO;AACH,QAAA,IAAI,EAAE;YACF,SAAS,EAAE,CAAA,YAAA,EAAe,CAAC,CAAA,GAAA,CAAK;AACnC,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,CAAA,aAAA,CAAe;AAC7B;KACJ;AACL;AAEO,MAAM,SAAS,GAAG,CAAC,IAAc,KAAI;AACxC,IAAA,MAAM,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC;IAEpB,OAAO;AACH,QAAA,IAAI,EAAE;YACF,SAAS,EAAE,CAAA,WAAA,EAAc,CAAC,CAAA,GAAA,CAAK;AAClC,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,CAAA,aAAA,CAAe;AAC7B;KACJ;AACL;AAEO,MAAM,UAAU,GAAG,OAAO;AAC7B,IAAA,IAAI,EAAE;AACF,QAAA,SAAS,EAAE,aAAa;AACxB,QAAA,OAAO,EAAE,CAAC;AACV,QAAA,eAAe,EAAE;AACpB,KAAA;AACD,IAAA,EAAE,EAAE;AACA,QAAA,SAAS,EAAE,WAAW;AACtB,QAAA,OAAO,EAAE,CAAC;AACV,QAAA,eAAe,EAAE;AACpB;AACJ,CAAA;AAEM,MAAM,QAAQ,GAAG,OAAO;AAC3B,IAAA,IAAI,EAAE;AACF,QAAA,SAAS,EAAE,aAAa;AACxB,QAAA,eAAe,EAAE,QAAQ;AACzB,QAAA,OAAO,EAAE;AACZ,KAAA;AACD,IAAA,EAAE,EAAE;AACA,QAAA,SAAS,EAAE,WAAW;AACtB,QAAA,eAAe,EAAE,QAAQ;AACzB,QAAA,OAAO,EAAE;AACZ;AACJ,CAAA;AAEM,MAAM,IAAI,GAAG,MAAK;IACrB,OAAO;AACH,QAAA,IAAI,EAAE;AACF,YAAA,OAAO,EAAE;AACZ,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,OAAO,EAAE;AACZ;KACJ;AACL;AAGO,MAAM,QAAQ,GAAG,CAAC,IAAc,KAAI;AACvC,IAAA,MAAM,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC;IAEpB,OAAO;AACH,QAAA,IAAI,EAAE;YACF,SAAS,EAAE,CAAA,YAAA,EAAe,CAAC,CAAA,eAAA,CAAiB;AAC5C,YAAA,OAAO,EAAE;AACZ,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,CAAA,sBAAA,CAAwB;AACnC,YAAA,OAAO,EAAE;AACZ;KACJ;AACL;AAEO,MAAM,MAAM,GAAG,CAAC,IAAc,KAAI;AACrC,IAAA,MAAM,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC;IAEpB,OAAO;AACH,QAAA,IAAI,EAAE;YACF,SAAS,EAAE,CAAA,WAAA,EAAc,CAAC,CAAA,eAAA,CAAiB;AAC3C,YAAA,OAAO,EAAE;AACZ,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,CAAA,sBAAA,CAAwB;AACnC,YAAA,OAAO,EAAE;AACZ;KACJ;AACL;AAEO,MAAM,SAAS,GAAG,CAAC,IAAc,KAAI;AACxC,IAAA,MAAM,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC;IAEpB,OAAO;AACH,QAAA,IAAI,EAAE;YACF,SAAS,EAAE,CAAA,YAAA,EAAe,CAAC,CAAA,eAAA,CAAiB;AAC5C,YAAA,OAAO,EAAE;AACZ,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,CAAA,sBAAA,CAAwB;AACnC,YAAA,OAAO,EAAE;AACZ;KACJ;AACL;AAEO,MAAM,QAAQ,GAAG,CAAC,IAAc,KAAI;AACvC,IAAA,MAAM,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC;IAEpB,OAAO;AACH,QAAA,IAAI,EAAE;YACF,SAAS,EAAE,CAAA,WAAA,EAAc,CAAC,CAAA,eAAA,CAAiB;AAC3C,YAAA,OAAO,EAAE;AACZ,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,CAAA,sBAAA,CAAwB;AACnC,YAAA,OAAO,EAAE;AACZ;KACJ;AACL;AAEO,MAAM,IAAI,GAAG,MAAK;IACrB,OAAO;AACH,QAAA,IAAI,EAAE;AACF,YAAA,SAAS,EAAE,eAAe;AAC1B,YAAA,OAAO,EAAE;AACZ,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,UAAU;AACrB,YAAA,OAAO,EAAE;AACZ;KACJ;AACL;AAEO,MAAM,IAAI,GAAG,MAAK;IACrB,OAAO;AACH,QAAA,IAAI,EAAE;AACF,YAAA,SAAS,EAAE,WAAW;AACtB,YAAA,eAAe,EAAE,QAAQ;AACzB,YAAA,OAAO,EAAE;AACZ,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,UAAU;AACrB,YAAA,eAAe,EAAE,QAAQ;AACzB,YAAA,OAAO,EAAE;AACZ;KACJ;AACL;AAEO,MAAM,QAAQ,GAAG,MAAK;IACzB,OAAO;AACH,QAAA,IAAI,EAAE;AACF,YAAA,SAAS,EAAE,YAAY;AACvB,YAAA,eAAe,EAAE,QAAQ;AACzB,YAAA,OAAO,EAAE;AACZ,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,UAAU;AACrB,YAAA,eAAe,EAAE,QAAQ;AACzB,YAAA,OAAO,EAAE;AACZ;KACJ;AACL;AAEO,MAAM,gBAAgB,GAAG,CAAC,IAAa,KAAI;IAC9C,OAAO;AACH,QAAA,IAAI,EAAE;AACF,YAAA,SAAS,EAAE,KAAK;AAChB,YAAA,QAAQ,EAAE;AACb,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,IAAI,CAAC,MAAM,GAAG,IAAI;AAC7B,YAAA,QAAQ,EAAE;AACb;KACJ;AACL;AAGO,MAAM,kBAAkB,GAAG,CAAC,IAAa,KAAI;IAChD,OAAO;AACH,QAAA,IAAI,EAAE;AACF,YAAA,KAAK,EAAE,KAAK;AACZ,YAAA,QAAQ,EAAE;AACb,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,KAAK,EAAE,IAAI,CAAC,KAAK,GAAG,IAAI;AACxB,YAAA,QAAQ,EAAE;AACb;KACJ;AACL;;;;;;;;;;;;;;;;;;;"}

package/{hooks/useTransition → Transition}/variants.d.ts

@@ -1,4 +1,4 @@
-declare const slideDown: (rect: DOMRect) => {
+declare const slideDown: (rect?: DOMRect) => {
     from: {
         transform: string;
     };
@@ -6,7 +6,7 @@ declare const slideDown: (rect: DOMRect) => {
         transform: string;
     };
 };
-declare const slideUp: (rect: DOMRect) => {
+declare const slideUp: (rect?: DOMRect) => {
     from: {
         transform: string;
     };
@@ -14,7 +14,7 @@ declare const slideUp: (rect: DOMRect) => {
         transform: string;
     };
 };
-declare const slideRight: (rect: DOMRect) => {
+declare const slideRight: (rect?: DOMRect) => {
     from: {
         transform: string;
     };
@@ -22,7 +22,7 @@ declare const slideRight: (rect: DOMRect) => {
         transform: string;
     };
 };
-declare const slideLeft: (rect: DOMRect) => {
+declare const slideLeft: (rect?: DOMRect) => {
     from: {
         transform: string;
     };
@@ -30,6 +30,30 @@ declare const slideLeft: (rect: DOMRect) => {
         transform: string;
     };
 };
+declare const scaleYDown: () => {
+    from: {
+        transform: string;
+        opacity: number;
+        transformOrigin: string;
+    };
+    to: {
+        transform: string;
+        opacity: number;
+        transformOrigin: string;
+    };
+};
+declare const scaleYUp: () => {
+    from: {
+        transform: string;
+        transformOrigin: string;
+        opacity: number;
+    };
+    to: {
+        transform: string;
+        transformOrigin: string;
+        opacity: number;
+    };
+};
 declare const fade: () => {
     from: {
         opacity: number;
@@ -38,7 +62,7 @@ declare const fade: () => {
         opacity: number;
     };
 };
-declare const fadeDown: () => {
+declare const fadeDown: (rect?: DOMRect) => {
     from: {
         transform: string;
         opacity: number;
@@ -48,7 +72,7 @@ declare const fadeDown: () => {
         opacity: number;
     };
 };
-declare const fadeUp: () => {
+declare const fadeUp: (rect?: DOMRect) => {
     from: {
         transform: string;
         opacity: number;
@@ -58,7 +82,7 @@ declare const fadeUp: () => {
         opacity: number;
     };
 };
-declare const fadeRight: () => {
+declare const fadeRight: (rect?: DOMRect) => {
     from: {
         transform: string;
         opacity: number;
@@ -68,7 +92,7 @@ declare const fadeRight: () => {
         opacity: number;
     };
 };
-declare const fadeLeft: () => {
+declare const fadeLeft: (rect?: DOMRect) => {
     from: {
         transform: string;
         opacity: number;
@@ -91,20 +115,24 @@ declare const grow: () => {
 declare const zoom: () => {
     from: {
         transform: string;
+        transformOrigin: string;
         opacity: number;
     };
     to: {
         transform: string;
+        transformOrigin: string;
         opacity: number;
     };
 };
 declare const zoomOver: () => {
     from: {
         transform: string;
+        transformOrigin: string;
         opacity: number;
     };
     to: {
         transform: string;
+        transformOrigin: string;
         opacity: number;
     };
 };
@@ -114,7 +142,7 @@ declare const collapseVertical: (rect: DOMRect) => {
         overflow: string;
     };
     to: {
-        maxHeight: number;
+        maxHeight: string;
         overflow: string;
     };
 };
@@ -129,4 +157,4 @@ declare const collapseHorizontal: (rect: DOMRect) => {
     };
 };
 
-export { collapseHorizontal, collapseVertical, fade, fadeDown, fadeLeft, fadeRight, fadeUp, grow, slideDown, slideLeft, slideRight, slideUp, zoom, zoomOver };
+export { collapseHorizontal, collapseVertical, fade, fadeDown, fadeLeft, fadeRight, fadeUp, grow, scaleYDown, scaleYUp, slideDown, slideLeft, slideRight, slideUp, zoom, zoomOver };

package/{hooks/useTransition → Transition}/variants.js

@@ -1,7 +1,10 @@
+const getY = (rect) => rect ? Math.min(rect.height / 2, 40) : 20;
+const getX = (rect) => rect ? Math.min(rect.width / 2, 40) : 20;
 const slideDown = (rect) => {
+    const y = getY(rect);
     return {
         from: {
-            transform: `translateY(-${rect.height}px)`,
+            transform: `translateY(-${y}px)`,
         },
         to: {
             transform: `translateY(0)`,
@@ -9,9 +12,10 @@ const slideDown = (rect) => {
     };
 };
 const slideUp = (rect) => {
+    const y = getY(rect);
     return {
         from: {
-            transform: `translateY(${rect.height}px)`,
+            transform: `translateY(${y}px)`,
         },
         to: {
             transform: `translateY(0)`,
@@ -19,9 +23,10 @@ const slideUp = (rect) => {
     };
 };
 const slideRight = (rect) => {
+    const x = getX(rect);
     return {
         from: {
-            transform: `translateX(-${rect.width}px)`,
+            transform: `translateX(-${x}px)`,
         },
         to: {
             transform: `translateX(0)`,
@@ -29,15 +34,40 @@ const slideRight = (rect) => {
     };
 };
 const slideLeft = (rect) => {
+    const x = getX(rect);
     return {
         from: {
-            transform: `translateX(${rect.width}px)`,
+            transform: `translateX(${x}px)`,
         },
         to: {
             transform: `translateX(0)`,
         }
     };
 };
+const scaleYDown = () => ({
+    from: {
+        transform: "scaleY(0.8)",
+        opacity: 0,
+        transformOrigin: "top"
+    },
+    to: {
+        transform: "scaleY(1)",
+        opacity: 1,
+        transformOrigin: "top"
+    }
+});
+const scaleYUp = () => ({
+    from: {
+        transform: "scaleY(0.8)",
+        transformOrigin: "bottom",
+        opacity: 0
+    },
+    to: {
+        transform: "scaleY(1)",
+        transformOrigin: "bottom",
+        opacity: 1
+    }
+});
 const fade = () => {
     return {
         from: {
@@ -48,50 +78,54 @@ const fade = () => {
         }
     };
 };
-const fadeDown = () => {
+const fadeDown = (rect) => {
+    const y = getY(rect);
     return {
         from: {
-            transform: `translateY(-30px)`,
+            transform: `translateY(-${y}px) scale(0.98)`,
             opacity: 0
         },
         to: {
-            transform: `translateY(0)`,
+            transform: `translateY(0) scale(1)`,
             opacity: 1
         }
     };
 };
-const fadeUp = () => {
+const fadeUp = (rect) => {
+    const y = getY(rect);
     return {
         from: {
-            transform: `translateY(30px)`,
+            transform: `translateY(${y}px) scale(0.98)`,
             opacity: 0
         },
         to: {
-            transform: `translateY(0)`,
+            transform: `translateY(0) scale(1)`,
             opacity: 1
         }
     };
 };
-const fadeRight = () => {
+const fadeRight = (rect) => {
+    const x = getX(rect);
     return {
         from: {
-            transform: `translateX(-30px)`,
+            transform: `translateX(-${x}px) scale(0.98)`,
             opacity: 0
         },
         to: {
-            transform: `translateX(0)`,
+            transform: `translateX(0) scale(1)`,
             opacity: 1
         }
     };
 };
-const fadeLeft = () => {
+const fadeLeft = (rect) => {
+    const x = getX(rect);
     return {
         from: {
-            transform: `translateX(30px)`,
+            transform: `translateX(${x}px) scale(0.98)`,
             opacity: 0
         },
         to: {
-            transform: `translateX(0)`,
+            transform: `translateX(0) scale(1)`,
             opacity: 1
         }
     };
@@ -112,10 +146,12 @@ const zoom = () => {
     return {
         from: {
             transform: "scale(.8)",
+            transformOrigin: "center",
             opacity: 0
         },
         to: {
             transform: "scale(1)",
+            transformOrigin: "center",
             opacity: 1
         }
     };
@@ -124,10 +160,12 @@ const zoomOver = () => {
     return {
         from: {
             transform: "scale(1.2)",
+            transformOrigin: "center",
             opacity: 0
         },
         to: {
             transform: "scale(1)",
+            transformOrigin: "center",
             opacity: 1
         }
     };
@@ -135,11 +173,11 @@ const zoomOver = () => {
 const collapseVertical = (rect) => {
     return {
         from: {
-            maxHeight: 0 + "px",
+            maxHeight: "0px",
             overflow: "hidden"
         },
         to: {
-            maxHeight: rect.height,
+            maxHeight: rect.height + "px",
             overflow: "hidden"
         }
     };
@@ -147,15 +185,15 @@ const collapseVertical = (rect) => {
 const collapseHorizontal = (rect) => {
     return {
         from: {
-            width: 0 + "px",
+            width: "0px",
             overflow: "hidden"
         },
         to: {
-            width: (rect === null || rect === void 0 ? void 0 : rect.width) ? (rect === null || rect === void 0 ? void 0 : rect.width) + "px" : "auto",
+            width: rect.width + "px",
             overflow: "hidden"
         }
     };
 };
 
-export { collapseHorizontal, collapseVertical, fade, fadeDown, fadeLeft, fadeRight, fadeUp, grow, slideDown, slideLeft, slideRight, slideUp, zoom, zoomOver };
+export { collapseHorizontal, collapseVertical, fade, fadeDown, fadeLeft, fadeRight, fadeUp, grow, scaleYDown, scaleYUp, slideDown, slideLeft, slideRight, slideUp, zoom, zoomOver };
 //# sourceMappingURL=variants.js.map

package/Transition/variants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"variants.js","sources":["../../src/Transition/variants.ts"],"sourcesContent":["\nconst getY = (rect?: DOMRect) =>\n    rect ? Math.min(rect.height / 2, 40) : 20\n\nconst getX = (rect?: DOMRect) =>\n    rect ? Math.min(rect.width / 2, 40) : 20\n\n\n\nexport const slideDown = (rect?: DOMRect) => {\n    const y = getY(rect)\n\n    return {\n        from: {\n            transform: `translateY(-${y}px)`,\n        },\n        to: {\n            transform: `translateY(0)`,\n        }\n    }\n}\n\nexport const slideUp = (rect?: DOMRect) => {\n    const y = getY(rect)\n\n    return {\n        from: {\n            transform: `translateY(${y}px)`,\n        },\n        to: {\n            transform: `translateY(0)`,\n        }\n    }\n}\n\nexport const slideRight = (rect?: DOMRect) => {\n    const x = getX(rect)\n\n    return {\n        from: {\n            transform: `translateX(-${x}px)`,\n        },\n        to: {\n            transform: `translateX(0)`,\n        }\n    }\n}\n\nexport const slideLeft = (rect?: DOMRect) => {\n    const x = getX(rect)\n\n    return {\n        from: {\n            transform: `translateX(${x}px)`,\n        },\n        to: {\n            transform: `translateX(0)`,\n        }\n    }\n}\n\nexport const scaleYDown = () => ({\n    from: {\n        transform: \"scaleY(0.8)\",\n        opacity: 0,\n        transformOrigin: \"top\"\n    },\n    to: {\n        transform: \"scaleY(1)\",\n        opacity: 1,\n        transformOrigin: \"top\"\n    }\n})\n\nexport const scaleYUp = () => ({\n    from: {\n        transform: \"scaleY(0.8)\",\n        transformOrigin: \"bottom\",\n        opacity: 0\n    },\n    to: {\n        transform: \"scaleY(1)\",\n        transformOrigin: \"bottom\",\n        opacity: 1\n    }\n})\n\nexport const fade = () => {\n    return {\n        from: {\n            opacity: 0\n        },\n        to: {\n            opacity: 1\n        }\n    }\n}\n\n\nexport const fadeDown = (rect?: DOMRect) => {\n    const y = getY(rect)\n\n    return {\n        from: {\n            transform: `translateY(-${y}px) scale(0.98)`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateY(0) scale(1)`,\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeUp = (rect?: DOMRect) => {\n    const y = getY(rect)\n\n    return {\n        from: {\n            transform: `translateY(${y}px) scale(0.98)`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateY(0) scale(1)`,\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeRight = (rect?: DOMRect) => {\n    const x = getX(rect)\n\n    return {\n        from: {\n            transform: `translateX(-${x}px) scale(0.98)`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateX(0) scale(1)`,\n            opacity: 1\n        }\n    }\n}\n\nexport const fadeLeft = (rect?: DOMRect) => {\n    const x = getX(rect)\n\n    return {\n        from: {\n            transform: `translateX(${x}px) scale(0.98)`,\n            opacity: 0\n        },\n        to: {\n            transform: `translateX(0) scale(1)`,\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            transformOrigin: \"center\",\n            opacity: 0\n        },\n        to: {\n            transform: \"scale(1)\",\n            transformOrigin: \"center\",\n            opacity: 1\n        }\n    }\n}\n\nexport const zoomOver = () => {\n    return {\n        from: {\n            transform: \"scale(1.2)\",\n            transformOrigin: \"center\",\n            opacity: 0\n        },\n        to: {\n            transform: \"scale(1)\",\n            transformOrigin: \"center\",\n            opacity: 1\n        }\n    }\n}\n\nexport const collapseVertical = (rect: DOMRect) => {\n    return {\n        from: {\n            maxHeight: \"0px\",\n            overflow: \"hidden\"\n        },\n        to: {\n            maxHeight: rect.height + \"px\",\n            overflow: \"hidden\"\n        }\n    }\n}\n\n\nexport const collapseHorizontal = (rect: DOMRect) => {\n    return {\n        from: {\n            width: \"0px\",\n            overflow: \"hidden\"\n        },\n        to: {\n            width: rect.width + \"px\",\n            overflow: \"hidden\"\n        }\n    }\n}\n\n\n\n\n"],"names":[],"mappings":"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"}

package/hooks/useInterface.cjs

@@ -1,9 +1,14 @@
 'use strict';
 
+require('tslib');
+require('react/jsx-runtime');
+require('react');
+require('../Tag/index.cjs');
 var core = require('../theme/core.cjs');
 require('../css/getValue.cjs');
 require('oncss');
-require('../theme/ThemeProvider.cjs');
+require('../Document/index.cjs');
+require('../css/CSSCacheProvider.cjs');
 
 const useInterface = (name, userPorps, defaultProps) => {
     const theme = core.useTheme();

package/hooks/useInterface.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useInterface.cjs","sources":["../../src/hooks/useInterface.ts"],"sourcesContent":["import { useTheme } from \"../theme\"\n\nconst useInterface = <P extends object>(name: string, userPorps: P, defaultProps: P) => {\n    const theme = useTheme()\n    let _props = { ...defaultProps, ...userPorps } as P\n    if (name in theme.interfaces) {\n        return theme.interfaces[name](_props, theme)\n    }\n    return [_props, theme]\n}\n\nexport default useInterface"],"names":["useTheme"],"mappings":";;;;;;;AAEA,MAAM,YAAY,GAAG,CAAmB,IAAY,EAAE,SAAY,EAAE,YAAe,KAAI;AACnF,IAAA,MAAM,KAAK,GAAGA,aAAQ,EAAE;AACxB,IAAA,IAAI,MAAM,GAAG,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,YAAY,CAAA,EAAK,SAAS,CAAO;AACnD,IAAA,IAAI,IAAI,IAAI,KAAK,CAAC,UAAU,EAAE;QAC1B,OAAO,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,KAAK,CAAC;IAChD;AACA,IAAA,OAAO,CAAC,MAAM,EAAE,KAAK,CAAC;AAC1B;;;;"}
+{"version":3,"file":"useInterface.cjs","sources":["../../src/hooks/useInterface.ts"],"sourcesContent":["import { useTheme } from \"../theme\"\n\nconst useInterface = <P extends object>(name: string, userPorps: P, defaultProps: P) => {\n    const theme = useTheme()\n    let _props = { ...defaultProps, ...userPorps } as P\n    if (name in theme.interfaces) {\n        return theme.interfaces[name](_props, theme)\n    }\n    return [_props, theme]\n}\n\nexport default useInterface"],"names":["useTheme"],"mappings":";;;;;;;;;;;;AAEA,MAAM,YAAY,GAAG,CAAmB,IAAY,EAAE,SAAY,EAAE,YAAe,KAAI;AACnF,IAAA,MAAM,KAAK,GAAGA,aAAQ,EAAE;AACxB,IAAA,IAAI,MAAM,GAAG,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,YAAY,CAAA,EAAK,SAAS,CAAO;AACnD,IAAA,IAAI,IAAI,IAAI,KAAK,CAAC,UAAU,EAAE;QAC1B,OAAO,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,KAAK,CAAC;IAChD;AACA,IAAA,OAAO,CAAC,MAAM,EAAE,KAAK,CAAC;AAC1B;;;;"}

package/hooks/useInterface.d.ts

@@ -1,5 +1,5 @@
-import { UseThemeOptions } from '../theme/core.js';
+import { ThemeOptions } from '../theme/types.js';
 
-declare const useInterface: <P extends object>(name: string, userPorps: P, defaultProps: P) => P | (P | UseThemeOptions)[];
+declare const useInterface: <P extends object>(name: string, userPorps: P, defaultProps: P) => P | (P | ThemeOptions)[];
 
 export { useInterface as default };

package/hooks/useInterface.js

@@ -1,7 +1,12 @@
+import 'tslib';
+import 'react/jsx-runtime';
+import 'react';
+import '../Tag/index.js';
 import { useTheme } from '../theme/core.js';
 import '../css/getValue.js';
 import 'oncss';
-import '../theme/ThemeProvider.js';
+import '../Document/index.js';
+import '../css/CSSCacheProvider.js';
 
 const useInterface = (name, userPorps, defaultProps) => {
     const theme = useTheme();

package/hooks/useInterface.js.map

@@ -1 +1 @@
-{"version":3,"file":"useInterface.js","sources":["../../src/hooks/useInterface.ts"],"sourcesContent":["import { useTheme } from \"../theme\"\n\nconst useInterface = <P extends object>(name: string, userPorps: P, defaultProps: P) => {\n    const theme = useTheme()\n    let _props = { ...defaultProps, ...userPorps } as P\n    if (name in theme.interfaces) {\n        return theme.interfaces[name](_props, theme)\n    }\n    return [_props, theme]\n}\n\nexport default useInterface"],"names":[],"mappings":";;;;;AAEA,MAAM,YAAY,GAAG,CAAmB,IAAY,EAAE,SAAY,EAAE,YAAe,KAAI;AACnF,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE;AACxB,IAAA,IAAI,MAAM,GAAG,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,YAAY,CAAA,EAAK,SAAS,CAAO;AACnD,IAAA,IAAI,IAAI,IAAI,KAAK,CAAC,UAAU,EAAE;QAC1B,OAAO,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,KAAK,CAAC;IAChD;AACA,IAAA,OAAO,CAAC,MAAM,EAAE,KAAK,CAAC;AAC1B;;;;"}
+{"version":3,"file":"useInterface.js","sources":["../../src/hooks/useInterface.ts"],"sourcesContent":["import { useTheme } from \"../theme\"\n\nconst useInterface = <P extends object>(name: string, userPorps: P, defaultProps: P) => {\n    const theme = useTheme()\n    let _props = { ...defaultProps, ...userPorps } as P\n    if (name in theme.interfaces) {\n        return theme.interfaces[name](_props, theme)\n    }\n    return [_props, theme]\n}\n\nexport default useInterface"],"names":[],"mappings":";;;;;;;;;;AAEA,MAAM,YAAY,GAAG,CAAmB,IAAY,EAAE,SAAY,EAAE,YAAe,KAAI;AACnF,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE;AACxB,IAAA,IAAI,MAAM,GAAG,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAK,YAAY,CAAA,EAAK,SAAS,CAAO;AACnD,IAAA,IAAI,IAAI,IAAI,KAAK,CAAC,UAAU,EAAE;QAC1B,OAAO,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,KAAK,CAAC;IAChD;AACA,IAAA,OAAO,CAAC,MAAM,EAAE,KAAK,CAAC;AAC1B;;;;"}