@iziui/react 0.0.5-rc → 0.0.51-rc
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/.types/animations/Bounce/Bounce.d.ts +0 -1
- package/dist/.types/animations/Bounce/Bounce.d.ts.map +1 -1
- package/dist/.types/animations/Fade/Fade.d.ts +0 -1
- package/dist/.types/animations/Fade/Fade.d.ts.map +1 -1
- package/dist/.types/animations/Slide/Slide.d.ts +4 -4
- package/dist/.types/animations/Slide/Slide.d.ts.map +1 -1
- package/dist/animations/Bounce/index.cjs.map +1 -1
- package/dist/animations/Bounce/index.js.map +1 -1
- package/dist/animations/Fade/index.cjs.map +1 -1
- package/dist/animations/Fade/index.js.map +1 -1
- package/dist/chunks/Slide-BxEwoZ70.js.map +1 -1
- package/dist/chunks/Slide-D4aLHjYS.cjs.map +1 -1
- package/package.json +1 -1
|
@@ -5,7 +5,6 @@ export interface BounceProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
|
5
5
|
delay?: number;
|
|
6
6
|
timeout?: number;
|
|
7
7
|
direction?: Direction;
|
|
8
|
-
children: React.ReactNode;
|
|
9
8
|
tag?: React.ElementType;
|
|
10
9
|
}
|
|
11
10
|
export default function Bounce({ enter, children, tag, delay, timeout, direction, ...props }: BounceProps): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Bounce.d.ts","sourceRoot":"","sources":["../../../../src/animations/Bounce/Bounce.tsx"],"names":[],"mappings":"AAEA,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAC;AAE5D,MAAM,MAAM,KAAK,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC,OAAO,CAAC,CAAC;AAqBlE,MAAM,WAAW,WAAY,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACvE,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,
|
|
1
|
+
{"version":3,"file":"Bounce.d.ts","sourceRoot":"","sources":["../../../../src/animations/Bounce/Bounce.tsx"],"names":[],"mappings":"AAEA,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAC;AAE5D,MAAM,MAAM,KAAK,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC,OAAO,CAAC,CAAC;AAqBlE,MAAM,WAAW,WAAY,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACvE,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,GAAG,CAAC,EAAE,KAAK,CAAC,WAAW,CAAC;CACzB;AAED,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAC7B,KAAK,EACL,QAAQ,EACR,GAAW,EACX,KAAU,EACV,OAAa,EACb,SAAmB,EACnB,GAAG,KAAK,EACT,EAAE,WAAW,2CAqBb"}
|
|
@@ -2,7 +2,6 @@ export interface FadeProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
|
2
2
|
enter: boolean;
|
|
3
3
|
delay?: number;
|
|
4
4
|
timeout?: number;
|
|
5
|
-
children: React.ReactNode;
|
|
6
5
|
}
|
|
7
6
|
export default function Fade({ children, enter, delay, timeout, ...props }: Readonly<FadeProps>): false | import("react/jsx-runtime").JSX.Element;
|
|
8
7
|
//# sourceMappingURL=Fade.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Fade.d.ts","sourceRoot":"","sources":["../../../../src/animations/Fade/Fade.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,SAAU,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACrE,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"Fade.d.ts","sourceRoot":"","sources":["../../../../src/animations/Fade/Fade.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,SAAU,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACrE,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,CAAC,OAAO,UAAU,IAAI,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAU,EAAE,OAAY,EAAE,GAAG,KAAK,EAAE,EAAE,QAAQ,CAAC,SAAS,CAAC,mDA8CxG"}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
+
import { ElementType, HTMLAttributes } from 'react';
|
|
1
2
|
export type Direction = 'left' | 'right' | 'top' | 'bottom';
|
|
2
|
-
export type Style =
|
|
3
|
-
export interface SlideProps extends
|
|
3
|
+
export type Style = HTMLAttributes<HTMLDivElement>['style'];
|
|
4
|
+
export interface SlideProps extends HTMLAttributes<HTMLDivElement> {
|
|
4
5
|
enter: boolean;
|
|
5
6
|
delay?: number;
|
|
6
7
|
timeout?: number;
|
|
7
8
|
direction?: Direction;
|
|
8
|
-
|
|
9
|
-
tag?: React.ElementType;
|
|
9
|
+
tag?: ElementType;
|
|
10
10
|
}
|
|
11
11
|
export default function Slide({ enter, children, tag, delay, timeout, direction, ...props }: SlideProps): import("react/jsx-runtime").JSX.Element;
|
|
12
12
|
//# sourceMappingURL=Slide.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Slide.d.ts","sourceRoot":"","sources":["../../../../src/animations/Slide/Slide.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Slide.d.ts","sourceRoot":"","sources":["../../../../src/animations/Slide/Slide.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,WAAW,EAChB,KAAK,cAAc,EACpB,MAAM,OAAO,CAAC;AAEf,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAC;AAE5D,MAAM,MAAM,KAAK,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC,OAAO,CAAC,CAAC;AAuB5D,MAAM,WAAW,UAAW,SAAQ,cAAc,CAAC,cAAc,CAAC;IAChE,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,GAAG,CAAC,EAAE,WAAW,CAAC;CACnB;AAED,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAC5B,KAAK,EACL,QAAQ,EACR,GAAW,EACX,KAAU,EACV,OAAY,EACZ,SAAmB,EACnB,GAAG,KAAK,EACT,EAAE,UAAU,2CAgBZ"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../../../src/animations/Bounce/Bounce.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nexport type Direction = 'left' | 'right' | 'top' | 'bottom';\n\nexport type Style = React.HTMLAttributes<HTMLDivElement>['style'];\n\nconst styledShow = (timeout: number): Style => ({\n transform: 'translate(0, 0)',\n transition: `transform ${timeout}s ease-in-out`,\n});\n\nconst styledBounce = (timeout: number, direction: Direction): Style => {\n const translate = {\n top: 'translate(0, -10px)',\n left: 'translate(-10px, 0)',\n right: 'translate(10px, 0)',\n bottom: 'translate(0, 10px)',\n };\n\n return {\n transform: translate[direction],\n transition: `transform ${timeout}s ease-in-out`,\n };\n};\n\nexport interface BounceProps extends React.HTMLAttributes<HTMLDivElement> {\n enter: boolean;\n delay?: number;\n timeout?: number;\n direction?: Direction;\n
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../../src/animations/Bounce/Bounce.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nexport type Direction = 'left' | 'right' | 'top' | 'bottom';\n\nexport type Style = React.HTMLAttributes<HTMLDivElement>['style'];\n\nconst styledShow = (timeout: number): Style => ({\n transform: 'translate(0, 0)',\n transition: `transform ${timeout}s ease-in-out`,\n});\n\nconst styledBounce = (timeout: number, direction: Direction): Style => {\n const translate = {\n top: 'translate(0, -10px)',\n left: 'translate(-10px, 0)',\n right: 'translate(10px, 0)',\n bottom: 'translate(0, 10px)',\n };\n\n return {\n transform: translate[direction],\n transition: `transform ${timeout}s ease-in-out`,\n };\n};\n\nexport interface BounceProps extends React.HTMLAttributes<HTMLDivElement> {\n enter: boolean;\n delay?: number;\n timeout?: number;\n direction?: Direction;\n tag?: React.ElementType;\n}\n\nexport default function Bounce({\n enter,\n children,\n tag = 'div',\n delay = 50,\n timeout = 0.2,\n direction = 'right',\n ...props\n}: BounceProps) {\n const CustomTag = tag;\n\n const [style, setStyle] = useState<Style>(styledShow(timeout));\n\n useEffect(() => {\n if (!enter) return;\n\n setTimeout(() => {\n setStyle(styledBounce(timeout, direction));\n setTimeout(() => {\n setStyle(styledShow(timeout));\n }, timeout * 1000);\n }, delay);\n }, [enter, delay, timeout, direction]);\n\n return (\n <CustomTag {...props} style={{ ...style, ...props.style }}>\n {children}\n </CustomTag>\n );\n}\n"],"names":["styledShow","timeout","styledBounce","direction","Bounce","enter","children","tag","delay","props","CustomTag","style","setStyle","useState","useEffect","jsx"],"mappings":"oKAMMA,EAAcC,IAA4B,CAC9C,UAAW,kBACX,WAAY,aAAaA,CAAO,eAClC,GAEMC,EAAe,CAACD,EAAiBE,KAQ9B,CACL,UARgB,CAChB,IAAK,sBACL,KAAM,sBACN,MAAO,qBACP,OAAQ,oBAAA,EAIaA,CAAS,EAC9B,WAAY,aAAaF,CAAO,eAAA,GAYpC,SAAwBG,EAAO,CAC7B,MAAAC,EACA,SAAAC,EACA,IAAAC,EAAM,MACN,MAAAC,EAAQ,GACR,QAAAP,EAAU,GACV,UAAAE,EAAY,QACZ,GAAGM,CACL,EAAgB,CACd,MAAMC,EAAYH,EAEZ,CAACI,EAAOC,CAAQ,EAAIC,EAAAA,SAAgBb,EAAWC,CAAO,CAAC,EAE7Da,OAAAA,EAAAA,UAAU,IAAM,CACTT,GAEL,WAAW,IAAM,CACfO,EAASV,EAAaD,EAASE,CAAS,CAAC,EACzC,WAAW,IAAM,CACfS,EAASZ,EAAWC,CAAO,CAAC,CAC9B,EAAGA,EAAU,GAAI,CACnB,EAAGO,CAAK,CACV,EAAG,CAACH,EAAOG,EAAOP,EAASE,CAAS,CAAC,EAGnCY,MAACL,EAAA,CAAW,GAAGD,EAAO,MAAO,CAAE,GAAGE,EAAO,GAAGF,EAAM,KAAA,EAC/C,SAAAH,CAAA,CACH,CAEJ"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/animations/Bounce/Bounce.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nexport type Direction = 'left' | 'right' | 'top' | 'bottom';\n\nexport type Style = React.HTMLAttributes<HTMLDivElement>['style'];\n\nconst styledShow = (timeout: number): Style => ({\n transform: 'translate(0, 0)',\n transition: `transform ${timeout}s ease-in-out`,\n});\n\nconst styledBounce = (timeout: number, direction: Direction): Style => {\n const translate = {\n top: 'translate(0, -10px)',\n left: 'translate(-10px, 0)',\n right: 'translate(10px, 0)',\n bottom: 'translate(0, 10px)',\n };\n\n return {\n transform: translate[direction],\n transition: `transform ${timeout}s ease-in-out`,\n };\n};\n\nexport interface BounceProps extends React.HTMLAttributes<HTMLDivElement> {\n enter: boolean;\n delay?: number;\n timeout?: number;\n direction?: Direction;\n
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/animations/Bounce/Bounce.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nexport type Direction = 'left' | 'right' | 'top' | 'bottom';\n\nexport type Style = React.HTMLAttributes<HTMLDivElement>['style'];\n\nconst styledShow = (timeout: number): Style => ({\n transform: 'translate(0, 0)',\n transition: `transform ${timeout}s ease-in-out`,\n});\n\nconst styledBounce = (timeout: number, direction: Direction): Style => {\n const translate = {\n top: 'translate(0, -10px)',\n left: 'translate(-10px, 0)',\n right: 'translate(10px, 0)',\n bottom: 'translate(0, 10px)',\n };\n\n return {\n transform: translate[direction],\n transition: `transform ${timeout}s ease-in-out`,\n };\n};\n\nexport interface BounceProps extends React.HTMLAttributes<HTMLDivElement> {\n enter: boolean;\n delay?: number;\n timeout?: number;\n direction?: Direction;\n tag?: React.ElementType;\n}\n\nexport default function Bounce({\n enter,\n children,\n tag = 'div',\n delay = 50,\n timeout = 0.2,\n direction = 'right',\n ...props\n}: BounceProps) {\n const CustomTag = tag;\n\n const [style, setStyle] = useState<Style>(styledShow(timeout));\n\n useEffect(() => {\n if (!enter) return;\n\n setTimeout(() => {\n setStyle(styledBounce(timeout, direction));\n setTimeout(() => {\n setStyle(styledShow(timeout));\n }, timeout * 1000);\n }, delay);\n }, [enter, delay, timeout, direction]);\n\n return (\n <CustomTag {...props} style={{ ...style, ...props.style }}>\n {children}\n </CustomTag>\n );\n}\n"],"names":["styledShow","timeout","styledBounce","direction","Bounce","enter","children","tag","delay","props","CustomTag","style","setStyle","useState","useEffect","jsx"],"mappings":"wFAMA,MAAMA,EAAcC,IAA4B,CAC9C,UAAW,kBACX,WAAY,aAAaA,CAAO,eAClC,GAEMC,EAAe,CAACD,EAAiBE,KAQ9B,CACL,UARgB,CAChB,IAAK,sBACL,KAAM,sBACN,MAAO,qBACP,OAAQ,oBAAA,EAIaA,CAAS,EAC9B,WAAY,aAAaF,CAAO,eAAA,GAYpC,SAAwBG,EAAO,CAC7B,MAAAC,EACA,SAAAC,EACA,IAAAC,EAAM,MACN,MAAAC,EAAQ,GACR,QAAAP,EAAU,GACV,UAAAE,EAAY,QACZ,GAAGM,CACL,EAAgB,CACd,MAAMC,EAAYH,EAEZ,CAACI,EAAOC,CAAQ,EAAIC,EAAgBb,EAAWC,CAAO,CAAC,EAE7D,OAAAa,EAAU,IAAM,CACTT,GAEL,WAAW,IAAM,CACfO,EAASV,EAAaD,EAASE,CAAS,CAAC,EACzC,WAAW,IAAM,CACfS,EAASZ,EAAWC,CAAO,CAAC,CAC9B,EAAGA,EAAU,GAAI,CACnB,EAAGO,CAAK,CACV,EAAG,CAACH,EAAOG,EAAOP,EAASE,CAAS,CAAC,EAGnCY,EAACL,EAAA,CAAW,GAAGD,EAAO,MAAO,CAAE,GAAGE,EAAO,GAAGF,EAAM,KAAA,EAC/C,SAAAH,CAAA,CACH,CAEJ"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../../../../../toolkit/src/promise/wait.ts","../../../src/animations/Fade/Fade.tsx"],"sourcesContent":["export function wait<T>(callback: () => T, ms: number) {\n return new Promise<T>(resolve => {\n setTimeout(() => { resolve(callback()); }, ms);\n });\n}\n","import { useEffect, useState } from 'react';\n\nimport { wait } from '@iziui/toolkit/promise';\n\ntype Style = React.HTMLAttributes<HTMLDivElement>['style'];\n\nexport interface FadeProps extends React.HTMLAttributes<HTMLDivElement> {\n enter: boolean;\n delay?: number;\n timeout?: number;\n
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../../../../toolkit/src/promise/wait.ts","../../../src/animations/Fade/Fade.tsx"],"sourcesContent":["export function wait<T>(callback: () => T, ms: number) {\n return new Promise<T>(resolve => {\n setTimeout(() => { resolve(callback()); }, ms);\n });\n}\n","import { useEffect, useState } from 'react';\n\nimport { wait } from '@iziui/toolkit/promise';\n\ntype Style = React.HTMLAttributes<HTMLDivElement>['style'];\n\nexport interface FadeProps extends React.HTMLAttributes<HTMLDivElement> {\n enter: boolean;\n delay?: number;\n timeout?: number;\n}\n\nexport default function Fade({ children, enter, delay = 10, timeout = .5, ...props }: Readonly<FadeProps>) {\n const [isVisible, setIsVisible] = useState(false);\n const [style, setStyle] = useState<Style>({ opacity: 0 });\n\n useEffect(() => {\n setTimeout(() => {\n if (enter) {\n show();\n return;\n }\n\n hide();\n }, delay);\n }, [enter]);\n\n const show = () => {\n setIsVisible(true);\n\n wait(() => {\n setStyle({ opacity: 1, });\n }, delay);\n };\n\n const hide = async () => {\n setStyle({ opacity: 0 });\n\n await wait(() => {\n setIsVisible(false);\n }, timeout * 1000);\n };\n\n return (\n isVisible && (\n <div\n {...props}\n style={{\n ...style,\n width: '100%',\n transition: `all ${timeout}s cubic-bezier(0.25, 0.1, 0.25, 1)`,\n ...props.style\n }}\n >\n {children}\n </div>\n )\n );\n}\n"],"names":["wait","callback","ms","resolve","Fade","children","enter","delay","timeout","props","isVisible","setIsVisible","useState","style","setStyle","useEffect","show","hide","jsx"],"mappings":"oKAAO,SAASA,EAAQC,EAAmBC,EAAY,CACrD,OAAO,IAAI,QAAWC,GAAW,CAC/B,WAAW,IAAM,CAAEA,EAAQF,GAAU,CAAG,EAAGC,CAAE,CAC/C,CAAC,CACH,CCQA,SAAwBE,EAAK,CAAE,SAAAC,EAAU,MAAAC,EAAO,MAAAC,EAAQ,GAAI,QAAAC,EAAU,GAAI,GAAGC,GAA8B,CACzG,KAAM,CAACC,EAAWC,CAAY,EAAIC,EAAAA,SAAS,EAAK,EAC1C,CAACC,EAAOC,CAAQ,EAAIF,EAAAA,SAAgB,CAAE,QAAS,EAAG,EAExDG,EAAAA,UAAU,IAAM,CACd,WAAW,IAAM,CACf,GAAIT,EAAO,CACTU,EAAA,EACA,MACF,CAEAC,EAAA,CACF,EAAGV,CAAK,CACV,EAAG,CAACD,CAAK,CAAC,EAEV,MAAMU,EAAO,IAAM,CACjBL,EAAa,EAAI,EAEjBX,EAAK,IAAM,CACTc,EAAS,CAAE,QAAS,EAAI,CAC1B,EAAGP,CAAK,CACV,EAEMU,EAAO,SAAY,CACvBH,EAAS,CAAE,QAAS,EAAG,EAEvB,MAAMd,EAAK,IAAM,CACfW,EAAa,EAAK,CACpB,EAAGH,EAAU,GAAI,CACnB,EAEA,OACEE,GACEQ,EAAAA,IAAC,MAAA,CACE,GAAGT,EACJ,MAAO,CACL,GAAGI,EACH,MAAO,OACP,WAAY,OAAOL,CAAO,qCAC1B,GAAGC,EAAM,KAAA,EAGV,SAAAJ,CAAA,CAAA,CAIT"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../../../toolkit/src/promise/wait.ts","../../../src/animations/Fade/Fade.tsx"],"sourcesContent":["export function wait<T>(callback: () => T, ms: number) {\n return new Promise<T>(resolve => {\n setTimeout(() => { resolve(callback()); }, ms);\n });\n}\n","import { useEffect, useState } from 'react';\n\nimport { wait } from '@iziui/toolkit/promise';\n\ntype Style = React.HTMLAttributes<HTMLDivElement>['style'];\n\nexport interface FadeProps extends React.HTMLAttributes<HTMLDivElement> {\n enter: boolean;\n delay?: number;\n timeout?: number;\n
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../../../toolkit/src/promise/wait.ts","../../../src/animations/Fade/Fade.tsx"],"sourcesContent":["export function wait<T>(callback: () => T, ms: number) {\n return new Promise<T>(resolve => {\n setTimeout(() => { resolve(callback()); }, ms);\n });\n}\n","import { useEffect, useState } from 'react';\n\nimport { wait } from '@iziui/toolkit/promise';\n\ntype Style = React.HTMLAttributes<HTMLDivElement>['style'];\n\nexport interface FadeProps extends React.HTMLAttributes<HTMLDivElement> {\n enter: boolean;\n delay?: number;\n timeout?: number;\n}\n\nexport default function Fade({ children, enter, delay = 10, timeout = .5, ...props }: Readonly<FadeProps>) {\n const [isVisible, setIsVisible] = useState(false);\n const [style, setStyle] = useState<Style>({ opacity: 0 });\n\n useEffect(() => {\n setTimeout(() => {\n if (enter) {\n show();\n return;\n }\n\n hide();\n }, delay);\n }, [enter]);\n\n const show = () => {\n setIsVisible(true);\n\n wait(() => {\n setStyle({ opacity: 1, });\n }, delay);\n };\n\n const hide = async () => {\n setStyle({ opacity: 0 });\n\n await wait(() => {\n setIsVisible(false);\n }, timeout * 1000);\n };\n\n return (\n isVisible && (\n <div\n {...props}\n style={{\n ...style,\n width: '100%',\n transition: `all ${timeout}s cubic-bezier(0.25, 0.1, 0.25, 1)`,\n ...props.style\n }}\n >\n {children}\n </div>\n )\n );\n}\n"],"names":["wait","callback","ms","resolve","Fade","children","enter","delay","timeout","props","isVisible","setIsVisible","useState","style","setStyle","useEffect","show","hide","jsx"],"mappings":"wFAAO,SAASA,EAAQC,EAAmBC,EAAY,CACrD,OAAO,IAAI,QAAWC,GAAW,CAC/B,WAAW,IAAM,CAAEA,EAAQF,GAAU,CAAG,EAAGC,CAAE,CAC/C,CAAC,CACH,CCQA,SAAwBE,EAAK,CAAE,SAAAC,EAAU,MAAAC,EAAO,MAAAC,EAAQ,GAAI,QAAAC,EAAU,GAAI,GAAGC,GAA8B,CACzG,KAAM,CAACC,EAAWC,CAAY,EAAIC,EAAS,EAAK,EAC1C,CAACC,EAAOC,CAAQ,EAAIF,EAAgB,CAAE,QAAS,EAAG,EAExDG,EAAU,IAAM,CACd,WAAW,IAAM,CACf,GAAIT,EAAO,CACTU,EAAA,EACA,MACF,CAEAC,EAAA,CACF,EAAGV,CAAK,CACV,EAAG,CAACD,CAAK,CAAC,EAEV,MAAMU,EAAO,IAAM,CACjBL,EAAa,EAAI,EAEjBX,EAAK,IAAM,CACTc,EAAS,CAAE,QAAS,EAAI,CAC1B,EAAGP,CAAK,CACV,EAEMU,EAAO,SAAY,CACvBH,EAAS,CAAE,QAAS,EAAG,EAEvB,MAAMd,EAAK,IAAM,CACfW,EAAa,EAAK,CACpB,EAAGH,EAAU,GAAI,CACnB,EAEA,OACEE,GACEQ,EAAC,MAAA,CACE,GAAGT,EACJ,MAAO,CACL,GAAGI,EACH,MAAO,OACP,WAAY,OAAOL,CAAO,qCAC1B,GAAGC,EAAM,KAAA,EAGV,SAAAJ,CAAA,CAAA,CAIT"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Slide-BxEwoZ70.js","sources":["../../src/animations/Slide/Slide.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"Slide-BxEwoZ70.js","sources":["../../src/animations/Slide/Slide.tsx"],"sourcesContent":["import {\n useState,\n useEffect,\n type ElementType,\n type HTMLAttributes,\n} from 'react';\n\nexport type Direction = 'left' | 'right' | 'top' | 'bottom';\n\nexport type Style = HTMLAttributes<HTMLDivElement>['style'];\n\nconst styledShow = (timeout: number): Style => ({\n opacity: 1,\n transform: '',\n transition: `all ${timeout}s ease-in-out`,\n});\n\nconst styledHide = (timeout: number, direction: Direction): Style => {\n const translate = {\n top: 'translateY(-10px)',\n left: 'translateX(-10px)',\n right: 'translateX(10px)',\n bottom: 'translateY(10px)',\n };\n\n return {\n opacity: 0,\n transform: translate[direction],\n transition: `all ${timeout}s ease-in-out`\n };\n};\n\nexport interface SlideProps extends HTMLAttributes<HTMLDivElement> {\n enter: boolean,\n delay?: number;\n timeout?: number;\n direction?: Direction;\n tag?: ElementType;\n}\n\nexport default function Slide({\n enter,\n children,\n tag = 'div',\n delay = 50,\n timeout = .2,\n direction = 'right',\n ...props\n}: SlideProps) {\n const CustomTag = tag;\n\n const [style, setStyle] = useState<Style>(styledHide(timeout, direction));\n\n useEffect(() => {\n setTimeout(() => {\n setStyle(enter ? styledShow(timeout) : styledHide(timeout, direction));\n }, delay);\n }, [enter, delay, timeout, direction]);\n\n return (\n <CustomTag {...props} style={{ ...style, width: '100%', ...props.style }}>\n {children}\n </CustomTag>\n );\n}\n"],"names":["styledShow","timeout","styledHide","direction","Slide","enter","children","tag","delay","props","CustomTag","style","setStyle","useState","useEffect","jsx"],"mappings":"wFAWA,MAAMA,EAAcC,IAA4B,CAC9C,QAAS,EACT,UAAW,GACX,WAAY,OAAOA,CAAO,eAC5B,GAEMC,EAAa,CAACD,EAAiBE,KAQ5B,CACL,QAAS,EACT,UATgB,CAChB,IAAK,oBACL,KAAM,oBACN,MAAO,mBACP,OAAQ,kBAAA,EAKaA,CAAS,EAC9B,WAAY,OAAOF,CAAO,eAAA,GAY9B,SAAwBG,EAAM,CAC5B,MAAAC,EACA,SAAAC,EACA,IAAAC,EAAM,MACN,MAAAC,EAAQ,GACR,QAAAP,EAAU,GACV,UAAAE,EAAY,QACZ,GAAGM,CACL,EAAe,CACb,MAAMC,EAAYH,EAEZ,CAACI,EAAOC,CAAQ,EAAIC,EAAgBX,EAAWD,EAASE,CAAS,CAAC,EAExE,OAAAW,EAAU,IAAM,CACd,WAAW,IAAM,CACfF,EAASP,EAAQL,EAAWC,CAAO,EAAIC,EAAWD,EAASE,CAAS,CAAC,CACvE,EAAGK,CAAK,CACV,EAAG,CAACH,EAAOG,EAAOP,EAASE,CAAS,CAAC,EAGnCY,EAACL,EAAA,CAAW,GAAGD,EAAO,MAAO,CAAE,GAAGE,EAAO,MAAO,OAAQ,GAAGF,EAAM,KAAA,EAC9D,SAAAH,CAAA,CACH,CAEJ"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Slide-D4aLHjYS.cjs","sources":["../../src/animations/Slide/Slide.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"Slide-D4aLHjYS.cjs","sources":["../../src/animations/Slide/Slide.tsx"],"sourcesContent":["import {\n useState,\n useEffect,\n type ElementType,\n type HTMLAttributes,\n} from 'react';\n\nexport type Direction = 'left' | 'right' | 'top' | 'bottom';\n\nexport type Style = HTMLAttributes<HTMLDivElement>['style'];\n\nconst styledShow = (timeout: number): Style => ({\n opacity: 1,\n transform: '',\n transition: `all ${timeout}s ease-in-out`,\n});\n\nconst styledHide = (timeout: number, direction: Direction): Style => {\n const translate = {\n top: 'translateY(-10px)',\n left: 'translateX(-10px)',\n right: 'translateX(10px)',\n bottom: 'translateY(10px)',\n };\n\n return {\n opacity: 0,\n transform: translate[direction],\n transition: `all ${timeout}s ease-in-out`\n };\n};\n\nexport interface SlideProps extends HTMLAttributes<HTMLDivElement> {\n enter: boolean,\n delay?: number;\n timeout?: number;\n direction?: Direction;\n tag?: ElementType;\n}\n\nexport default function Slide({\n enter,\n children,\n tag = 'div',\n delay = 50,\n timeout = .2,\n direction = 'right',\n ...props\n}: SlideProps) {\n const CustomTag = tag;\n\n const [style, setStyle] = useState<Style>(styledHide(timeout, direction));\n\n useEffect(() => {\n setTimeout(() => {\n setStyle(enter ? styledShow(timeout) : styledHide(timeout, direction));\n }, delay);\n }, [enter, delay, timeout, direction]);\n\n return (\n <CustomTag {...props} style={{ ...style, width: '100%', ...props.style }}>\n {children}\n </CustomTag>\n );\n}\n"],"names":["styledShow","timeout","styledHide","direction","Slide","enter","children","tag","delay","props","CustomTag","style","setStyle","useState","useEffect","jsx"],"mappings":"qEAWMA,EAAcC,IAA4B,CAC9C,QAAS,EACT,UAAW,GACX,WAAY,OAAOA,CAAO,eAC5B,GAEMC,EAAa,CAACD,EAAiBE,KAQ5B,CACL,QAAS,EACT,UATgB,CAChB,IAAK,oBACL,KAAM,oBACN,MAAO,mBACP,OAAQ,kBAAA,EAKaA,CAAS,EAC9B,WAAY,OAAOF,CAAO,eAAA,GAY9B,SAAwBG,EAAM,CAC5B,MAAAC,EACA,SAAAC,EACA,IAAAC,EAAM,MACN,MAAAC,EAAQ,GACR,QAAAP,EAAU,GACV,UAAAE,EAAY,QACZ,GAAGM,CACL,EAAe,CACb,MAAMC,EAAYH,EAEZ,CAACI,EAAOC,CAAQ,EAAIC,EAAAA,SAAgBX,EAAWD,EAASE,CAAS,CAAC,EAExEW,OAAAA,EAAAA,UAAU,IAAM,CACd,WAAW,IAAM,CACfF,EAASP,EAAQL,EAAWC,CAAO,EAAIC,EAAWD,EAASE,CAAS,CAAC,CACvE,EAAGK,CAAK,CACV,EAAG,CAACH,EAAOG,EAAOP,EAASE,CAAS,CAAC,EAGnCY,EAAAA,IAACL,EAAA,CAAW,GAAGD,EAAO,MAAO,CAAE,GAAGE,EAAO,MAAO,OAAQ,GAAGF,EAAM,KAAA,EAC9D,SAAAH,CAAA,CACH,CAEJ"}
|