@xanui/core 1.1.2 → 1.1.5

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.
Files changed (131) hide show
  1. package/ServerStyleTags.js +3 -0
  2. package/ServerStyleTags.js.map +1 -0
  3. package/ServerStyleTags.mjs +3 -0
  4. package/ServerStyleTags.mjs.map +1 -0
  5. package/Tag/cssPropList.js +186 -0
  6. package/Tag/cssPropList.js.map +1 -0
  7. package/{src/Tag/cssPropList.ts → Tag/cssPropList.mjs} +2 -7
  8. package/Tag/cssPropList.mjs.map +1 -0
  9. package/Tag/index.js +6 -0
  10. package/Tag/index.js.map +1 -0
  11. package/Tag/index.mjs +6 -0
  12. package/Tag/index.mjs.map +1 -0
  13. package/Tag/useTagProps.js +21 -0
  14. package/Tag/useTagProps.js.map +1 -0
  15. package/Tag/useTagProps.mjs +21 -0
  16. package/Tag/useTagProps.mjs.map +1 -0
  17. package/Transition/index.js +93 -0
  18. package/Transition/index.js.map +1 -0
  19. package/Transition/index.mjs +93 -0
  20. package/Transition/index.mjs.map +1 -0
  21. package/Transition/variants.js +158 -0
  22. package/Transition/variants.js.map +1 -0
  23. package/{src/Transition/variants.ts → Transition/variants.mjs} +44 -64
  24. package/Transition/variants.mjs.map +1 -0
  25. package/breakpoint/BreakpointProvider.js +43 -0
  26. package/breakpoint/BreakpointProvider.js.map +1 -0
  27. package/breakpoint/BreakpointProvider.mjs +43 -0
  28. package/breakpoint/BreakpointProvider.mjs.map +1 -0
  29. package/breakpoint/useBreakpoint.js +23 -0
  30. package/breakpoint/useBreakpoint.js.map +1 -0
  31. package/breakpoint/useBreakpoint.mjs +23 -0
  32. package/breakpoint/useBreakpoint.mjs.map +1 -0
  33. package/breakpoint/useBreakpointProps.js +42 -0
  34. package/breakpoint/useBreakpointProps.js.map +1 -0
  35. package/breakpoint/useBreakpointProps.mjs +42 -0
  36. package/breakpoint/useBreakpointProps.mjs.map +1 -0
  37. package/css/aliases.js +29 -0
  38. package/css/aliases.js.map +1 -0
  39. package/css/aliases.mjs +29 -0
  40. package/css/aliases.mjs.map +1 -0
  41. package/{src/css/getProps.ts → css/getProps.js} +15 -21
  42. package/css/getProps.js.map +1 -0
  43. package/css/getProps.mjs +32 -0
  44. package/css/getProps.mjs.map +1 -0
  45. package/{src/css/getValue.ts → css/getValue.js} +40 -65
  46. package/css/getValue.js.map +1 -0
  47. package/css/getValue.mjs +92 -0
  48. package/css/getValue.mjs.map +1 -0
  49. package/css/index.js +55 -0
  50. package/css/index.js.map +1 -0
  51. package/css/index.mjs +55 -0
  52. package/css/index.mjs.map +1 -0
  53. package/index.d.ts +629 -0
  54. package/index.js +1 -0
  55. package/index.js.map +1 -0
  56. package/index.mjs +1 -0
  57. package/index.mjs.map +1 -0
  58. package/isWindow.js +1 -0
  59. package/isWindow.js.map +1 -0
  60. package/isWindow.mjs +1 -0
  61. package/isWindow.mjs.map +1 -0
  62. package/package.json +50 -51
  63. package/theme/ThemeCssVars.js +5 -0
  64. package/theme/ThemeCssVars.js.map +1 -0
  65. package/theme/ThemeCssVars.mjs +5 -0
  66. package/theme/ThemeCssVars.mjs.map +1 -0
  67. package/theme/ThemeDefaultOptions.js +131 -0
  68. package/theme/ThemeDefaultOptions.js.map +1 -0
  69. package/{src/theme/ThemeDefaultOptions.ts → theme/ThemeDefaultOptions.mjs} +17 -32
  70. package/theme/ThemeDefaultOptions.mjs.map +1 -0
  71. package/theme/ThemeProvider.js +88 -0
  72. package/theme/ThemeProvider.js.map +1 -0
  73. package/theme/ThemeProvider.mjs +88 -0
  74. package/theme/ThemeProvider.mjs.map +1 -0
  75. package/theme/core.js +18 -0
  76. package/theme/core.js.map +1 -0
  77. package/theme/core.mjs +18 -0
  78. package/theme/core.mjs.map +1 -0
  79. package/theme/createColor.js +46 -0
  80. package/theme/createColor.js.map +1 -0
  81. package/theme/createColor.mjs +46 -0
  82. package/theme/createColor.mjs.map +1 -0
  83. package/theme/createTheme.js +21 -0
  84. package/theme/createTheme.js.map +1 -0
  85. package/theme/createTheme.mjs +21 -0
  86. package/theme/createTheme.mjs.map +1 -0
  87. package/theme/createThemeSwitcher.js +12 -0
  88. package/theme/createThemeSwitcher.js.map +1 -0
  89. package/theme/createThemeSwitcher.mjs +12 -0
  90. package/theme/createThemeSwitcher.mjs.map +1 -0
  91. package/theme/index.js +2 -0
  92. package/theme/index.js.map +1 -0
  93. package/theme/index.mjs +2 -0
  94. package/theme/index.mjs.map +1 -0
  95. package/useAnimation.js +25 -0
  96. package/useAnimation.js.map +1 -0
  97. package/{src/useAnimation.ts → useAnimation.mjs} +10 -25
  98. package/useAnimation.mjs.map +1 -0
  99. package/useColorTemplate.js +6 -0
  100. package/useColorTemplate.js.map +1 -0
  101. package/useColorTemplate.mjs +6 -0
  102. package/useColorTemplate.mjs.map +1 -0
  103. package/useInterface.js +8 -0
  104. package/useInterface.js.map +1 -0
  105. package/useInterface.mjs +8 -0
  106. package/useInterface.mjs.map +1 -0
  107. package/main.tsx +0 -97
  108. package/src/ServerStyleTags.tsx +0 -12
  109. package/src/Tag/index.tsx +0 -11
  110. package/src/Tag/types.ts +0 -183
  111. package/src/Tag/useTagProps.ts +0 -28
  112. package/src/Transition/index.tsx +0 -148
  113. package/src/breakpoint/index.tsx +0 -52
  114. package/src/breakpoint/useBreakpoint.ts +0 -31
  115. package/src/breakpoint/useBreakpointProps.ts +0 -57
  116. package/src/css/aliases.ts +0 -35
  117. package/src/css/index.ts +0 -78
  118. package/src/css/types.ts +0 -60
  119. package/src/index.ts +0 -34
  120. package/src/isWindow.ts +0 -3
  121. package/src/theme/ThemeCssVars.ts +0 -107
  122. package/src/theme/ThemeProvider.tsx +0 -140
  123. package/src/theme/core.ts +0 -21
  124. package/src/theme/createColor.ts +0 -53
  125. package/src/theme/createTheme.ts +0 -33
  126. package/src/theme/createThemeSwitcher.ts +0 -18
  127. package/src/theme/index.tsx +0 -17
  128. package/src/theme/types.ts +0 -181
  129. package/src/useColorTemplate.ts +0 -11
  130. package/src/useInterface.ts +0 -13
  131. package/tsconfig.json +0 -28
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useBreakpointProps.mjs","sources":["../../src/breakpoint/useBreakpointProps.ts"],"sourcesContent":["import React, { isValidElement } from \"react\"\nimport useBreakpoint from \"./useBreakpoint\"\nimport { BreakpointKeys } from \"../css/types\"\n\nexport type useBreakpointPropsType<P> = P | {\n [key in BreakpointKeys]?: P\n}\n\nconst useBreakpoinProps = <P extends object>(props: useBreakpointPropsType<P>): useBreakpointPropsType<P> => {\n const bpoint = useBreakpoint()\n const stringifiedElement = JSON.stringify(props, (key, value) => {\n if (key === '_owner' || key === '_store') {\n return undefined; // Skip circular references\n }\n return value;\n }, 2);\n\n let format: any = React.useMemo(() => {\n\n const _format: any = {\n xs: {},\n sm: {},\n md: {},\n lg: {},\n xl: {}\n }\n for (let prop in props) {\n let val = (props as any)[prop]\n if (!isValidElement(val) && typeof val === 'object') {\n for (let breakpoin in val) {\n _format[breakpoin][prop] = (props as any)[prop][breakpoin]\n }\n } else {\n _format.xs[prop] = (props as any)[prop]\n }\n }\n\n return _format\n }, [stringifiedElement, bpoint.value])\n\n return React.useMemo(() => {\n let _props = format.xs || {};\n for (let key of ['sm', 'md', 'lg', 'xl']) {\n if (bpoint.isOrDown(key as any)) {\n _props = { ..._props, ...format[key] };\n }\n if (bpoint.is(key as any)) {\n break;\n }\n }\n return _props;\n }, [format, bpoint.value]);\n}\n\n\n\nexport default useBreakpoinProps"],"names":["React"],"mappings":"iGAQA,MAAM,iBAAiB,GAAG,CAAmB,KAAgC,KAA+B;AACzG,IAAA,MAAM,MAAM,GAAG,aAAa,EAAE;AAC9B,IAAA,MAAM,kBAAkB,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC,GAAG,EAAE,KAAK,KAAI;AAC7D,QAAA,IAAI,GAAG,KAAK,QAAQ,IAAI,GAAG,KAAK,QAAQ,EAAE;YACvC,OAAO,SAAS,CAAC;AACnB;AACD,QAAA,OAAO,KAAK;KACd,EAAE,CAAC,CAAC;AAEL,IAAA,IAAI,MAAM,GAAQA,cAAK,CAAC,OAAO,CAAC,MAAK;AAElC,QAAA,MAAM,OAAO,GAAQ;AAClB,YAAA,EAAE,EAAE,EAAE;AACN,YAAA,EAAE,EAAE,EAAE;AACN,YAAA,EAAE,EAAE,EAAE;AACN,YAAA,EAAE,EAAE,EAAE;AACN,YAAA,EAAE,EAAE;SACN;AACD,QAAA,KAAK,IAAI,IAAI,IAAI,KAAK,EAAE;AACrB,YAAA,IAAI,GAAG,GAAI,KAAa,CAAC,IAAI,CAAC;YAC9B,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,IAAI,OAAO,GAAG,KAAK,QAAQ,EAAE;AAClD,gBAAA,KAAK,IAAI,SAAS,IAAI,GAAG,EAAE;AACxB,oBAAA,OAAO,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,GAAI,KAAa,CAAC,IAAI,CAAC,CAAC,SAAS,CAAC;AAC5D;AACH;AAAM,iBAAA;gBACJ,OAAO,CAAC,EAAE,CAAC,IAAI,CAAC,GAAI,KAAa,CAAC,IAAI,CAAC;AACzC;AACH;AAED,QAAA,OAAO,OAAO;KAChB,EAAE,CAAC,kBAAkB,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC;AAEtC,IAAA,OAAOA,cAAK,CAAC,OAAO,CAAC,MAAK;AACvB,QAAA,IAAI,MAAM,GAAG,MAAM,CAAC,EAAE,IAAI,EAAE;AAC5B,QAAA,KAAK,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,EAAE;AACvC,YAAA,IAAI,MAAM,CAAC,QAAQ,CAAC,GAAU,CAAC,EAAE;gBAC9B,MAAM,GAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAQ,MAAM,CAAK,EAAA,MAAM,CAAC,GAAG,CAAC,CAAE;AACxC;AACD,YAAA,IAAI,MAAM,CAAC,EAAE,CAAC,GAAU,CAAC,EAAE;gBACxB;AACF;AACH;AACD,QAAA,OAAO,MAAM;KACf,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC;AAC7B"}
package/css/aliases.js ADDED
@@ -0,0 +1,29 @@
1
+ 'use strict';const isStr = (v, or) => typeof v === 'string' ? v : or;
2
+ const aliases = {
3
+ bgcolor: (v) => ({ backgroundColor: v }),
4
+ bgimage: (v) => ({ backgroundImage: `url(${v})`, backgroundSize: "cover", backgroundRepeat: "no-repeat" }),
5
+ bg: (v) => ({ background: v }),
6
+ p: (v) => ({ padding: isStr(v, 8 * v) }),
7
+ pt: (v) => ({ paddingTop: isStr(v, 8 * v) }),
8
+ pr: (v) => ({ paddingRight: isStr(v, 8 * v) }),
9
+ pb: (v) => ({ paddingBottom: isStr(v, 8 * v) }),
10
+ pl: (v) => ({ paddingLeft: isStr(v, 8 * v) }),
11
+ px: (v) => ({ paddingLeft: isStr(v, 8 * v), paddingRight: isStr(v, 8 * v) }),
12
+ py: (v) => ({ paddingTop: isStr(v, 8 * v), paddingBottom: isStr(v, 8 * v) }),
13
+ m: (v) => ({ margin: isStr(v, 8 * v) }),
14
+ mt: (v) => ({ marginTop: isStr(v, 8 * v) }),
15
+ mr: (v) => ({ marginRight: isStr(v, 8 * v) }),
16
+ mb: (v) => ({ marginBottom: isStr(v, 8 * v) }),
17
+ ml: (v) => ({ marginLeft: isStr(v, 8 * v) }),
18
+ mx: (v) => ({ marginLeft: isStr(v, 8 * v), marginRight: isStr(v, 8 * v) }),
19
+ my: (v) => ({ marginTop: isStr(v, 8 * v), marginBottom: isStr(v, 8 * v) }),
20
+ radius: (v) => ({ borderRadius: isStr(v, 8 * v) }),
21
+ borderRadius: (v) => ({ borderRadius: isStr(v, 8 * v) }),
22
+ shadow: (v) => ({ boxShadow: v }),
23
+ flexBox: (v) => (v ? { display: "flex" } : {}),
24
+ flexRow: (v) => (v ? { flexDirection: "row" } : {}),
25
+ flexColumn: (v) => (v ? { flexDirection: "column" } : {}),
26
+ flexWraped: (v) => (v ? { flexWrap: "wrap" } : {}),
27
+ direction: (v) => (v === 'row' || v === 'column' ? { flexDirection: v } : { direction: v }),
28
+ gap: (v) => ({ gap: isStr(v, 8 * v) }),
29
+ };module.exports=aliases;//# sourceMappingURL=aliases.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"aliases.js","sources":["../../src/css/aliases.ts"],"sourcesContent":["import { OptionAliases } from 'oncss'\nimport { Aliases } from './types'\n\nconst isStr = (v: any, or: any) => typeof v === 'string' ? v : or\n\nconst aliases: OptionAliases<Aliases> = {\n bgcolor: (v) => ({ backgroundColor: v }),\n bgimage: (v) => ({ backgroundImage: `url(${v})`, backgroundSize: \"cover\", backgroundRepeat: \"no-repeat\" }),\n bg: (v) => ({ background: v }),\n p: (v) => ({ padding: isStr(v, 8 * v) }),\n pt: (v) => ({ paddingTop: isStr(v, 8 * v) }),\n pr: (v) => ({ paddingRight: isStr(v, 8 * v) }),\n pb: (v) => ({ paddingBottom: isStr(v, 8 * v) }),\n pl: (v) => ({ paddingLeft: isStr(v, 8 * v) }),\n px: (v) => ({ paddingLeft: isStr(v, 8 * v), paddingRight: isStr(v, 8 * v) }),\n py: (v) => ({ paddingTop: isStr(v, 8 * v), paddingBottom: isStr(v, 8 * v) }),\n m: (v) => ({ margin: isStr(v, 8 * v) }),\n mt: (v) => ({ marginTop: isStr(v, 8 * v) }),\n mr: (v) => ({ marginRight: isStr(v, 8 * v) }),\n mb: (v) => ({ marginBottom: isStr(v, 8 * v) }),\n ml: (v) => ({ marginLeft: isStr(v, 8 * v) }),\n mx: (v) => ({ marginLeft: isStr(v, 8 * v), marginRight: isStr(v, 8 * v) }),\n my: (v) => ({ marginTop: isStr(v, 8 * v), marginBottom: isStr(v, 8 * v) }),\n radius: (v) => ({ borderRadius: isStr(v, 8 * v) }),\n borderRadius: (v) => ({ borderRadius: isStr(v, 8 * v) }),\n shadow: (v) => ({ boxShadow: v }),\n flexBox: (v) => (v ? { display: \"flex\" } : {}),\n flexRow: (v) => (v ? { flexDirection: \"row\" } : {}),\n flexColumn: (v) => (v ? { flexDirection: \"column\" } : {}),\n flexWraped: (v) => (v ? { flexWrap: \"wrap\" } : {}),\n direction: (v) => (v === 'row' || v === 'column' ? { flexDirection: v } : { direction: v }),\n gap: (v) => ({ gap: isStr(v, 8 * v) }),\n};\n\nexport default aliases"],"names":[],"mappings":"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"}
@@ -0,0 +1,29 @@
1
+ const isStr = (v, or) => typeof v === 'string' ? v : or;
2
+ const aliases = {
3
+ bgcolor: (v) => ({ backgroundColor: v }),
4
+ bgimage: (v) => ({ backgroundImage: `url(${v})`, backgroundSize: "cover", backgroundRepeat: "no-repeat" }),
5
+ bg: (v) => ({ background: v }),
6
+ p: (v) => ({ padding: isStr(v, 8 * v) }),
7
+ pt: (v) => ({ paddingTop: isStr(v, 8 * v) }),
8
+ pr: (v) => ({ paddingRight: isStr(v, 8 * v) }),
9
+ pb: (v) => ({ paddingBottom: isStr(v, 8 * v) }),
10
+ pl: (v) => ({ paddingLeft: isStr(v, 8 * v) }),
11
+ px: (v) => ({ paddingLeft: isStr(v, 8 * v), paddingRight: isStr(v, 8 * v) }),
12
+ py: (v) => ({ paddingTop: isStr(v, 8 * v), paddingBottom: isStr(v, 8 * v) }),
13
+ m: (v) => ({ margin: isStr(v, 8 * v) }),
14
+ mt: (v) => ({ marginTop: isStr(v, 8 * v) }),
15
+ mr: (v) => ({ marginRight: isStr(v, 8 * v) }),
16
+ mb: (v) => ({ marginBottom: isStr(v, 8 * v) }),
17
+ ml: (v) => ({ marginLeft: isStr(v, 8 * v) }),
18
+ mx: (v) => ({ marginLeft: isStr(v, 8 * v), marginRight: isStr(v, 8 * v) }),
19
+ my: (v) => ({ marginTop: isStr(v, 8 * v), marginBottom: isStr(v, 8 * v) }),
20
+ radius: (v) => ({ borderRadius: isStr(v, 8 * v) }),
21
+ borderRadius: (v) => ({ borderRadius: isStr(v, 8 * v) }),
22
+ shadow: (v) => ({ boxShadow: v }),
23
+ flexBox: (v) => (v ? { display: "flex" } : {}),
24
+ flexRow: (v) => (v ? { flexDirection: "row" } : {}),
25
+ flexColumn: (v) => (v ? { flexDirection: "column" } : {}),
26
+ flexWraped: (v) => (v ? { flexWrap: "wrap" } : {}),
27
+ direction: (v) => (v === 'row' || v === 'column' ? { flexDirection: v } : { direction: v }),
28
+ gap: (v) => ({ gap: isStr(v, 8 * v) }),
29
+ };export{aliases as default};//# sourceMappingURL=aliases.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"aliases.mjs","sources":["../../src/css/aliases.ts"],"sourcesContent":["import { OptionAliases } from 'oncss'\nimport { Aliases } from './types'\n\nconst isStr = (v: any, or: any) => typeof v === 'string' ? v : or\n\nconst aliases: OptionAliases<Aliases> = {\n bgcolor: (v) => ({ backgroundColor: v }),\n bgimage: (v) => ({ backgroundImage: `url(${v})`, backgroundSize: \"cover\", backgroundRepeat: \"no-repeat\" }),\n bg: (v) => ({ background: v }),\n p: (v) => ({ padding: isStr(v, 8 * v) }),\n pt: (v) => ({ paddingTop: isStr(v, 8 * v) }),\n pr: (v) => ({ paddingRight: isStr(v, 8 * v) }),\n pb: (v) => ({ paddingBottom: isStr(v, 8 * v) }),\n pl: (v) => ({ paddingLeft: isStr(v, 8 * v) }),\n px: (v) => ({ paddingLeft: isStr(v, 8 * v), paddingRight: isStr(v, 8 * v) }),\n py: (v) => ({ paddingTop: isStr(v, 8 * v), paddingBottom: isStr(v, 8 * v) }),\n m: (v) => ({ margin: isStr(v, 8 * v) }),\n mt: (v) => ({ marginTop: isStr(v, 8 * v) }),\n mr: (v) => ({ marginRight: isStr(v, 8 * v) }),\n mb: (v) => ({ marginBottom: isStr(v, 8 * v) }),\n ml: (v) => ({ marginLeft: isStr(v, 8 * v) }),\n mx: (v) => ({ marginLeft: isStr(v, 8 * v), marginRight: isStr(v, 8 * v) }),\n my: (v) => ({ marginTop: isStr(v, 8 * v), marginBottom: isStr(v, 8 * v) }),\n radius: (v) => ({ borderRadius: isStr(v, 8 * v) }),\n borderRadius: (v) => ({ borderRadius: isStr(v, 8 * v) }),\n shadow: (v) => ({ boxShadow: v }),\n flexBox: (v) => (v ? { display: \"flex\" } : {}),\n flexRow: (v) => (v ? { flexDirection: \"row\" } : {}),\n flexColumn: (v) => (v ? { flexDirection: \"column\" } : {}),\n flexWraped: (v) => (v ? { flexWrap: \"wrap\" } : {}),\n direction: (v) => (v === 'row' || v === 'column' ? { flexDirection: v } : { direction: v }),\n gap: (v) => ({ gap: isStr(v, 8 * v) }),\n};\n\nexport default aliases"],"names":[],"mappings":"AAGA,MAAM,KAAK,GAAG,CAAC,CAAM,EAAE,EAAO,KAAK,OAAO,CAAC,KAAK,QAAQ,GAAG,CAAC,GAAG,EAAE;AAEjE,MAAM,OAAO,GAA2B;AACrC,IAAA,OAAO,EAAE,CAAC,CAAC,MAAM,EAAE,eAAe,EAAE,CAAC,EAAE,CAAC;IACxC,OAAO,EAAE,CAAC,CAAC,MAAM,EAAE,eAAe,EAAE,CAAA,IAAA,EAAO,CAAC,CAAG,CAAA,CAAA,EAAE,cAAc,EAAE,OAAO,EAAE,gBAAgB,EAAE,WAAW,EAAE,CAAC;AAC1G,IAAA,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,UAAU,EAAE,CAAC,EAAE,CAAC;AAC9B,IAAA,CAAC,EAAE,CAAC,CAAC,MAAM,EAAE,OAAO,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;AACxC,IAAA,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,UAAU,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;AAC5C,IAAA,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,YAAY,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;AAC9C,IAAA,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,aAAa,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;AAC/C,IAAA,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,WAAW,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;AAC7C,IAAA,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,WAAW,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,YAAY,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;AAC5E,IAAA,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,UAAU,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,aAAa,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;AAC5E,IAAA,CAAC,EAAE,CAAC,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;AACvC,IAAA,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,SAAS,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;AAC3C,IAAA,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,WAAW,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;AAC7C,IAAA,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,YAAY,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;AAC9C,IAAA,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,UAAU,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;AAC5C,IAAA,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,UAAU,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,WAAW,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;AAC1E,IAAA,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,SAAS,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,YAAY,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;AAC1E,IAAA,MAAM,EAAE,CAAC,CAAC,MAAM,EAAE,YAAY,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;AAClD,IAAA,YAAY,EAAE,CAAC,CAAC,MAAM,EAAE,YAAY,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;AACxD,IAAA,MAAM,EAAE,CAAC,CAAC,MAAM,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC;IACjC,OAAO,EAAE,CAAC,CAAC,MAAM,CAAC,GAAG,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC;IAC9C,OAAO,EAAE,CAAC,CAAC,MAAM,CAAC,GAAG,EAAE,aAAa,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC;IACnD,UAAU,EAAE,CAAC,CAAC,MAAM,CAAC,GAAG,EAAE,aAAa,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC;IACzD,UAAU,EAAE,CAAC,CAAC,MAAM,CAAC,GAAG,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC;AAClD,IAAA,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,KAAK,IAAI,CAAC,KAAK,QAAQ,GAAG,EAAE,aAAa,EAAE,CAAC,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC,EAAE,CAAC;AAC3F,IAAA,GAAG,EAAE,CAAC,CAAC,MAAM,EAAE,GAAG,EAAE,KAAK,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;"}
@@ -1,38 +1,32 @@
1
- import { CSSProps } from "./types";
2
-
3
- const getProps = (prop: string, value: string, _css: CSSProps) => {
1
+ 'use strict';const getProps = (prop, value, _css) => {
4
2
  let important;
5
3
  if (typeof value === 'string') {
6
- const split = value.split("!")
7
- important = split[1] ? "!important" : ""
8
- value = split[0]
4
+ const split = value.split("!");
5
+ important = split[1] ? "!important" : "";
6
+ value = split[0];
9
7
  }
10
-
11
8
  if (prop === 'disabled') {
12
- if ((value as any) === true) {
9
+ if (value === true) {
13
10
  return {
14
11
  pointerEvents: "none!important",
15
12
  cursor: "default!important",
16
13
  userSelect: "none!important",
17
14
  opacity: ".8!important"
18
- } as any
15
+ };
19
16
  }
20
- return {}
17
+ return {};
21
18
  }
22
-
23
- if (value && typeof value === "number" && ["border", "borderRight", "borderLeft", "borderTop", "borderBottom"].includes(prop as any)) {
24
- const keys: any = Object.keys(_css)
25
- let p: any = {
19
+ if (value && typeof value === "number" && ["border", "borderRight", "borderLeft", "borderTop", "borderBottom"].includes(prop)) {
20
+ const keys = Object.keys(_css);
21
+ let p = {
26
22
  [`${prop}Width`]: value + 'px' + (important || ""),
27
- }
23
+ };
28
24
  if (!keys.includes(`${prop}Color`)) {
29
- p[`${prop}Color`] = "divider"
25
+ p[`${prop}Color`] = "divider";
30
26
  }
31
27
  if (!keys.includes(`${prop}Style`)) {
32
- p[`${prop}Style`] = "solid"
28
+ p[`${prop}Style`] = "solid";
33
29
  }
34
- return p
30
+ return p;
35
31
  }
36
- }
37
-
38
- export default getProps
32
+ };module.exports=getProps;//# sourceMappingURL=getProps.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"getProps.js","sources":["../../src/css/getProps.ts"],"sourcesContent":["import { CSSProps } from \"./types\";\n\nconst getProps = (prop: string, value: string, _css: CSSProps) => {\n let important;\n if (typeof value === 'string') {\n const split = value.split(\"!\")\n important = split[1] ? \"!important\" : \"\"\n value = split[0]\n }\n\n if (prop === 'disabled') {\n if ((value as any) === true) {\n return {\n pointerEvents: \"none!important\",\n cursor: \"default!important\",\n userSelect: \"none!important\",\n opacity: \".8!important\"\n } as any\n }\n return {}\n }\n\n if (value && typeof value === \"number\" && [\"border\", \"borderRight\", \"borderLeft\", \"borderTop\", \"borderBottom\"].includes(prop as any)) {\n const keys: any = Object.keys(_css)\n let p: any = {\n [`${prop}Width`]: value + 'px' + (important || \"\"),\n }\n if (!keys.includes(`${prop}Color`)) {\n p[`${prop}Color`] = \"divider\"\n }\n if (!keys.includes(`${prop}Style`)) {\n p[`${prop}Style`] = \"solid\"\n }\n return p\n }\n}\n\nexport default getProps"],"names":[],"mappings":"aAEM,MAAA,QAAQ,GAAG,CAAC,IAAY,EAAE,KAAa,EAAE,IAAc,KAAI;AAC7D,IAAA,IAAI,SAAS;AACb,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;AACnB;IAED,IAAI,IAAI,KAAK,UAAU,EAAE;QACrB,IAAK,KAAa,KAAK,IAAI,EAAE;YACzB,OAAO;AACH,gBAAA,aAAa,EAAE,gBAAgB;AAC/B,gBAAA,MAAM,EAAE,mBAAmB;AAC3B,gBAAA,UAAU,EAAE,gBAAgB;AAC5B,gBAAA,OAAO,EAAE;aACL;AACX;AACD,QAAA,OAAO,EAAE;AACZ;IAED,IAAI,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,QAAQ,EAAE,aAAa,EAAE,YAAY,EAAE,WAAW,EAAE,cAAc,CAAC,CAAC,QAAQ,CAAC,IAAW,CAAC,EAAE;QAClI,MAAM,IAAI,GAAQ,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;AACnC,QAAA,IAAI,CAAC,GAAQ;AACT,YAAA,CAAC,CAAG,EAAA,IAAI,CAAO,KAAA,CAAA,GAAG,KAAK,GAAG,IAAI,IAAI,SAAS,IAAI,EAAE,CAAC;SACrD;QACD,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAG,EAAA,IAAI,CAAO,KAAA,CAAA,CAAC,EAAE;AAChC,YAAA,CAAC,CAAC,CAAG,EAAA,IAAI,OAAO,CAAC,GAAG,SAAS;AAChC;QACD,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAG,EAAA,IAAI,CAAO,KAAA,CAAA,CAAC,EAAE;AAChC,YAAA,CAAC,CAAC,CAAG,EAAA,IAAI,OAAO,CAAC,GAAG,OAAO;AAC9B;AACD,QAAA,OAAO,CAAC;AACX;AACL"}
@@ -0,0 +1,32 @@
1
+ const getProps = (prop, value, _css) => {
2
+ let important;
3
+ if (typeof value === 'string') {
4
+ const split = value.split("!");
5
+ important = split[1] ? "!important" : "";
6
+ value = split[0];
7
+ }
8
+ if (prop === 'disabled') {
9
+ if (value === true) {
10
+ return {
11
+ pointerEvents: "none!important",
12
+ cursor: "default!important",
13
+ userSelect: "none!important",
14
+ opacity: ".8!important"
15
+ };
16
+ }
17
+ return {};
18
+ }
19
+ if (value && typeof value === "number" && ["border", "borderRight", "borderLeft", "borderTop", "borderBottom"].includes(prop)) {
20
+ const keys = Object.keys(_css);
21
+ let p = {
22
+ [`${prop}Width`]: value + 'px' + (important || ""),
23
+ };
24
+ if (!keys.includes(`${prop}Color`)) {
25
+ p[`${prop}Color`] = "divider";
26
+ }
27
+ if (!keys.includes(`${prop}Style`)) {
28
+ p[`${prop}Style`] = "solid";
29
+ }
30
+ return p;
31
+ }
32
+ };export{getProps as default};//# sourceMappingURL=getProps.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"getProps.mjs","sources":["../../src/css/getProps.ts"],"sourcesContent":["import { CSSProps } from \"./types\";\n\nconst getProps = (prop: string, value: string, _css: CSSProps) => {\n let important;\n if (typeof value === 'string') {\n const split = value.split(\"!\")\n important = split[1] ? \"!important\" : \"\"\n value = split[0]\n }\n\n if (prop === 'disabled') {\n if ((value as any) === true) {\n return {\n pointerEvents: \"none!important\",\n cursor: \"default!important\",\n userSelect: \"none!important\",\n opacity: \".8!important\"\n } as any\n }\n return {}\n }\n\n if (value && typeof value === \"number\" && [\"border\", \"borderRight\", \"borderLeft\", \"borderTop\", \"borderBottom\"].includes(prop as any)) {\n const keys: any = Object.keys(_css)\n let p: any = {\n [`${prop}Width`]: value + 'px' + (important || \"\"),\n }\n if (!keys.includes(`${prop}Color`)) {\n p[`${prop}Color`] = \"divider\"\n }\n if (!keys.includes(`${prop}Style`)) {\n p[`${prop}Style`] = \"solid\"\n }\n return p\n }\n}\n\nexport default getProps"],"names":[],"mappings":"AAEM,MAAA,QAAQ,GAAG,CAAC,IAAY,EAAE,KAAa,EAAE,IAAc,KAAI;AAC7D,IAAA,IAAI,SAAS;AACb,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;AACnB;IAED,IAAI,IAAI,KAAK,UAAU,EAAE;QACrB,IAAK,KAAa,KAAK,IAAI,EAAE;YACzB,OAAO;AACH,gBAAA,aAAa,EAAE,gBAAgB;AAC/B,gBAAA,MAAM,EAAE,mBAAmB;AAC3B,gBAAA,UAAU,EAAE,gBAAgB;AAC5B,gBAAA,OAAO,EAAE;aACL;AACX;AACD,QAAA,OAAO,EAAE;AACZ;IAED,IAAI,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,CAAC,QAAQ,EAAE,aAAa,EAAE,YAAY,EAAE,WAAW,EAAE,cAAc,CAAC,CAAC,QAAQ,CAAC,IAAW,CAAC,EAAE;QAClI,MAAM,IAAI,GAAQ,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC;AACnC,QAAA,IAAI,CAAC,GAAQ;AACT,YAAA,CAAC,CAAG,EAAA,IAAI,CAAO,KAAA,CAAA,GAAG,KAAK,GAAG,IAAI,IAAI,SAAS,IAAI,EAAE,CAAC;SACrD;QACD,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAG,EAAA,IAAI,CAAO,KAAA,CAAA,CAAC,EAAE;AAChC,YAAA,CAAC,CAAC,CAAG,EAAA,IAAI,OAAO,CAAC,GAAG,SAAS;AAChC;QACD,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAG,EAAA,IAAI,CAAO,KAAA,CAAA,CAAC,EAAE;AAChC,YAAA,CAAC,CAAC,CAAG,EAAA,IAAI,OAAO,CAAC,GAAG,OAAO;AAC9B;AACD,QAAA,OAAO,CAAC;AACX;AACL"}
@@ -1,44 +1,22 @@
1
- import { CSSProps } from "./types"
2
-
3
- const getColor = (color: string) => {
1
+ 'use strict';const getColor = (color) => {
4
2
  return {
5
3
  [`${color}`]: `var(--color-${color}-primary)`,
6
4
  [`${color}.primary`]: `var(--color-${color}-primary)`,
7
5
  [`${color}.secondary`]: `var(--color-${color}-secondary)`,
8
6
  [`${color}.text`]: `var(--color-${color}-text)`,
9
7
  [`${color}.alpha`]: `var(--color-${color}-alpha)`
10
- }
11
- }
12
-
13
- const withImportant = (important: any, value: any) => important ? value + important : value
14
- const colors: any = {
15
- "text": `var(--color-text-primary)`,
16
- "text.primary": `var(--color-text-primary)`,
17
- "text.secondary": `var(--color-text-secondary)`,
18
-
19
- "background": `var(--color-background-primary)`,
20
- "background.primary": `var(--color-background-primary)`,
21
- "background.secondary": `var(--color-background-secondary)`,
22
- "background.alpha": `var(--color-background-alpha)`,
23
- "divider": `var(--color-divider)`,
24
-
25
- ...getColor("brand"),
26
- ...getColor("accent"),
27
- ...getColor("info"),
28
- ...getColor("success"),
29
- ...getColor("warning"),
30
- ...getColor("danger"),
31
- }
32
-
33
- const breakpoints: any = {
8
+ };
9
+ };
10
+ const withImportant = (important, value) => important ? value + important : value;
11
+ const colors = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ "text": `var(--color-text-primary)`, "text.primary": `var(--color-text-primary)`, "text.secondary": `var(--color-text-secondary)`, "background": `var(--color-background-primary)`, "background.primary": `var(--color-background-primary)`, "background.secondary": `var(--color-background-secondary)`, "background.alpha": `var(--color-background-alpha)`, "divider": `var(--color-divider)` }, getColor("brand")), getColor("accent")), getColor("info")), getColor("success")), getColor("warning")), getColor("danger"));
12
+ const breakpoints = {
34
13
  "xs": "var(--bp-xs)",
35
14
  "sm": "var(--bp-sm)",
36
15
  "md": "var(--bp-md)",
37
16
  "lg": "var(--bp-lg)",
38
17
  "xl": "var(--bp-xl)"
39
- }
40
-
41
- let fontsizes: any = {
18
+ };
19
+ let fontsizes = {
42
20
  "h1": "var(--fontsize-h1)",
43
21
  "h2": "var(--fontsize-h2)",
44
22
  "h3": "var(--fontsize-h3)",
@@ -48,9 +26,8 @@ let fontsizes: any = {
48
26
  "text": "var(--fontsize-text)",
49
27
  "button": "var(--fontsize-button)",
50
28
  "small": "var(--fontsize-small)"
51
- }
52
-
53
- let lineHeights: any = {
29
+ };
30
+ let lineHeights = {
54
31
  "h1": "var(--lineheight-h1)",
55
32
  "h2": "var(--lineheight-h2)",
56
33
  "h3": "var(--lineheight-h3)",
@@ -60,9 +37,8 @@ let lineHeights: any = {
60
37
  "text": "var(--lineheight-text)",
61
38
  "button": "var(--lineheight-button)",
62
39
  "small": "var(--lineheight-small)"
63
- }
64
-
65
- let fontWeights: any = {
40
+ };
41
+ let fontWeights = {
66
42
  "h1": "var(--fontweight-h1)",
67
43
  "h2": "var(--fontweight-h2)",
68
44
  "h3": "var(--fontweight-h3)",
@@ -72,9 +48,8 @@ let fontWeights: any = {
72
48
  "text": "var(--fontweight-text)",
73
49
  "button": "var(--fontweight-button)",
74
50
  "small": "var(--fontweight-small)"
75
- }
76
-
77
- let font: any = {
51
+ };
52
+ let font = {
78
53
  "h1": "var(--font-h1)",
79
54
  "h2": "var(--font-h2)",
80
55
  "h3": "var(--font-h3)",
@@ -84,34 +59,34 @@ let font: any = {
84
59
  "text": "var(--font-text)",
85
60
  "button": "var(--font-button)",
86
61
  "small": "var(--font-small)"
87
- }
88
-
89
- const getValue = (prop: any, value: string | number, _css: CSSProps): any => {
62
+ };
63
+ const getValue = (prop, value, _css) => {
90
64
  let important;
91
-
92
65
  if (typeof value === 'string') {
93
- const split = value.split("!")
94
- important = split[1] ? "!important" : ""
95
- value = split[0]
66
+ const split = value.split("!");
67
+ important = split[1] ? "!important" : "";
68
+ value = split[0];
96
69
  }
97
-
98
70
  if (['width', 'maxWidth', 'minWidth', 'max-width', 'min-width'].includes(prop)) {
99
- return withImportant(important, breakpoints[value] || value)
100
- } else if (['fontFamily', 'font-family'].includes(prop) && value === 'default') {
101
- return withImportant(important, "var(--font-family)")
102
- } if (prop === 'font' && typeof value === "string" && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {
103
- return withImportant(important, font[value] || value)
104
- } if (['fontWeight', 'font-weight'].includes(prop) && typeof value === 'string' && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {
105
- return withImportant(important, fontWeights[value] || value)
106
- } else if (['lineHeight', 'line-height'].includes(prop) && typeof value === 'string' && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {
107
- return withImportant(important, lineHeights[value] || value)
108
- } else if (['fontSize', 'font-size'].includes(prop) && typeof value === 'string') {
109
- return withImportant(important, fontsizes[value] || value)
110
- } else if (typeof value === "number" && ["shadow", "boxShadow"].includes(prop)) {
111
- return withImportant(important, `var(--shadow-${value})`)
71
+ return withImportant(important, breakpoints[value] || value);
72
+ }
73
+ else if (['fontFamily', 'font-family'].includes(prop) && value === 'default') {
74
+ return withImportant(important, "var(--font-family)");
75
+ }
76
+ if (prop === 'font' && typeof value === "string" && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {
77
+ return withImportant(important, font[value] || value);
78
+ }
79
+ if (['fontWeight', 'font-weight'].includes(prop) && typeof value === 'string' && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {
80
+ return withImportant(important, fontWeights[value] || value);
81
+ }
82
+ else if (['lineHeight', 'line-height'].includes(prop) && typeof value === 'string' && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {
83
+ return withImportant(important, lineHeights[value] || value);
84
+ }
85
+ else if (['fontSize', 'font-size'].includes(prop) && typeof value === 'string') {
86
+ return withImportant(important, fontsizes[value] || value);
87
+ }
88
+ else if (typeof value === "number" && ["shadow", "boxShadow"].includes(prop)) {
89
+ return withImportant(important, `var(--shadow-${value})`);
112
90
  }
113
-
114
- return withImportant(important, colors[value] || value)
115
- }
116
-
117
- export default getValue
91
+ return withImportant(important, colors[value] || value);
92
+ };module.exports=getValue;//# sourceMappingURL=getValue.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"getValue.js","sources":["../../src/css/getValue.ts"],"sourcesContent":["import { CSSProps } from \"./types\"\n\nconst getColor = (color: string) => {\n return {\n [`${color}`]: `var(--color-${color}-primary)`,\n [`${color}.primary`]: `var(--color-${color}-primary)`,\n [`${color}.secondary`]: `var(--color-${color}-secondary)`,\n [`${color}.text`]: `var(--color-${color}-text)`,\n [`${color}.alpha`]: `var(--color-${color}-alpha)`\n }\n}\n\nconst withImportant = (important: any, value: any) => important ? value + important : value\nconst colors: any = {\n \"text\": `var(--color-text-primary)`,\n \"text.primary\": `var(--color-text-primary)`,\n \"text.secondary\": `var(--color-text-secondary)`,\n\n \"background\": `var(--color-background-primary)`,\n \"background.primary\": `var(--color-background-primary)`,\n \"background.secondary\": `var(--color-background-secondary)`,\n \"background.alpha\": `var(--color-background-alpha)`,\n \"divider\": `var(--color-divider)`,\n\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 \"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 \"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 \"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 \"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 if (['width', 'maxWidth', 'minWidth', 'max-width', 'min-width'].includes(prop)) {\n return withImportant(important, breakpoints[value] || value)\n } else if (['fontFamily', 'font-family'].includes(prop) && value === 'default') {\n return withImportant(important, \"var(--font-family)\")\n } 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 } 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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"}
@@ -0,0 +1,92 @@
1
+ const getColor = (color) => {
2
+ return {
3
+ [`${color}`]: `var(--color-${color}-primary)`,
4
+ [`${color}.primary`]: `var(--color-${color}-primary)`,
5
+ [`${color}.secondary`]: `var(--color-${color}-secondary)`,
6
+ [`${color}.text`]: `var(--color-${color}-text)`,
7
+ [`${color}.alpha`]: `var(--color-${color}-alpha)`
8
+ };
9
+ };
10
+ const withImportant = (important, value) => important ? value + important : value;
11
+ const colors = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({ "text": `var(--color-text-primary)`, "text.primary": `var(--color-text-primary)`, "text.secondary": `var(--color-text-secondary)`, "background": `var(--color-background-primary)`, "background.primary": `var(--color-background-primary)`, "background.secondary": `var(--color-background-secondary)`, "background.alpha": `var(--color-background-alpha)`, "divider": `var(--color-divider)` }, getColor("brand")), getColor("accent")), getColor("info")), getColor("success")), getColor("warning")), getColor("danger"));
12
+ const breakpoints = {
13
+ "xs": "var(--bp-xs)",
14
+ "sm": "var(--bp-sm)",
15
+ "md": "var(--bp-md)",
16
+ "lg": "var(--bp-lg)",
17
+ "xl": "var(--bp-xl)"
18
+ };
19
+ let fontsizes = {
20
+ "h1": "var(--fontsize-h1)",
21
+ "h2": "var(--fontsize-h2)",
22
+ "h3": "var(--fontsize-h3)",
23
+ "h4": "var(--fontsize-h4)",
24
+ "h5": "var(--fontsize-h5)",
25
+ "h6": "var(--fontsize-h6)",
26
+ "text": "var(--fontsize-text)",
27
+ "button": "var(--fontsize-button)",
28
+ "small": "var(--fontsize-small)"
29
+ };
30
+ let lineHeights = {
31
+ "h1": "var(--lineheight-h1)",
32
+ "h2": "var(--lineheight-h2)",
33
+ "h3": "var(--lineheight-h3)",
34
+ "h4": "var(--lineheight-h4)",
35
+ "h5": "var(--lineheight-h5)",
36
+ "h6": "var(--lineheight-h6)",
37
+ "text": "var(--lineheight-text)",
38
+ "button": "var(--lineheight-button)",
39
+ "small": "var(--lineheight-small)"
40
+ };
41
+ let fontWeights = {
42
+ "h1": "var(--fontweight-h1)",
43
+ "h2": "var(--fontweight-h2)",
44
+ "h3": "var(--fontweight-h3)",
45
+ "h4": "var(--fontweight-h4)",
46
+ "h5": "var(--fontweight-h5)",
47
+ "h6": "var(--fontweight-h6)",
48
+ "text": "var(--fontweight-text)",
49
+ "button": "var(--fontweight-button)",
50
+ "small": "var(--fontweight-small)"
51
+ };
52
+ let font = {
53
+ "h1": "var(--font-h1)",
54
+ "h2": "var(--font-h2)",
55
+ "h3": "var(--font-h3)",
56
+ "h4": "var(--font-h4)",
57
+ "h5": "var(--font-h5)",
58
+ "h6": "var(--font-h6)",
59
+ "text": "var(--font-text)",
60
+ "button": "var(--font-button)",
61
+ "small": "var(--font-small)"
62
+ };
63
+ const getValue = (prop, value, _css) => {
64
+ let important;
65
+ if (typeof value === 'string') {
66
+ const split = value.split("!");
67
+ important = split[1] ? "!important" : "";
68
+ value = split[0];
69
+ }
70
+ if (['width', 'maxWidth', 'minWidth', 'max-width', 'min-width'].includes(prop)) {
71
+ return withImportant(important, breakpoints[value] || value);
72
+ }
73
+ else if (['fontFamily', 'font-family'].includes(prop) && value === 'default') {
74
+ return withImportant(important, "var(--font-family)");
75
+ }
76
+ if (prop === 'font' && typeof value === "string" && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {
77
+ return withImportant(important, font[value] || value);
78
+ }
79
+ if (['fontWeight', 'font-weight'].includes(prop) && typeof value === 'string' && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {
80
+ return withImportant(important, fontWeights[value] || value);
81
+ }
82
+ else if (['lineHeight', 'line-height'].includes(prop) && typeof value === 'string' && ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'text', 'button', 'small'].includes(value)) {
83
+ return withImportant(important, lineHeights[value] || value);
84
+ }
85
+ else if (['fontSize', 'font-size'].includes(prop) && typeof value === 'string') {
86
+ return withImportant(important, fontsizes[value] || value);
87
+ }
88
+ else if (typeof value === "number" && ["shadow", "boxShadow"].includes(prop)) {
89
+ return withImportant(important, `var(--shadow-${value})`);
90
+ }
91
+ return withImportant(important, colors[value] || value);
92
+ };export{getValue as default};//# sourceMappingURL=getValue.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"getValue.mjs","sources":["../../src/css/getValue.ts"],"sourcesContent":["import { CSSProps } from \"./types\"\n\nconst getColor = (color: string) => {\n return {\n [`${color}`]: `var(--color-${color}-primary)`,\n [`${color}.primary`]: `var(--color-${color}-primary)`,\n [`${color}.secondary`]: `var(--color-${color}-secondary)`,\n [`${color}.text`]: `var(--color-${color}-text)`,\n [`${color}.alpha`]: `var(--color-${color}-alpha)`\n }\n}\n\nconst withImportant = (important: any, value: any) => important ? value + important : value\nconst colors: any = {\n \"text\": `var(--color-text-primary)`,\n \"text.primary\": `var(--color-text-primary)`,\n \"text.secondary\": `var(--color-text-secondary)`,\n\n \"background\": `var(--color-background-primary)`,\n \"background.primary\": `var(--color-background-primary)`,\n \"background.secondary\": `var(--color-background-secondary)`,\n \"background.alpha\": `var(--color-background-alpha)`,\n \"divider\": `var(--color-divider)`,\n\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 \"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 \"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 \"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 \"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 if (['width', 'maxWidth', 'minWidth', 'max-width', 'min-width'].includes(prop)) {\n return withImportant(important, breakpoints[value] || value)\n } else if (['fontFamily', 'font-family'].includes(prop) && value === 'default') {\n return withImportant(important, \"var(--font-family)\")\n } 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 } 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.js ADDED
@@ -0,0 +1,55 @@
1
+ 'use strict';Object.defineProperty(exports,'__esModule',{value:true});var getValue=require('./getValue.js'),getProps=require('./getProps.js'),aliases=require('./aliases.js'),oncss=require('oncss');const breakpoints = {
2
+ xs: 0,
3
+ sm: 600,
4
+ md: 900,
5
+ lg: 1200,
6
+ xl: 1536
7
+ };
8
+ const css = (props, options) => {
9
+ const cssOptions = Object.assign(Object.assign({}, options), { breakpoints,
10
+ aliases, getValue: (p, v, _c, dept) => {
11
+ if (options === null || options === void 0 ? void 0 : options.getValue) {
12
+ let _val = options === null || options === void 0 ? void 0 : options.getValue(p, v, _c, dept);
13
+ if (_val)
14
+ return _val;
15
+ }
16
+ return getValue(p, v);
17
+ }, getProps: (p, v, _c, dept) => {
18
+ if (options === null || options === void 0 ? void 0 : options.getProps) {
19
+ let _p = options === null || options === void 0 ? void 0 : options.getProps(p, v, _c, dept);
20
+ if (_p)
21
+ return _p;
22
+ }
23
+ return getProps(p, v, _c);
24
+ } });
25
+ return oncss.css(props, cssOptions);
26
+ };
27
+ const adjustColor = (hex, factor) => {
28
+ hex = hex.replace(/^#/, '');
29
+ let r = parseInt(hex.slice(0, 2), 16);
30
+ let g = parseInt(hex.slice(2, 4), 16);
31
+ let b = parseInt(hex.slice(4, 6), 16);
32
+ r = Math.floor(r * factor);
33
+ g = Math.floor(g * factor);
34
+ b = Math.floor(b * factor);
35
+ r = Math.min(255, Math.max(0, r));
36
+ g = Math.min(255, Math.max(0, g));
37
+ b = Math.min(255, Math.max(0, b));
38
+ return `#${r.toString(16).padStart(2, '0')}${g.toString(16).padStart(2, '0')}${b.toString(16).padStart(2, '0')}`;
39
+ };
40
+ const adjustTextContrast = (color) => {
41
+ color = color.replace(/^#/, '');
42
+ const r = parseInt(color.slice(0, 2), 16);
43
+ const g = parseInt(color.slice(2, 4), 16);
44
+ const b = parseInt(color.slice(4, 6), 16);
45
+ const luminance = (0.299 * r + 0.587 * g + 0.114 * b) / 255;
46
+ return luminance > 0.5 ? '#111111' : '#FFFFFF';
47
+ };
48
+ const alpha = (color, opacity = 1) => {
49
+ if (typeof opacity !== 'number')
50
+ return color;
51
+ let _opacity = opacity * 100;
52
+ if (!color.startsWith("#"))
53
+ throw new Error(`color must be hex`);
54
+ return (color + (`0${Math.round((255 / 100) * _opacity).toString(16)}`.slice(-2))).toUpperCase();
55
+ };exports.getValue=getValue;exports.getProps=getProps;exports.adjustColor=adjustColor;exports.adjustTextContrast=adjustTextContrast;exports.alpha=alpha;exports.breakpoints=breakpoints;exports.css=css;//# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
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: 600,\n md: 900,\n lg: 1200,\n xl: 1536\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":"qMAWa,MAAA,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;AACxC,YAAA,IAAI,OAAO,KAAP,IAAA,IAAA,OAAO,uBAAP,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;AACxB;YACD,OAAO,QAAQ,CAAC,CAAC,EAAE,CAAK,CAAC;AAC7B,SAAC,EACD,QAAQ,EAAE,CAAC,CAAM,EAAE,CAAM,EAAE,EAAO,EAAE,IAAI,KAAI;AACxC,YAAA,IAAI,OAAO,KAAP,IAAA,IAAA,OAAO,uBAAP,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;AACpB;YACD,OAAO,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC;AAC7B,SAAC,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,CAAG,EAAA,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE;AACpH;AAEa,MAAA,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;AAEa,MAAA,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.mjs ADDED
@@ -0,0 +1,55 @@
1
+ import getValue from'./getValue.mjs';import getProps from'./getProps.mjs';import aliases from'./aliases.mjs';import {css as css$1}from'oncss';const breakpoints = {
2
+ xs: 0,
3
+ sm: 600,
4
+ md: 900,
5
+ lg: 1200,
6
+ xl: 1536
7
+ };
8
+ const css = (props, options) => {
9
+ const cssOptions = Object.assign(Object.assign({}, options), { breakpoints,
10
+ aliases, getValue: (p, v, _c, dept) => {
11
+ if (options === null || options === void 0 ? void 0 : options.getValue) {
12
+ let _val = options === null || options === void 0 ? void 0 : options.getValue(p, v, _c, dept);
13
+ if (_val)
14
+ return _val;
15
+ }
16
+ return getValue(p, v);
17
+ }, getProps: (p, v, _c, dept) => {
18
+ if (options === null || options === void 0 ? void 0 : options.getProps) {
19
+ let _p = options === null || options === void 0 ? void 0 : options.getProps(p, v, _c, dept);
20
+ if (_p)
21
+ return _p;
22
+ }
23
+ return getProps(p, v, _c);
24
+ } });
25
+ return css$1(props, cssOptions);
26
+ };
27
+ const adjustColor = (hex, factor) => {
28
+ hex = hex.replace(/^#/, '');
29
+ let r = parseInt(hex.slice(0, 2), 16);
30
+ let g = parseInt(hex.slice(2, 4), 16);
31
+ let b = parseInt(hex.slice(4, 6), 16);
32
+ r = Math.floor(r * factor);
33
+ g = Math.floor(g * factor);
34
+ b = Math.floor(b * factor);
35
+ r = Math.min(255, Math.max(0, r));
36
+ g = Math.min(255, Math.max(0, g));
37
+ b = Math.min(255, Math.max(0, b));
38
+ return `#${r.toString(16).padStart(2, '0')}${g.toString(16).padStart(2, '0')}${b.toString(16).padStart(2, '0')}`;
39
+ };
40
+ const adjustTextContrast = (color) => {
41
+ color = color.replace(/^#/, '');
42
+ const r = parseInt(color.slice(0, 2), 16);
43
+ const g = parseInt(color.slice(2, 4), 16);
44
+ const b = parseInt(color.slice(4, 6), 16);
45
+ const luminance = (0.299 * r + 0.587 * g + 0.114 * b) / 255;
46
+ return luminance > 0.5 ? '#111111' : '#FFFFFF';
47
+ };
48
+ const alpha = (color, opacity = 1) => {
49
+ if (typeof opacity !== 'number')
50
+ return color;
51
+ let _opacity = opacity * 100;
52
+ if (!color.startsWith("#"))
53
+ throw new Error(`color must be hex`);
54
+ return (color + (`0${Math.round((255 / 100) * _opacity).toString(16)}`.slice(-2))).toUpperCase();
55
+ };export{adjustColor,adjustTextContrast,alpha,breakpoints,css,getProps,getValue};//# sourceMappingURL=index.mjs.map