@xanui/core 1.2.43 → 1.2.45
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 +20 -0
- package/AppRoot/AppRootProvider.cjs.map +1 -0
- package/AppRoot/AppRootProvider.js +7 -10
- package/AppRoot/AppRootProvider.js.map +1 -1
- package/AppRoot/Renderar.cjs +89 -0
- package/AppRoot/Renderar.cjs.map +1 -0
- package/AppRoot/Renderar.d.ts +1 -0
- package/AppRoot/Renderar.js +52 -20
- package/AppRoot/Renderar.js.map +1 -1
- package/AppRoot/index.cjs +45 -0
- package/AppRoot/index.cjs.map +1 -0
- package/AppRoot/index.js +25 -24
- package/AppRoot/index.js.map +1 -1
- package/Document/index.cjs +21 -0
- package/Document/index.cjs.map +1 -0
- package/Document/index.d.ts +7 -1
- package/Document/index.js +8 -11
- package/Document/index.js.map +1 -1
- package/Iframe/index.cjs +45 -0
- package/Iframe/{index.mjs.map → index.cjs.map} +1 -1
- package/Iframe/index.js +23 -25
- package/Iframe/index.js.map +1 -1
- package/Tag/ServerStyleTag.cjs +13 -0
- package/Tag/{ServerStyleTag.mjs.map → ServerStyleTag.cjs.map} +1 -1
- package/Tag/ServerStyleTag.js +3 -5
- package/Tag/ServerStyleTag.js.map +1 -1
- package/Tag/{cssPropList.mjs → cssPropList.cjs} +4 -2
- package/Tag/cssPropList.cjs.map +1 -0
- package/Tag/cssPropList.js +1 -3
- package/Tag/cssPropList.js.map +1 -1
- package/Tag/index.cjs +40 -0
- package/Tag/{index.mjs.map → index.cjs.map} +1 -1
- package/Tag/index.js +10 -31
- package/Tag/index.js.map +1 -1
- package/Tag/{useTagProps.mjs → useTagProps.cjs} +18 -16
- package/Tag/useTagProps.cjs.map +1 -0
- package/Tag/useTagProps.js +15 -17
- package/Tag/useTagProps.js.map +1 -1
- package/Transition/index.cjs +29 -0
- package/Transition/{index.mjs.map → index.cjs.map} +1 -1
- package/Transition/index.js +13 -15
- package/Transition/index.js.map +1 -1
- package/breakpoint/BreakpointProvider.cjs +49 -0
- package/breakpoint/BreakpointProvider.cjs.map +1 -0
- package/breakpoint/BreakpointProvider.js +27 -24
- package/breakpoint/BreakpointProvider.js.map +1 -1
- package/breakpoint/useBreakpoint.cjs +24 -0
- package/breakpoint/{useBreakpoint.mjs.map → useBreakpoint.cjs.map} +1 -1
- package/breakpoint/useBreakpoint.js +7 -9
- package/breakpoint/useBreakpoint.js.map +1 -1
- package/breakpoint/{useBreakpointProps.mjs → useBreakpointProps.cjs} +8 -6
- package/breakpoint/useBreakpointProps.cjs.map +1 -0
- package/breakpoint/useBreakpointProps.js +5 -7
- package/breakpoint/useBreakpointProps.js.map +1 -1
- package/css/CSSCacheProvider.cjs +34 -0
- package/css/{CSSCacheProvider.mjs.map → CSSCacheProvider.cjs.map} +1 -1
- package/css/CSSCacheProvider.js +10 -15
- package/css/CSSCacheProvider.js.map +1 -1
- package/css/{aliases.mjs → aliases.cjs} +4 -2
- package/css/aliases.cjs.map +1 -0
- package/css/aliases.js +1 -3
- package/css/aliases.js.map +1 -1
- package/css/{getProps.mjs → getProps.cjs} +4 -2
- package/css/{getProps.mjs.map → getProps.cjs.map} +1 -1
- package/css/getProps.js +1 -3
- package/css/getProps.js.map +1 -1
- package/css/{getValue.mjs → getValue.cjs} +4 -2
- package/css/{getValue.mjs.map → getValue.cjs.map} +1 -1
- package/css/getValue.js +1 -3
- package/css/getValue.js.map +1 -1
- package/css/{index.mjs → index.cjs} +15 -7
- package/css/index.cjs.map +1 -0
- package/css/index.js +6 -14
- package/css/index.js.map +1 -1
- package/hooks/{useAnimation.mjs → useAnimation.cjs} +16 -11
- package/hooks/{useAnimation.mjs.map → useAnimation.cjs.map} +1 -1
- package/hooks/useAnimation.js +10 -15
- package/hooks/useAnimation.js.map +1 -1
- package/hooks/{useColorTemplate.mjs → useColorTemplate.cjs} +4 -2
- package/hooks/{useColorTemplate.mjs.map → useColorTemplate.cjs.map} +1 -1
- package/hooks/useColorTemplate.js +1 -3
- package/hooks/useColorTemplate.js.map +1 -1
- package/hooks/useInterface.cjs +19 -0
- package/hooks/useInterface.cjs.map +1 -0
- package/hooks/useInterface.js +7 -9
- package/hooks/useInterface.js.map +1 -1
- package/hooks/{useMergeRefs.mjs → useMergeRefs.cjs} +6 -4
- package/hooks/{useMergeRefs.mjs.map → useMergeRefs.cjs.map} +1 -1
- package/hooks/useMergeRefs.js +3 -5
- package/hooks/useMergeRefs.js.map +1 -1
- package/hooks/usePortal.cjs +69 -0
- package/hooks/usePortal.cjs.map +1 -0
- package/hooks/usePortal.js +29 -32
- package/hooks/usePortal.js.map +1 -1
- package/hooks/useTransition/{index.mjs → index.cjs} +29 -27
- package/hooks/useTransition/index.cjs.map +1 -0
- package/hooks/useTransition/index.js +26 -28
- package/hooks/useTransition/index.js.map +1 -1
- package/hooks/useTransition/{variants.mjs → variants.cjs} +17 -2
- package/hooks/useTransition/{variants.mjs.map → variants.cjs.map} +1 -1
- package/hooks/useTransition/variants.js +1 -16
- package/hooks/useTransition/variants.js.map +1 -1
- package/index.cjs +64 -0
- package/index.cjs.map +1 -0
- package/index.js +25 -63
- package/index.js.map +1 -1
- package/package.json +4 -11
- package/theme/{ThemeCssVars.mjs → ThemeCssVars.cjs} +4 -2
- package/theme/{ThemeCssVars.mjs.map → ThemeCssVars.cjs.map} +1 -1
- package/theme/ThemeCssVars.js +1 -3
- package/theme/ThemeCssVars.js.map +1 -1
- package/theme/{ThemeDefaultOptions.mjs → ThemeDefaultOptions.cjs} +11 -5
- package/theme/{ThemeDefaultOptions.mjs.map → ThemeDefaultOptions.cjs.map} +1 -1
- package/theme/ThemeDefaultOptions.js +4 -10
- package/theme/ThemeDefaultOptions.js.map +1 -1
- package/theme/{ThemeProvider.mjs → ThemeProvider.cjs} +52 -31
- package/theme/ThemeProvider.cjs.map +1 -0
- package/theme/ThemeProvider.js +30 -51
- package/theme/ThemeProvider.js.map +1 -1
- package/theme/{core.mjs → core.cjs} +12 -6
- package/theme/core.cjs.map +1 -0
- package/theme/core.js +5 -11
- package/theme/core.js.map +1 -1
- package/theme/createTheme.cjs +27 -0
- package/theme/{createTheme.mjs.map → createTheme.cjs.map} +1 -1
- package/theme/createTheme.js +10 -12
- package/theme/createTheme.js.map +1 -1
- package/theme/{createThemeSwitcher.mjs → createThemeSwitcher.cjs} +8 -6
- package/theme/{createThemeSwitcher.mjs.map → createThemeSwitcher.cjs.map} +1 -1
- package/theme/createThemeSwitcher.js +5 -7
- package/theme/createThemeSwitcher.js.map +1 -1
- package/theme/index.cjs +15 -0
- package/theme/{index.mjs.map → index.cjs.map} +1 -1
- package/theme/index.js +6 -11
- package/theme/index.js.map +1 -1
- package/AppRoot/AppRootProvider.mjs +0 -17
- package/AppRoot/AppRootProvider.mjs.map +0 -1
- package/AppRoot/Renderar.mjs +0 -51
- package/AppRoot/Renderar.mjs.map +0 -1
- package/AppRoot/index.mjs +0 -40
- package/AppRoot/index.mjs.map +0 -1
- package/Document/index.mjs +0 -18
- package/Document/index.mjs.map +0 -1
- package/Iframe/index.mjs +0 -43
- package/Tag/ServerStyleTag.mjs +0 -11
- package/Tag/cssPropList.mjs.map +0 -1
- package/Tag/index.mjs +0 -19
- package/Tag/useTagProps.mjs.map +0 -1
- package/Transition/index.mjs +0 -27
- package/breakpoint/BreakpointProvider.mjs +0 -40
- package/breakpoint/BreakpointProvider.mjs.map +0 -1
- package/breakpoint/useBreakpoint.mjs +0 -22
- package/breakpoint/useBreakpointProps.mjs.map +0 -1
- package/css/CSSCacheProvider.mjs +0 -29
- package/css/aliases.mjs.map +0 -1
- package/css/index.mjs.map +0 -1
- package/hooks/useInterface.mjs +0 -17
- package/hooks/useInterface.mjs.map +0 -1
- package/hooks/usePortal.mjs +0 -68
- package/hooks/usePortal.mjs.map +0 -1
- package/hooks/useTransition/index.mjs.map +0 -1
- package/index.mjs +0 -26
- package/index.mjs.map +0 -1
- package/theme/ThemeProvider.mjs.map +0 -1
- package/theme/core.mjs.map +0 -1
- package/theme/createTheme.mjs +0 -25
- package/theme/index.mjs +0 -10
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getValue.
|
|
1
|
+
{"version":3,"file":"getValue.cjs","sources":["../../src/css/getValue.ts"],"sourcesContent":["import { CSSProps } from \"./types\"\r\n\r\nconst getColor = (color: string, hasText = true) => {\r\n const i = {\r\n [`${color}`]: `var(--color-${color}-primary)`,\r\n [`${color}.primary`]: `var(--color-${color}-primary)`,\r\n [`${color}.secondary`]: `var(--color-${color}-secondary)`,\r\n [`${color}.soft.primary`]: `var(--color-${color}-soft-primary)`,\r\n [`${color}.soft.secondary`]: `var(--color-${color}-soft-secondary)`,\r\n }\r\n if (hasText) {\r\n i[`${color}.text`] = `var(--color-${color}-text)`\r\n }\r\n\r\n return i\r\n}\r\n\r\nconst withImportant = (important: any, value: any) => important ? value + important : value\r\nconst colors: any = {\r\n ...getColor(\"background\", false),\r\n ...getColor(\"text\", false),\r\n ...getColor(\"divider\", false),\r\n ...getColor(\"brand\"),\r\n ...getColor(\"accent\"),\r\n ...getColor(\"info\"),\r\n ...getColor(\"success\"),\r\n ...getColor(\"warning\"),\r\n ...getColor(\"danger\"),\r\n}\r\n\r\nconst breakpoints: any = {\r\n \"xs\": \"var(--bp-xs)\",\r\n \"sm\": \"var(--bp-sm)\",\r\n \"md\": \"var(--bp-md)\",\r\n \"lg\": \"var(--bp-lg)\",\r\n \"xl\": \"var(--bp-xl)\"\r\n}\r\n\r\nlet fontsizes: any = {\r\n \"h1\": \"var(--fontsize-h1)\",\r\n \"h2\": \"var(--fontsize-h2)\",\r\n \"h3\": \"var(--fontsize-h3)\",\r\n \"h4\": \"var(--fontsize-h4)\",\r\n \"h5\": \"var(--fontsize-h5)\",\r\n \"h6\": \"var(--fontsize-h6)\",\r\n \"big\": \"var(--fontsize-big)\",\r\n \"text\": \"var(--fontsize-text)\",\r\n \"button\": \"var(--fontsize-button)\",\r\n \"small\": \"var(--fontsize-small)\"\r\n}\r\n\r\nlet lineHeights: any = {\r\n \"h1\": \"var(--lineheight-h1)\",\r\n \"h2\": \"var(--lineheight-h2)\",\r\n \"h3\": \"var(--lineheight-h3)\",\r\n \"h4\": \"var(--lineheight-h4)\",\r\n \"h5\": \"var(--lineheight-h5)\",\r\n \"h6\": \"var(--lineheight-h6)\",\r\n \"big\": \"var(--lineheight-big)\",\r\n \"text\": \"var(--lineheight-text)\",\r\n \"button\": \"var(--lineheight-button)\",\r\n \"small\": \"var(--lineheight-small)\"\r\n}\r\n\r\nlet fontWeights: any = {\r\n \"h1\": \"var(--fontweight-h1)\",\r\n \"h2\": \"var(--fontweight-h2)\",\r\n \"h3\": \"var(--fontweight-h3)\",\r\n \"h4\": \"var(--fontweight-h4)\",\r\n \"h5\": \"var(--fontweight-h5)\",\r\n \"h6\": \"var(--fontweight-h6)\",\r\n \"big\": \"var(--fontweight-big)\",\r\n \"text\": \"var(--fontweight-text)\",\r\n \"button\": \"var(--fontweight-button)\",\r\n \"small\": \"var(--fontweight-small)\"\r\n}\r\n\r\nlet font: any = {\r\n \"h1\": \"var(--font-h1)\",\r\n \"h2\": \"var(--font-h2)\",\r\n \"h3\": \"var(--font-h3)\",\r\n \"h4\": \"var(--font-h4)\",\r\n \"h5\": \"var(--font-h5)\",\r\n \"h6\": \"var(--font-h6)\",\r\n \"big\": \"var(--font-big)\",\r\n \"text\": \"var(--font-text)\",\r\n \"button\": \"var(--font-button)\",\r\n \"small\": \"var(--font-small)\"\r\n}\r\n\r\nconst getValue = (prop: any, value: string | number, _css: CSSProps): any => {\r\n let important;\r\n\r\n if (typeof value === 'string') {\r\n const split = value.split(\"!\")\r\n important = split[1] ? \"!important\" : \"\"\r\n value = split[0]\r\n }\r\n\r\n\r\n if (['width', 'maxWidth', 'minWidth', 'max-width', 'min-width'].includes(prop)) {\r\n return withImportant(important, breakpoints[value] || value)\r\n } else if (prop === 'font' && typeof value === \"string\" && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\r\n return withImportant(important, font[value] || value)\r\n } else if (['fontWeight', 'font-weight'].includes(prop) && typeof value === 'string' && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\r\n return withImportant(important, fontWeights[value] || value)\r\n } else if (['lineHeight', 'line-height'].includes(prop) && typeof value === 'string' && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\r\n return withImportant(important, lineHeights[value] || value)\r\n } else if (['fontSize', 'font-size'].includes(prop) && typeof value === 'string') {\r\n return withImportant(important, fontsizes[value] || value)\r\n } else if (typeof value === \"number\" && [\"shadow\", \"boxShadow\"].includes(prop)) {\r\n return withImportant(important, `var(--shadow-${value})`)\r\n }\r\n\r\n return withImportant(important, colors[value] || value)\r\n}\r\n\r\nexport default getValue"],"names":[],"mappings":"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"}
|
package/css/getValue.js
CHANGED
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
1
|
const getColor = (color, hasText = true) => {
|
|
4
2
|
const i = {
|
|
5
3
|
[`${color}`]: `var(--color-${color}-primary)`,
|
|
@@ -98,5 +96,5 @@ const getValue = (prop, value, _css) => {
|
|
|
98
96
|
return withImportant(important, colors[value] || value);
|
|
99
97
|
};
|
|
100
98
|
|
|
101
|
-
|
|
99
|
+
export { getValue as default };
|
|
102
100
|
//# sourceMappingURL=getValue.js.map
|
package/css/getValue.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getValue.js","sources":["../../src/css/getValue.ts"],"sourcesContent":["import { CSSProps } from \"./types\"\r\n\r\nconst getColor = (color: string, hasText = true) => {\r\n const i = {\r\n [`${color}`]: `var(--color-${color}-primary)`,\r\n [`${color}.primary`]: `var(--color-${color}-primary)`,\r\n [`${color}.secondary`]: `var(--color-${color}-secondary)`,\r\n [`${color}.soft.primary`]: `var(--color-${color}-soft-primary)`,\r\n [`${color}.soft.secondary`]: `var(--color-${color}-soft-secondary)`,\r\n }\r\n if (hasText) {\r\n i[`${color}.text`] = `var(--color-${color}-text)`\r\n }\r\n\r\n return i\r\n}\r\n\r\nconst withImportant = (important: any, value: any) => important ? value + important : value\r\nconst colors: any = {\r\n ...getColor(\"background\", false),\r\n ...getColor(\"text\", false),\r\n ...getColor(\"divider\", false),\r\n ...getColor(\"brand\"),\r\n ...getColor(\"accent\"),\r\n ...getColor(\"info\"),\r\n ...getColor(\"success\"),\r\n ...getColor(\"warning\"),\r\n ...getColor(\"danger\"),\r\n}\r\n\r\nconst breakpoints: any = {\r\n \"xs\": \"var(--bp-xs)\",\r\n \"sm\": \"var(--bp-sm)\",\r\n \"md\": \"var(--bp-md)\",\r\n \"lg\": \"var(--bp-lg)\",\r\n \"xl\": \"var(--bp-xl)\"\r\n}\r\n\r\nlet fontsizes: any = {\r\n \"h1\": \"var(--fontsize-h1)\",\r\n \"h2\": \"var(--fontsize-h2)\",\r\n \"h3\": \"var(--fontsize-h3)\",\r\n \"h4\": \"var(--fontsize-h4)\",\r\n \"h5\": \"var(--fontsize-h5)\",\r\n \"h6\": \"var(--fontsize-h6)\",\r\n \"big\": \"var(--fontsize-big)\",\r\n \"text\": \"var(--fontsize-text)\",\r\n \"button\": \"var(--fontsize-button)\",\r\n \"small\": \"var(--fontsize-small)\"\r\n}\r\n\r\nlet lineHeights: any = {\r\n \"h1\": \"var(--lineheight-h1)\",\r\n \"h2\": \"var(--lineheight-h2)\",\r\n \"h3\": \"var(--lineheight-h3)\",\r\n \"h4\": \"var(--lineheight-h4)\",\r\n \"h5\": \"var(--lineheight-h5)\",\r\n \"h6\": \"var(--lineheight-h6)\",\r\n \"big\": \"var(--lineheight-big)\",\r\n \"text\": \"var(--lineheight-text)\",\r\n \"button\": \"var(--lineheight-button)\",\r\n \"small\": \"var(--lineheight-small)\"\r\n}\r\n\r\nlet fontWeights: any = {\r\n \"h1\": \"var(--fontweight-h1)\",\r\n \"h2\": \"var(--fontweight-h2)\",\r\n \"h3\": \"var(--fontweight-h3)\",\r\n \"h4\": \"var(--fontweight-h4)\",\r\n \"h5\": \"var(--fontweight-h5)\",\r\n \"h6\": \"var(--fontweight-h6)\",\r\n \"big\": \"var(--fontweight-big)\",\r\n \"text\": \"var(--fontweight-text)\",\r\n \"button\": \"var(--fontweight-button)\",\r\n \"small\": \"var(--fontweight-small)\"\r\n}\r\n\r\nlet font: any = {\r\n \"h1\": \"var(--font-h1)\",\r\n \"h2\": \"var(--font-h2)\",\r\n \"h3\": \"var(--font-h3)\",\r\n \"h4\": \"var(--font-h4)\",\r\n \"h5\": \"var(--font-h5)\",\r\n \"h6\": \"var(--font-h6)\",\r\n \"big\": \"var(--font-big)\",\r\n \"text\": \"var(--font-text)\",\r\n \"button\": \"var(--font-button)\",\r\n \"small\": \"var(--font-small)\"\r\n}\r\n\r\nconst getValue = (prop: any, value: string | number, _css: CSSProps): any => {\r\n let important;\r\n\r\n if (typeof value === 'string') {\r\n const split = value.split(\"!\")\r\n important = split[1] ? \"!important\" : \"\"\r\n value = split[0]\r\n }\r\n\r\n\r\n if (['width', 'maxWidth', 'minWidth', 'max-width', 'min-width'].includes(prop)) {\r\n return withImportant(important, breakpoints[value] || value)\r\n } else if (prop === 'font' && typeof value === \"string\" && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\r\n return withImportant(important, font[value] || value)\r\n } else if (['fontWeight', 'font-weight'].includes(prop) && typeof value === 'string' && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\r\n return withImportant(important, fontWeights[value] || value)\r\n } else if (['lineHeight', 'line-height'].includes(prop) && typeof value === 'string' && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\r\n return withImportant(important, lineHeights[value] || value)\r\n } else if (['fontSize', 'font-size'].includes(prop) && typeof value === 'string') {\r\n return withImportant(important, fontsizes[value] || value)\r\n } else if (typeof value === \"number\" && [\"shadow\", \"boxShadow\"].includes(prop)) {\r\n return withImportant(important, `var(--shadow-${value})`)\r\n }\r\n\r\n return withImportant(important, colors[value] || value)\r\n}\r\n\r\nexport default getValue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"getValue.js","sources":["../../src/css/getValue.ts"],"sourcesContent":["import { CSSProps } from \"./types\"\r\n\r\nconst getColor = (color: string, hasText = true) => {\r\n const i = {\r\n [`${color}`]: `var(--color-${color}-primary)`,\r\n [`${color}.primary`]: `var(--color-${color}-primary)`,\r\n [`${color}.secondary`]: `var(--color-${color}-secondary)`,\r\n [`${color}.soft.primary`]: `var(--color-${color}-soft-primary)`,\r\n [`${color}.soft.secondary`]: `var(--color-${color}-soft-secondary)`,\r\n }\r\n if (hasText) {\r\n i[`${color}.text`] = `var(--color-${color}-text)`\r\n }\r\n\r\n return i\r\n}\r\n\r\nconst withImportant = (important: any, value: any) => important ? value + important : value\r\nconst colors: any = {\r\n ...getColor(\"background\", false),\r\n ...getColor(\"text\", false),\r\n ...getColor(\"divider\", false),\r\n ...getColor(\"brand\"),\r\n ...getColor(\"accent\"),\r\n ...getColor(\"info\"),\r\n ...getColor(\"success\"),\r\n ...getColor(\"warning\"),\r\n ...getColor(\"danger\"),\r\n}\r\n\r\nconst breakpoints: any = {\r\n \"xs\": \"var(--bp-xs)\",\r\n \"sm\": \"var(--bp-sm)\",\r\n \"md\": \"var(--bp-md)\",\r\n \"lg\": \"var(--bp-lg)\",\r\n \"xl\": \"var(--bp-xl)\"\r\n}\r\n\r\nlet fontsizes: any = {\r\n \"h1\": \"var(--fontsize-h1)\",\r\n \"h2\": \"var(--fontsize-h2)\",\r\n \"h3\": \"var(--fontsize-h3)\",\r\n \"h4\": \"var(--fontsize-h4)\",\r\n \"h5\": \"var(--fontsize-h5)\",\r\n \"h6\": \"var(--fontsize-h6)\",\r\n \"big\": \"var(--fontsize-big)\",\r\n \"text\": \"var(--fontsize-text)\",\r\n \"button\": \"var(--fontsize-button)\",\r\n \"small\": \"var(--fontsize-small)\"\r\n}\r\n\r\nlet lineHeights: any = {\r\n \"h1\": \"var(--lineheight-h1)\",\r\n \"h2\": \"var(--lineheight-h2)\",\r\n \"h3\": \"var(--lineheight-h3)\",\r\n \"h4\": \"var(--lineheight-h4)\",\r\n \"h5\": \"var(--lineheight-h5)\",\r\n \"h6\": \"var(--lineheight-h6)\",\r\n \"big\": \"var(--lineheight-big)\",\r\n \"text\": \"var(--lineheight-text)\",\r\n \"button\": \"var(--lineheight-button)\",\r\n \"small\": \"var(--lineheight-small)\"\r\n}\r\n\r\nlet fontWeights: any = {\r\n \"h1\": \"var(--fontweight-h1)\",\r\n \"h2\": \"var(--fontweight-h2)\",\r\n \"h3\": \"var(--fontweight-h3)\",\r\n \"h4\": \"var(--fontweight-h4)\",\r\n \"h5\": \"var(--fontweight-h5)\",\r\n \"h6\": \"var(--fontweight-h6)\",\r\n \"big\": \"var(--fontweight-big)\",\r\n \"text\": \"var(--fontweight-text)\",\r\n \"button\": \"var(--fontweight-button)\",\r\n \"small\": \"var(--fontweight-small)\"\r\n}\r\n\r\nlet font: any = {\r\n \"h1\": \"var(--font-h1)\",\r\n \"h2\": \"var(--font-h2)\",\r\n \"h3\": \"var(--font-h3)\",\r\n \"h4\": \"var(--font-h4)\",\r\n \"h5\": \"var(--font-h5)\",\r\n \"h6\": \"var(--font-h6)\",\r\n \"big\": \"var(--font-big)\",\r\n \"text\": \"var(--font-text)\",\r\n \"button\": \"var(--font-button)\",\r\n \"small\": \"var(--font-small)\"\r\n}\r\n\r\nconst getValue = (prop: any, value: string | number, _css: CSSProps): any => {\r\n let important;\r\n\r\n if (typeof value === 'string') {\r\n const split = value.split(\"!\")\r\n important = split[1] ? \"!important\" : \"\"\r\n value = split[0]\r\n }\r\n\r\n\r\n if (['width', 'maxWidth', 'minWidth', 'max-width', 'min-width'].includes(prop)) {\r\n return withImportant(important, breakpoints[value] || value)\r\n } else if (prop === 'font' && typeof value === \"string\" && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\r\n return withImportant(important, font[value] || value)\r\n } else if (['fontWeight', 'font-weight'].includes(prop) && typeof value === 'string' && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\r\n return withImportant(important, fontWeights[value] || value)\r\n } else if (['lineHeight', 'line-height'].includes(prop) && typeof value === 'string' && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {\r\n return withImportant(important, lineHeights[value] || value)\r\n } else if (['fontSize', 'font-size'].includes(prop) && typeof value === 'string') {\r\n return withImportant(important, fontsizes[value] || value)\r\n } else if (typeof value === \"number\" && [\"shadow\", \"boxShadow\"].includes(prop)) {\r\n return withImportant(important, `var(--shadow-${value})`)\r\n }\r\n\r\n return withImportant(important, colors[value] || value)\r\n}\r\n\r\nexport default getValue"],"names":[],"mappings":"AAEA,MAAM,QAAQ,GAAG,CAAC,KAAa,EAAE,OAAO,GAAG,IAAI,KAAI;AAC/C,IAAA,MAAM,CAAC,GAAG;AACN,QAAA,CAAC,GAAG,KAAK,CAAA,CAAE,GAAG,CAAA,YAAA,EAAe,KAAK,CAAA,SAAA,CAAW;AAC7C,QAAA,CAAC,GAAG,KAAK,CAAA,QAAA,CAAU,GAAG,CAAA,YAAA,EAAe,KAAK,CAAA,SAAA,CAAW;AACrD,QAAA,CAAC,GAAG,KAAK,CAAA,UAAA,CAAY,GAAG,CAAA,YAAA,EAAe,KAAK,CAAA,WAAA,CAAa;AACzD,QAAA,CAAC,GAAG,KAAK,CAAA,aAAA,CAAe,GAAG,CAAA,YAAA,EAAe,KAAK,CAAA,cAAA,CAAgB;AAC/D,QAAA,CAAC,GAAG,KAAK,CAAA,eAAA,CAAiB,GAAG,CAAA,YAAA,EAAe,KAAK,CAAA,gBAAA,CAAkB;KACtE;IACD,IAAI,OAAO,EAAE;QACT,CAAC,CAAC,GAAG,KAAK,CAAA,KAAA,CAAO,CAAC,GAAG,CAAA,YAAA,EAAe,KAAK,CAAA,MAAA,CAAQ;IACrD;AAEA,IAAA,OAAO,CAAC;AACZ,CAAC;AAED,MAAM,aAAa,GAAG,CAAC,SAAc,EAAE,KAAU,KAAK,SAAS,GAAG,KAAK,GAAG,SAAS,GAAG,KAAK;AAC3F,MAAM,MAAM,GAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACL,QAAQ,CAAC,YAAY,EAAE,KAAK,CAAC,CAAA,EAC7B,QAAQ,CAAC,MAAM,EAAE,KAAK,CAAC,CAAA,EACvB,QAAQ,CAAC,SAAS,EAAE,KAAK,CAAC,CAAA,EAC1B,QAAQ,CAAC,OAAO,CAAC,CAAA,EACjB,QAAQ,CAAC,QAAQ,CAAC,CAAA,EAClB,QAAQ,CAAC,MAAM,CAAC,CAAA,EAChB,QAAQ,CAAC,SAAS,CAAC,CAAA,EACnB,QAAQ,CAAC,SAAS,CAAC,CAAA,EACnB,QAAQ,CAAC,QAAQ,CAAC,CACxB;AAED,MAAM,WAAW,GAAQ;AACrB,IAAA,IAAI,EAAE,cAAc;AACpB,IAAA,IAAI,EAAE,cAAc;AACpB,IAAA,IAAI,EAAE,cAAc;AACpB,IAAA,IAAI,EAAE,cAAc;AACpB,IAAA,IAAI,EAAE;CACT;AAED,IAAI,SAAS,GAAQ;AACjB,IAAA,IAAI,EAAE,oBAAoB;AAC1B,IAAA,IAAI,EAAE,oBAAoB;AAC1B,IAAA,IAAI,EAAE,oBAAoB;AAC1B,IAAA,IAAI,EAAE,oBAAoB;AAC1B,IAAA,IAAI,EAAE,oBAAoB;AAC1B,IAAA,IAAI,EAAE,oBAAoB;AAC1B,IAAA,KAAK,EAAE,qBAAqB;AAC5B,IAAA,MAAM,EAAE,sBAAsB;AAC9B,IAAA,QAAQ,EAAE,wBAAwB;AAClC,IAAA,OAAO,EAAE;CACZ;AAED,IAAI,WAAW,GAAQ;AACnB,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,KAAK,EAAE,uBAAuB;AAC9B,IAAA,MAAM,EAAE,wBAAwB;AAChC,IAAA,QAAQ,EAAE,0BAA0B;AACpC,IAAA,OAAO,EAAE;CACZ;AAED,IAAI,WAAW,GAAQ;AACnB,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,IAAI,EAAE,sBAAsB;AAC5B,IAAA,KAAK,EAAE,uBAAuB;AAC9B,IAAA,MAAM,EAAE,wBAAwB;AAChC,IAAA,QAAQ,EAAE,0BAA0B;AACpC,IAAA,OAAO,EAAE;CACZ;AAED,IAAI,IAAI,GAAQ;AACZ,IAAA,IAAI,EAAE,gBAAgB;AACtB,IAAA,IAAI,EAAE,gBAAgB;AACtB,IAAA,IAAI,EAAE,gBAAgB;AACtB,IAAA,IAAI,EAAE,gBAAgB;AACtB,IAAA,IAAI,EAAE,gBAAgB;AACtB,IAAA,IAAI,EAAE,gBAAgB;AACtB,IAAA,KAAK,EAAE,iBAAiB;AACxB,IAAA,MAAM,EAAE,kBAAkB;AAC1B,IAAA,QAAQ,EAAE,oBAAoB;AAC9B,IAAA,OAAO,EAAE;CACZ;AAED,MAAM,QAAQ,GAAG,CAAC,IAAS,EAAE,KAAsB,EAAE,IAAc,KAAS;AACxE,IAAA,IAAI,SAAS;AAEb,IAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;QAC3B,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;AAC9B,QAAA,SAAS,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,YAAY,GAAG,EAAE;AACxC,QAAA,KAAK,GAAG,KAAK,CAAC,CAAC,CAAC;IACpB;AAGA,IAAA,IAAI,CAAC,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,WAAW,EAAE,WAAW,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE;QAC5E,OAAO,aAAa,CAAC,SAAS,EAAE,WAAW,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC;IAChE;AAAO,SAAA,IAAI,IAAI,KAAK,MAAM,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE;QACxI,OAAO,aAAa,CAAC,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC;IACzD;AAAO,SAAA,IAAI,CAAC,YAAY,EAAE,aAAa,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE;QACrK,OAAO,aAAa,CAAC,SAAS,EAAE,WAAW,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC;IAChE;AAAO,SAAA,IAAI,CAAC,YAAY,EAAE,aAAa,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAE;QACrK,OAAO,aAAa,CAAC,SAAS,EAAE,WAAW,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC;IAChE;AAAO,SAAA,IAAI,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;QAC9E,OAAO,aAAa,CAAC,SAAS,EAAE,SAAS,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC;IAC9D;AAAO,SAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE;QAC5E,OAAO,aAAa,CAAC,SAAS,EAAE,gBAAgB,KAAK,CAAA,CAAA,CAAG,CAAC;IAC7D;IAEA,OAAO,aAAa,CAAC,SAAS,EAAE,MAAM,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC;AAC3D;;;;"}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var getValue = require('./getValue.cjs');
|
|
4
|
+
var getProps = require('./getProps.cjs');
|
|
5
|
+
var aliases = require('./aliases.cjs');
|
|
6
|
+
var oncss = require('oncss');
|
|
5
7
|
|
|
6
8
|
const breakpoints = {
|
|
7
9
|
xs: 0,
|
|
@@ -27,7 +29,7 @@ const css = (props, options) => {
|
|
|
27
29
|
}
|
|
28
30
|
return getProps(p, v, _c);
|
|
29
31
|
} });
|
|
30
|
-
return css
|
|
32
|
+
return oncss.css(props, cssOptions);
|
|
31
33
|
};
|
|
32
34
|
const adjustColor = (hex, factor) => {
|
|
33
35
|
hex = hex.replace(/^#/, '');
|
|
@@ -59,5 +61,11 @@ const alpha = (color, opacity = 1) => {
|
|
|
59
61
|
return (color + (`0${Math.round((255 / 100) * _opacity).toString(16)}`.slice(-2))).toUpperCase();
|
|
60
62
|
};
|
|
61
63
|
|
|
62
|
-
|
|
63
|
-
|
|
64
|
+
exports.getValue = getValue;
|
|
65
|
+
exports.getProps = getProps;
|
|
66
|
+
exports.adjustColor = adjustColor;
|
|
67
|
+
exports.adjustTextContrast = adjustTextContrast;
|
|
68
|
+
exports.alpha = alpha;
|
|
69
|
+
exports.breakpoints = breakpoints;
|
|
70
|
+
exports.css = css;
|
|
71
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../src/css/index.ts"],"sourcesContent":["import getValue from \"./getValue\"\r\nimport getProps from \"./getProps\"\r\nimport aliases from \"./aliases\"\r\nimport { Aliases, BreakpointKeys, CSSOptionProps, CSSProps } from './types'\r\nimport { css as _css } from \"oncss\"\r\n\r\nexport {\r\n getValue,\r\n getProps\r\n}\r\n\r\nexport const breakpoints = {\r\n xs: 0,\r\n sm: 600,\r\n md: 900,\r\n lg: 1200,\r\n xl: 1536\r\n}\r\n\r\nexport const css = (props: CSSProps, options?: CSSOptionProps) => {\r\n const cssOptions: CSSOptionProps = {\r\n ...options,\r\n breakpoints,\r\n aliases,\r\n getValue: (p: any, v: any, _c: any, dept) => {\r\n if (options?.getValue) {\r\n let _val = options?.getValue(p, v, _c, dept)\r\n if (_val) return _val\r\n }\r\n return getValue(p, v, _c)\r\n },\r\n getProps: (p: any, v: any, _c: any, dept) => {\r\n if (options?.getProps) {\r\n let _p = options?.getProps(p, v, _c, dept)\r\n if (_p) return _p\r\n }\r\n return getProps(p, v, _c)\r\n },\r\n }\r\n return _css<Aliases, BreakpointKeys>(props, cssOptions)\r\n}\r\n\r\nexport const adjustColor = (hex: string, factor: number) => {\r\n\r\n hex = hex.replace(/^#/, '')\r\n\r\n let r = parseInt(hex.slice(0, 2), 16)\r\n let g = parseInt(hex.slice(2, 4), 16)\r\n let b = parseInt(hex.slice(4, 6), 16)\r\n\r\n r = Math.floor(r * factor)\r\n g = Math.floor(g * factor)\r\n b = Math.floor(b * factor)\r\n\r\n r = Math.min(255, Math.max(0, r))\r\n g = Math.min(255, Math.max(0, g))\r\n b = Math.min(255, Math.max(0, b))\r\n\r\n return `#${r.toString(16).padStart(2, '0')}${g.toString(16).padStart(2, '0')}${b.toString(16).padStart(2, '0')}`;\r\n}\r\n\r\nexport const adjustTextContrast = (color: string) => {\r\n color = color.replace(/^#/, '')\r\n const r = parseInt(color.slice(0, 2), 16);\r\n const g = parseInt(color.slice(2, 4), 16);\r\n const b = parseInt(color.slice(4, 6), 16);\r\n\r\n const luminance = (0.299 * r + 0.587 * g + 0.114 * b) / 255;\r\n return luminance > 0.5 ? '#111111' : '#FFFFFF';\r\n}\r\n\r\nexport const alpha = (color: string, opacity = 1) => {\r\n if (typeof opacity !== 'number') return color\r\n let _opacity = opacity * 100\r\n if (!color.startsWith(\"#\")) throw new Error(`color must be hex`)\r\n return (color + (`0${Math.round((255 / 100) * _opacity).toString(16)}`.slice(-2))).toUpperCase();\r\n};\r\n\r\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;;MAGK,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
CHANGED
|
@@ -1,9 +1,7 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var aliases = require('./aliases.js');
|
|
6
|
-
var oncss = require('oncss');
|
|
1
|
+
import getValue from './getValue.js';
|
|
2
|
+
import getProps from './getProps.js';
|
|
3
|
+
import aliases from './aliases.js';
|
|
4
|
+
import { css as css$1 } from 'oncss';
|
|
7
5
|
|
|
8
6
|
const breakpoints = {
|
|
9
7
|
xs: 0,
|
|
@@ -29,7 +27,7 @@ const css = (props, options) => {
|
|
|
29
27
|
}
|
|
30
28
|
return getProps(p, v, _c);
|
|
31
29
|
} });
|
|
32
|
-
return
|
|
30
|
+
return css$1(props, cssOptions);
|
|
33
31
|
};
|
|
34
32
|
const adjustColor = (hex, factor) => {
|
|
35
33
|
hex = hex.replace(/^#/, '');
|
|
@@ -61,11 +59,5 @@ const alpha = (color, opacity = 1) => {
|
|
|
61
59
|
return (color + (`0${Math.round((255 / 100) * _opacity).toString(16)}`.slice(-2))).toUpperCase();
|
|
62
60
|
};
|
|
63
61
|
|
|
64
|
-
|
|
65
|
-
exports.getProps = getProps;
|
|
66
|
-
exports.adjustColor = adjustColor;
|
|
67
|
-
exports.adjustTextContrast = adjustTextContrast;
|
|
68
|
-
exports.alpha = alpha;
|
|
69
|
-
exports.breakpoints = breakpoints;
|
|
70
|
-
exports.css = css;
|
|
62
|
+
export { adjustColor, adjustTextContrast, alpha, breakpoints, css, getProps, getValue };
|
|
71
63
|
//# sourceMappingURL=index.js.map
|
package/css/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/css/index.ts"],"sourcesContent":["import getValue from \"./getValue\"\r\nimport getProps from \"./getProps\"\r\nimport aliases from \"./aliases\"\r\nimport { Aliases, BreakpointKeys, CSSOptionProps, CSSProps } from './types'\r\nimport { css as _css } from \"oncss\"\r\n\r\nexport {\r\n getValue,\r\n getProps\r\n}\r\n\r\nexport const breakpoints = {\r\n xs: 0,\r\n sm: 600,\r\n md: 900,\r\n lg: 1200,\r\n xl: 1536\r\n}\r\n\r\nexport const css = (props: CSSProps, options?: CSSOptionProps) => {\r\n const cssOptions: CSSOptionProps = {\r\n ...options,\r\n breakpoints,\r\n aliases,\r\n getValue: (p: any, v: any, _c: any, dept) => {\r\n if (options?.getValue) {\r\n let _val = options?.getValue(p, v, _c, dept)\r\n if (_val) return _val\r\n }\r\n return getValue(p, v, _c)\r\n },\r\n getProps: (p: any, v: any, _c: any, dept) => {\r\n if (options?.getProps) {\r\n let _p = options?.getProps(p, v, _c, dept)\r\n if (_p) return _p\r\n }\r\n return getProps(p, v, _c)\r\n },\r\n }\r\n return _css<Aliases, BreakpointKeys>(props, cssOptions)\r\n}\r\n\r\nexport const adjustColor = (hex: string, factor: number) => {\r\n\r\n hex = hex.replace(/^#/, '')\r\n\r\n let r = parseInt(hex.slice(0, 2), 16)\r\n let g = parseInt(hex.slice(2, 4), 16)\r\n let b = parseInt(hex.slice(4, 6), 16)\r\n\r\n r = Math.floor(r * factor)\r\n g = Math.floor(g * factor)\r\n b = Math.floor(b * factor)\r\n\r\n r = Math.min(255, Math.max(0, r))\r\n g = Math.min(255, Math.max(0, g))\r\n b = Math.min(255, Math.max(0, b))\r\n\r\n return `#${r.toString(16).padStart(2, '0')}${g.toString(16).padStart(2, '0')}${b.toString(16).padStart(2, '0')}`;\r\n}\r\n\r\nexport const adjustTextContrast = (color: string) => {\r\n color = color.replace(/^#/, '')\r\n const r = parseInt(color.slice(0, 2), 16);\r\n const g = parseInt(color.slice(2, 4), 16);\r\n const b = parseInt(color.slice(4, 6), 16);\r\n\r\n const luminance = (0.299 * r + 0.587 * g + 0.114 * b) / 255;\r\n return luminance > 0.5 ? '#111111' : '#FFFFFF';\r\n}\r\n\r\nexport const alpha = (color: string, opacity = 1) => {\r\n if (typeof opacity !== 'number') return color\r\n let _opacity = opacity * 100\r\n if (!color.startsWith(\"#\")) throw new Error(`color must be hex`)\r\n return (color + (`0${Math.round((255 / 100) * _opacity).toString(16)}`.slice(-2))).toUpperCase();\r\n};\r\n\r\n"],"names":["_css"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/css/index.ts"],"sourcesContent":["import getValue from \"./getValue\"\r\nimport getProps from \"./getProps\"\r\nimport aliases from \"./aliases\"\r\nimport { Aliases, BreakpointKeys, CSSOptionProps, CSSProps } from './types'\r\nimport { css as _css } from \"oncss\"\r\n\r\nexport {\r\n getValue,\r\n getProps\r\n}\r\n\r\nexport const breakpoints = {\r\n xs: 0,\r\n sm: 600,\r\n md: 900,\r\n lg: 1200,\r\n xl: 1536\r\n}\r\n\r\nexport const css = (props: CSSProps, options?: CSSOptionProps) => {\r\n const cssOptions: CSSOptionProps = {\r\n ...options,\r\n breakpoints,\r\n aliases,\r\n getValue: (p: any, v: any, _c: any, dept) => {\r\n if (options?.getValue) {\r\n let _val = options?.getValue(p, v, _c, dept)\r\n if (_val) return _val\r\n }\r\n return getValue(p, v, _c)\r\n },\r\n getProps: (p: any, v: any, _c: any, dept) => {\r\n if (options?.getProps) {\r\n let _p = options?.getProps(p, v, _c, dept)\r\n if (_p) return _p\r\n }\r\n return getProps(p, v, _c)\r\n },\r\n }\r\n return _css<Aliases, BreakpointKeys>(props, cssOptions)\r\n}\r\n\r\nexport const adjustColor = (hex: string, factor: number) => {\r\n\r\n hex = hex.replace(/^#/, '')\r\n\r\n let r = parseInt(hex.slice(0, 2), 16)\r\n let g = parseInt(hex.slice(2, 4), 16)\r\n let b = parseInt(hex.slice(4, 6), 16)\r\n\r\n r = Math.floor(r * factor)\r\n g = Math.floor(g * factor)\r\n b = Math.floor(b * factor)\r\n\r\n r = Math.min(255, Math.max(0, r))\r\n g = Math.min(255, Math.max(0, g))\r\n b = Math.min(255, Math.max(0, b))\r\n\r\n return `#${r.toString(16).padStart(2, '0')}${g.toString(16).padStart(2, '0')}${b.toString(16).padStart(2, '0')}`;\r\n}\r\n\r\nexport const adjustTextContrast = (color: string) => {\r\n color = color.replace(/^#/, '')\r\n const r = parseInt(color.slice(0, 2), 16);\r\n const g = parseInt(color.slice(2, 4), 16);\r\n const b = parseInt(color.slice(4, 6), 16);\r\n\r\n const luminance = (0.299 * r + 0.587 * g + 0.114 * b) / 255;\r\n return luminance > 0.5 ? '#111111' : '#FFFFFF';\r\n}\r\n\r\nexport const alpha = (color: string, opacity = 1) => {\r\n if (typeof opacity !== 'number') return color\r\n let _opacity = opacity * 100\r\n if (!color.startsWith(\"#\")) throw new Error(`color must be hex`)\r\n return (color + (`0${Math.round((255 / 100) * _opacity).toString(16)}`.slice(-2))).toUpperCase();\r\n};\r\n\r\n"],"names":["_css"],"mappings":"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"}
|
|
@@ -1,8 +1,12 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
5
|
+
|
|
6
|
+
var index$1 = require('../css/index.cjs');
|
|
7
|
+
var React = require('react');
|
|
8
|
+
var index = require('../Document/index.cjs');
|
|
9
|
+
var CSSCacheProvider = require('../css/CSSCacheProvider.cjs');
|
|
6
10
|
|
|
7
11
|
const animationEases = {
|
|
8
12
|
standard: "cubic-bezier(0.4, 0, 0.2, 1)",
|
|
@@ -15,10 +19,10 @@ const useAnimation = ({ from, to, delay, ease, duration }) => {
|
|
|
15
19
|
let _delay = delay || 0;
|
|
16
20
|
let _duration = duration || 600;
|
|
17
21
|
let _ease = ease || "standard";
|
|
18
|
-
const id = "anim" + useId().replace(/:/g, "");
|
|
19
|
-
const doc = useDocument();
|
|
20
|
-
const cacheId = useCSSCacheId();
|
|
21
|
-
const anim = css({
|
|
22
|
+
const id = "anim" + React.useId().replace(/:/g, "");
|
|
23
|
+
const doc = index.useDocument();
|
|
24
|
+
const cacheId = CSSCacheProvider.useCSSCacheId();
|
|
25
|
+
const anim = index$1.css({
|
|
22
26
|
animationName: id,
|
|
23
27
|
animationDelay: _delay + "ms",
|
|
24
28
|
animationDuration: _duration + "ms",
|
|
@@ -28,11 +32,12 @@ const useAnimation = ({ from, to, delay, ease, duration }) => {
|
|
|
28
32
|
to: to
|
|
29
33
|
}
|
|
30
34
|
}, {
|
|
31
|
-
container: doc,
|
|
35
|
+
container: doc.document,
|
|
32
36
|
cacheId
|
|
33
37
|
});
|
|
34
38
|
return anim.classname;
|
|
35
39
|
};
|
|
36
40
|
|
|
37
|
-
|
|
38
|
-
|
|
41
|
+
exports.animationEases = animationEases;
|
|
42
|
+
exports.default = useAnimation;
|
|
43
|
+
//# sourceMappingURL=useAnimation.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useAnimation.
|
|
1
|
+
{"version":3,"file":"useAnimation.cjs","sources":["../../src/hooks/useAnimation.ts"],"sourcesContent":["\"use client\";\r\nimport { css } from '../css'\r\nimport { useId } from 'react'\r\nimport { CSSProps } from '../css/types'\r\nimport { useDocument } from '../Document';\r\nimport { useCSSCacheId } from '../css/CSSCacheProvider';\r\n\r\nexport const animationEases = {\r\n standard: \"cubic-bezier(0.4, 0, 0.2, 1)\",\r\n fast: \"cubic-bezier(0.2, 0, 0, 1)\",\r\n smooth: \"cubic-bezier(0.25, 0.46, 0.45, 0.94)\",\r\n linear: \"cubic-bezier(0, 0, 1, 1)\",\r\n bounce: \"cubic-bezier(0.34, 1.50, 0.64, 1)\",\r\n};\r\n\r\nexport interface UseAnimationProps {\r\n delay?: number;\r\n duration?: number;\r\n from: CSSProps;\r\n to: CSSProps;\r\n ease?: keyof typeof animationEases;\r\n}\r\n\r\nconst useAnimation = ({ from, to, delay, ease, duration }: UseAnimationProps) => {\r\n let _delay = delay || 0;\r\n let _duration = duration || 600;\r\n let _ease = ease || \"standard\"\r\n const id = \"anim\" + useId().replace(/:/g, \"\")\r\n const doc = useDocument()\r\n const cacheId = useCSSCacheId()\r\n\r\n const anim = css({\r\n animationName: id,\r\n animationDelay: _delay + \"ms\",\r\n animationDuration: _duration + \"ms\",\r\n animationTimingFunction: animationEases[_ease] || animationEases.standard,\r\n [`@keyframes ${id}`]: {\r\n from: from as any,\r\n to: to as any\r\n }\r\n }, {\r\n container: doc.document,\r\n cacheId\r\n })\r\n return anim.classname\r\n}\r\n\r\nexport default useAnimation"],"names":[],"mappings":";;;;;;;;;;AAOO;AACH;AACA;AACA;AACA;AACA;;AAWJ;AACI;AACA;AACA;AACA;AACA;AACA;;AAGI;;;;AAIA;AACI;AACA;AACH;;;;AAIJ;;AAEL;;;"}
|
package/hooks/useAnimation.js
CHANGED
|
@@ -1,12 +1,8 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
var index$1 = require('../css/index.js');
|
|
7
|
-
var React = require('react');
|
|
8
|
-
var index = require('../Document/index.js');
|
|
9
|
-
var CSSCacheProvider = require('../css/CSSCacheProvider.js');
|
|
2
|
+
import { css } from '../css/index.js';
|
|
3
|
+
import { useId } from 'react';
|
|
4
|
+
import { useDocument } from '../Document/index.js';
|
|
5
|
+
import { useCSSCacheId } from '../css/CSSCacheProvider.js';
|
|
10
6
|
|
|
11
7
|
const animationEases = {
|
|
12
8
|
standard: "cubic-bezier(0.4, 0, 0.2, 1)",
|
|
@@ -19,10 +15,10 @@ const useAnimation = ({ from, to, delay, ease, duration }) => {
|
|
|
19
15
|
let _delay = delay || 0;
|
|
20
16
|
let _duration = duration || 600;
|
|
21
17
|
let _ease = ease || "standard";
|
|
22
|
-
const id = "anim" +
|
|
23
|
-
const doc =
|
|
24
|
-
const cacheId =
|
|
25
|
-
const anim =
|
|
18
|
+
const id = "anim" + useId().replace(/:/g, "");
|
|
19
|
+
const doc = useDocument();
|
|
20
|
+
const cacheId = useCSSCacheId();
|
|
21
|
+
const anim = css({
|
|
26
22
|
animationName: id,
|
|
27
23
|
animationDelay: _delay + "ms",
|
|
28
24
|
animationDuration: _duration + "ms",
|
|
@@ -32,12 +28,11 @@ const useAnimation = ({ from, to, delay, ease, duration }) => {
|
|
|
32
28
|
to: to
|
|
33
29
|
}
|
|
34
30
|
}, {
|
|
35
|
-
container: doc,
|
|
31
|
+
container: doc.document,
|
|
36
32
|
cacheId
|
|
37
33
|
});
|
|
38
34
|
return anim.classname;
|
|
39
35
|
};
|
|
40
36
|
|
|
41
|
-
|
|
42
|
-
exports.default = useAnimation;
|
|
37
|
+
export { animationEases, useAnimation as default };
|
|
43
38
|
//# sourceMappingURL=useAnimation.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useAnimation.js","sources":["../../src/hooks/useAnimation.ts"],"sourcesContent":["\"use client\";\r\nimport { css } from '../css'\r\nimport { useId } from 'react'\r\nimport { CSSProps } from '../css/types'\r\nimport { useDocument } from '../Document';\r\nimport { useCSSCacheId } from '../css/CSSCacheProvider';\r\n\r\nexport const animationEases = {\r\n standard: \"cubic-bezier(0.4, 0, 0.2, 1)\",\r\n fast: \"cubic-bezier(0.2, 0, 0, 1)\",\r\n smooth: \"cubic-bezier(0.25, 0.46, 0.45, 0.94)\",\r\n linear: \"cubic-bezier(0, 0, 1, 1)\",\r\n bounce: \"cubic-bezier(0.34, 1.50, 0.64, 1)\",\r\n};\r\n\r\nexport interface UseAnimationProps {\r\n delay?: number;\r\n duration?: number;\r\n from: CSSProps;\r\n to: CSSProps;\r\n ease?: keyof typeof animationEases;\r\n}\r\n\r\nconst useAnimation = ({ from, to, delay, ease, duration }: UseAnimationProps) => {\r\n let _delay = delay || 0;\r\n let _duration = duration || 600;\r\n let _ease = ease || \"standard\"\r\n const id = \"anim\" + useId().replace(/:/g, \"\")\r\n const doc = useDocument()\r\n const cacheId = useCSSCacheId()\r\n\r\n const anim = css({\r\n animationName: id,\r\n animationDelay: _delay + \"ms\",\r\n animationDuration: _duration + \"ms\",\r\n animationTimingFunction: animationEases[_ease] || animationEases.standard,\r\n [`@keyframes ${id}`]: {\r\n from: from as any,\r\n to: to as any\r\n }\r\n }, {\r\n container: doc,\r\n cacheId\r\n })\r\n return anim.classname\r\n}\r\n\r\nexport default useAnimation"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useAnimation.js","sources":["../../src/hooks/useAnimation.ts"],"sourcesContent":["\"use client\";\r\nimport { css } from '../css'\r\nimport { useId } from 'react'\r\nimport { CSSProps } from '../css/types'\r\nimport { useDocument } from '../Document';\r\nimport { useCSSCacheId } from '../css/CSSCacheProvider';\r\n\r\nexport const animationEases = {\r\n standard: \"cubic-bezier(0.4, 0, 0.2, 1)\",\r\n fast: \"cubic-bezier(0.2, 0, 0, 1)\",\r\n smooth: \"cubic-bezier(0.25, 0.46, 0.45, 0.94)\",\r\n linear: \"cubic-bezier(0, 0, 1, 1)\",\r\n bounce: \"cubic-bezier(0.34, 1.50, 0.64, 1)\",\r\n};\r\n\r\nexport interface UseAnimationProps {\r\n delay?: number;\r\n duration?: number;\r\n from: CSSProps;\r\n to: CSSProps;\r\n ease?: keyof typeof animationEases;\r\n}\r\n\r\nconst useAnimation = ({ from, to, delay, ease, duration }: UseAnimationProps) => {\r\n let _delay = delay || 0;\r\n let _duration = duration || 600;\r\n let _ease = ease || \"standard\"\r\n const id = \"anim\" + useId().replace(/:/g, \"\")\r\n const doc = useDocument()\r\n const cacheId = useCSSCacheId()\r\n\r\n const anim = css({\r\n animationName: id,\r\n animationDelay: _delay + \"ms\",\r\n animationDuration: _duration + \"ms\",\r\n animationTimingFunction: animationEases[_ease] || animationEases.standard,\r\n [`@keyframes ${id}`]: {\r\n from: from as any,\r\n to: to as any\r\n }\r\n }, {\r\n container: doc.document,\r\n cacheId\r\n })\r\n return anim.classname\r\n}\r\n\r\nexport default useAnimation"],"names":[],"mappings":";;;;;;AAOO;AACH;AACA;AACA;AACA;AACA;;AAWJ;AACI;AACA;AACA;AACA;AACA;AACA;;AAGI;;;;AAIA;AACI;AACA;AACH;;;;AAIJ;;AAEL;;"}
|
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
"use client";
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
2
4
|
const useColorTemplate = (color, type) => {
|
|
3
5
|
const is_def = color === "default";
|
|
4
6
|
if (is_def) {
|
|
@@ -71,5 +73,5 @@ const useColorTemplate = (color, type) => {
|
|
|
71
73
|
throw new Error(`useColorTemplate: Unknown type ${type}`);
|
|
72
74
|
};
|
|
73
75
|
|
|
74
|
-
|
|
75
|
-
//# sourceMappingURL=useColorTemplate.
|
|
76
|
+
module.exports = useColorTemplate;
|
|
77
|
+
//# sourceMappingURL=useColorTemplate.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useColorTemplate.
|
|
1
|
+
{"version":3,"file":"useColorTemplate.cjs","sources":["../../src/hooks/useColorTemplate.ts"],"sourcesContent":["\"use client\";\r\nexport type UseColorTemplateType = \"fill\" | \"outline\" | \"text\" | \"soft\"\r\nexport type UseColorTemplateColor = \"default\" | \"brand\" | \"accent\" | \"success\" | \"info\" | \"warning\" | \"danger\"\r\n\r\nconst useColorTemplate = (color: UseColorTemplateColor, type: UseColorTemplateType) => {\r\n const is_def = color === \"default\";\r\n if (is_def) {\r\n color = \"divider\" as any\r\n }\r\n\r\n if (type === \"outline\") {\r\n return {\r\n primary: {\r\n bgcolor: `transparent`,\r\n color: is_def ? `text.primary` : `${color}.primary`,\r\n border: \"1px solid\",\r\n borderColor: is_def ? `divider` : `${color}.primary`,\r\n },\r\n secondary: {\r\n bgcolor: `transparent`,\r\n color: is_def ? `text.primary` : `${color}.secondary`,\r\n border: \"1px solid\",\r\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\r\n }\r\n }\r\n } else if (type === \"fill\") {\r\n return {\r\n primary: {\r\n bgcolor: color,\r\n color: is_def ? `text.primary` : `${color}.text`,\r\n border: \"1px solid\",\r\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\r\n },\r\n secondary: {\r\n bgcolor: `${color}.secondary`,\r\n color: is_def ? `text.primary` : `${color}.text`,\r\n border: \"1px solid\",\r\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\r\n }\r\n }\r\n } else if (type === \"text\") {\r\n return {\r\n primary: {\r\n bgcolor: \"transparent\",\r\n color: is_def ? `text.primary` : `${color}.primary`,\r\n border: 0,\r\n borderColor: `transparent`,\r\n },\r\n secondary: {\r\n bgcolor: \"transparent\",\r\n color: is_def ? `text.primary` : `${color}.secondary`,\r\n border: 0,\r\n borderColor: `transparent`,\r\n }\r\n }\r\n } else if (type === \"soft\") {\r\n return {\r\n primary: {\r\n bgcolor: `${color}.soft.primary`,\r\n color: is_def ? `text.primary` : color,\r\n border: 0,\r\n borderColor: `transparent`,\r\n },\r\n secondary: {\r\n bgcolor: `${color}.soft.secondary`,\r\n color: is_def ? `text.primary` : `${color}.secondary`,\r\n border: 0,\r\n borderColor: `transparent`,\r\n }\r\n }\r\n }\r\n\r\n throw new Error(`useColorTemplate: Unknown type ${type}`);\r\n}\r\n\r\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,6 +1,4 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
'use strict';
|
|
3
|
-
|
|
4
2
|
const useColorTemplate = (color, type) => {
|
|
5
3
|
const is_def = color === "default";
|
|
6
4
|
if (is_def) {
|
|
@@ -73,5 +71,5 @@ const useColorTemplate = (color, type) => {
|
|
|
73
71
|
throw new Error(`useColorTemplate: Unknown type ${type}`);
|
|
74
72
|
};
|
|
75
73
|
|
|
76
|
-
|
|
74
|
+
export { useColorTemplate as default };
|
|
77
75
|
//# sourceMappingURL=useColorTemplate.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useColorTemplate.js","sources":["../../src/hooks/useColorTemplate.ts"],"sourcesContent":["\"use client\";\r\nexport type UseColorTemplateType = \"fill\" | \"outline\" | \"text\" | \"soft\"\r\nexport type UseColorTemplateColor = \"default\" | \"brand\" | \"accent\" | \"success\" | \"info\" | \"warning\" | \"danger\"\r\n\r\nconst useColorTemplate = (color: UseColorTemplateColor, type: UseColorTemplateType) => {\r\n const is_def = color === \"default\";\r\n if (is_def) {\r\n color = \"divider\" as any\r\n }\r\n\r\n if (type === \"outline\") {\r\n return {\r\n primary: {\r\n bgcolor: `transparent`,\r\n color: is_def ? `text.primary` : `${color}.primary`,\r\n border: \"1px solid\",\r\n borderColor: is_def ? `divider` : `${color}.primary`,\r\n },\r\n secondary: {\r\n bgcolor: `transparent`,\r\n color: is_def ? `text.primary` : `${color}.secondary`,\r\n border: \"1px solid\",\r\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\r\n }\r\n }\r\n } else if (type === \"fill\") {\r\n return {\r\n primary: {\r\n bgcolor: color,\r\n color: is_def ? `text.primary` : `${color}.text`,\r\n border: \"1px solid\",\r\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\r\n },\r\n secondary: {\r\n bgcolor: `${color}.secondary`,\r\n color: is_def ? `text.primary` : `${color}.text`,\r\n border: \"1px solid\",\r\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\r\n }\r\n }\r\n } else if (type === \"text\") {\r\n return {\r\n primary: {\r\n bgcolor: \"transparent\",\r\n color: is_def ? `text.primary` : `${color}.primary`,\r\n border: 0,\r\n borderColor: `transparent`,\r\n },\r\n secondary: {\r\n bgcolor: \"transparent\",\r\n color: is_def ? `text.primary` : `${color}.secondary`,\r\n border: 0,\r\n borderColor: `transparent`,\r\n }\r\n }\r\n } else if (type === \"soft\") {\r\n return {\r\n primary: {\r\n bgcolor: `${color}.soft.primary`,\r\n color: is_def ? `text.primary` : color,\r\n border: 0,\r\n borderColor: `transparent`,\r\n },\r\n secondary: {\r\n bgcolor: `${color}.soft.secondary`,\r\n color: is_def ? `text.primary` : `${color}.secondary`,\r\n border: 0,\r\n borderColor: `transparent`,\r\n }\r\n }\r\n }\r\n\r\n throw new Error(`useColorTemplate: Unknown type ${type}`);\r\n}\r\n\r\nexport default useColorTemplate"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useColorTemplate.js","sources":["../../src/hooks/useColorTemplate.ts"],"sourcesContent":["\"use client\";\r\nexport type UseColorTemplateType = \"fill\" | \"outline\" | \"text\" | \"soft\"\r\nexport type UseColorTemplateColor = \"default\" | \"brand\" | \"accent\" | \"success\" | \"info\" | \"warning\" | \"danger\"\r\n\r\nconst useColorTemplate = (color: UseColorTemplateColor, type: UseColorTemplateType) => {\r\n const is_def = color === \"default\";\r\n if (is_def) {\r\n color = \"divider\" as any\r\n }\r\n\r\n if (type === \"outline\") {\r\n return {\r\n primary: {\r\n bgcolor: `transparent`,\r\n color: is_def ? `text.primary` : `${color}.primary`,\r\n border: \"1px solid\",\r\n borderColor: is_def ? `divider` : `${color}.primary`,\r\n },\r\n secondary: {\r\n bgcolor: `transparent`,\r\n color: is_def ? `text.primary` : `${color}.secondary`,\r\n border: \"1px solid\",\r\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\r\n }\r\n }\r\n } else if (type === \"fill\") {\r\n return {\r\n primary: {\r\n bgcolor: color,\r\n color: is_def ? `text.primary` : `${color}.text`,\r\n border: \"1px solid\",\r\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\r\n },\r\n secondary: {\r\n bgcolor: `${color}.secondary`,\r\n color: is_def ? `text.primary` : `${color}.text`,\r\n border: \"1px solid\",\r\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\r\n }\r\n }\r\n } else if (type === \"text\") {\r\n return {\r\n primary: {\r\n bgcolor: \"transparent\",\r\n color: is_def ? `text.primary` : `${color}.primary`,\r\n border: 0,\r\n borderColor: `transparent`,\r\n },\r\n secondary: {\r\n bgcolor: \"transparent\",\r\n color: is_def ? `text.primary` : `${color}.secondary`,\r\n border: 0,\r\n borderColor: `transparent`,\r\n }\r\n }\r\n } else if (type === \"soft\") {\r\n return {\r\n primary: {\r\n bgcolor: `${color}.soft.primary`,\r\n color: is_def ? `text.primary` : color,\r\n border: 0,\r\n borderColor: `transparent`,\r\n },\r\n secondary: {\r\n bgcolor: `${color}.soft.secondary`,\r\n color: is_def ? `text.primary` : `${color}.secondary`,\r\n border: 0,\r\n borderColor: `transparent`,\r\n }\r\n }\r\n }\r\n\r\n throw new Error(`useColorTemplate: Unknown type ${type}`);\r\n}\r\n\r\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;;"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var core = require('../theme/core.cjs');
|
|
4
|
+
require('../css/getValue.cjs');
|
|
5
|
+
require('oncss');
|
|
6
|
+
require('../theme/ThemeProvider.cjs');
|
|
7
|
+
require('react-state-bucket');
|
|
8
|
+
|
|
9
|
+
const useInterface = (name, userPorps, defaultProps) => {
|
|
10
|
+
const theme = core.useTheme();
|
|
11
|
+
let _props = Object.assign(Object.assign({}, defaultProps), userPorps);
|
|
12
|
+
if (name in theme.interfaces) {
|
|
13
|
+
return theme.interfaces[name](_props, theme);
|
|
14
|
+
}
|
|
15
|
+
return [_props, theme];
|
|
16
|
+
};
|
|
17
|
+
|
|
18
|
+
module.exports = useInterface;
|
|
19
|
+
//# sourceMappingURL=useInterface.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useInterface.cjs","sources":["../../src/hooks/useInterface.ts"],"sourcesContent":["import { useTheme } from \"../theme\"\r\n\r\nconst useInterface = <P extends object>(name: string, userPorps: P, defaultProps: P) => {\r\n const theme = useTheme()\r\n let _props = { ...defaultProps, ...userPorps } as P\r\n if (name in theme.interfaces) {\r\n return theme.interfaces[name](_props, theme)\r\n }\r\n return [_props, theme]\r\n}\r\n\r\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.js
CHANGED
|
@@ -1,13 +1,11 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
require('../theme/ThemeProvider.js');
|
|
7
|
-
require('react-state-bucket');
|
|
1
|
+
import { useTheme } from '../theme/core.js';
|
|
2
|
+
import '../css/getValue.js';
|
|
3
|
+
import 'oncss';
|
|
4
|
+
import '../theme/ThemeProvider.js';
|
|
5
|
+
import 'react-state-bucket';
|
|
8
6
|
|
|
9
7
|
const useInterface = (name, userPorps, defaultProps) => {
|
|
10
|
-
const theme =
|
|
8
|
+
const theme = useTheme();
|
|
11
9
|
let _props = Object.assign(Object.assign({}, defaultProps), userPorps);
|
|
12
10
|
if (name in theme.interfaces) {
|
|
13
11
|
return theme.interfaces[name](_props, theme);
|
|
@@ -15,5 +13,5 @@ const useInterface = (name, userPorps, defaultProps) => {
|
|
|
15
13
|
return [_props, theme];
|
|
16
14
|
};
|
|
17
15
|
|
|
18
|
-
|
|
16
|
+
export { useInterface as default };
|
|
19
17
|
//# sourceMappingURL=useInterface.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useInterface.js","sources":["../../src/hooks/useInterface.ts"],"sourcesContent":["import { useTheme } from \"../theme\"\r\n\r\nconst useInterface = <P extends object>(name: string, userPorps: P, defaultProps: P) => {\r\n const theme = useTheme()\r\n let _props = { ...defaultProps, ...userPorps } as P\r\n if (name in theme.interfaces) {\r\n return theme.interfaces[name](_props, theme)\r\n }\r\n return [_props, theme]\r\n}\r\n\r\nexport default useInterface"],"names":[
|
|
1
|
+
{"version":3,"file":"useInterface.js","sources":["../../src/hooks/useInterface.ts"],"sourcesContent":["import { useTheme } from \"../theme\"\r\n\r\nconst useInterface = <P extends object>(name: string, userPorps: P, defaultProps: P) => {\r\n const theme = useTheme()\r\n let _props = { ...defaultProps, ...userPorps } as P\r\n if (name in theme.interfaces) {\r\n return theme.interfaces[name](_props, theme)\r\n }\r\n return [_props, theme]\r\n}\r\n\r\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,8 +1,10 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
var React = require('react');
|
|
3
5
|
|
|
4
6
|
function useMergeRefs(...refs) {
|
|
5
|
-
return useCallback((value) => {
|
|
7
|
+
return React.useCallback((value) => {
|
|
6
8
|
for (const ref of refs) {
|
|
7
9
|
if (!ref)
|
|
8
10
|
continue;
|
|
@@ -16,5 +18,5 @@ function useMergeRefs(...refs) {
|
|
|
16
18
|
}, refs);
|
|
17
19
|
}
|
|
18
20
|
|
|
19
|
-
|
|
20
|
-
//# sourceMappingURL=useMergeRefs.
|
|
21
|
+
module.exports = useMergeRefs;
|
|
22
|
+
//# sourceMappingURL=useMergeRefs.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useMergeRefs.
|
|
1
|
+
{"version":3,"file":"useMergeRefs.cjs","sources":["../../src/hooks/useMergeRefs.ts"],"sourcesContent":["\"use client\";\r\nimport { useCallback } from \"react\";\r\n\r\nfunction useMergeRefs<T>(\r\n ...refs: Array<React.Ref<T> | undefined>\r\n) {\r\n return useCallback((value: T | null) => {\r\n for (const ref of refs) {\r\n if (!ref) continue;\r\n if (typeof ref === \"function\") {\r\n ref(value);\r\n } else {\r\n (ref as React.MutableRefObject<T | null>).current = value;\r\n }\r\n }\r\n }, refs);\r\n}\r\n\r\nexport default useMergeRefs;"],"names":[],"mappings":";;;;;AAGA;AAGG;AACG;AACG;;AACA;;;;AAGI;;;;AAIb;;"}
|
package/hooks/useMergeRefs.js
CHANGED
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
var React = require('react');
|
|
2
|
+
import { useCallback } from 'react';
|
|
5
3
|
|
|
6
4
|
function useMergeRefs(...refs) {
|
|
7
|
-
return
|
|
5
|
+
return useCallback((value) => {
|
|
8
6
|
for (const ref of refs) {
|
|
9
7
|
if (!ref)
|
|
10
8
|
continue;
|
|
@@ -18,5 +16,5 @@ function useMergeRefs(...refs) {
|
|
|
18
16
|
}, refs);
|
|
19
17
|
}
|
|
20
18
|
|
|
21
|
-
|
|
19
|
+
export { useMergeRefs as default };
|
|
22
20
|
//# sourceMappingURL=useMergeRefs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useMergeRefs.js","sources":["../../src/hooks/useMergeRefs.ts"],"sourcesContent":["\"use client\";\r\nimport { useCallback } from \"react\";\r\n\r\nfunction useMergeRefs<T>(\r\n ...refs: Array<React.Ref<T> | undefined>\r\n) {\r\n return useCallback((value: T | null) => {\r\n for (const ref of refs) {\r\n if (!ref) continue;\r\n if (typeof ref === \"function\") {\r\n ref(value);\r\n } else {\r\n (ref as React.MutableRefObject<T | null>).current = value;\r\n }\r\n }\r\n }, refs);\r\n}\r\n\r\nexport default useMergeRefs;"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useMergeRefs.js","sources":["../../src/hooks/useMergeRefs.ts"],"sourcesContent":["\"use client\";\r\nimport { useCallback } from \"react\";\r\n\r\nfunction useMergeRefs<T>(\r\n ...refs: Array<React.Ref<T> | undefined>\r\n) {\r\n return useCallback((value: T | null) => {\r\n for (const ref of refs) {\r\n if (!ref) continue;\r\n if (typeof ref === \"function\") {\r\n ref(value);\r\n } else {\r\n (ref as React.MutableRefObject<T | null>).current = value;\r\n }\r\n }\r\n }, refs);\r\n}\r\n\r\nexport default useMergeRefs;"],"names":[],"mappings":";;;AAGA;AAGG;AACG;AACG;;AACA;;;;AAGI;;;;AAIb;;"}
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
5
|
+
var React = require('react');
|
|
6
|
+
var client = require('react-dom/client');
|
|
7
|
+
var core = require('../theme/core.cjs');
|
|
8
|
+
require('../css/getValue.cjs');
|
|
9
|
+
require('oncss');
|
|
10
|
+
require('../theme/ThemeProvider.cjs');
|
|
11
|
+
require('react-state-bucket');
|
|
12
|
+
var AppRootProvider = require('../AppRoot/AppRootProvider.cjs');
|
|
13
|
+
var index = require('../Document/index.cjs');
|
|
14
|
+
var index$1 = require('../AppRoot/index.cjs');
|
|
15
|
+
var CSSCacheProvider = require('../css/CSSCacheProvider.cjs');
|
|
16
|
+
|
|
17
|
+
function usePortal(children, options) {
|
|
18
|
+
options = options || {};
|
|
19
|
+
if (options.autoMount === undefined) {
|
|
20
|
+
options.autoMount = true;
|
|
21
|
+
}
|
|
22
|
+
const [mounted, setMounted] = React.useState(options.autoMount);
|
|
23
|
+
const theme = core.useTheme();
|
|
24
|
+
const doc = index.useDocument();
|
|
25
|
+
const appRoot = AppRootProvider.useAppRootElement();
|
|
26
|
+
const cacheId = CSSCacheProvider.useCSSCacheId();
|
|
27
|
+
const { el, root } = React.useMemo(() => {
|
|
28
|
+
const el = doc.document.createElement("div");
|
|
29
|
+
const root = client.createRoot(el);
|
|
30
|
+
return { el, root };
|
|
31
|
+
}, [options.autoMount]);
|
|
32
|
+
const container = () => {
|
|
33
|
+
const container = (options === null || options === void 0 ? void 0 : options.container) || appRoot;
|
|
34
|
+
if (!container)
|
|
35
|
+
throw new Error(`Container not found for portal. Please ensure that AppRoot is present in the application tree.`);
|
|
36
|
+
return container;
|
|
37
|
+
};
|
|
38
|
+
const mount = () => {
|
|
39
|
+
const cont = container();
|
|
40
|
+
if (!cont.contains(el)) {
|
|
41
|
+
cont.appendChild(el);
|
|
42
|
+
}
|
|
43
|
+
root.render(jsxRuntime.jsx(index$1, { theme: theme.name, CSSCacheId: cacheId, document: doc.document, children: children }));
|
|
44
|
+
};
|
|
45
|
+
const unmount = () => {
|
|
46
|
+
root.render(null);
|
|
47
|
+
el.remove();
|
|
48
|
+
};
|
|
49
|
+
React.useEffect(() => {
|
|
50
|
+
(mounted && appRoot) ? mount() : unmount();
|
|
51
|
+
}, [mounted, appRoot]);
|
|
52
|
+
React.useEffect(() => {
|
|
53
|
+
if (mounted && appRoot)
|
|
54
|
+
mount();
|
|
55
|
+
}, [children, appRoot]);
|
|
56
|
+
React.useEffect(() => {
|
|
57
|
+
return () => {
|
|
58
|
+
unmount();
|
|
59
|
+
};
|
|
60
|
+
}, []);
|
|
61
|
+
return {
|
|
62
|
+
isMount: () => mounted,
|
|
63
|
+
mount: () => setMounted(true),
|
|
64
|
+
unmount: () => setMounted(false)
|
|
65
|
+
};
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
module.exports = usePortal;
|
|
69
|
+
//# sourceMappingURL=usePortal.cjs.map
|