@tenphi/tasty 0.5.3 → 0.5.4
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/README.md +2 -2
- package/dist/debug.js +1 -1
- package/dist/debug.js.map +1 -1
- package/dist/pipeline/conditions.js +14 -8
- package/dist/pipeline/conditions.js.map +1 -1
- package/dist/pipeline/index.js +59 -40
- package/dist/pipeline/index.js.map +1 -1
- package/dist/pipeline/materialize.js +34 -98
- package/dist/pipeline/materialize.js.map +1 -1
- package/dist/pipeline/parseStateKey.js +17 -9
- package/dist/pipeline/parseStateKey.js.map +1 -1
- package/dist/pipeline/simplify.js +111 -152
- package/dist/pipeline/simplify.js.map +1 -1
- package/dist/pipeline/warnings.js +18 -0
- package/dist/pipeline/warnings.js.map +1 -0
- package/dist/styles/align.d.ts +1 -1
- package/dist/styles/align.js.map +1 -1
- package/dist/styles/border.d.ts +1 -1
- package/dist/styles/border.js.map +1 -1
- package/dist/styles/color.d.ts +2 -2
- package/dist/styles/color.js.map +1 -1
- package/dist/styles/createStyle.js +1 -1
- package/dist/styles/createStyle.js.map +1 -1
- package/dist/styles/fade.d.ts +1 -1
- package/dist/styles/fade.js.map +1 -1
- package/dist/styles/fill.d.ts +14 -16
- package/dist/styles/fill.js.map +1 -1
- package/dist/styles/flow.d.ts +3 -3
- package/dist/styles/flow.js.map +1 -1
- package/dist/styles/justify.d.ts +1 -1
- package/dist/styles/justify.js.map +1 -1
- package/dist/styles/predefined.js.map +1 -1
- package/dist/styles/radius.d.ts +1 -1
- package/dist/styles/radius.js.map +1 -1
- package/dist/styles/scrollbar.d.ts +1 -1
- package/dist/styles/scrollbar.js +19 -12
- package/dist/styles/scrollbar.js.map +1 -1
- package/dist/styles/shadow.d.ts +2 -2
- package/dist/styles/shadow.js.map +1 -1
- package/dist/styles/styledScrollbar.d.ts +1 -1
- package/dist/styles/styledScrollbar.js.map +1 -1
- package/dist/styles/transition.d.ts +1 -1
- package/dist/styles/transition.js.map +1 -1
- package/dist/utils/colors.d.ts +1 -1
- package/dist/utils/colors.js.map +1 -1
- package/dist/utils/dotize.d.ts +1 -1
- package/dist/utils/mod-attrs.js.map +1 -1
- package/dist/utils/string.js.map +1 -1
- package/dist/utils/styles.d.ts +7 -12
- package/dist/utils/styles.js +13 -8
- package/dist/utils/styles.js.map +1 -1
- package/package.json +47 -1
package/dist/styles/radius.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"radius.js","names":[],"sources":["../../src/styles/radius.ts"],"sourcesContent":["import { makeEmptyDetails } from '../parser/types';\nimport { DIRECTIONS, parseStyle } from '../utils/styles';\n\nconst PROP = 'var(--radius)';\nconst SHARP = 'var(--sharp-radius)';\n\nexport function radiusStyle({ radius }) {\n if (typeof radius === 'number') {\n radius = `${radius}px`;\n }\n\n if (!radius) return;\n\n if (radius === true) radius = '1r';\n\n const processed = parseStyle(radius);\n const { mods } = processed.groups[0] ?? makeEmptyDetails();\n let { values } = processed.groups[0] ?? makeEmptyDetails();\n\n if (mods.includes('round')) {\n values = ['9999rem'];\n } else if (mods.includes('ellipse')) {\n values = ['50%'];\n } else if (!values.length) {\n values = [PROP];\n }\n\n if (mods.includes('leaf')) {\n values = [\n values[1] || SHARP,\n values[0] || PROP,\n values[1] || SHARP,\n values[0] || PROP,\n ];\n } else if (mods.includes('backleaf')) {\n values = [\n values[0] || PROP,\n values[1] || SHARP,\n values[0] || PROP,\n values[1] || SHARP,\n ];\n } else if (mods.length) {\n const arr = ['0', '0', '0', '0'];\n\n let flag = false;\n\n DIRECTIONS.forEach((dir, i) => {\n if (!mods.includes(dir)) return;\n\n flag = true;\n\n arr[i] = values[0] || PROP;\n arr[(i + 1) % 4] = values[0] || PROP;\n });\n\n if (flag) {\n values = arr;\n }\n }\n\n return {\n 'border-radius': values.join(' '),\n };\n}\n\nradiusStyle.__lookupStyles = ['radius'];\n"],"mappings":";;;;AAGA,MAAM,OAAO;AACb,MAAM,QAAQ;AAEd,SAAgB,YAAY,
|
|
1
|
+
{"version":3,"file":"radius.js","names":[],"sources":["../../src/styles/radius.ts"],"sourcesContent":["import { makeEmptyDetails } from '../parser/types';\nimport { DIRECTIONS, parseStyle } from '../utils/styles';\n\nconst PROP = 'var(--radius)';\nconst SHARP = 'var(--sharp-radius)';\n\nexport function radiusStyle({\n radius,\n}: {\n radius?: string | number | boolean;\n}) {\n if (typeof radius === 'number') {\n radius = `${radius}px`;\n }\n\n if (!radius) return;\n\n if (radius === true) radius = '1r';\n\n const processed = parseStyle(radius);\n const { mods } = processed.groups[0] ?? makeEmptyDetails();\n let { values } = processed.groups[0] ?? makeEmptyDetails();\n\n if (mods.includes('round')) {\n values = ['9999rem'];\n } else if (mods.includes('ellipse')) {\n values = ['50%'];\n } else if (!values.length) {\n values = [PROP];\n }\n\n if (mods.includes('leaf')) {\n values = [\n values[1] || SHARP,\n values[0] || PROP,\n values[1] || SHARP,\n values[0] || PROP,\n ];\n } else if (mods.includes('backleaf')) {\n values = [\n values[0] || PROP,\n values[1] || SHARP,\n values[0] || PROP,\n values[1] || SHARP,\n ];\n } else if (mods.length) {\n const arr = ['0', '0', '0', '0'];\n\n let flag = false;\n\n DIRECTIONS.forEach((dir, i) => {\n if (!mods.includes(dir)) return;\n\n flag = true;\n\n arr[i] = values[0] || PROP;\n arr[(i + 1) % 4] = values[0] || PROP;\n });\n\n if (flag) {\n values = arr;\n }\n }\n\n return {\n 'border-radius': values.join(' '),\n };\n}\n\nradiusStyle.__lookupStyles = ['radius'];\n"],"mappings":";;;;AAGA,MAAM,OAAO;AACb,MAAM,QAAQ;AAEd,SAAgB,YAAY,EAC1B,UAGC;AACD,KAAI,OAAO,WAAW,SACpB,UAAS,GAAG,OAAO;AAGrB,KAAI,CAAC,OAAQ;AAEb,KAAI,WAAW,KAAM,UAAS;CAE9B,MAAM,YAAY,WAAW,OAAO;CACpC,MAAM,EAAE,SAAS,UAAU,OAAO,MAAM,kBAAkB;CAC1D,IAAI,EAAE,WAAW,UAAU,OAAO,MAAM,kBAAkB;AAE1D,KAAI,KAAK,SAAS,QAAQ,CACxB,UAAS,CAAC,UAAU;UACX,KAAK,SAAS,UAAU,CACjC,UAAS,CAAC,MAAM;UACP,CAAC,OAAO,OACjB,UAAS,CAAC,KAAK;AAGjB,KAAI,KAAK,SAAS,OAAO,CACvB,UAAS;EACP,OAAO,MAAM;EACb,OAAO,MAAM;EACb,OAAO,MAAM;EACb,OAAO,MAAM;EACd;UACQ,KAAK,SAAS,WAAW,CAClC,UAAS;EACP,OAAO,MAAM;EACb,OAAO,MAAM;EACb,OAAO,MAAM;EACb,OAAO,MAAM;EACd;UACQ,KAAK,QAAQ;EACtB,MAAM,MAAM;GAAC;GAAK;GAAK;GAAK;GAAI;EAEhC,IAAI,OAAO;AAEX,aAAW,SAAS,KAAK,MAAM;AAC7B,OAAI,CAAC,KAAK,SAAS,IAAI,CAAE;AAEzB,UAAO;AAEP,OAAI,KAAK,OAAO,MAAM;AACtB,QAAK,IAAI,KAAK,KAAK,OAAO,MAAM;IAChC;AAEF,MAAI,KACF,UAAS;;AAIb,QAAO,EACL,iBAAiB,OAAO,KAAK,IAAI,EAClC;;AAGH,YAAY,iBAAiB,CAAC,SAAS"}
|
|
@@ -12,7 +12,7 @@ interface ScrollbarStyleProps {
|
|
|
12
12
|
declare function scrollbarStyle({
|
|
13
13
|
scrollbar,
|
|
14
14
|
overflow
|
|
15
|
-
}: ScrollbarStyleProps):
|
|
15
|
+
}: ScrollbarStyleProps): Record<string, string | Record<string, string>> | undefined;
|
|
16
16
|
declare namespace scrollbarStyle {
|
|
17
17
|
var __lookupStyles: string[];
|
|
18
18
|
}
|
package/dist/styles/scrollbar.js
CHANGED
|
@@ -13,6 +13,11 @@ function scrollbarStyle({ scrollbar, overflow }) {
|
|
|
13
13
|
const value = scrollbar === true || scrollbar === "" ? "thin" : scrollbar;
|
|
14
14
|
const { mods, colors, values } = parseStyle(String(value)).groups[0] ?? makeEmptyDetails();
|
|
15
15
|
const style = {};
|
|
16
|
+
function getNested(key) {
|
|
17
|
+
const v = style[key];
|
|
18
|
+
if (v && typeof v === "object") return v;
|
|
19
|
+
return {};
|
|
20
|
+
}
|
|
16
21
|
const defaultThumbColor = "var(--scrollbar-thumb-color)";
|
|
17
22
|
const defaultTrackColor = "var(--scrollbar-track-color, transparent)";
|
|
18
23
|
style["scrollbar-color"] = `${defaultThumbColor} transparent`;
|
|
@@ -30,7 +35,7 @@ function scrollbarStyle({ scrollbar, overflow }) {
|
|
|
30
35
|
} else if (mods.includes("auto")) style["scrollbar-width"] = "auto";
|
|
31
36
|
if (mods.includes("stable") || mods.includes("both-edges")) style["scrollbar-gutter"] = mods.includes("both-edges") ? "stable both-edges" : "stable";
|
|
32
37
|
if (sizeValue) style["&::-webkit-scrollbar"] = {
|
|
33
|
-
...
|
|
38
|
+
...getNested("&::-webkit-scrollbar"),
|
|
34
39
|
width: sizeValue,
|
|
35
40
|
height: sizeValue
|
|
36
41
|
};
|
|
@@ -39,26 +44,28 @@ function scrollbarStyle({ scrollbar, overflow }) {
|
|
|
39
44
|
const cornerColor = colors && colors[2] ? colors[2] : trackColor;
|
|
40
45
|
if (colors && colors.length) {
|
|
41
46
|
style["scrollbar-color"] = `${thumbColor} ${trackColor}`;
|
|
42
|
-
|
|
43
|
-
|
|
47
|
+
const webkitScrollbar = getNested("&::-webkit-scrollbar");
|
|
48
|
+
webkitScrollbar["background"] = trackColor;
|
|
49
|
+
style["&::-webkit-scrollbar"] = webkitScrollbar;
|
|
44
50
|
style["&::-webkit-scrollbar-track"] = {
|
|
45
|
-
...
|
|
51
|
+
...getNested("&::-webkit-scrollbar-track"),
|
|
46
52
|
background: trackColor
|
|
47
53
|
};
|
|
48
54
|
style["&::-webkit-scrollbar-thumb"] = {
|
|
49
|
-
...
|
|
55
|
+
...getNested("&::-webkit-scrollbar-thumb"),
|
|
50
56
|
background: thumbColor
|
|
51
57
|
};
|
|
52
58
|
style["&::-webkit-scrollbar-corner"] = {
|
|
53
|
-
...
|
|
59
|
+
...getNested("&::-webkit-scrollbar-corner"),
|
|
54
60
|
background: cornerColor
|
|
55
61
|
};
|
|
56
62
|
}
|
|
57
63
|
if (mods.includes("always")) {
|
|
58
64
|
style["overflow"] = overflow || "scroll";
|
|
59
65
|
if (!style["scrollbar-gutter"]) style["scrollbar-gutter"] = "stable";
|
|
60
|
-
|
|
61
|
-
|
|
66
|
+
const alwaysScrollbar = getNested("&::-webkit-scrollbar");
|
|
67
|
+
alwaysScrollbar["display"] = "block";
|
|
68
|
+
style["&::-webkit-scrollbar"] = alwaysScrollbar;
|
|
62
69
|
}
|
|
63
70
|
if (mods.includes("styled")) {
|
|
64
71
|
const baseTransition = [
|
|
@@ -76,24 +83,24 @@ function scrollbarStyle({ scrollbar, overflow }) {
|
|
|
76
83
|
height: sizeValue,
|
|
77
84
|
transition: baseTransition,
|
|
78
85
|
background: defaultTrackColor,
|
|
79
|
-
...
|
|
86
|
+
...getNested("&::-webkit-scrollbar")
|
|
80
87
|
};
|
|
81
88
|
style["&::-webkit-scrollbar-thumb"] = {
|
|
82
89
|
"border-radius": "8px",
|
|
83
90
|
"min-height": "24px",
|
|
84
91
|
transition: baseTransition,
|
|
85
92
|
background: defaultThumbColor,
|
|
86
|
-
...
|
|
93
|
+
...getNested("&::-webkit-scrollbar-thumb")
|
|
87
94
|
};
|
|
88
95
|
style["&::-webkit-scrollbar-track"] = {
|
|
89
96
|
background: defaultTrackColor,
|
|
90
97
|
transition: baseTransition,
|
|
91
|
-
...
|
|
98
|
+
...getNested("&::-webkit-scrollbar-track")
|
|
92
99
|
};
|
|
93
100
|
style["&::-webkit-scrollbar-corner"] = {
|
|
94
101
|
background: defaultTrackColor,
|
|
95
102
|
transition: baseTransition,
|
|
96
|
-
...
|
|
103
|
+
...getNested("&::-webkit-scrollbar-corner")
|
|
97
104
|
};
|
|
98
105
|
}
|
|
99
106
|
return style;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scrollbar.js","names":[],"sources":["../../src/styles/scrollbar.ts"],"sourcesContent":["import { makeEmptyDetails } from '../parser/types';\nimport { parseStyle } from '../utils/styles';\n\ninterface ScrollbarStyleProps {\n scrollbar?: string | boolean | number;\n overflow?: string;\n}\n\n/**\n * Creates cross-browser compatible scrollbar styles\n *\n * Supports both Firefox (scrollbar-width, scrollbar-color) and\n * WebKit/Chromium browsers (::-webkit-scrollbar)\n */\nexport function scrollbarStyle({ scrollbar, overflow }: ScrollbarStyleProps) {\n // Check if scrollbar is defined\n if (!scrollbar && scrollbar !== 0) return;\n\n // Support true as alias for thin\n const value = scrollbar === true || scrollbar === '' ? 'thin' : scrollbar;\n const processed = parseStyle(String(value));\n const { mods, colors, values } = processed.groups[0] ?? makeEmptyDetails();\n const style = {};\n\n // Default colors for scrollbar\n const defaultThumbColor = 'var(--scrollbar-thumb-color)';\n const defaultTrackColor = 'var(--scrollbar-track-color, transparent)';\n\n // Setup default Firefox scrollbar style\n style['scrollbar-color'] = `${defaultThumbColor} transparent`;\n\n // Default scrollbar size\n const defaultSize = '8px';\n const sizeValue = values[0] || defaultSize;\n\n // Process modifiers\n if (mods.includes('thin')) {\n style['scrollbar-width'] = 'thin';\n } else if (mods.includes('none')) {\n style['scrollbar-width'] = 'none';\n // Remove scrollbar-color as it's not needed when scrollbar is hidden\n delete style['scrollbar-color'];\n // Also hide WebKit scrollbars\n style['&::-webkit-scrollbar'] = {\n width: '0px',\n height: '0px',\n display: 'none',\n };\n\n return style;\n } else if (mods.includes('auto')) {\n style['scrollbar-width'] = 'auto';\n }\n\n // Handle scrollbar gutter behavior\n if (mods.includes('stable') || mods.includes('both-edges')) {\n // scrollbar-gutter is supported in newer browsers only\n style['scrollbar-gutter'] = mods.includes('both-edges')\n ? 'stable both-edges'\n : 'stable';\n }\n\n // Custom size setup for WebKit\n if (sizeValue) {\n style['&::-webkit-scrollbar'] = {\n ...(
|
|
1
|
+
{"version":3,"file":"scrollbar.js","names":[],"sources":["../../src/styles/scrollbar.ts"],"sourcesContent":["import { makeEmptyDetails } from '../parser/types';\nimport { parseStyle } from '../utils/styles';\n\ninterface ScrollbarStyleProps {\n scrollbar?: string | boolean | number;\n overflow?: string;\n}\n\n/**\n * Creates cross-browser compatible scrollbar styles\n *\n * Supports both Firefox (scrollbar-width, scrollbar-color) and\n * WebKit/Chromium browsers (::-webkit-scrollbar)\n */\nexport function scrollbarStyle({ scrollbar, overflow }: ScrollbarStyleProps) {\n // Check if scrollbar is defined\n if (!scrollbar && scrollbar !== 0) return;\n\n // Support true as alias for thin\n const value = scrollbar === true || scrollbar === '' ? 'thin' : scrollbar;\n const processed = parseStyle(String(value));\n const { mods, colors, values } = processed.groups[0] ?? makeEmptyDetails();\n type NestedStyle = Record<string, string>;\n type ScrollbarStyleMap = Record<string, string | NestedStyle>;\n const style: ScrollbarStyleMap = {};\n\n function getNested(key: string): NestedStyle {\n const v = style[key];\n if (v && typeof v === 'object') return v;\n return {};\n }\n\n // Default colors for scrollbar\n const defaultThumbColor = 'var(--scrollbar-thumb-color)';\n const defaultTrackColor = 'var(--scrollbar-track-color, transparent)';\n\n // Setup default Firefox scrollbar style\n style['scrollbar-color'] = `${defaultThumbColor} transparent`;\n\n // Default scrollbar size\n const defaultSize = '8px';\n const sizeValue = values[0] || defaultSize;\n\n // Process modifiers\n if (mods.includes('thin')) {\n style['scrollbar-width'] = 'thin';\n } else if (mods.includes('none')) {\n style['scrollbar-width'] = 'none';\n // Remove scrollbar-color as it's not needed when scrollbar is hidden\n delete style['scrollbar-color'];\n // Also hide WebKit scrollbars\n style['&::-webkit-scrollbar'] = {\n width: '0px',\n height: '0px',\n display: 'none',\n };\n\n return style;\n } else if (mods.includes('auto')) {\n style['scrollbar-width'] = 'auto';\n }\n\n // Handle scrollbar gutter behavior\n if (mods.includes('stable') || mods.includes('both-edges')) {\n // scrollbar-gutter is supported in newer browsers only\n style['scrollbar-gutter'] = mods.includes('both-edges')\n ? 'stable both-edges'\n : 'stable';\n }\n\n // Custom size setup for WebKit\n if (sizeValue) {\n style['&::-webkit-scrollbar'] = {\n ...getNested('&::-webkit-scrollbar'),\n width: sizeValue,\n height: sizeValue,\n };\n }\n\n // Extract colors (support up to 3: thumb, track, corner)\n // These will be used in various places throughout the function\n const thumbColor = colors && colors[0] ? colors[0] : defaultThumbColor;\n const trackColor = colors && colors[1] ? colors[1] : defaultTrackColor;\n const cornerColor = colors && colors[2] ? colors[2] : trackColor;\n\n // Apply colors if they are specified\n if (colors && colors.length) {\n // Firefox\n style['scrollbar-color'] = `${thumbColor} ${trackColor}`;\n\n // WebKit - always set these for consistency\n const webkitScrollbar = getNested('&::-webkit-scrollbar');\n webkitScrollbar['background'] = trackColor;\n style['&::-webkit-scrollbar'] = webkitScrollbar;\n\n style['&::-webkit-scrollbar-track'] = {\n ...getNested('&::-webkit-scrollbar-track'),\n background: trackColor,\n };\n\n style['&::-webkit-scrollbar-thumb'] = {\n ...getNested('&::-webkit-scrollbar-thumb'),\n background: thumbColor,\n };\n\n style['&::-webkit-scrollbar-corner'] = {\n ...getNested('&::-webkit-scrollbar-corner'),\n background: cornerColor,\n };\n }\n\n // Handle 'always' mode: force scrollbars to show\n if (mods.includes('always')) {\n style['overflow'] = overflow || 'scroll';\n\n // Use auto for WebKit browsers since they don't support 'always'\n // This is closer to the expected behavior\n if (!style['scrollbar-gutter']) {\n style['scrollbar-gutter'] = 'stable';\n }\n\n // Ensure scrollbars appear in WebKit even with little content\n const alwaysScrollbar = getNested('&::-webkit-scrollbar');\n alwaysScrollbar['display'] = 'block';\n style['&::-webkit-scrollbar'] = alwaysScrollbar;\n }\n\n // Enhanced 'styled' mode with better transitions and appearance\n if (mods.includes('styled')) {\n const baseTransition = [\n 'background var(--transition)',\n 'border-radius var(--transition)',\n 'box-shadow var(--transition)',\n 'width var(--transition)',\n 'height var(--transition)',\n 'border var(--transition)',\n ].join(', ');\n\n // Firefox\n style['scrollbar-width'] = style['scrollbar-width'] || 'thin';\n style['scrollbar-color'] =\n style['scrollbar-color'] || `${defaultThumbColor} ${defaultTrackColor}`;\n\n // WebKit\n style['&::-webkit-scrollbar'] = {\n width: sizeValue,\n height: sizeValue,\n transition: baseTransition,\n background: defaultTrackColor,\n ...getNested('&::-webkit-scrollbar'),\n };\n\n style['&::-webkit-scrollbar-thumb'] = {\n 'border-radius': '8px',\n 'min-height': '24px',\n transition: baseTransition,\n background: defaultThumbColor,\n ...getNested('&::-webkit-scrollbar-thumb'),\n };\n\n style['&::-webkit-scrollbar-track'] = {\n background: defaultTrackColor,\n transition: baseTransition,\n ...getNested('&::-webkit-scrollbar-track'),\n };\n\n style['&::-webkit-scrollbar-corner'] = {\n background: defaultTrackColor,\n transition: baseTransition,\n ...getNested('&::-webkit-scrollbar-corner'),\n };\n }\n\n return style;\n}\n\nscrollbarStyle.__lookupStyles = ['scrollbar', 'overflow'];\n"],"mappings":";;;;;;;;;;AAcA,SAAgB,eAAe,EAAE,WAAW,YAAiC;AAE3E,KAAI,CAAC,aAAa,cAAc,EAAG;CAGnC,MAAM,QAAQ,cAAc,QAAQ,cAAc,KAAK,SAAS;CAEhE,MAAM,EAAE,MAAM,QAAQ,WADJ,WAAW,OAAO,MAAM,CAAC,CACA,OAAO,MAAM,kBAAkB;CAG1E,MAAM,QAA2B,EAAE;CAEnC,SAAS,UAAU,KAA0B;EAC3C,MAAM,IAAI,MAAM;AAChB,MAAI,KAAK,OAAO,MAAM,SAAU,QAAO;AACvC,SAAO,EAAE;;CAIX,MAAM,oBAAoB;CAC1B,MAAM,oBAAoB;AAG1B,OAAM,qBAAqB,GAAG,kBAAkB;CAIhD,MAAM,YAAY,OAAO,MADL;AAIpB,KAAI,KAAK,SAAS,OAAO,CACvB,OAAM,qBAAqB;UAClB,KAAK,SAAS,OAAO,EAAE;AAChC,QAAM,qBAAqB;AAE3B,SAAO,MAAM;AAEb,QAAM,0BAA0B;GAC9B,OAAO;GACP,QAAQ;GACR,SAAS;GACV;AAED,SAAO;YACE,KAAK,SAAS,OAAO,CAC9B,OAAM,qBAAqB;AAI7B,KAAI,KAAK,SAAS,SAAS,IAAI,KAAK,SAAS,aAAa,CAExD,OAAM,sBAAsB,KAAK,SAAS,aAAa,GACnD,sBACA;AAIN,KAAI,UACF,OAAM,0BAA0B;EAC9B,GAAG,UAAU,uBAAuB;EACpC,OAAO;EACP,QAAQ;EACT;CAKH,MAAM,aAAa,UAAU,OAAO,KAAK,OAAO,KAAK;CACrD,MAAM,aAAa,UAAU,OAAO,KAAK,OAAO,KAAK;CACrD,MAAM,cAAc,UAAU,OAAO,KAAK,OAAO,KAAK;AAGtD,KAAI,UAAU,OAAO,QAAQ;AAE3B,QAAM,qBAAqB,GAAG,WAAW,GAAG;EAG5C,MAAM,kBAAkB,UAAU,uBAAuB;AACzD,kBAAgB,gBAAgB;AAChC,QAAM,0BAA0B;AAEhC,QAAM,gCAAgC;GACpC,GAAG,UAAU,6BAA6B;GAC1C,YAAY;GACb;AAED,QAAM,gCAAgC;GACpC,GAAG,UAAU,6BAA6B;GAC1C,YAAY;GACb;AAED,QAAM,iCAAiC;GACrC,GAAG,UAAU,8BAA8B;GAC3C,YAAY;GACb;;AAIH,KAAI,KAAK,SAAS,SAAS,EAAE;AAC3B,QAAM,cAAc,YAAY;AAIhC,MAAI,CAAC,MAAM,oBACT,OAAM,sBAAsB;EAI9B,MAAM,kBAAkB,UAAU,uBAAuB;AACzD,kBAAgB,aAAa;AAC7B,QAAM,0BAA0B;;AAIlC,KAAI,KAAK,SAAS,SAAS,EAAE;EAC3B,MAAM,iBAAiB;GACrB;GACA;GACA;GACA;GACA;GACA;GACD,CAAC,KAAK,KAAK;AAGZ,QAAM,qBAAqB,MAAM,sBAAsB;AACvD,QAAM,qBACJ,MAAM,sBAAsB,GAAG,kBAAkB,GAAG;AAGtD,QAAM,0BAA0B;GAC9B,OAAO;GACP,QAAQ;GACR,YAAY;GACZ,YAAY;GACZ,GAAG,UAAU,uBAAuB;GACrC;AAED,QAAM,gCAAgC;GACpC,iBAAiB;GACjB,cAAc;GACd,YAAY;GACZ,YAAY;GACZ,GAAG,UAAU,6BAA6B;GAC3C;AAED,QAAM,gCAAgC;GACpC,YAAY;GACZ,YAAY;GACZ,GAAG,UAAU,6BAA6B;GAC3C;AAED,QAAM,iCAAiC;GACrC,YAAY;GACZ,YAAY;GACZ,GAAG,UAAU,8BAA8B;GAC5C;;AAGH,QAAO;;AAGT,eAAe,iBAAiB,CAAC,aAAa,WAAW"}
|
package/dist/styles/shadow.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shadow.js","names":[],"sources":["../../src/styles/shadow.ts"],"sourcesContent":["import { makeEmptyDetails } from '../parser/types';\nimport { parseStyle } from '../utils/styles';\n\nfunction toBoxShadow(shadow) {\n const processed = parseStyle(shadow);\n const { values, mods, colors } = processed.groups[0] ?? makeEmptyDetails();\n const mod = mods[0] || '';\n const shadowColor = (colors && colors[0]) ?? '';\n\n return [mod, ...values, shadowColor].join(' ');\n}\n\nexport function shadowStyle({ shadow }) {\n if (!shadow) return;\n\n if (shadow === true) shadow = 'var(--shadow)';\n\n return {\n 'box-shadow': shadow.split(',').map(toBoxShadow).join(','),\n };\n}\n\nshadowStyle.__lookupStyles = ['shadow'];\n"],"mappings":";;;;AAGA,SAAS,YAAY,
|
|
1
|
+
{"version":3,"file":"shadow.js","names":[],"sources":["../../src/styles/shadow.ts"],"sourcesContent":["import { makeEmptyDetails } from '../parser/types';\nimport { parseStyle } from '../utils/styles';\n\nfunction toBoxShadow(shadow: string): string {\n const processed = parseStyle(shadow);\n const { values, mods, colors } = processed.groups[0] ?? makeEmptyDetails();\n const mod = mods[0] || '';\n const shadowColor = (colors && colors[0]) ?? '';\n\n return [mod, ...values, shadowColor].join(' ');\n}\n\nexport function shadowStyle({ shadow }: { shadow?: string | boolean }) {\n if (!shadow) return;\n\n if (shadow === true) shadow = 'var(--shadow)';\n\n return {\n 'box-shadow': shadow.split(',').map(toBoxShadow).join(','),\n };\n}\n\nshadowStyle.__lookupStyles = ['shadow'];\n"],"mappings":";;;;AAGA,SAAS,YAAY,QAAwB;CAE3C,MAAM,EAAE,QAAQ,MAAM,WADJ,WAAW,OAAO,CACO,OAAO,MAAM,kBAAkB;CAC1E,MAAM,MAAM,KAAK,MAAM;CACvB,MAAM,eAAe,UAAU,OAAO,OAAO;AAE7C,QAAO;EAAC;EAAK,GAAG;EAAQ;EAAY,CAAC,KAAK,IAAI;;AAGhD,SAAgB,YAAY,EAAE,UAAyC;AACrE,KAAI,CAAC,OAAQ;AAEb,KAAI,WAAW,KAAM,UAAS;AAE9B,QAAO,EACL,cAAc,OAAO,MAAM,IAAI,CAAC,IAAI,YAAY,CAAC,KAAK,IAAI,EAC3D;;AAGH,YAAY,iBAAiB,CAAC,SAAS"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styledScrollbar.js","names":[],"sources":["../../src/styles/styledScrollbar.ts"],"sourcesContent":["/**\n * @deprecated `styledScrollbar` is deprecated. Use `scrollbar` instead.\n */\nexport function styledScrollbarStyle({
|
|
1
|
+
{"version":3,"file":"styledScrollbar.js","names":[],"sources":["../../src/styles/styledScrollbar.ts"],"sourcesContent":["/**\n * @deprecated `styledScrollbar` is deprecated. Use `scrollbar` instead.\n */\nexport function styledScrollbarStyle({\n styledScrollbar: val,\n}: {\n styledScrollbar?: string | boolean | null;\n}) {\n if (val == null) return null;\n\n if (!val) {\n return [\n {\n $: '::-webkit-scrollbar',\n display: 'none',\n },\n {\n 'scrollbar-width': 'none',\n },\n ];\n }\n\n return [\n {\n $: '::-webkit-scrollbar',\n width: 'var(--scrollbar-width)',\n height: 'var(--scrollbar-width)',\n },\n {\n $: '::-webkit-scrollbar-track',\n 'background-color': 'var(--scrollbar-bg-color)',\n },\n {\n $: '::-webkit-scrollbar-thumb',\n 'background-color': 'var(--scrollbar-thumb-color)',\n 'border-radius': 'var(--scrollbar-radius)',\n border:\n 'var(--scrollbar-outline-width) solid var(--scrollbar-outline-color)',\n 'background-clip': 'padding-box',\n },\n {\n $: '::-webkit-scrollbar-corner',\n 'background-color': 'var(--scrollbar-corner-color)',\n },\n // Breaks the scrollbar in the latest Chromium browsers\n // {\n // 'scrollbar-width': 'thin',\n // 'scrollbar-color':\n // 'var(--scrollbar-bg-color) var(--scrollbar-thumb-color)',\n // },\n ];\n}\n\nstyledScrollbarStyle.__lookupStyles = ['styledScrollbar'];\n"],"mappings":";;;;AAGA,SAAgB,qBAAqB,EACnC,iBAAiB,OAGhB;AACD,KAAI,OAAO,KAAM,QAAO;AAExB,KAAI,CAAC,IACH,QAAO,CACL;EACE,GAAG;EACH,SAAS;EACV,EACD,EACE,mBAAmB,QACpB,CACF;AAGH,QAAO;EACL;GACE,GAAG;GACH,OAAO;GACP,QAAQ;GACT;EACD;GACE,GAAG;GACH,oBAAoB;GACrB;EACD;GACE,GAAG;GACH,oBAAoB;GACpB,iBAAiB;GACjB,QACE;GACF,mBAAmB;GACpB;EACD;GACE,GAAG;GACH,oBAAoB;GACrB;EAOF;;AAGH,qBAAqB,iBAAiB,CAAC,kBAAkB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"transition.js","names":[],"sources":["../../src/styles/transition.ts"],"sourcesContent":["import { parseStyle } from '../utils/styles';\n\nconst SECOND_FILL_COLOR_PROPERTY = '--tasty-second-fill-color';\n\nconst MAP: Record<string, string[]> = {\n fade: ['mask', 'mask-composite'],\n translate: ['transform', 'translate'],\n rotate: ['transform', 'rotate'],\n scale: ['transform', 'scale'],\n fill: ['background-color', 'background-image', SECOND_FILL_COLOR_PROPERTY],\n image: [\n 'background-image',\n 'background-position',\n 'background-size',\n 'background-repeat',\n 'background-attachment',\n 'background-origin',\n 'background-clip',\n SECOND_FILL_COLOR_PROPERTY,\n ],\n background: [\n 'background-color',\n 'background-image',\n 'background-position',\n 'background-size',\n 'background-repeat',\n 'background-attachment',\n 'background-origin',\n 'background-clip',\n SECOND_FILL_COLOR_PROPERTY,\n ],\n border: [\n 'border',\n 'border-top',\n 'border-right',\n 'border-bottom',\n 'border-left',\n ],\n filter: ['filter', 'backdrop-filter'],\n radius: ['border-radius'],\n shadow: ['box-shadow'],\n outline: ['outline', 'outline-offset'],\n preset: [\n 'font-size',\n 'line-height',\n 'letter-spacing',\n 'font-weight',\n 'font-style',\n ],\n text: ['font-weight', 'text-decoration-color'],\n color: ['color'],\n opacity: ['opacity'],\n theme: [\n 'color',\n 'background-color',\n 'background-image',\n 'box-shadow',\n 'border',\n 'border-radius',\n 'outline',\n 'opacity',\n SECOND_FILL_COLOR_PROPERTY,\n ],\n width: ['max-width', 'min-width', 'width'],\n height: ['max-height', 'min-height', 'height'],\n gap: ['gap', 'margin'],\n zIndex: ['z-index'],\n inset: ['inset', 'top', 'right', 'bottom', 'left'],\n};\n\nexport const DEFAULT_TIMING = 'var(--transition)';\nconst DEFAULT_EASING = 'linear';\n\nconst EASING_KEYWORDS = new Set([\n 'ease',\n 'ease-in',\n 'ease-out',\n 'ease-in-out',\n 'linear',\n 'step-start',\n 'step-end',\n]);\n\nfunction isEasing(token: string): boolean {\n return (\n EASING_KEYWORDS.has(token) ||\n token.startsWith('cubic-bezier(') ||\n token.startsWith('steps(') ||\n token.startsWith('linear(')\n );\n}\n\nfunction getTiming(name: string): string {\n return `var(--${name}-transition, var(--transition))`;\n}\n\ntype TransitionEntry = [\n name: string,\n easing: string | undefined,\n timing: string | undefined,\n delay: string | undefined,\n];\n\nexport function transitionStyle({ transition }) {\n if (!transition) return;\n\n const processed = parseStyle(transition);\n const tokens: string[] = [];\n processed.groups.forEach((g, idx) => {\n tokens.push(...g.all);\n if (idx < processed.groups.length - 1) tokens.push(',');\n });\n\n if (tokens.length === 0) return;\n\n let tempTransition: string[] = [];\n const transitions: string[][] = [];\n\n tokens.forEach((token) => {\n if (token === ',') {\n if (tempTransition.length) {\n transitions.push(tempTransition);\n tempTransition = [];\n }\n } else {\n tempTransition.push(token);\n }\n });\n\n if (tempTransition.length) {\n transitions.push(tempTransition);\n }\n\n const map: Record<string, TransitionEntry> = {};\n\n transitions.forEach((transition) => {\n const name = transition[0];\n\n let timing: string | undefined;\n let easing: string | undefined;\n let delay: string | undefined;\n\n if (transition[1] && isEasing(transition[1])) {\n easing = transition[1];\n delay = transition[2];\n } else {\n timing = transition[1];\n easing = transition[2];\n delay = transition[3];\n }\n\n const styles = MAP[name] || [name];\n\n styles.forEach((style) => {\n map[style] = [name, easing, timing, delay];\n });\n });\n\n const result = Object.entries(map)\n .map(([style, [name, easing, timing, delay]]) => {\n let value = `${style} ${timing || getTiming(name)}`;\n if (easing || delay) {\n value += ` ${easing || DEFAULT_EASING}`;\n }\n if (delay) {\n value += ` ${delay}`;\n }\n return value;\n })\n .join(', ');\n\n return { transition: result };\n}\n\ntransitionStyle.__lookupStyles = ['transition'];\n"],"mappings":";;;AAEA,MAAM,6BAA6B;AAEnC,MAAM,MAAgC;CACpC,MAAM,CAAC,QAAQ,iBAAiB;CAChC,WAAW,CAAC,aAAa,YAAY;CACrC,QAAQ,CAAC,aAAa,SAAS;CAC/B,OAAO,CAAC,aAAa,QAAQ;CAC7B,MAAM;EAAC;EAAoB;EAAoB;EAA2B;CAC1E,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,YAAY;EACV;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,QAAQ;EACN;EACA;EACA;EACA;EACA;EACD;CACD,QAAQ,CAAC,UAAU,kBAAkB;CACrC,QAAQ,CAAC,gBAAgB;CACzB,QAAQ,CAAC,aAAa;CACtB,SAAS,CAAC,WAAW,iBAAiB;CACtC,QAAQ;EACN;EACA;EACA;EACA;EACA;EACD;CACD,MAAM,CAAC,eAAe,wBAAwB;CAC9C,OAAO,CAAC,QAAQ;CAChB,SAAS,CAAC,UAAU;CACpB,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,OAAO;EAAC;EAAa;EAAa;EAAQ;CAC1C,QAAQ;EAAC;EAAc;EAAc;EAAS;CAC9C,KAAK,CAAC,OAAO,SAAS;CACtB,QAAQ,CAAC,UAAU;CACnB,OAAO;EAAC;EAAS;EAAO;EAAS;EAAU;EAAO;CACnD;AAGD,MAAM,iBAAiB;AAEvB,MAAM,kBAAkB,IAAI,IAAI;CAC9B;CACA;CACA;CACA;CACA;CACA;CACA;CACD,CAAC;AAEF,SAAS,SAAS,OAAwB;AACxC,QACE,gBAAgB,IAAI,MAAM,IAC1B,MAAM,WAAW,gBAAgB,IACjC,MAAM,WAAW,SAAS,IAC1B,MAAM,WAAW,UAAU;;AAI/B,SAAS,UAAU,MAAsB;AACvC,QAAO,SAAS,KAAK;;AAUvB,SAAgB,gBAAgB,EAAE,
|
|
1
|
+
{"version":3,"file":"transition.js","names":[],"sources":["../../src/styles/transition.ts"],"sourcesContent":["import { parseStyle } from '../utils/styles';\n\nconst SECOND_FILL_COLOR_PROPERTY = '--tasty-second-fill-color';\n\nconst MAP: Record<string, string[]> = {\n fade: ['mask', 'mask-composite'],\n translate: ['transform', 'translate'],\n rotate: ['transform', 'rotate'],\n scale: ['transform', 'scale'],\n fill: ['background-color', 'background-image', SECOND_FILL_COLOR_PROPERTY],\n image: [\n 'background-image',\n 'background-position',\n 'background-size',\n 'background-repeat',\n 'background-attachment',\n 'background-origin',\n 'background-clip',\n SECOND_FILL_COLOR_PROPERTY,\n ],\n background: [\n 'background-color',\n 'background-image',\n 'background-position',\n 'background-size',\n 'background-repeat',\n 'background-attachment',\n 'background-origin',\n 'background-clip',\n SECOND_FILL_COLOR_PROPERTY,\n ],\n border: [\n 'border',\n 'border-top',\n 'border-right',\n 'border-bottom',\n 'border-left',\n ],\n filter: ['filter', 'backdrop-filter'],\n radius: ['border-radius'],\n shadow: ['box-shadow'],\n outline: ['outline', 'outline-offset'],\n preset: [\n 'font-size',\n 'line-height',\n 'letter-spacing',\n 'font-weight',\n 'font-style',\n ],\n text: ['font-weight', 'text-decoration-color'],\n color: ['color'],\n opacity: ['opacity'],\n theme: [\n 'color',\n 'background-color',\n 'background-image',\n 'box-shadow',\n 'border',\n 'border-radius',\n 'outline',\n 'opacity',\n SECOND_FILL_COLOR_PROPERTY,\n ],\n width: ['max-width', 'min-width', 'width'],\n height: ['max-height', 'min-height', 'height'],\n gap: ['gap', 'margin'],\n zIndex: ['z-index'],\n inset: ['inset', 'top', 'right', 'bottom', 'left'],\n};\n\nexport const DEFAULT_TIMING = 'var(--transition)';\nconst DEFAULT_EASING = 'linear';\n\nconst EASING_KEYWORDS = new Set([\n 'ease',\n 'ease-in',\n 'ease-out',\n 'ease-in-out',\n 'linear',\n 'step-start',\n 'step-end',\n]);\n\nfunction isEasing(token: string): boolean {\n return (\n EASING_KEYWORDS.has(token) ||\n token.startsWith('cubic-bezier(') ||\n token.startsWith('steps(') ||\n token.startsWith('linear(')\n );\n}\n\nfunction getTiming(name: string): string {\n return `var(--${name}-transition, var(--transition))`;\n}\n\ntype TransitionEntry = [\n name: string,\n easing: string | undefined,\n timing: string | undefined,\n delay: string | undefined,\n];\n\nexport function transitionStyle({ transition }: { transition?: string }) {\n if (!transition) return;\n\n const processed = parseStyle(transition);\n const tokens: string[] = [];\n processed.groups.forEach((g, idx) => {\n tokens.push(...g.all);\n if (idx < processed.groups.length - 1) tokens.push(',');\n });\n\n if (tokens.length === 0) return;\n\n let tempTransition: string[] = [];\n const transitions: string[][] = [];\n\n tokens.forEach((token) => {\n if (token === ',') {\n if (tempTransition.length) {\n transitions.push(tempTransition);\n tempTransition = [];\n }\n } else {\n tempTransition.push(token);\n }\n });\n\n if (tempTransition.length) {\n transitions.push(tempTransition);\n }\n\n const map: Record<string, TransitionEntry> = {};\n\n transitions.forEach((transition) => {\n const name = transition[0];\n\n let timing: string | undefined;\n let easing: string | undefined;\n let delay: string | undefined;\n\n if (transition[1] && isEasing(transition[1])) {\n easing = transition[1];\n delay = transition[2];\n } else {\n timing = transition[1];\n easing = transition[2];\n delay = transition[3];\n }\n\n const styles = MAP[name] || [name];\n\n styles.forEach((style) => {\n map[style] = [name, easing, timing, delay];\n });\n });\n\n const result = Object.entries(map)\n .map(([style, [name, easing, timing, delay]]) => {\n let value = `${style} ${timing || getTiming(name)}`;\n if (easing || delay) {\n value += ` ${easing || DEFAULT_EASING}`;\n }\n if (delay) {\n value += ` ${delay}`;\n }\n return value;\n })\n .join(', ');\n\n return { transition: result };\n}\n\ntransitionStyle.__lookupStyles = ['transition'];\n"],"mappings":"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"}
|
package/dist/utils/colors.d.ts
CHANGED
package/dist/utils/colors.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"colors.js","names":[],"sources":["../../src/utils/colors.ts"],"sourcesContent":["export function color(name, opacity = 1) {\n if (opacity !== 1) {\n return `rgb(var(--${name}-color-rgb) / ${opacity})`;\n }\n\n return `var(--${name}-color)`;\n}\n"],"mappings":";AAAA,SAAgB,MAAM,
|
|
1
|
+
{"version":3,"file":"colors.js","names":[],"sources":["../../src/utils/colors.ts"],"sourcesContent":["export function color(name: string, opacity = 1) {\n if (opacity !== 1) {\n return `rgb(var(--${name}-color-rgb) / ${opacity})`;\n }\n\n return `var(--${name}-color)`;\n}\n"],"mappings":";AAAA,SAAgB,MAAM,MAAc,UAAU,GAAG;AAC/C,KAAI,YAAY,EACd,QAAO,aAAa,KAAK,gBAAgB,QAAQ;AAGnD,QAAO,SAAS,KAAK"}
|
package/dist/utils/dotize.d.ts
CHANGED
|
@@ -7,7 +7,7 @@ declare const dotize: {
|
|
|
7
7
|
array: string;
|
|
8
8
|
};
|
|
9
9
|
getValType: (val: any) => string | undefined;
|
|
10
|
-
getPathType: (arrPath: any) =>
|
|
10
|
+
getPathType: (arrPath: any) => string[];
|
|
11
11
|
isUndefined: (obj: any) => obj is undefined;
|
|
12
12
|
isNumber: (f: any) => boolean;
|
|
13
13
|
isEmptyObj: (obj: any) => boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mod-attrs.js","names":[],"sources":["../../src/utils/mod-attrs.ts"],"sourcesContent":["/**\n * Generate data DOM attributes from modifier map.\n */\nimport type { AllBaseProps } from '../types';\n\nimport { cacheWrapper } from './cache-wrapper';\nimport { camelToKebab } from './case-converter';\n\nfunction modAttrs(map: AllBaseProps['mods']): Record<string, string> | null {\n return map\n ? Object.keys(map).reduce((attrs, key) => {\n
|
|
1
|
+
{"version":3,"file":"mod-attrs.js","names":[],"sources":["../../src/utils/mod-attrs.ts"],"sourcesContent":["/**\n * Generate data DOM attributes from modifier map.\n */\nimport type { AllBaseProps } from '../types';\n\nimport { cacheWrapper } from './cache-wrapper';\nimport { camelToKebab } from './case-converter';\n\nfunction modAttrs(map: AllBaseProps['mods']): Record<string, string> | null {\n return map\n ? Object.keys(map).reduce(\n (attrs, key) => {\n const value = map[key];\n\n // Skip null, undefined, false\n if (value == null || value === false) {\n return attrs;\n }\n\n const attrName = `data-${camelToKebab(key)}`;\n\n if (value === true) {\n // Boolean true: data-{name}=\"\"\n attrs[attrName] = '';\n } else if (typeof value === 'string') {\n // String value: data-{name}=\"value\"\n attrs[attrName] = value;\n } else if (typeof value === 'number') {\n // Number: convert to string\n attrs[attrName] = String(value);\n } else {\n // Reject other types (objects, arrays, functions)\n if (process.env.NODE_ENV !== 'production') {\n console.warn(\n `CubeUIKit: Invalid mod value for \"${key}\". Expected boolean, string, or number, got ${typeof value}`,\n );\n }\n }\n\n return attrs;\n },\n {} as Record<string, string>,\n )\n : null;\n}\n\nconst _modAttrs = cacheWrapper(modAttrs);\n\nexport { _modAttrs as modAttrs };\n"],"mappings":";;;;AAQA,SAAS,SAAS,KAA0D;AAC1E,QAAO,MACH,OAAO,KAAK,IAAI,CAAC,QACd,OAAO,QAAQ;EACd,MAAM,QAAQ,IAAI;AAGlB,MAAI,SAAS,QAAQ,UAAU,MAC7B,QAAO;EAGT,MAAM,WAAW,QAAQ,aAAa,IAAI;AAE1C,MAAI,UAAU,KAEZ,OAAM,YAAY;WACT,OAAO,UAAU,SAE1B,OAAM,YAAY;WACT,OAAO,UAAU,SAE1B,OAAM,YAAY,OAAO,MAAM;MAI7B,SAAQ,KACN,qCAAqC,IAAI,8CAA8C,OAAO,QAC/F;AAIL,SAAO;IAET,EAAE,CACH,GACD;;AAGN,MAAM,YAAY,aAAa,SAAS"}
|
package/dist/utils/string.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"string.js","names":[],"sources":["../../src/utils/string.ts"],"sourcesContent":["export function toSnakeCase(str) {\n return str.replace(/[A-Z]/g, (s) => `-${s.toLowerCase()}`);\n}\n"],"mappings":";AAAA,SAAgB,YAAY,
|
|
1
|
+
{"version":3,"file":"string.js","names":[],"sources":["../../src/utils/string.ts"],"sourcesContent":["export function toSnakeCase(str: string): string {\n return str.replace(/[A-Z]/g, (s) => `-${s.toLowerCase()}`);\n}\n"],"mappings":";AAAA,SAAgB,YAAY,KAAqB;AAC/C,QAAO,IAAI,QAAQ,WAAW,MAAM,IAAI,EAAE,aAAa,GAAG"}
|
package/dist/utils/styles.d.ts
CHANGED
|
@@ -71,7 +71,7 @@ declare const CUSTOM_UNITS: {
|
|
|
71
71
|
x: string;
|
|
72
72
|
fs: string;
|
|
73
73
|
lh: string;
|
|
74
|
-
sf: (num:
|
|
74
|
+
sf: (num: number) => string;
|
|
75
75
|
};
|
|
76
76
|
declare const DIRECTIONS: string[];
|
|
77
77
|
declare function getModSelector(modName: string): string;
|
|
@@ -117,7 +117,7 @@ declare function parseStyle(value: StyleValue): ProcessedStyle;
|
|
|
117
117
|
* Optimized to avoid heavy parseStyle calls for simple color patterns.
|
|
118
118
|
*/
|
|
119
119
|
declare function parseColor(val: string, ignoreError?: boolean): ParsedColor;
|
|
120
|
-
declare function strToRgb(color:
|
|
120
|
+
declare function strToRgb(color: string, _ignoreAlpha?: boolean): string | null | undefined;
|
|
121
121
|
/**
|
|
122
122
|
* Extract RGB values from an rgb()/rgba() string.
|
|
123
123
|
* Supports all modern CSS syntax variations:
|
|
@@ -130,9 +130,9 @@ declare function strToRgb(color: any, _ignoreAlpha?: boolean): any;
|
|
|
130
130
|
* Returns array of RGB values (0-255 range), converting percentages as needed.
|
|
131
131
|
*/
|
|
132
132
|
declare function getRgbValuesFromRgbaString(str: string): number[];
|
|
133
|
-
declare function hexToRgb(hex:
|
|
134
|
-
declare function filterMods(mods:
|
|
135
|
-
declare function extendStyles(defaultStyles
|
|
133
|
+
declare function hexToRgb(hex: string): string | null;
|
|
134
|
+
declare function filterMods(mods: string[], allowedMods: string[]): string[];
|
|
135
|
+
declare function extendStyles(defaultStyles?: Record<string, unknown> | null, newStyles?: Record<string, unknown> | null): Record<string, unknown>;
|
|
136
136
|
/**
|
|
137
137
|
* Split properties into style and non-style properties.
|
|
138
138
|
* @param props - Component prop map.
|
|
@@ -167,16 +167,11 @@ declare function styleStateMapToStyleStateDataList(styleStateMap: StyleStateMap
|
|
|
167
167
|
mods: string[];
|
|
168
168
|
hasAdvancedStates: boolean;
|
|
169
169
|
};
|
|
170
|
-
declare const COMPUTE_FUNC_MAP:
|
|
171
|
-
'!': (a: any) => boolean;
|
|
172
|
-
'^': (a: any, b: any) => any;
|
|
173
|
-
'|': (a: any, b: any) => any;
|
|
174
|
-
'&': (a: any, b: any) => any;
|
|
175
|
-
};
|
|
170
|
+
declare const COMPUTE_FUNC_MAP: Record<string, (a: unknown, b?: unknown) => unknown>;
|
|
176
171
|
/**
|
|
177
172
|
* Compute a result based on a model and incoming map.
|
|
178
173
|
*/
|
|
179
|
-
declare function computeState(computeModel: ComputeModel, valueMap: (number | boolean)[] | Record<string, boolean> | ((...args: unknown[]) => unknown)):
|
|
174
|
+
declare function computeState(computeModel: ComputeModel, valueMap: (number | boolean)[] | Record<string, boolean> | ((...args: unknown[]) => unknown)): unknown;
|
|
180
175
|
declare function stringifyStyles(styles: unknown): string;
|
|
181
176
|
//#endregion
|
|
182
177
|
export { COMPUTE_FUNC_MAP, CSSMap, CUSTOM_UNITS, ComputeModel, DIRECTIONS, ParsedColor, RawStyleHandler, STATE_OPERATORS, STATE_OPERATOR_LIST, StyleHandler, StyleHandlerDefinition, StyleHandlerResult, StyleMap, StylePropValue, StyleStateData, StyleStateDataList, StyleStateDataListMap, StyleStateMap, StyleValue, StyleValueStateMap, buildAtRuleContext, computeState, customFunc, extendStyles, extractStyles, filterMods, getGlobalFuncs, getGlobalParser, getGlobalPredefinedTokens, getModSelector, getRgbValuesFromRgbaString, hexToRgb, isAdvancedStateToken, normalizeColorTokenValue, parseColor, parseStateNotation, parseStyle, resetGlobalPredefinedTokens, setGlobalPredefinedTokens, strToRgb, stringifyStyles, styleStateMapToStyleStateDataList };
|
package/dist/utils/styles.js
CHANGED
|
@@ -230,7 +230,9 @@ function getRgbValuesFromRgbaString(str) {
|
|
|
230
230
|
});
|
|
231
231
|
}
|
|
232
232
|
function hexToRgb(hex) {
|
|
233
|
-
const
|
|
233
|
+
const matched = hex.replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i, (_m, r, g, b) => "#" + r + r + g + g + b + b).substring(1).match(/.{2}/g);
|
|
234
|
+
if (!matched) return null;
|
|
235
|
+
const rgba = matched.map((x, i) => parseInt(x, 16) * (i === 3 ? 1 / 255 : 1));
|
|
234
236
|
if (rgba.some((v) => Number.isNaN(v))) return null;
|
|
235
237
|
if (rgba.length >= 3) return `rgb(${rgba.slice(0, 3).join(" ")}${rgba.length > 3 ? ` / ${rgba[3]}` : ""})`;
|
|
236
238
|
return null;
|
|
@@ -536,28 +538,30 @@ const COMPUTE_FUNC_MAP = {
|
|
|
536
538
|
*/
|
|
537
539
|
function computeState(computeModel, valueMap) {
|
|
538
540
|
if (!computeModel) return true;
|
|
541
|
+
const map = valueMap;
|
|
539
542
|
if (!Array.isArray(computeModel)) if (typeof valueMap === "function") return !!valueMap(computeModel);
|
|
540
|
-
else return !!
|
|
543
|
+
else return !!map[computeModel];
|
|
541
544
|
const func = COMPUTE_FUNC_MAP[computeModel[0]];
|
|
542
545
|
if (!func) console.warn("CubeUIKit: unexpected compute method in the model", computeModel);
|
|
543
546
|
let a = computeModel[1];
|
|
544
547
|
if (typeof a === "object") a = !!computeState(a, valueMap);
|
|
545
548
|
else if (typeof valueMap === "function") a = !!valueMap(a);
|
|
546
|
-
else a = !!
|
|
549
|
+
else a = !!map[a];
|
|
547
550
|
if (computeModel.length === 2) return func(a);
|
|
548
551
|
let b = computeModel[2];
|
|
549
552
|
if (typeof b === "object") b = !!computeState(b, valueMap);
|
|
550
553
|
else if (typeof valueMap === "function") b = !!valueMap(b);
|
|
551
|
-
else b = !!
|
|
554
|
+
else b = !!map[b];
|
|
552
555
|
return !!func(a, b);
|
|
553
556
|
}
|
|
554
557
|
const _innerCache = /* @__PURE__ */ new WeakMap();
|
|
555
558
|
function stringifyStyles(styles) {
|
|
556
559
|
if (styles == null || typeof styles !== "object") return "";
|
|
557
|
-
const
|
|
560
|
+
const obj = styles;
|
|
561
|
+
const keys = Object.keys(obj).sort();
|
|
558
562
|
const parts = [];
|
|
559
563
|
for (const k of keys) {
|
|
560
|
-
const v =
|
|
564
|
+
const v = obj[k];
|
|
561
565
|
if (v === void 0 || typeof v === "function" || typeof v === "symbol") continue;
|
|
562
566
|
const c0 = k.charCodeAt(0);
|
|
563
567
|
const needsInnerSort = (c0 >= 65 && c0 <= 90 || c0 === 38) && v && typeof v === "object" && !Array.isArray(v);
|
|
@@ -565,10 +569,11 @@ function stringifyStyles(styles) {
|
|
|
565
569
|
if (needsInnerSort) {
|
|
566
570
|
sv = _innerCache.get(v);
|
|
567
571
|
if (sv === void 0) {
|
|
568
|
-
const
|
|
572
|
+
const innerObj = v;
|
|
573
|
+
const innerKeys = Object.keys(innerObj).sort();
|
|
569
574
|
const innerParts = [];
|
|
570
575
|
for (const ik of innerKeys) {
|
|
571
|
-
const ivs = JSON.stringify(
|
|
576
|
+
const ivs = JSON.stringify(innerObj[ik]);
|
|
572
577
|
if (ivs !== void 0) innerParts.push(JSON.stringify(ik) + ":" + ivs);
|
|
573
578
|
}
|
|
574
579
|
sv = "{" + innerParts.join(",") + "}";
|