@xanui/core 1.2.58 → 1.2.60
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/AppRoot/AppRootProvider.cjs.map +1 -1
- package/AppRoot/AppRootProvider.js.map +1 -1
- package/AppRoot/Renderar.cjs.map +1 -1
- package/AppRoot/Renderar.js.map +1 -1
- package/AppRoot/index.cjs +14 -12
- package/AppRoot/index.cjs.map +1 -1
- package/AppRoot/index.d.ts +1 -0
- package/AppRoot/index.js +15 -13
- package/AppRoot/index.js.map +1 -1
- package/Document/index.cjs.map +1 -1
- package/Document/index.js.map +1 -1
- package/Iframe/index.cjs.map +1 -1
- package/Iframe/index.js.map +1 -1
- package/Portal/index.cjs.map +1 -1
- package/Portal/index.js.map +1 -1
- package/Tag/ServerStyleTag.cjs.map +1 -1
- package/Tag/ServerStyleTag.js.map +1 -1
- package/Tag/cssPropList.cjs.map +1 -1
- package/Tag/cssPropList.js.map +1 -1
- package/Tag/index.cjs.map +1 -1
- package/Tag/index.js.map +1 -1
- package/Tag/useTagProps.cjs.map +1 -1
- package/Tag/useTagProps.js.map +1 -1
- package/Transition/index.cjs.map +1 -1
- package/Transition/index.js.map +1 -1
- package/breakpoint/BreakpointProvider.cjs +37 -39
- package/breakpoint/BreakpointProvider.cjs.map +1 -1
- package/breakpoint/BreakpointProvider.js +37 -39
- package/breakpoint/BreakpointProvider.js.map +1 -1
- package/breakpoint/useBreakpoint.cjs +10 -9
- package/breakpoint/useBreakpoint.cjs.map +1 -1
- package/breakpoint/useBreakpoint.d.ts +4 -5
- package/breakpoint/useBreakpoint.js +10 -9
- package/breakpoint/useBreakpoint.js.map +1 -1
- package/breakpoint/useBreakpointProps.cjs.map +1 -1
- package/breakpoint/useBreakpointProps.js.map +1 -1
- package/css/CSSCacheProvider.cjs.map +1 -1
- package/css/CSSCacheProvider.js.map +1 -1
- package/css/aliases.cjs.map +1 -1
- package/css/aliases.js.map +1 -1
- package/css/getProps.cjs.map +1 -1
- package/css/getProps.js.map +1 -1
- package/css/getValue.cjs.map +1 -1
- package/css/getValue.js.map +1 -1
- package/css/index.cjs.map +1 -1
- package/css/index.js.map +1 -1
- package/hooks/useAnimation.cjs.map +1 -1
- package/hooks/useAnimation.js.map +1 -1
- package/hooks/useColorTemplate.cjs.map +1 -1
- package/hooks/useColorTemplate.js.map +1 -1
- package/hooks/useInterface.cjs.map +1 -1
- package/hooks/useInterface.js.map +1 -1
- package/hooks/useMergeRefs.cjs.map +1 -1
- package/hooks/useMergeRefs.js.map +1 -1
- package/hooks/useTransition/index.cjs +1 -1
- package/hooks/useTransition/index.cjs.map +1 -1
- package/hooks/useTransition/index.js +2 -2
- package/hooks/useTransition/index.js.map +1 -1
- package/hooks/useTransition/variants.cjs.map +1 -1
- package/hooks/useTransition/variants.js.map +1 -1
- package/package.json +1 -1
- package/readme.md +109 -109
- package/theme/ThemeCssVars.cjs.map +1 -1
- package/theme/ThemeCssVars.js.map +1 -1
- package/theme/ThemeDefaultOptions.cjs.map +1 -1
- package/theme/ThemeDefaultOptions.js.map +1 -1
- package/theme/ThemeProvider.cjs.map +1 -1
- package/theme/ThemeProvider.js.map +1 -1
- package/theme/core.cjs.map +1 -1
- package/theme/core.js.map +1 -1
- package/theme/createTheme.cjs.map +1 -1
- package/theme/createTheme.js.map +1 -1
- package/theme/createThemeSwitcher.cjs.map +1 -1
- package/theme/createThemeSwitcher.js.map +1 -1
- package/theme/index.cjs.map +1 -1
- package/theme/index.js.map +1 -1
package/css/getValue.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getValue.js","sources":["../../src/css/getValue.ts"],"sourcesContent":["import { CSSProps } from \"./types\"\
|
|
1
|
+
{"version":3,"file":"getValue.js","sources":["../../src/css/getValue.ts"],"sourcesContent":["import { CSSProps } from \"./types\"\n\nconst getColor = (color: string, hasText = true) => {\n const i = {\n [`${color}`]: `var(--color-${color}-primary)`,\n [`${color}.primary`]: `var(--color-${color}-primary)`,\n [`${color}.secondary`]: `var(--color-${color}-secondary)`,\n [`${color}.soft.primary`]: `var(--color-${color}-soft-primary)`,\n [`${color}.soft.secondary`]: `var(--color-${color}-soft-secondary)`,\n }\n if (hasText) {\n i[`${color}.text`] = `var(--color-${color}-text)`\n }\n\n return i\n}\n\nconst withImportant = (important: any, value: any) => important ? value + important : value\nconst colors: any = {\n ...getColor(\"background\", false),\n ...getColor(\"text\", false),\n ...getColor(\"divider\", false),\n ...getColor(\"brand\"),\n ...getColor(\"accent\"),\n ...getColor(\"info\"),\n ...getColor(\"success\"),\n ...getColor(\"warning\"),\n ...getColor(\"danger\"),\n}\n\nconst breakpoints: any = {\n \"xs\": \"var(--bp-xs)\",\n \"sm\": \"var(--bp-sm)\",\n \"md\": \"var(--bp-md)\",\n \"lg\": \"var(--bp-lg)\",\n \"xl\": \"var(--bp-xl)\"\n}\n\nlet fontsizes: any = {\n \"h1\": \"var(--fontsize-h1)\",\n \"h2\": \"var(--fontsize-h2)\",\n \"h3\": \"var(--fontsize-h3)\",\n \"h4\": \"var(--fontsize-h4)\",\n \"h5\": \"var(--fontsize-h5)\",\n \"h6\": \"var(--fontsize-h6)\",\n \"big\": \"var(--fontsize-big)\",\n \"text\": \"var(--fontsize-text)\",\n \"button\": \"var(--fontsize-button)\",\n \"small\": \"var(--fontsize-small)\"\n}\n\nlet lineHeights: any = {\n \"h1\": \"var(--lineheight-h1)\",\n \"h2\": \"var(--lineheight-h2)\",\n \"h3\": \"var(--lineheight-h3)\",\n \"h4\": \"var(--lineheight-h4)\",\n \"h5\": \"var(--lineheight-h5)\",\n \"h6\": \"var(--lineheight-h6)\",\n \"big\": \"var(--lineheight-big)\",\n \"text\": \"var(--lineheight-text)\",\n \"button\": \"var(--lineheight-button)\",\n \"small\": \"var(--lineheight-small)\"\n}\n\nlet fontWeights: any = {\n \"h1\": \"var(--fontweight-h1)\",\n \"h2\": \"var(--fontweight-h2)\",\n \"h3\": \"var(--fontweight-h3)\",\n \"h4\": \"var(--fontweight-h4)\",\n \"h5\": \"var(--fontweight-h5)\",\n \"h6\": \"var(--fontweight-h6)\",\n \"big\": \"var(--fontweight-big)\",\n \"text\": \"var(--fontweight-text)\",\n \"button\": \"var(--fontweight-button)\",\n \"small\": \"var(--fontweight-small)\"\n}\n\nlet font: any = {\n \"h1\": \"var(--font-h1)\",\n \"h2\": \"var(--font-h2)\",\n \"h3\": \"var(--font-h3)\",\n \"h4\": \"var(--font-h4)\",\n \"h5\": \"var(--font-h5)\",\n \"h6\": \"var(--font-h6)\",\n \"big\": \"var(--font-big)\",\n \"text\": \"var(--font-text)\",\n \"button\": \"var(--font-button)\",\n \"small\": \"var(--font-small)\"\n}\n\nconst getValue = (prop: any, value: string | number, _css: CSSProps): any => {\n let important;\n\n if (typeof value === 'string') {\n const split = value.split(\"!\")\n important = split[1] ? \"!important\" : \"\"\n value = split[0]\n }\n\n\n if (['width', 'maxWidth', 'minWidth', 'max-width', 'min-width'].includes(prop)) {\n return withImportant(important, breakpoints[value] || value)\n } else if (prop === 'font' && typeof value === \"string\" && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\n return withImportant(important, font[value] || value)\n } else if (['fontWeight', 'font-weight'].includes(prop) && typeof value === 'string' && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\n return withImportant(important, fontWeights[value] || value)\n } else if (['lineHeight', 'line-height'].includes(prop) && typeof value === 'string' && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\n return withImportant(important, lineHeights[value] || value)\n } else if (['fontSize', 'font-size'].includes(prop) && typeof value === 'string') {\n return withImportant(important, fontsizes[value] || value)\n } else if (typeof value === \"number\" && [\"shadow\", \"boxShadow\"].includes(prop)) {\n return withImportant(important, `var(--shadow-${value})`)\n }\n\n return withImportant(important, colors[value] || value)\n}\n\nexport default getValue"],"names":[],"mappings":"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"}
|
package/css/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../../src/css/index.ts"],"sourcesContent":["import getValue from \"./getValue\"\
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../src/css/index.ts"],"sourcesContent":["import getValue from \"./getValue\"\nimport getProps from \"./getProps\"\nimport aliases from \"./aliases\"\nimport { Aliases, BreakpointKeys, CSSOptionProps, CSSProps } from './types'\nimport { css as _css } from \"oncss\"\n\nexport {\n getValue,\n getProps\n}\n\nexport const breakpoints = {\n xs: 0,\n sm: 640,\n md: 768,\n lg: 1024,\n xl: 1280,\n}\n\nexport const css = (props: CSSProps, options?: CSSOptionProps) => {\n const cssOptions: CSSOptionProps = {\n ...options,\n breakpoints,\n aliases,\n getValue: (p: any, v: any, _c: any, dept) => {\n if (options?.getValue) {\n let _val = options?.getValue(p, v, _c, dept)\n if (_val) return _val\n }\n return getValue(p, v, _c)\n },\n getProps: (p: any, v: any, _c: any, dept) => {\n if (options?.getProps) {\n let _p = options?.getProps(p, v, _c, dept)\n if (_p) return _p\n }\n return getProps(p, v, _c)\n },\n }\n return _css<Aliases, BreakpointKeys>(props, cssOptions)\n}\n\nexport const adjustColor = (hex: string, factor: number) => {\n\n hex = hex.replace(/^#/, '')\n\n let r = parseInt(hex.slice(0, 2), 16)\n let g = parseInt(hex.slice(2, 4), 16)\n let b = parseInt(hex.slice(4, 6), 16)\n\n r = Math.floor(r * factor)\n g = Math.floor(g * factor)\n b = Math.floor(b * factor)\n\n r = Math.min(255, Math.max(0, r))\n g = Math.min(255, Math.max(0, g))\n b = Math.min(255, Math.max(0, b))\n\n return `#${r.toString(16).padStart(2, '0')}${g.toString(16).padStart(2, '0')}${b.toString(16).padStart(2, '0')}`;\n}\n\nexport const adjustTextContrast = (color: string) => {\n color = color.replace(/^#/, '')\n const r = parseInt(color.slice(0, 2), 16);\n const g = parseInt(color.slice(2, 4), 16);\n const b = parseInt(color.slice(4, 6), 16);\n\n const luminance = (0.299 * r + 0.587 * g + 0.114 * b) / 255;\n return luminance > 0.5 ? '#111111' : '#FFFFFF';\n}\n\nexport const alpha = (color: string, opacity = 1) => {\n if (typeof opacity !== 'number') return color\n let _opacity = opacity * 100\n if (!color.startsWith(\"#\")) throw new Error(`color must be hex`)\n return (color + (`0${Math.round((255 / 100) * _opacity).toString(16)}`.slice(-2))).toUpperCase();\n};\n\n"],"names":["_css"],"mappings":";;;;;;;AAWO,MAAM,WAAW,GAAG;AACvB,IAAA,EAAE,EAAE,CAAC;AACL,IAAA,EAAE,EAAE,GAAG;AACP,IAAA,EAAE,EAAE,GAAG;AACP,IAAA,EAAE,EAAE,IAAI;AACR,IAAA,EAAE,EAAE,IAAI;;MAGC,GAAG,GAAG,CAAC,KAAe,EAAE,OAAwB,KAAI;AAC7D,IAAA,MAAM,UAAU,GAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACT,OAAO,CAAA,EAAA,EACV,WAAW;AACX,QAAA,OAAO,EACP,QAAQ,EAAE,CAAC,CAAM,EAAE,CAAM,EAAE,EAAO,EAAE,IAAI,KAAI;YACxC,IAAI,OAAO,aAAP,OAAO,KAAA,MAAA,GAAA,MAAA,GAAP,OAAO,CAAE,QAAQ,EAAE;AACnB,gBAAA,IAAI,IAAI,GAAG,OAAO,aAAP,OAAO,KAAA,MAAA,GAAA,MAAA,GAAP,OAAO,CAAE,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,IAAI,CAAC;AAC5C,gBAAA,IAAI,IAAI;AAAE,oBAAA,OAAO,IAAI;YACzB;YACA,OAAO,QAAQ,CAAC,CAAC,EAAE,CAAK,CAAC;AAC7B,QAAA,CAAC,EACD,QAAQ,EAAE,CAAC,CAAM,EAAE,CAAM,EAAE,EAAO,EAAE,IAAI,KAAI;YACxC,IAAI,OAAO,aAAP,OAAO,KAAA,MAAA,GAAA,MAAA,GAAP,OAAO,CAAE,QAAQ,EAAE;AACnB,gBAAA,IAAI,EAAE,GAAG,OAAO,aAAP,OAAO,KAAA,MAAA,GAAA,MAAA,GAAP,OAAO,CAAE,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,IAAI,CAAC;AAC1C,gBAAA,IAAI,EAAE;AAAE,oBAAA,OAAO,EAAE;YACrB;YACA,OAAO,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;AAC7B,QAAA,CAAC,GACJ;AACD,IAAA,OAAOA,SAAI,CAA0B,KAAK,EAAE,UAAU,CAAC;AAC3D;MAEa,WAAW,GAAG,CAAC,GAAW,EAAE,MAAc,KAAI;IAEvD,GAAG,GAAG,GAAG,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC;AAE3B,IAAA,IAAI,CAAC,GAAG,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC;AACrC,IAAA,IAAI,CAAC,GAAG,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC;AACrC,IAAA,IAAI,CAAC,GAAG,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC;IAErC,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,MAAM,CAAC;IAC1B,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,MAAM,CAAC;IAC1B,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,MAAM,CAAC;AAE1B,IAAA,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;AACjC,IAAA,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;AACjC,IAAA,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;AAEjC,IAAA,OAAO,IAAI,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,CAAA,EAAG,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,CAAA,EAAG,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE;AACpH;AAEO,MAAM,kBAAkB,GAAG,CAAC,KAAa,KAAI;IAChD,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC;AAC/B,IAAA,MAAM,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC;AACzC,IAAA,MAAM,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC;AACzC,IAAA,MAAM,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC;AAEzC,IAAA,MAAM,SAAS,GAAG,CAAC,KAAK,GAAG,CAAC,GAAG,KAAK,GAAG,CAAC,GAAG,KAAK,GAAG,CAAC,IAAI,GAAG;IAC3D,OAAO,SAAS,GAAG,GAAG,GAAG,SAAS,GAAG,SAAS;AAClD;AAEO,MAAM,KAAK,GAAG,CAAC,KAAa,EAAE,OAAO,GAAG,CAAC,KAAI;IAChD,IAAI,OAAO,OAAO,KAAK,QAAQ;AAAE,QAAA,OAAO,KAAK;AAC7C,IAAA,IAAI,QAAQ,GAAG,OAAO,GAAG,GAAG;AAC5B,IAAA,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,GAAG,CAAC;AAAE,QAAA,MAAM,IAAI,KAAK,CAAC,CAAA,iBAAA,CAAmB,CAAC;AAChE,IAAA,OAAO,CAAC,KAAK,IAAI,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,GAAG,IAAI,QAAQ,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAA,CAAE,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,EAAE,WAAW,EAAE;AACpG;;;;;;;;;;"}
|
package/css/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/css/index.ts"],"sourcesContent":["import getValue from \"./getValue\"\
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/css/index.ts"],"sourcesContent":["import getValue from \"./getValue\"\nimport getProps from \"./getProps\"\nimport aliases from \"./aliases\"\nimport { Aliases, BreakpointKeys, CSSOptionProps, CSSProps } from './types'\nimport { css as _css } from \"oncss\"\n\nexport {\n getValue,\n getProps\n}\n\nexport const breakpoints = {\n xs: 0,\n sm: 640,\n md: 768,\n lg: 1024,\n xl: 1280,\n}\n\nexport const css = (props: CSSProps, options?: CSSOptionProps) => {\n const cssOptions: CSSOptionProps = {\n ...options,\n breakpoints,\n aliases,\n getValue: (p: any, v: any, _c: any, dept) => {\n if (options?.getValue) {\n let _val = options?.getValue(p, v, _c, dept)\n if (_val) return _val\n }\n return getValue(p, v, _c)\n },\n getProps: (p: any, v: any, _c: any, dept) => {\n if (options?.getProps) {\n let _p = options?.getProps(p, v, _c, dept)\n if (_p) return _p\n }\n return getProps(p, v, _c)\n },\n }\n return _css<Aliases, BreakpointKeys>(props, cssOptions)\n}\n\nexport const adjustColor = (hex: string, factor: number) => {\n\n hex = hex.replace(/^#/, '')\n\n let r = parseInt(hex.slice(0, 2), 16)\n let g = parseInt(hex.slice(2, 4), 16)\n let b = parseInt(hex.slice(4, 6), 16)\n\n r = Math.floor(r * factor)\n g = Math.floor(g * factor)\n b = Math.floor(b * factor)\n\n r = Math.min(255, Math.max(0, r))\n g = Math.min(255, Math.max(0, g))\n b = Math.min(255, Math.max(0, b))\n\n return `#${r.toString(16).padStart(2, '0')}${g.toString(16).padStart(2, '0')}${b.toString(16).padStart(2, '0')}`;\n}\n\nexport const adjustTextContrast = (color: string) => {\n color = color.replace(/^#/, '')\n const r = parseInt(color.slice(0, 2), 16);\n const g = parseInt(color.slice(2, 4), 16);\n const b = parseInt(color.slice(4, 6), 16);\n\n const luminance = (0.299 * r + 0.587 * g + 0.114 * b) / 255;\n return luminance > 0.5 ? '#111111' : '#FFFFFF';\n}\n\nexport const alpha = (color: string, opacity = 1) => {\n if (typeof opacity !== 'number') return color\n let _opacity = opacity * 100\n if (!color.startsWith(\"#\")) throw new Error(`color must be hex`)\n return (color + (`0${Math.round((255 / 100) * _opacity).toString(16)}`.slice(-2))).toUpperCase();\n};\n\n"],"names":["_css"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useAnimation.cjs","sources":["../../src/hooks/useAnimation.ts"],"sourcesContent":["\"use client\";\
|
|
1
|
+
{"version":3,"file":"useAnimation.cjs","sources":["../../src/hooks/useAnimation.ts"],"sourcesContent":["\"use client\";\nimport { css } from '../css'\nimport { useId } from 'react'\nimport { CSSProps } from '../css/types'\nimport { useDocument } from '../Document';\nimport { useCSSCacheId } from '../css/CSSCacheProvider';\n\nexport const animationEases = {\n standard: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n fast: \"cubic-bezier(0.2, 0, 0, 1)\",\n smooth: \"cubic-bezier(0.25, 0.46, 0.45, 0.94)\",\n linear: \"cubic-bezier(0, 0, 1, 1)\",\n bounce: \"cubic-bezier(0.34, 1.50, 0.64, 1)\",\n};\n\nexport interface UseAnimationProps {\n delay?: number;\n duration?: number;\n from: CSSProps;\n to: CSSProps;\n ease?: keyof typeof animationEases;\n}\n\nconst useAnimation = ({ from, to, delay, ease, duration }: UseAnimationProps) => {\n let _delay = delay || 0;\n let _duration = duration || 600;\n let _ease = ease || \"standard\"\n const id = \"anim\" + useId().replace(/:/g, \"\")\n const doc = useDocument()\n const cacheId = useCSSCacheId()\n\n const anim = css({\n animationName: id,\n animationDelay: _delay + \"ms\",\n animationDuration: _duration + \"ms\",\n animationTimingFunction: animationEases[_ease] || animationEases.standard,\n [`@keyframes ${id}`]: {\n from: from as any,\n to: to as any\n }\n }, {\n container: doc?.document,\n cacheId,\n injectStyle: typeof window !== 'undefined'\n })\n return anim.classname\n}\n\nexport default useAnimation"],"names":[],"mappings":";;;;;;;;;;AAOO;AACH;AACA;AACA;AACA;AACA;;AAWJ;AACI;AACA;AACA;AACA;AACA;AACA;;AAGI;;;;AAIA;AACI;AACA;AACH;;AAED;;AAEA;AACH;;AAEL;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useAnimation.js","sources":["../../src/hooks/useAnimation.ts"],"sourcesContent":["\"use client\";\
|
|
1
|
+
{"version":3,"file":"useAnimation.js","sources":["../../src/hooks/useAnimation.ts"],"sourcesContent":["\"use client\";\nimport { css } from '../css'\nimport { useId } from 'react'\nimport { CSSProps } from '../css/types'\nimport { useDocument } from '../Document';\nimport { useCSSCacheId } from '../css/CSSCacheProvider';\n\nexport const animationEases = {\n standard: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n fast: \"cubic-bezier(0.2, 0, 0, 1)\",\n smooth: \"cubic-bezier(0.25, 0.46, 0.45, 0.94)\",\n linear: \"cubic-bezier(0, 0, 1, 1)\",\n bounce: \"cubic-bezier(0.34, 1.50, 0.64, 1)\",\n};\n\nexport interface UseAnimationProps {\n delay?: number;\n duration?: number;\n from: CSSProps;\n to: CSSProps;\n ease?: keyof typeof animationEases;\n}\n\nconst useAnimation = ({ from, to, delay, ease, duration }: UseAnimationProps) => {\n let _delay = delay || 0;\n let _duration = duration || 600;\n let _ease = ease || \"standard\"\n const id = \"anim\" + useId().replace(/:/g, \"\")\n const doc = useDocument()\n const cacheId = useCSSCacheId()\n\n const anim = css({\n animationName: id,\n animationDelay: _delay + \"ms\",\n animationDuration: _duration + \"ms\",\n animationTimingFunction: animationEases[_ease] || animationEases.standard,\n [`@keyframes ${id}`]: {\n from: from as any,\n to: to as any\n }\n }, {\n container: doc?.document,\n cacheId,\n injectStyle: typeof window !== 'undefined'\n })\n return anim.classname\n}\n\nexport default useAnimation"],"names":[],"mappings":";;;;;;AAOO;AACH;AACA;AACA;AACA;AACA;;AAWJ;AACI;AACA;AACA;AACA;AACA;AACA;;AAGI;;;;AAIA;AACI;AACA;AACH;;AAED;;AAEA;AACH;;AAEL;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useColorTemplate.cjs","sources":["../../src/hooks/useColorTemplate.ts"],"sourcesContent":["\"use client\";\
|
|
1
|
+
{"version":3,"file":"useColorTemplate.cjs","sources":["../../src/hooks/useColorTemplate.ts"],"sourcesContent":["\"use client\";\nexport type UseColorTemplateType = \"fill\" | \"outline\" | \"text\" | \"soft\"\nexport type UseColorTemplateColor = \"default\" | \"brand\" | \"accent\" | \"success\" | \"info\" | \"warning\" | \"danger\"\n\nconst useColorTemplate = (color: UseColorTemplateColor, type: UseColorTemplateType) => {\n const is_def = color === \"default\";\n if (is_def) {\n color = \"divider\" as any\n }\n\n if (type === \"outline\") {\n return {\n primary: {\n bgcolor: `transparent`,\n color: is_def ? `text.primary` : `${color}.primary`,\n border: \"1px solid\",\n borderColor: is_def ? `divider` : `${color}.primary`,\n },\n secondary: {\n bgcolor: `transparent`,\n color: is_def ? `text.primary` : `${color}.secondary`,\n border: \"1px solid\",\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\n }\n }\n } else if (type === \"fill\") {\n return {\n primary: {\n bgcolor: color,\n color: is_def ? `text.primary` : `${color}.text`,\n border: \"1px solid\",\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\n },\n secondary: {\n bgcolor: `${color}.secondary`,\n color: is_def ? `text.primary` : `${color}.text`,\n border: \"1px solid\",\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\n }\n }\n } else if (type === \"text\") {\n return {\n primary: {\n bgcolor: \"transparent\",\n color: is_def ? `text.primary` : `${color}.primary`,\n border: 0,\n borderColor: `transparent`,\n },\n secondary: {\n bgcolor: \"transparent\",\n color: is_def ? `text.primary` : `${color}.secondary`,\n border: 0,\n borderColor: `transparent`,\n }\n }\n } else if (type === \"soft\") {\n return {\n primary: {\n bgcolor: `${color}.soft.primary`,\n color: is_def ? `text.primary` : color,\n border: 0,\n borderColor: `transparent`,\n },\n secondary: {\n bgcolor: `${color}.soft.secondary`,\n color: is_def ? `text.primary` : `${color}.secondary`,\n border: 0,\n borderColor: `transparent`,\n }\n }\n }\n\n throw new Error(`useColorTemplate: Unknown type ${type}`);\n}\n\nexport default useColorTemplate"],"names":[],"mappings":";;;AAIA;AACI;;;;AAKA;;AAEQ;AACI;;AAEA;;AAEH;AACD;AACI;;AAEA;;AAEH;;;AAEF;;AAEC;AACI;;AAEA;;AAEH;AACD;;;AAGI;;AAEH;;;AAEF;;AAEC;AACI;;AAEA;AACA;AACH;AACD;AACI;;AAEA;AACA;AACH;;;AAEF;;AAEC;;;AAGI;AACA;AACH;AACD;;;AAGI;AACA;AACH;;;AAIT;AACJ;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useColorTemplate.js","sources":["../../src/hooks/useColorTemplate.ts"],"sourcesContent":["\"use client\";\
|
|
1
|
+
{"version":3,"file":"useColorTemplate.js","sources":["../../src/hooks/useColorTemplate.ts"],"sourcesContent":["\"use client\";\nexport type UseColorTemplateType = \"fill\" | \"outline\" | \"text\" | \"soft\"\nexport type UseColorTemplateColor = \"default\" | \"brand\" | \"accent\" | \"success\" | \"info\" | \"warning\" | \"danger\"\n\nconst useColorTemplate = (color: UseColorTemplateColor, type: UseColorTemplateType) => {\n const is_def = color === \"default\";\n if (is_def) {\n color = \"divider\" as any\n }\n\n if (type === \"outline\") {\n return {\n primary: {\n bgcolor: `transparent`,\n color: is_def ? `text.primary` : `${color}.primary`,\n border: \"1px solid\",\n borderColor: is_def ? `divider` : `${color}.primary`,\n },\n secondary: {\n bgcolor: `transparent`,\n color: is_def ? `text.primary` : `${color}.secondary`,\n border: \"1px solid\",\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\n }\n }\n } else if (type === \"fill\") {\n return {\n primary: {\n bgcolor: color,\n color: is_def ? `text.primary` : `${color}.text`,\n border: \"1px solid\",\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\n },\n secondary: {\n bgcolor: `${color}.secondary`,\n color: is_def ? `text.primary` : `${color}.text`,\n border: \"1px solid\",\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\n }\n }\n } else if (type === \"text\") {\n return {\n primary: {\n bgcolor: \"transparent\",\n color: is_def ? `text.primary` : `${color}.primary`,\n border: 0,\n borderColor: `transparent`,\n },\n secondary: {\n bgcolor: \"transparent\",\n color: is_def ? `text.primary` : `${color}.secondary`,\n border: 0,\n borderColor: `transparent`,\n }\n }\n } else if (type === \"soft\") {\n return {\n primary: {\n bgcolor: `${color}.soft.primary`,\n color: is_def ? `text.primary` : color,\n border: 0,\n borderColor: `transparent`,\n },\n secondary: {\n bgcolor: `${color}.soft.secondary`,\n color: is_def ? `text.primary` : `${color}.secondary`,\n border: 0,\n borderColor: `transparent`,\n }\n }\n }\n\n throw new Error(`useColorTemplate: Unknown type ${type}`);\n}\n\nexport default useColorTemplate"],"names":[],"mappings":";AAIA;AACI;;;;AAKA;;AAEQ;AACI;;AAEA;;AAEH;AACD;AACI;;AAEA;;AAEH;;;AAEF;;AAEC;AACI;;AAEA;;AAEH;AACD;;;AAGI;;AAEH;;;AAEF;;AAEC;AACI;;AAEA;AACA;AACH;AACD;AACI;;AAEA;AACA;AACH;;;AAEF;;AAEC;;;AAGI;AACA;AACH;AACD;;;AAGI;AACA;AACH;;;AAIT;AACJ;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useInterface.cjs","sources":["../../src/hooks/useInterface.ts"],"sourcesContent":["import { useTheme } from \"../theme\"\
|
|
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;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useInterface.js","sources":["../../src/hooks/useInterface.ts"],"sourcesContent":["import { useTheme } from \"../theme\"\
|
|
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;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useMergeRefs.cjs","sources":["../../src/hooks/useMergeRefs.ts"],"sourcesContent":["\"use client\";\
|
|
1
|
+
{"version":3,"file":"useMergeRefs.cjs","sources":["../../src/hooks/useMergeRefs.ts"],"sourcesContent":["\"use client\";\nimport { useCallback } from \"react\";\n\nfunction useMergeRefs<T>(\n ...refs: Array<React.Ref<T> | undefined>\n) {\n return useCallback((value: T | null) => {\n for (const ref of refs) {\n if (!ref) continue;\n if (typeof ref === \"function\") {\n ref(value);\n } else {\n (ref as React.MutableRefObject<T | null>).current = value;\n }\n }\n }, refs);\n}\n\nexport default useMergeRefs;"],"names":[],"mappings":";;;;;AAGA;AAGG;AACG;AACG;;AACA;;;;AAGI;;;;AAIb;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useMergeRefs.js","sources":["../../src/hooks/useMergeRefs.ts"],"sourcesContent":["\"use client\";\
|
|
1
|
+
{"version":3,"file":"useMergeRefs.js","sources":["../../src/hooks/useMergeRefs.ts"],"sourcesContent":["\"use client\";\nimport { useCallback } from \"react\";\n\nfunction useMergeRefs<T>(\n ...refs: Array<React.Ref<T> | undefined>\n) {\n return useCallback((value: T | null) => {\n for (const ref of refs) {\n if (!ref) continue;\n if (typeof ref === \"function\") {\n ref(value);\n } else {\n (ref as React.MutableRefObject<T | null>).current = value;\n }\n }\n }, refs);\n}\n\nexport default useMergeRefs;"],"names":[],"mappings":";;;AAGA;AAGG;AACG;AACG;;AACA;;;;AAGI;;;;AAIb;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../../../src/hooks/useTransition/index.ts"],"sourcesContent":["\"use client\";\
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../../src/hooks/useTransition/index.ts"],"sourcesContent":["\"use client\";\nimport { useState, useEffect, useId, useLayoutEffect } 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 { useDocument } from '../../Document';\nimport { useCSSCacheId } from '../../css/CSSCacheProvider';\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 style = (obj = {}, cacheId: string, doc?: Document) => {\n return css(obj, { selector: \"#\", container: doc, cacheId }).classname;\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 const doc = useDocument();\n const cacheId = useCSSCacheId()\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: style({ visibility: \"hidden\" }, cacheId, doc?.document),\n variant: variant,\n rect: null as DOMRect | null,\n stage: open ? \"open\" : \"closed\",\n unmounted: false,\n })\n\n const getEle = () => doc?.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: style({ visibility: \"hidden\" }, cacheId, doc?.document),\n stage: \"open\",\n }))\n }\n }\n }, [open, state.stage, exitOnUnmount, variant])\n\n // initial effect\n useLayoutEffect(() => {\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) ? style(from, cacheId, doc?.document) : \"\",\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: style(from, cacheId, doc?.document),\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: style(_, cacheId, doc?.document),\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":";;;;;;;;;;;;AAgCA;AACG;AACH;AAEA;AACG;AACA;AAAS;AACT;AACH;AAEA;AAAuB;AACpB;AAcA;AACA;AACA;AACA;AACA;AACG;AACA;AACA;AACA;;AAEA;AACF;AAED;AACA;;;;;;;AAaS;;;AAQT;;;AAIG;AACA;;AACA;;AAEA;AACA;AACA;;;;AASG;;AAEG;;AAEG;;AAEA;;;AAMN;AAEA;;AAEG;;AAEG;;AAEA;;;AAMN;;AACI;AACJ;;AAMN;;AAIG;AACG;AACA;;;AAGA;AAIA;;;;AASH;AACA;;AAEG;;AAEF;;AAEP;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { __rest } from 'tslib';
|
|
3
|
-
import { useId, useState, useEffect } from 'react';
|
|
3
|
+
import { useId, useState, useEffect, useLayoutEffect } from 'react';
|
|
4
4
|
import { animationEases } from '../useAnimation.js';
|
|
5
5
|
import { css } from '../../css/index.js';
|
|
6
6
|
import { formatCSSProp } from 'oncss';
|
|
@@ -45,7 +45,7 @@ const useTransition = (_a) => {
|
|
|
45
45
|
}
|
|
46
46
|
}, [open, state.stage, exitOnUnmount, variant]);
|
|
47
47
|
// initial effect
|
|
48
|
-
|
|
48
|
+
useLayoutEffect(() => {
|
|
49
49
|
const ele = getEle();
|
|
50
50
|
if (!ele)
|
|
51
51
|
return;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/hooks/useTransition/index.ts"],"sourcesContent":["\"use client\";\
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/hooks/useTransition/index.ts"],"sourcesContent":["\"use client\";\nimport { useState, useEffect, useId, useLayoutEffect } 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 { useDocument } from '../../Document';\nimport { useCSSCacheId } from '../../css/CSSCacheProvider';\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 style = (obj = {}, cacheId: string, doc?: Document) => {\n return css(obj, { selector: \"#\", container: doc, cacheId }).classname;\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 const doc = useDocument();\n const cacheId = useCSSCacheId()\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: style({ visibility: \"hidden\" }, cacheId, doc?.document),\n variant: variant,\n rect: null as DOMRect | null,\n stage: open ? \"open\" : \"closed\",\n unmounted: false,\n })\n\n const getEle = () => doc?.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: style({ visibility: \"hidden\" }, cacheId, doc?.document),\n stage: \"open\",\n }))\n }\n }\n }, [open, state.stage, exitOnUnmount, variant])\n\n // initial effect\n useLayoutEffect(() => {\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) ? style(from, cacheId, doc?.document) : \"\",\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: style(from, cacheId, doc?.document),\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: style(_, cacheId, doc?.document),\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":";;;;;;;;;;AAgCA;AACG;AACH;AAEA;AACG;AACA;AAAS;AACT;AACH;AAEA;AAAuB;AACpB;AAcA;AACA;AACA;AACA;AACA;AACG;AACA;AACA;AACA;;AAEA;AACF;AAED;AACA;;;;;;;AAaS;;;AAQT;;;AAIG;AACA;;AACA;;AAEA;AACA;AACA;;;;AASG;;AAEG;;AAEG;;AAEA;;;AAMN;AAEA;;AAEG;;AAEG;;AAEA;;;AAMN;;AACI;AACJ;;AAMN;;AAIG;AACG;AACA;;;AAGA;AAIA;;;;AASH;AACA;;AAEG;;AAEF;;AAEP;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"variants.cjs","sources":["../../../src/hooks/useTransition/variants.ts"],"sourcesContent":["\
|
|
1
|
+
{"version":3,"file":"variants.cjs","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":";;AACO,MAAM,SAAS,GAAG,CAAC,IAAa,KAAI;IAEvC,OAAO;AACH,QAAA,IAAI,EAAE;AACF,YAAA,SAAS,EAAE,CAAA,YAAA,EAAe,IAAI,CAAC,MAAM,CAAA,GAAA,CAAK;AAC7C,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,CAAA,aAAA,CAAe;AAC7B;KACJ;AACL;AAEO,MAAM,OAAO,GAAG,CAAC,IAAa,KAAI;IACrC,OAAO;AACH,QAAA,IAAI,EAAE;AACF,YAAA,SAAS,EAAE,CAAA,WAAA,EAAc,IAAI,CAAC,MAAM,CAAA,GAAA,CAAK;AAC5C,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,CAAA,aAAA,CAAe;AAC7B;KACJ;AACL;AAEO,MAAM,UAAU,GAAG,CAAC,IAAa,KAAI;IACxC,OAAO;AACH,QAAA,IAAI,EAAE;AACF,YAAA,SAAS,EAAE,CAAA,YAAA,EAAe,IAAI,CAAC,KAAK,CAAA,GAAA,CAAK;AAC5C,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,CAAA,aAAA,CAAe;AAC7B;KACJ;AACL;AAEO,MAAM,SAAS,GAAG,CAAC,IAAa,KAAI;IACvC,OAAO;AACH,QAAA,IAAI,EAAE;AACF,YAAA,SAAS,EAAE,CAAA,WAAA,EAAc,IAAI,CAAC,KAAK,CAAA,GAAA,CAAK;AAC3C,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,CAAA,aAAA,CAAe;AAC7B;KACJ;AACL;AAEO,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;AAEO,MAAM,QAAQ,GAAG,MAAK;IACzB,OAAO;AACH,QAAA,IAAI,EAAE;AACF,YAAA,SAAS,EAAE,CAAA,iBAAA,CAAmB;AAC9B,YAAA,OAAO,EAAE;AACZ,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,CAAA,aAAA,CAAe;AAC1B,YAAA,OAAO,EAAE;AACZ;KACJ;AACL;AAEO,MAAM,MAAM,GAAG,MAAK;IACvB,OAAO;AACH,QAAA,IAAI,EAAE;AACF,YAAA,SAAS,EAAE,CAAA,gBAAA,CAAkB;AAC7B,YAAA,OAAO,EAAE;AACZ,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,CAAA,aAAA,CAAe;AAC1B,YAAA,OAAO,EAAE;AACZ;KACJ;AACL;AAEO,MAAM,SAAS,GAAG,MAAK;IAC1B,OAAO;AACH,QAAA,IAAI,EAAE;AACF,YAAA,SAAS,EAAE,CAAA,iBAAA,CAAmB;AAC9B,YAAA,OAAO,EAAE;AACZ,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,CAAA,aAAA,CAAe;AAC1B,YAAA,OAAO,EAAE;AACZ;KACJ;AACL;AAEO,MAAM,QAAQ,GAAG,MAAK;IACzB,OAAO;AACH,QAAA,IAAI,EAAE;AACF,YAAA,SAAS,EAAE,CAAA,gBAAA,CAAkB;AAC7B,YAAA,OAAO,EAAE;AACZ,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,CAAA,aAAA,CAAe;AAC1B,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,OAAO,EAAE;AACZ,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,UAAU;AACrB,YAAA,OAAO,EAAE;AACZ;KACJ;AACL;AAEO,MAAM,QAAQ,GAAG,MAAK;IACzB,OAAO;AACH,QAAA,IAAI,EAAE;AACF,YAAA,SAAS,EAAE,YAAY;AACvB,YAAA,OAAO,EAAE;AACZ,SAAA;AACD,QAAA,EAAE,EAAE;AACA,YAAA,SAAS,EAAE,UAAU;AACrB,YAAA,OAAO,EAAE;AACZ;KACJ;AACL;AAEO,MAAM,gBAAgB,GAAG,CAAC,IAAa,KAAI;IAE9C,OAAO;AACH,QAAA,IAAI,EAAE;YACF,SAAS,EAAE,CAAC,GAAG,IAAI;AACnB,YAAA,QAAQ,EAAE;AACb,SAAA;AACD,QAAA,EAAE,EAAE;YACA,SAAS,EAAE,IAAI,CAAC,MAAM;AACtB,YAAA,QAAQ,EAAE;AACb;KACJ;AACL;AAGO,MAAM,kBAAkB,GAAG,CAAC,IAAa,KAAI;IAChD,OAAO;AACH,QAAA,IAAI,EAAE;YACF,KAAK,EAAE,CAAC,GAAG,IAAI;AACf,YAAA,QAAQ,EAAE;AACb,SAAA;AACD,QAAA,EAAE,EAAE;YACA,KAAK,EAAE,CAAA,IAAI,KAAA,IAAA,IAAJ,IAAI,uBAAJ,IAAI,CAAE,KAAK,IAAG,CAAA,IAAI,KAAA,IAAA,IAAJ,IAAI,KAAA,MAAA,GAAA,MAAA,GAAJ,IAAI,CAAE,KAAK,IAAG,IAAI,GAAG,MAAM;AAChD,YAAA,QAAQ,EAAE;AACb;KACJ;AACL;;;;;;;;;;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"variants.js","sources":["../../../src/hooks/useTransition/variants.ts"],"sourcesContent":["\
|
|
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)`,\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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"}
|