@tenphi/tasty 0.1.0 → 0.1.3
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 +27 -2
- package/dist/_virtual/_rolldown/runtime.js +8 -0
- package/dist/chunks/renderChunk.js.map +1 -1
- package/dist/config.js.map +1 -1
- package/dist/debug.js.map +1 -1
- package/dist/hooks/useKeyframes.js.map +1 -1
- package/dist/hooks/useRawCSS.js.map +1 -1
- package/dist/injector/injector.js.map +1 -1
- package/dist/injector/sheet-manager.js.map +1 -1
- package/dist/parser/index.d.ts +3 -0
- package/dist/parser/index.js +4 -0
- package/dist/parser/parser.js.map +1 -1
- package/dist/parser/types.d.ts +6 -1
- package/dist/pipeline/conditions.js.map +1 -1
- package/dist/pipeline/exclusive.js.map +1 -1
- package/dist/pipeline/index.js.map +1 -1
- package/dist/pipeline/materialize.js.map +1 -1
- package/dist/pipeline/parseStateKey.js.map +1 -1
- package/dist/pipeline/simplify.js.map +1 -1
- package/dist/styles/dimension.js.map +1 -1
- package/dist/styles/predefined.js.map +1 -1
- package/dist/styles/radius.js.map +1 -1
- package/dist/styles/scrollbar.js.map +1 -1
- package/dist/styles/shadow.js.map +1 -1
- package/dist/tasty.d.ts +8 -8
- package/dist/tasty.js.map +1 -1
- package/dist/utils/resolve-recipes.js.map +1 -1
- package/dist/utils/styles.js.map +1 -1
- package/dist/zero/{babel.d.mts → babel.d.ts} +6 -6
- package/dist/zero/{babel.mjs → babel.js} +6 -6
- package/dist/zero/babel.js.map +1 -0
- package/dist/{css-writer.d.mts → zero/css-writer.d.ts} +1 -1
- package/dist/{css-writer.mjs → zero/css-writer.js} +1 -1
- package/dist/zero/css-writer.js.map +1 -0
- package/dist/{extractor.d.mts → zero/extractor.d.ts} +3 -2
- package/dist/{extractor.mjs → zero/extractor.js} +6 -6
- package/dist/zero/extractor.js.map +1 -0
- package/dist/zero/index.d.ts +3 -0
- package/dist/zero/{index.mjs → index.js} +2 -2
- package/dist/zero/{next.d.mts → next.d.ts} +1 -1
- package/dist/zero/{next.mjs → next.js} +2 -2
- package/dist/zero/next.js.map +1 -0
- package/package.json +22 -23
- package/dist/_virtual/_rolldown/runtime.mjs +0 -7
- package/dist/chunks/cacheKey.mjs +0 -70
- package/dist/chunks/cacheKey.mjs.map +0 -1
- package/dist/chunks/definitions.mjs +0 -260
- package/dist/chunks/definitions.mjs.map +0 -1
- package/dist/chunks/renderChunk.mjs +0 -61
- package/dist/chunks/renderChunk.mjs.map +0 -1
- package/dist/config.mjs +0 -231
- package/dist/config.mjs.map +0 -1
- package/dist/css-writer.mjs.map +0 -1
- package/dist/extractor.mjs.map +0 -1
- package/dist/injector/injector.mjs +0 -404
- package/dist/injector/injector.mjs.map +0 -1
- package/dist/injector/sheet-manager.mjs +0 -714
- package/dist/injector/sheet-manager.mjs.map +0 -1
- package/dist/injector/types.d.mts +0 -18
- package/dist/keyframes/index.mjs +0 -156
- package/dist/keyframes/index.mjs.map +0 -1
- package/dist/parser/classify.mjs +0 -319
- package/dist/parser/classify.mjs.map +0 -1
- package/dist/parser/const.mjs +0 -33
- package/dist/parser/const.mjs.map +0 -1
- package/dist/parser/lru.mjs +0 -109
- package/dist/parser/lru.mjs.map +0 -1
- package/dist/parser/parser.mjs +0 -116
- package/dist/parser/parser.mjs.map +0 -1
- package/dist/parser/tokenizer.mjs +0 -69
- package/dist/parser/tokenizer.mjs.map +0 -1
- package/dist/parser/types.d.mts +0 -37
- package/dist/parser/types.mjs +0 -46
- package/dist/parser/types.mjs.map +0 -1
- package/dist/pipeline/conditions.mjs +0 -377
- package/dist/pipeline/conditions.mjs.map +0 -1
- package/dist/pipeline/exclusive.mjs +0 -231
- package/dist/pipeline/exclusive.mjs.map +0 -1
- package/dist/pipeline/index.mjs +0 -635
- package/dist/pipeline/index.mjs.map +0 -1
- package/dist/pipeline/materialize.mjs +0 -821
- package/dist/pipeline/materialize.mjs.map +0 -1
- package/dist/pipeline/parseStateKey.mjs +0 -418
- package/dist/pipeline/parseStateKey.mjs.map +0 -1
- package/dist/pipeline/simplify.mjs +0 -557
- package/dist/pipeline/simplify.mjs.map +0 -1
- package/dist/plugins/okhsl-plugin.mjs +0 -345
- package/dist/plugins/okhsl-plugin.mjs.map +0 -1
- package/dist/plugins/types.d.mts +0 -49
- package/dist/properties/index.mjs +0 -141
- package/dist/properties/index.mjs.map +0 -1
- package/dist/states/index.mjs +0 -161
- package/dist/states/index.mjs.map +0 -1
- package/dist/styles/align.mjs +0 -14
- package/dist/styles/align.mjs.map +0 -1
- package/dist/styles/border.mjs +0 -114
- package/dist/styles/border.mjs.map +0 -1
- package/dist/styles/color.mjs +0 -23
- package/dist/styles/color.mjs.map +0 -1
- package/dist/styles/createStyle.mjs +0 -77
- package/dist/styles/createStyle.mjs.map +0 -1
- package/dist/styles/dimension.mjs +0 -97
- package/dist/styles/dimension.mjs.map +0 -1
- package/dist/styles/display.mjs +0 -67
- package/dist/styles/display.mjs.map +0 -1
- package/dist/styles/fade.mjs +0 -58
- package/dist/styles/fade.mjs.map +0 -1
- package/dist/styles/fill.mjs +0 -51
- package/dist/styles/fill.mjs.map +0 -1
- package/dist/styles/flow.mjs +0 -12
- package/dist/styles/flow.mjs.map +0 -1
- package/dist/styles/gap.mjs +0 -37
- package/dist/styles/gap.mjs.map +0 -1
- package/dist/styles/height.mjs +0 -20
- package/dist/styles/height.mjs.map +0 -1
- package/dist/styles/index.mjs +0 -9
- package/dist/styles/index.mjs.map +0 -1
- package/dist/styles/inset.mjs +0 -142
- package/dist/styles/inset.mjs.map +0 -1
- package/dist/styles/justify.mjs +0 -14
- package/dist/styles/justify.mjs.map +0 -1
- package/dist/styles/margin.mjs +0 -96
- package/dist/styles/margin.mjs.map +0 -1
- package/dist/styles/outline.mjs +0 -65
- package/dist/styles/outline.mjs.map +0 -1
- package/dist/styles/padding.mjs +0 -96
- package/dist/styles/padding.mjs.map +0 -1
- package/dist/styles/predefined.mjs +0 -232
- package/dist/styles/predefined.mjs.map +0 -1
- package/dist/styles/preset.mjs +0 -126
- package/dist/styles/preset.mjs.map +0 -1
- package/dist/styles/radius.mjs +0 -51
- package/dist/styles/radius.mjs.map +0 -1
- package/dist/styles/scrollbar.mjs +0 -105
- package/dist/styles/scrollbar.mjs.map +0 -1
- package/dist/styles/shadow.mjs +0 -24
- package/dist/styles/shadow.mjs.map +0 -1
- package/dist/styles/styledScrollbar.mjs +0 -38
- package/dist/styles/styledScrollbar.mjs.map +0 -1
- package/dist/styles/transition.mjs +0 -138
- package/dist/styles/transition.mjs.map +0 -1
- package/dist/styles/types.d.mts +0 -492
- package/dist/styles/width.mjs +0 -20
- package/dist/styles/width.mjs.map +0 -1
- package/dist/utils/cache-wrapper.mjs +0 -26
- package/dist/utils/cache-wrapper.mjs.map +0 -1
- package/dist/utils/case-converter.mjs +0 -8
- package/dist/utils/case-converter.mjs.map +0 -1
- package/dist/utils/hsl-to-rgb.mjs +0 -38
- package/dist/utils/hsl-to-rgb.mjs.map +0 -1
- package/dist/utils/is-dev-env.mjs +0 -19
- package/dist/utils/is-dev-env.mjs.map +0 -1
- package/dist/utils/merge-styles.mjs +0 -146
- package/dist/utils/merge-styles.mjs.map +0 -1
- package/dist/utils/okhsl-to-rgb.mjs +0 -296
- package/dist/utils/okhsl-to-rgb.mjs.map +0 -1
- package/dist/utils/process-tokens.mjs +0 -28
- package/dist/utils/process-tokens.mjs.map +0 -1
- package/dist/utils/resolve-recipes.mjs +0 -143
- package/dist/utils/resolve-recipes.mjs.map +0 -1
- package/dist/utils/string.mjs +0 -8
- package/dist/utils/string.mjs.map +0 -1
- package/dist/utils/styles.d.mts +0 -18
- package/dist/utils/styles.mjs +0 -346
- package/dist/utils/styles.mjs.map +0 -1
- package/dist/zero/babel.mjs.map +0 -1
- package/dist/zero/index.d.mts +0 -3
- package/dist/zero/next.mjs.map +0 -1
package/dist/styles/display.mjs
DELETED
|
@@ -1,67 +0,0 @@
|
|
|
1
|
-
import { parseStyle } from "../utils/styles.mjs";
|
|
2
|
-
|
|
3
|
-
//#region src/styles/display.ts
|
|
4
|
-
/**
|
|
5
|
-
* Handles display, hide, textOverflow, overflow, and whiteSpace styles.
|
|
6
|
-
*
|
|
7
|
-
* textOverflow syntax:
|
|
8
|
-
* - `textOverflow="ellipsis"` - single-line truncation with ellipsis
|
|
9
|
-
* - `textOverflow="ellipsis / 3"` - multi-line clamping (3 lines) with ellipsis
|
|
10
|
-
* - `textOverflow="clip"` - single-line truncation with clip (no ellipsis)
|
|
11
|
-
* - `textOverflow="clip / 2"` - multi-line clip (2 lines)
|
|
12
|
-
* - `textOverflow={true}` or `textOverflow="initial"` - reset to initial
|
|
13
|
-
*
|
|
14
|
-
* Priority:
|
|
15
|
-
* 1. `hide` takes precedence (display: none)
|
|
16
|
-
* 2. Multi-line `textOverflow` forces display: -webkit-box
|
|
17
|
-
* 3. Single-line `textOverflow` defaults white-space to nowrap, multi-line defaults to initial
|
|
18
|
-
* 4. Explicit `whiteSpace` overrides the default white-space from `textOverflow`
|
|
19
|
-
*/
|
|
20
|
-
function displayStyle({ display, hide, textOverflow, overflow, whiteSpace }) {
|
|
21
|
-
const result = {};
|
|
22
|
-
if (textOverflow != null && textOverflow !== false) if (textOverflow === true || textOverflow === "initial") result["text-overflow"] = "initial";
|
|
23
|
-
else {
|
|
24
|
-
const group = parseStyle(String(textOverflow)).groups[0];
|
|
25
|
-
if (group) {
|
|
26
|
-
const { parts } = group;
|
|
27
|
-
const modePart = parts[0];
|
|
28
|
-
const clampPart = parts[1];
|
|
29
|
-
const hasEllipsis = modePart?.mods.includes("ellipsis");
|
|
30
|
-
const hasClip = modePart?.mods.includes("clip");
|
|
31
|
-
let clamp = 1;
|
|
32
|
-
if (clampPart?.values[0]) {
|
|
33
|
-
const parsed = parseInt(clampPart.values[0], 10);
|
|
34
|
-
if (!isNaN(parsed) && parsed > 0) clamp = parsed;
|
|
35
|
-
}
|
|
36
|
-
if (hasEllipsis || hasClip) {
|
|
37
|
-
result["overflow"] = "hidden";
|
|
38
|
-
result["text-overflow"] = hasEllipsis ? "ellipsis" : "clip";
|
|
39
|
-
if (clamp === 1) result["white-space"] = whiteSpace || "nowrap";
|
|
40
|
-
else {
|
|
41
|
-
result["display"] = "-webkit-box";
|
|
42
|
-
result["-webkit-box-orient"] = "vertical";
|
|
43
|
-
result["-webkit-line-clamp"] = clamp;
|
|
44
|
-
result["line-clamp"] = clamp;
|
|
45
|
-
result["white-space"] = whiteSpace || "initial";
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
if (overflow && !result["overflow"]) result["overflow"] = overflow;
|
|
51
|
-
if (whiteSpace && !result["white-space"]) result["white-space"] = whiteSpace;
|
|
52
|
-
if (hide) result["display"] = "none";
|
|
53
|
-
else if (!result["display"] && display) result["display"] = display;
|
|
54
|
-
if (Object.keys(result).length === 0) return;
|
|
55
|
-
return result;
|
|
56
|
-
}
|
|
57
|
-
displayStyle.__lookupStyles = [
|
|
58
|
-
"display",
|
|
59
|
-
"hide",
|
|
60
|
-
"textOverflow",
|
|
61
|
-
"overflow",
|
|
62
|
-
"whiteSpace"
|
|
63
|
-
];
|
|
64
|
-
|
|
65
|
-
//#endregion
|
|
66
|
-
export { displayStyle };
|
|
67
|
-
//# sourceMappingURL=display.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"display.mjs","names":[],"sources":["../../src/styles/display.ts"],"sourcesContent":["import { parseStyle } from '../utils/styles';\n\ninterface DisplayStyleProps {\n display?: string;\n hide?: boolean;\n textOverflow?: string | boolean;\n overflow?: string;\n whiteSpace?: string;\n}\n\n/**\n * Handles display, hide, textOverflow, overflow, and whiteSpace styles.\n *\n * textOverflow syntax:\n * - `textOverflow=\"ellipsis\"` - single-line truncation with ellipsis\n * - `textOverflow=\"ellipsis / 3\"` - multi-line clamping (3 lines) with ellipsis\n * - `textOverflow=\"clip\"` - single-line truncation with clip (no ellipsis)\n * - `textOverflow=\"clip / 2\"` - multi-line clip (2 lines)\n * - `textOverflow={true}` or `textOverflow=\"initial\"` - reset to initial\n *\n * Priority:\n * 1. `hide` takes precedence (display: none)\n * 2. Multi-line `textOverflow` forces display: -webkit-box\n * 3. Single-line `textOverflow` defaults white-space to nowrap, multi-line defaults to initial\n * 4. Explicit `whiteSpace` overrides the default white-space from `textOverflow`\n */\nexport function displayStyle({\n display,\n hide,\n textOverflow,\n overflow,\n whiteSpace,\n}: DisplayStyleProps) {\n const result: Record<string, string | number> = {};\n\n // Handle textOverflow first to determine required overrides\n if (textOverflow != null && textOverflow !== false) {\n // Boolean true or 'initial' → reset to initial\n if (textOverflow === true || textOverflow === 'initial') {\n result['text-overflow'] = 'initial';\n } else {\n const processed = parseStyle(String(textOverflow));\n const group = processed.groups[0];\n\n if (group) {\n const { parts } = group;\n const modePart = parts[0];\n const clampPart = parts[1];\n\n const hasEllipsis = modePart?.mods.includes('ellipsis');\n const hasClip = modePart?.mods.includes('clip');\n\n // Get clamp value from second part (after /)\n let clamp = 1;\n if (clampPart?.values[0]) {\n const parsed = parseInt(clampPart.values[0], 10);\n if (!isNaN(parsed) && parsed > 0) {\n clamp = parsed;\n }\n }\n\n if (hasEllipsis || hasClip) {\n result['overflow'] = 'hidden';\n result['text-overflow'] = hasEllipsis ? 'ellipsis' : 'clip';\n\n if (clamp === 1) {\n result['white-space'] = whiteSpace || 'nowrap';\n } else {\n result['display'] = '-webkit-box';\n result['-webkit-box-orient'] = 'vertical';\n result['-webkit-line-clamp'] = clamp;\n result['line-clamp'] = clamp;\n result['white-space'] = whiteSpace || 'initial';\n }\n }\n }\n }\n }\n\n // Apply user-specified values (only if not overridden by textOverflow)\n if (overflow && !result['overflow']) {\n result['overflow'] = overflow;\n }\n if (whiteSpace && !result['white-space']) {\n result['white-space'] = whiteSpace;\n }\n\n // Handle display (hide > textOverflow > user value)\n if (hide) {\n result['display'] = 'none';\n } else if (!result['display'] && display) {\n result['display'] = display;\n }\n\n // Return undefined if no styles to apply\n if (Object.keys(result).length === 0) {\n return;\n }\n\n return result;\n}\n\ndisplayStyle.__lookupStyles = [\n 'display',\n 'hide',\n 'textOverflow',\n 'overflow',\n 'whiteSpace',\n];\n"],"mappings":";;;;;;;;;;;;;;;;;;;AA0BA,SAAgB,aAAa,EAC3B,SACA,MACA,cACA,UACA,cACoB;CACpB,MAAM,SAA0C,EAAE;AAGlD,KAAI,gBAAgB,QAAQ,iBAAiB,MAE3C,KAAI,iBAAiB,QAAQ,iBAAiB,UAC5C,QAAO,mBAAmB;MACrB;EAEL,MAAM,QADY,WAAW,OAAO,aAAa,CAAC,CAC1B,OAAO;AAE/B,MAAI,OAAO;GACT,MAAM,EAAE,UAAU;GAClB,MAAM,WAAW,MAAM;GACvB,MAAM,YAAY,MAAM;GAExB,MAAM,cAAc,UAAU,KAAK,SAAS,WAAW;GACvD,MAAM,UAAU,UAAU,KAAK,SAAS,OAAO;GAG/C,IAAI,QAAQ;AACZ,OAAI,WAAW,OAAO,IAAI;IACxB,MAAM,SAAS,SAAS,UAAU,OAAO,IAAI,GAAG;AAChD,QAAI,CAAC,MAAM,OAAO,IAAI,SAAS,EAC7B,SAAQ;;AAIZ,OAAI,eAAe,SAAS;AAC1B,WAAO,cAAc;AACrB,WAAO,mBAAmB,cAAc,aAAa;AAErD,QAAI,UAAU,EACZ,QAAO,iBAAiB,cAAc;SACjC;AACL,YAAO,aAAa;AACpB,YAAO,wBAAwB;AAC/B,YAAO,wBAAwB;AAC/B,YAAO,gBAAgB;AACvB,YAAO,iBAAiB,cAAc;;;;;AAQhD,KAAI,YAAY,CAAC,OAAO,YACtB,QAAO,cAAc;AAEvB,KAAI,cAAc,CAAC,OAAO,eACxB,QAAO,iBAAiB;AAI1B,KAAI,KACF,QAAO,aAAa;UACX,CAAC,OAAO,cAAc,QAC/B,QAAO,aAAa;AAItB,KAAI,OAAO,KAAK,OAAO,CAAC,WAAW,EACjC;AAGF,QAAO;;AAGT,aAAa,iBAAiB;CAC5B;CACA;CACA;CACA;CACA;CACD"}
|
package/dist/styles/fade.mjs
DELETED
|
@@ -1,58 +0,0 @@
|
|
|
1
|
-
import { DIRECTIONS, filterMods, parseStyle } from "../utils/styles.mjs";
|
|
2
|
-
|
|
3
|
-
//#region src/styles/fade.ts
|
|
4
|
-
const DIRECTION_MAP = {
|
|
5
|
-
right: "to left",
|
|
6
|
-
left: "to right",
|
|
7
|
-
top: "to bottom",
|
|
8
|
-
bottom: "to top"
|
|
9
|
-
};
|
|
10
|
-
const DEFAULT_TRANSPARENT_COLOR = "rgb(0 0 0 / 0)";
|
|
11
|
-
const DEFAULT_OPAQUE_COLOR = "rgb(0 0 0 / 1)";
|
|
12
|
-
/**
|
|
13
|
-
* Process a single group and return gradient strings for its directions.
|
|
14
|
-
*/
|
|
15
|
-
function processGroup(group, isOnlyGroup) {
|
|
16
|
-
let { values } = group;
|
|
17
|
-
const { mods, colors } = group;
|
|
18
|
-
let directions = filterMods(mods, DIRECTIONS);
|
|
19
|
-
if (!values.length) values = ["calc(2 * var(--gap))"];
|
|
20
|
-
if (!directions.length) if (isOnlyGroup) directions = [
|
|
21
|
-
"top",
|
|
22
|
-
"right",
|
|
23
|
-
"bottom",
|
|
24
|
-
"left"
|
|
25
|
-
];
|
|
26
|
-
else return [];
|
|
27
|
-
const transparentColor = colors?.[0] || DEFAULT_TRANSPARENT_COLOR;
|
|
28
|
-
const opaqueColor = colors?.[1] || DEFAULT_OPAQUE_COLOR;
|
|
29
|
-
return directions.map((direction, index) => {
|
|
30
|
-
const size = values[index] || values[index % 2] || values[0];
|
|
31
|
-
return `linear-gradient(${DIRECTION_MAP[direction]}, ${transparentColor} 0%, ${opaqueColor} ${size})`;
|
|
32
|
-
});
|
|
33
|
-
}
|
|
34
|
-
function fadeStyle({ fade }) {
|
|
35
|
-
if (!fade) return;
|
|
36
|
-
const groups = parseStyle(fade).groups ?? [];
|
|
37
|
-
if (!groups.length) return;
|
|
38
|
-
const isOnlyGroup = groups.length === 1;
|
|
39
|
-
const gradients = [];
|
|
40
|
-
for (const group of groups) {
|
|
41
|
-
const groupGradients = processGroup({
|
|
42
|
-
values: group.values ?? [],
|
|
43
|
-
mods: group.mods ?? [],
|
|
44
|
-
colors: group.colors ?? []
|
|
45
|
-
}, isOnlyGroup);
|
|
46
|
-
gradients.push(...groupGradients);
|
|
47
|
-
}
|
|
48
|
-
if (!gradients.length) return;
|
|
49
|
-
return {
|
|
50
|
-
mask: gradients.join(", "),
|
|
51
|
-
"mask-composite": "intersect"
|
|
52
|
-
};
|
|
53
|
-
}
|
|
54
|
-
fadeStyle.__lookupStyles = ["fade"];
|
|
55
|
-
|
|
56
|
-
//#endregion
|
|
57
|
-
export { fadeStyle };
|
|
58
|
-
//# sourceMappingURL=fade.mjs.map
|
package/dist/styles/fade.mjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"fade.mjs","names":[],"sources":["../../src/styles/fade.ts"],"sourcesContent":["import { DIRECTIONS, filterMods, parseStyle } from '../utils/styles';\n\nconst DIRECTION_MAP: Record<(typeof DIRECTIONS)[number], string> = {\n right: 'to left',\n left: 'to right',\n top: 'to bottom',\n bottom: 'to top',\n};\n\n// Default mask colors (standard black with alpha for gradient masks)\nconst DEFAULT_TRANSPARENT_COLOR = 'rgb(0 0 0 / 0)';\nconst DEFAULT_OPAQUE_COLOR = 'rgb(0 0 0 / 1)';\n\ninterface GroupData {\n values: string[];\n mods: string[];\n colors: string[];\n}\n\n/**\n * Process a single group and return gradient strings for its directions.\n */\nfunction processGroup(group: GroupData, isOnlyGroup: boolean): string[] {\n let { values } = group;\n const { mods, colors } = group;\n\n let directions = filterMods(\n mods,\n DIRECTIONS,\n ) as (typeof DIRECTIONS)[number][];\n\n if (!values.length) {\n values = ['calc(2 * var(--gap))'];\n }\n\n // If this is the only group and no directions specified, apply to all edges\n if (!directions.length) {\n if (isOnlyGroup) {\n directions = ['top', 'right', 'bottom', 'left'];\n } else {\n // For multi-group without explicit direction, skip this group\n return [];\n }\n }\n\n // Extract colors: first = transparent mask color, second = opaque mask color\n const transparentColor = colors?.[0] || DEFAULT_TRANSPARENT_COLOR;\n const opaqueColor = colors?.[1] || DEFAULT_OPAQUE_COLOR;\n\n return directions.map(\n (direction: (typeof DIRECTIONS)[number], index: number) => {\n const size = values[index] || values[index % 2] || values[0];\n\n return `linear-gradient(${DIRECTION_MAP[direction]}, ${transparentColor} 0%, ${opaqueColor} ${size})`;\n },\n );\n}\n\nexport function fadeStyle({ fade }) {\n if (!fade) return;\n\n const processed = parseStyle(fade);\n const groups: GroupData[] = processed.groups ?? [];\n\n if (!groups.length) return;\n\n const isOnlyGroup = groups.length === 1;\n\n // Process all groups and collect gradients\n const gradients: string[] = [];\n\n for (const group of groups) {\n const groupGradients = processGroup(\n {\n values: group.values ?? [],\n mods: group.mods ?? [],\n colors: group.colors ?? [],\n },\n isOnlyGroup,\n );\n gradients.push(...groupGradients);\n }\n\n if (!gradients.length) return;\n\n return {\n mask: gradients.join(', '),\n 'mask-composite': 'intersect',\n };\n}\n\nfadeStyle.__lookupStyles = ['fade'];\n"],"mappings":";;;AAEA,MAAM,gBAA6D;CACjE,OAAO;CACP,MAAM;CACN,KAAK;CACL,QAAQ;CACT;AAGD,MAAM,4BAA4B;AAClC,MAAM,uBAAuB;;;;AAW7B,SAAS,aAAa,OAAkB,aAAgC;CACtE,IAAI,EAAE,WAAW;CACjB,MAAM,EAAE,MAAM,WAAW;CAEzB,IAAI,aAAa,WACf,MACA,WACD;AAED,KAAI,CAAC,OAAO,OACV,UAAS,CAAC,uBAAuB;AAInC,KAAI,CAAC,WAAW,OACd,KAAI,YACF,cAAa;EAAC;EAAO;EAAS;EAAU;EAAO;KAG/C,QAAO,EAAE;CAKb,MAAM,mBAAmB,SAAS,MAAM;CACxC,MAAM,cAAc,SAAS,MAAM;AAEnC,QAAO,WAAW,KACf,WAAwC,UAAkB;EACzD,MAAM,OAAO,OAAO,UAAU,OAAO,QAAQ,MAAM,OAAO;AAE1D,SAAO,mBAAmB,cAAc,WAAW,IAAI,iBAAiB,OAAO,YAAY,GAAG,KAAK;GAEtG;;AAGH,SAAgB,UAAU,EAAE,QAAQ;AAClC,KAAI,CAAC,KAAM;CAGX,MAAM,SADY,WAAW,KAAK,CACI,UAAU,EAAE;AAElD,KAAI,CAAC,OAAO,OAAQ;CAEpB,MAAM,cAAc,OAAO,WAAW;CAGtC,MAAM,YAAsB,EAAE;AAE9B,MAAK,MAAM,SAAS,QAAQ;EAC1B,MAAM,iBAAiB,aACrB;GACE,QAAQ,MAAM,UAAU,EAAE;GAC1B,MAAM,MAAM,QAAQ,EAAE;GACtB,QAAQ,MAAM,UAAU,EAAE;GAC3B,EACD,YACD;AACD,YAAU,KAAK,GAAG,eAAe;;AAGnC,KAAI,CAAC,UAAU,OAAQ;AAEvB,QAAO;EACL,MAAM,UAAU,KAAK,KAAK;EAC1B,kBAAkB;EACnB;;AAGH,UAAU,iBAAiB,CAAC,OAAO"}
|
package/dist/styles/fill.mjs
DELETED
|
@@ -1,51 +0,0 @@
|
|
|
1
|
-
import { parseStyle } from "../utils/styles.mjs";
|
|
2
|
-
|
|
3
|
-
//#region src/styles/fill.ts
|
|
4
|
-
function fillStyle({ fill, backgroundColor, image, backgroundImage, backgroundPosition, backgroundSize, backgroundRepeat, backgroundAttachment, backgroundOrigin, backgroundClip, background }) {
|
|
5
|
-
if (background) return { background: parseStyle(background).output || background };
|
|
6
|
-
const result = {};
|
|
7
|
-
const colorValue = backgroundColor ?? fill;
|
|
8
|
-
if (colorValue) {
|
|
9
|
-
const parsed = parseStyle(colorValue);
|
|
10
|
-
const firstColor = parsed.groups[0]?.colors[0];
|
|
11
|
-
const secondColor = parsed.groups[0]?.colors[1];
|
|
12
|
-
result["background-color"] = firstColor || colorValue;
|
|
13
|
-
if (secondColor && !backgroundImage && !image) {
|
|
14
|
-
result["--tasty-second-fill-color"] = secondColor;
|
|
15
|
-
result["background-image"] = "linear-gradient(var(--tasty-second-fill-color), var(--tasty-second-fill-color))";
|
|
16
|
-
}
|
|
17
|
-
}
|
|
18
|
-
const imageValue = backgroundImage ?? image;
|
|
19
|
-
if (imageValue) result["background-image"] = parseStyle(imageValue).output || imageValue;
|
|
20
|
-
if (backgroundPosition) result["background-position"] = parseStyle(backgroundPosition).output || backgroundPosition;
|
|
21
|
-
if (backgroundSize) result["background-size"] = parseStyle(backgroundSize).output || backgroundSize;
|
|
22
|
-
if (backgroundRepeat) result["background-repeat"] = backgroundRepeat;
|
|
23
|
-
if (backgroundAttachment) result["background-attachment"] = backgroundAttachment;
|
|
24
|
-
if (backgroundOrigin) result["background-origin"] = backgroundOrigin;
|
|
25
|
-
if (backgroundClip) result["background-clip"] = backgroundClip;
|
|
26
|
-
if (Object.keys(result).length === 0) return;
|
|
27
|
-
return result;
|
|
28
|
-
}
|
|
29
|
-
fillStyle.__lookupStyles = [
|
|
30
|
-
"fill",
|
|
31
|
-
"backgroundColor",
|
|
32
|
-
"image",
|
|
33
|
-
"backgroundImage",
|
|
34
|
-
"backgroundPosition",
|
|
35
|
-
"backgroundSize",
|
|
36
|
-
"backgroundRepeat",
|
|
37
|
-
"backgroundAttachment",
|
|
38
|
-
"backgroundOrigin",
|
|
39
|
-
"backgroundClip",
|
|
40
|
-
"background"
|
|
41
|
-
];
|
|
42
|
-
function svgFillStyle({ svgFill }) {
|
|
43
|
-
if (!svgFill) return;
|
|
44
|
-
svgFill = parseStyle(svgFill).groups[0]?.colors[0] || svgFill;
|
|
45
|
-
return { fill: svgFill };
|
|
46
|
-
}
|
|
47
|
-
svgFillStyle.__lookupStyles = ["svgFill"];
|
|
48
|
-
|
|
49
|
-
//#endregion
|
|
50
|
-
export { fillStyle, svgFillStyle };
|
|
51
|
-
//# sourceMappingURL=fill.mjs.map
|
package/dist/styles/fill.mjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"fill.mjs","names":[],"sources":["../../src/styles/fill.ts"],"sourcesContent":["import { parseStyle } from '../utils/styles';\n\nexport function fillStyle({\n fill,\n backgroundColor,\n image,\n backgroundImage,\n backgroundPosition,\n backgroundSize,\n backgroundRepeat,\n backgroundAttachment,\n backgroundOrigin,\n backgroundClip,\n background,\n}) {\n // If background is set, it overrides everything\n if (background) {\n const processed = parseStyle(background);\n return { background: processed.output || background };\n }\n\n const result: Record<string, string> = {};\n\n // Priority: backgroundColor > fill\n const colorValue = backgroundColor ?? fill;\n if (colorValue) {\n const parsed = parseStyle(colorValue);\n const firstColor = parsed.groups[0]?.colors[0];\n const secondColor = parsed.groups[0]?.colors[1];\n\n result['background-color'] = firstColor || colorValue;\n\n // Apply second color as gradient layer (only if no explicit backgroundImage/image)\n // Uses a registered custom property to enable CSS transitions\n if (secondColor && !backgroundImage && !image) {\n result['--tasty-second-fill-color'] = secondColor;\n result['background-image'] =\n 'linear-gradient(var(--tasty-second-fill-color), var(--tasty-second-fill-color))';\n }\n }\n\n // Priority: backgroundImage > image (overrides second fill color if set)\n const imageValue = backgroundImage ?? image;\n if (imageValue) {\n const parsed = parseStyle(imageValue);\n result['background-image'] = parsed.output || imageValue;\n }\n\n // Other background properties (pass through with parseStyle for token support)\n if (backgroundPosition) {\n result['background-position'] =\n parseStyle(backgroundPosition).output || backgroundPosition;\n }\n if (backgroundSize) {\n result['background-size'] =\n parseStyle(backgroundSize).output || backgroundSize;\n }\n if (backgroundRepeat) {\n result['background-repeat'] = backgroundRepeat;\n }\n if (backgroundAttachment) {\n result['background-attachment'] = backgroundAttachment;\n }\n if (backgroundOrigin) {\n result['background-origin'] = backgroundOrigin;\n }\n if (backgroundClip) {\n result['background-clip'] = backgroundClip;\n }\n\n if (Object.keys(result).length === 0) return;\n return result;\n}\n\nfillStyle.__lookupStyles = [\n 'fill',\n 'backgroundColor',\n 'image',\n 'backgroundImage',\n 'backgroundPosition',\n 'backgroundSize',\n 'backgroundRepeat',\n 'backgroundAttachment',\n 'backgroundOrigin',\n 'backgroundClip',\n 'background',\n];\n\nexport function svgFillStyle({ svgFill }) {\n if (!svgFill) return;\n\n const processed = parseStyle(svgFill);\n svgFill = processed.groups[0]?.colors[0] || svgFill;\n\n return { fill: svgFill };\n}\n\nsvgFillStyle.__lookupStyles = ['svgFill'];\n"],"mappings":";;;AAEA,SAAgB,UAAU,EACxB,MACA,iBACA,OACA,iBACA,oBACA,gBACA,kBACA,sBACA,kBACA,gBACA,cACC;AAED,KAAI,WAEF,QAAO,EAAE,YADS,WAAW,WAAW,CACT,UAAU,YAAY;CAGvD,MAAM,SAAiC,EAAE;CAGzC,MAAM,aAAa,mBAAmB;AACtC,KAAI,YAAY;EACd,MAAM,SAAS,WAAW,WAAW;EACrC,MAAM,aAAa,OAAO,OAAO,IAAI,OAAO;EAC5C,MAAM,cAAc,OAAO,OAAO,IAAI,OAAO;AAE7C,SAAO,sBAAsB,cAAc;AAI3C,MAAI,eAAe,CAAC,mBAAmB,CAAC,OAAO;AAC7C,UAAO,+BAA+B;AACtC,UAAO,sBACL;;;CAKN,MAAM,aAAa,mBAAmB;AACtC,KAAI,WAEF,QAAO,sBADQ,WAAW,WAAW,CACD,UAAU;AAIhD,KAAI,mBACF,QAAO,yBACL,WAAW,mBAAmB,CAAC,UAAU;AAE7C,KAAI,eACF,QAAO,qBACL,WAAW,eAAe,CAAC,UAAU;AAEzC,KAAI,iBACF,QAAO,uBAAuB;AAEhC,KAAI,qBACF,QAAO,2BAA2B;AAEpC,KAAI,iBACF,QAAO,uBAAuB;AAEhC,KAAI,eACF,QAAO,qBAAqB;AAG9B,KAAI,OAAO,KAAK,OAAO,CAAC,WAAW,EAAG;AACtC,QAAO;;AAGT,UAAU,iBAAiB;CACzB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD;AAED,SAAgB,aAAa,EAAE,WAAW;AACxC,KAAI,CAAC,QAAS;AAGd,WADkB,WAAW,QAAQ,CACjB,OAAO,IAAI,OAAO,MAAM;AAE5C,QAAO,EAAE,MAAM,SAAS;;AAG1B,aAAa,iBAAiB,CAAC,UAAU"}
|
package/dist/styles/flow.mjs
DELETED
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
//#region src/styles/flow.ts
|
|
2
|
-
function flowStyle({ display = "block", flow }) {
|
|
3
|
-
let style;
|
|
4
|
-
if (display.includes("grid")) style = "grid-auto-flow";
|
|
5
|
-
else if (display.includes("flex")) style = "flex-flow";
|
|
6
|
-
return style ? { [style]: flow } : null;
|
|
7
|
-
}
|
|
8
|
-
flowStyle.__lookupStyles = ["display", "flow"];
|
|
9
|
-
|
|
10
|
-
//#endregion
|
|
11
|
-
export { flowStyle };
|
|
12
|
-
//# sourceMappingURL=flow.mjs.map
|
package/dist/styles/flow.mjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"flow.mjs","names":[],"sources":["../../src/styles/flow.ts"],"sourcesContent":["export function flowStyle({ display = 'block', flow }) {\n let style;\n\n if (display.includes('grid')) {\n style = 'grid-auto-flow';\n } else if (display.includes('flex')) {\n style = 'flex-flow';\n }\n\n return style ? { [style]: flow } : null;\n}\n\nflowStyle.__lookupStyles = ['display', 'flow'];\n"],"mappings":";AAAA,SAAgB,UAAU,EAAE,UAAU,SAAS,QAAQ;CACrD,IAAI;AAEJ,KAAI,QAAQ,SAAS,OAAO,CAC1B,SAAQ;UACC,QAAQ,SAAS,OAAO,CACjC,SAAQ;AAGV,QAAO,QAAQ,GAAG,QAAQ,MAAM,GAAG;;AAGrC,UAAU,iBAAiB,CAAC,WAAW,OAAO"}
|
package/dist/styles/gap.mjs
DELETED
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
import { makeEmptyDetails } from "../parser/types.mjs";
|
|
2
|
-
import { parseStyle } from "../utils/styles.mjs";
|
|
3
|
-
|
|
4
|
-
//#region src/styles/gap.ts
|
|
5
|
-
function gapStyle({ display = "block", flow, gap }) {
|
|
6
|
-
if (typeof gap === "number") gap = `${gap}px`;
|
|
7
|
-
if (!gap) return;
|
|
8
|
-
if (gap === true) gap = "1x";
|
|
9
|
-
const isGrid = display.includes("grid");
|
|
10
|
-
const isFlex = display.includes("flex");
|
|
11
|
-
const isWrap = flow ? flow.includes("wrap") && !flow.includes("nowrap") : false;
|
|
12
|
-
if (!isGrid && flow == null) flow = isFlex ? "row" : "column";
|
|
13
|
-
const { values } = parseStyle(gap).groups[0] ?? makeEmptyDetails();
|
|
14
|
-
gap = values.join(" ");
|
|
15
|
-
if (isGrid || isFlex) return { gap };
|
|
16
|
-
const gapDir = flow?.includes("row") ? "right" : "bottom";
|
|
17
|
-
return isWrap ? [{
|
|
18
|
-
"margin-right": `calc(-1 * ${values[1] || values[0]})`,
|
|
19
|
-
"margin-bottom": `calc(-1 * ${values[0]})`
|
|
20
|
-
}, {
|
|
21
|
-
$: "& > *",
|
|
22
|
-
"margin-right": values[1] || values[0],
|
|
23
|
-
"margin-bottom": values[0]
|
|
24
|
-
}] : {
|
|
25
|
-
$: "& > *:not(:last-child)",
|
|
26
|
-
[`margin-${gapDir}`]: gap
|
|
27
|
-
};
|
|
28
|
-
}
|
|
29
|
-
gapStyle.__lookupStyles = [
|
|
30
|
-
"display",
|
|
31
|
-
"flow",
|
|
32
|
-
"gap"
|
|
33
|
-
];
|
|
34
|
-
|
|
35
|
-
//#endregion
|
|
36
|
-
export { gapStyle };
|
|
37
|
-
//# sourceMappingURL=gap.mjs.map
|
package/dist/styles/gap.mjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"gap.mjs","names":[],"sources":["../../src/styles/gap.ts"],"sourcesContent":["import { makeEmptyDetails } from '../parser/types';\nimport { parseStyle } from '../utils/styles';\n\nexport function gapStyle({\n display = 'block',\n flow,\n gap,\n}: {\n display?: string;\n flow?: string;\n gap?: string | number | boolean;\n}) {\n if (typeof gap === 'number') {\n gap = `${gap}px`;\n }\n\n if (!gap) {\n return;\n }\n\n if (gap === true) {\n gap = '1x';\n }\n\n const isGrid = display.includes('grid');\n const isFlex = display.includes('flex');\n const isWrap = flow\n ? flow.includes('wrap') && !flow.includes('nowrap')\n : false;\n\n if (!isGrid && flow == null) {\n flow = isFlex ? 'row' : 'column';\n }\n\n const processed = parseStyle(gap);\n const { values } = processed.groups[0] ?? makeEmptyDetails();\n\n gap = values.join(' ');\n\n if (isGrid || isFlex) {\n return { gap };\n }\n\n const gapDir = flow?.includes('row') ? 'right' : 'bottom';\n\n return isWrap\n ? [\n {\n 'margin-right': `calc(-1 * ${values[1] || values[0]})`,\n 'margin-bottom': `calc(-1 * ${values[0]})`,\n },\n {\n $: '& > *',\n 'margin-right': values[1] || values[0],\n 'margin-bottom': values[0],\n },\n ]\n : {\n $: '& > *:not(:last-child)',\n [`margin-${gapDir}`]: gap,\n };\n}\n\ngapStyle.__lookupStyles = ['display', 'flow', 'gap'];\n"],"mappings":";;;;AAGA,SAAgB,SAAS,EACvB,UAAU,SACV,MACA,OAKC;AACD,KAAI,OAAO,QAAQ,SACjB,OAAM,GAAG,IAAI;AAGf,KAAI,CAAC,IACH;AAGF,KAAI,QAAQ,KACV,OAAM;CAGR,MAAM,SAAS,QAAQ,SAAS,OAAO;CACvC,MAAM,SAAS,QAAQ,SAAS,OAAO;CACvC,MAAM,SAAS,OACX,KAAK,SAAS,OAAO,IAAI,CAAC,KAAK,SAAS,SAAS,GACjD;AAEJ,KAAI,CAAC,UAAU,QAAQ,KACrB,QAAO,SAAS,QAAQ;CAI1B,MAAM,EAAE,WADU,WAAW,IAAI,CACJ,OAAO,MAAM,kBAAkB;AAE5D,OAAM,OAAO,KAAK,IAAI;AAEtB,KAAI,UAAU,OACZ,QAAO,EAAE,KAAK;CAGhB,MAAM,SAAS,MAAM,SAAS,MAAM,GAAG,UAAU;AAEjD,QAAO,SACH,CACE;EACE,gBAAgB,aAAa,OAAO,MAAM,OAAO,GAAG;EACpD,iBAAiB,aAAa,OAAO,GAAG;EACzC,EACD;EACE,GAAG;EACH,gBAAgB,OAAO,MAAM,OAAO;EACpC,iBAAiB,OAAO;EACzB,CACF,GACD;EACE,GAAG;GACF,UAAU,WAAW;EACvB;;AAGP,SAAS,iBAAiB;CAAC;CAAW;CAAQ;CAAM"}
|
package/dist/styles/height.mjs
DELETED
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import { dimensionStyle } from "./dimension.mjs";
|
|
2
|
-
|
|
3
|
-
//#region src/styles/height.ts
|
|
4
|
-
const dimension = dimensionStyle("height");
|
|
5
|
-
function heightStyle({ height, minHeight, maxHeight }) {
|
|
6
|
-
return dimension({
|
|
7
|
-
value: height,
|
|
8
|
-
min: minHeight,
|
|
9
|
-
max: maxHeight
|
|
10
|
-
});
|
|
11
|
-
}
|
|
12
|
-
heightStyle.__lookupStyles = [
|
|
13
|
-
"height",
|
|
14
|
-
"minHeight",
|
|
15
|
-
"maxHeight"
|
|
16
|
-
];
|
|
17
|
-
|
|
18
|
-
//#endregion
|
|
19
|
-
export { heightStyle };
|
|
20
|
-
//# sourceMappingURL=height.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"height.mjs","names":[],"sources":["../../src/styles/height.ts"],"sourcesContent":["import { dimensionStyle } from './dimension';\n\nconst dimension = dimensionStyle('height');\n\ninterface HeightStyleProps {\n height?: string | number | boolean;\n minHeight?: string | number | boolean;\n maxHeight?: string | number | boolean;\n}\n\nexport function heightStyle({\n height,\n minHeight,\n maxHeight,\n}: HeightStyleProps) {\n return dimension({ value: height, min: minHeight, max: maxHeight });\n}\n\nheightStyle.__lookupStyles = ['height', 'minHeight', 'maxHeight'];\n"],"mappings":";;;AAEA,MAAM,YAAY,eAAe,SAAS;AAQ1C,SAAgB,YAAY,EAC1B,QACA,WACA,aACmB;AACnB,QAAO,UAAU;EAAE,OAAO;EAAQ,KAAK;EAAW,KAAK;EAAW,CAAC;;AAGrE,YAAY,iBAAiB;CAAC;CAAU;CAAa;CAAY"}
|
package/dist/styles/index.mjs
DELETED
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import { convertColorChainToRgbChain, createStyle } from "./createStyle.mjs";
|
|
2
|
-
import { normalizeHandlerDefinition, predefine, registerHandler } from "./predefined.mjs";
|
|
3
|
-
|
|
4
|
-
//#region src/styles/index.ts
|
|
5
|
-
const { STYLE_HANDLER_MAP, defineCustomStyle, defineStyleAlias } = predefine();
|
|
6
|
-
|
|
7
|
-
//#endregion
|
|
8
|
-
export { STYLE_HANDLER_MAP };
|
|
9
|
-
//# sourceMappingURL=index.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","names":[],"sources":["../../src/styles/index.ts"],"sourcesContent":["import { predefine, styleHandlers } from './predefined';\n\nconst { STYLE_HANDLER_MAP, defineCustomStyle, defineStyleAlias } = predefine();\n\nexport {\n STYLE_HANDLER_MAP,\n defineCustomStyle,\n defineStyleAlias,\n styleHandlers,\n};\nexport * from './createStyle';\nexport {\n normalizeHandlerDefinition,\n registerHandler,\n resetHandlers,\n validateHandlerResult,\n} from './predefined';\n"],"mappings":";;;;AAEA,MAAM,EAAE,mBAAmB,mBAAmB,qBAAqB,WAAW"}
|
package/dist/styles/inset.mjs
DELETED
|
@@ -1,142 +0,0 @@
|
|
|
1
|
-
import { DIRECTIONS, filterMods, parseStyle } from "../utils/styles.mjs";
|
|
2
|
-
|
|
3
|
-
//#region src/styles/inset.ts
|
|
4
|
-
/**
|
|
5
|
-
* Parse an inset value and return the first processed value
|
|
6
|
-
*/
|
|
7
|
-
function parseInsetValue(value) {
|
|
8
|
-
if (typeof value === "number") return `${value}px`;
|
|
9
|
-
if (!value) return null;
|
|
10
|
-
if (value === true) value = "0";
|
|
11
|
-
const { values } = parseStyle(value).groups[0] ?? { values: [] };
|
|
12
|
-
return values[0] || "0";
|
|
13
|
-
}
|
|
14
|
-
/**
|
|
15
|
-
* Parse inset value with optional directions (like "1x top" or "2x left right")
|
|
16
|
-
*/
|
|
17
|
-
function parseDirectionalInset(value) {
|
|
18
|
-
if (typeof value === "number") return {
|
|
19
|
-
values: [`${value}px`],
|
|
20
|
-
directions: []
|
|
21
|
-
};
|
|
22
|
-
if (!value) return {
|
|
23
|
-
values: [],
|
|
24
|
-
directions: []
|
|
25
|
-
};
|
|
26
|
-
if (value === true) value = "0";
|
|
27
|
-
const { values = [], mods = [] } = parseStyle(value).groups[0] ?? {};
|
|
28
|
-
return {
|
|
29
|
-
values: values.length ? values : ["0"],
|
|
30
|
-
directions: filterMods(mods, DIRECTIONS)
|
|
31
|
-
};
|
|
32
|
-
}
|
|
33
|
-
/**
|
|
34
|
-
* Inset style handler.
|
|
35
|
-
*
|
|
36
|
-
* IMPORTANT: This handler uses individual CSS properties (top, right, bottom, left)
|
|
37
|
-
* when only individual direction props are specified. This allows CSS cascade to work
|
|
38
|
-
* correctly when modifiers override only some directions.
|
|
39
|
-
*
|
|
40
|
-
* Example problem with using `inset` shorthand everywhere:
|
|
41
|
-
* styles: {
|
|
42
|
-
* top: { '': 0, 'side=bottom': 'initial' },
|
|
43
|
-
* right: { '': 0, 'side=left': 'initial' },
|
|
44
|
-
* bottom: { '': 0, 'side=top': 'initial' },
|
|
45
|
-
* left: { '': 0, 'side=right': 'initial' },
|
|
46
|
-
* }
|
|
47
|
-
*
|
|
48
|
-
* If we output `inset` for both cases:
|
|
49
|
-
* - Default: inset: 0 0 0 0
|
|
50
|
-
* - side=bottom: inset: initial auto auto auto ← WRONG! Overrides all 4 directions
|
|
51
|
-
*
|
|
52
|
-
* With individual properties:
|
|
53
|
-
* - Default: top: 0; right: 0; bottom: 0; left: 0
|
|
54
|
-
* - side=bottom: top: initial ← CORRECT! Only overrides top
|
|
55
|
-
*
|
|
56
|
-
* The `inset` shorthand is only used when the base `inset` prop is specified
|
|
57
|
-
* OR when `insetBlock`/`insetInline` are used (which imply setting pairs).
|
|
58
|
-
*/
|
|
59
|
-
function insetStyle({ inset, insetBlock, insetInline, top, right, bottom, left }) {
|
|
60
|
-
if (inset == null && insetBlock == null && insetInline == null && top == null && right == null && bottom == null && left == null) return {};
|
|
61
|
-
if (inset == null && insetBlock == null && insetInline == null) {
|
|
62
|
-
const result = {};
|
|
63
|
-
if (top != null) {
|
|
64
|
-
const val = parseInsetValue(top);
|
|
65
|
-
if (val) result["top"] = val;
|
|
66
|
-
}
|
|
67
|
-
if (right != null) {
|
|
68
|
-
const val = parseInsetValue(right);
|
|
69
|
-
if (val) result["right"] = val;
|
|
70
|
-
}
|
|
71
|
-
if (bottom != null) {
|
|
72
|
-
const val = parseInsetValue(bottom);
|
|
73
|
-
if (val) result["bottom"] = val;
|
|
74
|
-
}
|
|
75
|
-
if (left != null) {
|
|
76
|
-
const val = parseInsetValue(left);
|
|
77
|
-
if (val) result["left"] = val;
|
|
78
|
-
}
|
|
79
|
-
return result;
|
|
80
|
-
}
|
|
81
|
-
let [topVal, rightVal, bottomVal, leftVal] = [
|
|
82
|
-
"auto",
|
|
83
|
-
"auto",
|
|
84
|
-
"auto",
|
|
85
|
-
"auto"
|
|
86
|
-
];
|
|
87
|
-
if (inset != null) {
|
|
88
|
-
const { values, directions } = parseDirectionalInset(inset);
|
|
89
|
-
if (values.length) if (directions.length === 0) {
|
|
90
|
-
topVal = values[0];
|
|
91
|
-
rightVal = values[1] || values[0];
|
|
92
|
-
bottomVal = values[2] || values[0];
|
|
93
|
-
leftVal = values[3] || values[1] || values[0];
|
|
94
|
-
} else directions.forEach((dir, i) => {
|
|
95
|
-
const val = values[i] ?? values[0];
|
|
96
|
-
if (dir === "top") topVal = val;
|
|
97
|
-
else if (dir === "right") rightVal = val;
|
|
98
|
-
else if (dir === "bottom") bottomVal = val;
|
|
99
|
-
else if (dir === "left") leftVal = val;
|
|
100
|
-
});
|
|
101
|
-
}
|
|
102
|
-
if (insetBlock != null) {
|
|
103
|
-
const val = parseInsetValue(insetBlock);
|
|
104
|
-
if (val) topVal = bottomVal = val;
|
|
105
|
-
}
|
|
106
|
-
if (insetInline != null) {
|
|
107
|
-
const val = parseInsetValue(insetInline);
|
|
108
|
-
if (val) leftVal = rightVal = val;
|
|
109
|
-
}
|
|
110
|
-
if (top != null) {
|
|
111
|
-
const val = parseInsetValue(top);
|
|
112
|
-
if (val) topVal = val;
|
|
113
|
-
}
|
|
114
|
-
if (right != null) {
|
|
115
|
-
const val = parseInsetValue(right);
|
|
116
|
-
if (val) rightVal = val;
|
|
117
|
-
}
|
|
118
|
-
if (bottom != null) {
|
|
119
|
-
const val = parseInsetValue(bottom);
|
|
120
|
-
if (val) bottomVal = val;
|
|
121
|
-
}
|
|
122
|
-
if (left != null) {
|
|
123
|
-
const val = parseInsetValue(left);
|
|
124
|
-
if (val) leftVal = val;
|
|
125
|
-
}
|
|
126
|
-
if (topVal === rightVal && rightVal === bottomVal && bottomVal === leftVal) return { inset: topVal };
|
|
127
|
-
if (topVal === bottomVal && leftVal === rightVal) return { inset: `${topVal} ${leftVal}` };
|
|
128
|
-
return { inset: `${topVal} ${rightVal} ${bottomVal} ${leftVal}` };
|
|
129
|
-
}
|
|
130
|
-
insetStyle.__lookupStyles = [
|
|
131
|
-
"inset",
|
|
132
|
-
"insetBlock",
|
|
133
|
-
"insetInline",
|
|
134
|
-
"top",
|
|
135
|
-
"right",
|
|
136
|
-
"bottom",
|
|
137
|
-
"left"
|
|
138
|
-
];
|
|
139
|
-
|
|
140
|
-
//#endregion
|
|
141
|
-
export { insetStyle };
|
|
142
|
-
//# sourceMappingURL=inset.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"inset.mjs","names":[],"sources":["../../src/styles/inset.ts"],"sourcesContent":["import { DIRECTIONS, filterMods, parseStyle } from '../utils/styles';\n\n/**\n * Parse an inset value and return the first processed value\n */\nfunction parseInsetValue(value: string | number | boolean): string | null {\n if (typeof value === 'number') return `${value}px`;\n if (!value) return null;\n if (value === true) value = '0';\n\n const { values } = parseStyle(value).groups[0] ?? { values: [] };\n\n return values[0] || '0';\n}\n\n/**\n * Parse inset value with optional directions (like \"1x top\" or \"2x left right\")\n */\nfunction parseDirectionalInset(value: string | number | boolean): {\n values: string[];\n directions: string[];\n} {\n if (typeof value === 'number') {\n return { values: [`${value}px`], directions: [] };\n }\n if (!value) return { values: [], directions: [] };\n if (value === true) value = '0';\n\n const { values = [], mods = [] } = parseStyle(value).groups[0] ?? {};\n\n return {\n values: values.length ? values : ['0'],\n directions: filterMods(mods, DIRECTIONS),\n };\n}\n\n/**\n * Inset style handler.\n *\n * IMPORTANT: This handler uses individual CSS properties (top, right, bottom, left)\n * when only individual direction props are specified. This allows CSS cascade to work\n * correctly when modifiers override only some directions.\n *\n * Example problem with using `inset` shorthand everywhere:\n * styles: {\n * top: { '': 0, 'side=bottom': 'initial' },\n * right: { '': 0, 'side=left': 'initial' },\n * bottom: { '': 0, 'side=top': 'initial' },\n * left: { '': 0, 'side=right': 'initial' },\n * }\n *\n * If we output `inset` for both cases:\n * - Default: inset: 0 0 0 0\n * - side=bottom: inset: initial auto auto auto ← WRONG! Overrides all 4 directions\n *\n * With individual properties:\n * - Default: top: 0; right: 0; bottom: 0; left: 0\n * - side=bottom: top: initial ← CORRECT! Only overrides top\n *\n * The `inset` shorthand is only used when the base `inset` prop is specified\n * OR when `insetBlock`/`insetInline` are used (which imply setting pairs).\n */\nexport function insetStyle({\n inset,\n insetBlock,\n insetInline,\n top,\n right,\n bottom,\n left,\n}: {\n inset?: string | number | boolean;\n insetBlock?: string | number | boolean;\n insetInline?: string | number | boolean;\n top?: string | number | boolean;\n right?: string | number | boolean;\n bottom?: string | number | boolean;\n left?: string | number | boolean;\n}) {\n // If no props are defined, return empty object\n if (\n inset == null &&\n insetBlock == null &&\n insetInline == null &&\n top == null &&\n right == null &&\n bottom == null &&\n left == null\n ) {\n return {};\n }\n\n // When only individual direction props are used (no inset, insetBlock, insetInline),\n // output individual CSS properties to allow proper CSS cascade with modifiers\n const onlyIndividualProps =\n inset == null && insetBlock == null && insetInline == null;\n\n if (onlyIndividualProps) {\n const result: Record<string, string> = {};\n\n if (top != null) {\n const val = parseInsetValue(top);\n if (val) result['top'] = val;\n }\n if (right != null) {\n const val = parseInsetValue(right);\n if (val) result['right'] = val;\n }\n if (bottom != null) {\n const val = parseInsetValue(bottom);\n if (val) result['bottom'] = val;\n }\n if (left != null) {\n const val = parseInsetValue(left);\n if (val) result['left'] = val;\n }\n\n return result;\n }\n\n // When inset, insetBlock, or insetInline is used, use the shorthand approach\n // Initialize all directions to auto\n let [topVal, rightVal, bottomVal, leftVal] = ['auto', 'auto', 'auto', 'auto'];\n\n // Priority 1 (lowest): inset\n if (inset != null) {\n const { values, directions } = parseDirectionalInset(inset);\n\n if (values.length) {\n if (directions.length === 0) {\n topVal = values[0];\n rightVal = values[1] || values[0];\n bottomVal = values[2] || values[0];\n leftVal = values[3] || values[1] || values[0];\n } else {\n // Assign values to directions in the order they appear\n // e.g., 'right 1x top 0' → right: 1x, top: 0\n directions.forEach((dir, i) => {\n const val = values[i] ?? values[0];\n if (dir === 'top') topVal = val;\n else if (dir === 'right') rightVal = val;\n else if (dir === 'bottom') bottomVal = val;\n else if (dir === 'left') leftVal = val;\n });\n }\n }\n }\n\n // Priority 2 (medium): insetBlock/insetInline\n if (insetBlock != null) {\n const val = parseInsetValue(insetBlock);\n if (val) topVal = bottomVal = val;\n }\n if (insetInline != null) {\n const val = parseInsetValue(insetInline);\n if (val) leftVal = rightVal = val;\n }\n\n // Priority 3 (highest): individual directions\n if (top != null) {\n const val = parseInsetValue(top);\n if (val) topVal = val;\n }\n if (right != null) {\n const val = parseInsetValue(right);\n if (val) rightVal = val;\n }\n if (bottom != null) {\n const val = parseInsetValue(bottom);\n if (val) bottomVal = val;\n }\n if (left != null) {\n const val = parseInsetValue(left);\n if (val) leftVal = val;\n }\n\n // Optimize output: 1 value if all same, 2 values if top==bottom && left==right\n if (topVal === rightVal && rightVal === bottomVal && bottomVal === leftVal) {\n return { inset: topVal };\n }\n if (topVal === bottomVal && leftVal === rightVal) {\n return { inset: `${topVal} ${leftVal}` };\n }\n\n return { inset: `${topVal} ${rightVal} ${bottomVal} ${leftVal}` };\n}\n\ninsetStyle.__lookupStyles = [\n 'inset',\n 'insetBlock',\n 'insetInline',\n 'top',\n 'right',\n 'bottom',\n 'left',\n];\n"],"mappings":";;;;;;AAKA,SAAS,gBAAgB,OAAiD;AACxE,KAAI,OAAO,UAAU,SAAU,QAAO,GAAG,MAAM;AAC/C,KAAI,CAAC,MAAO,QAAO;AACnB,KAAI,UAAU,KAAM,SAAQ;CAE5B,MAAM,EAAE,WAAW,WAAW,MAAM,CAAC,OAAO,MAAM,EAAE,QAAQ,EAAE,EAAE;AAEhE,QAAO,OAAO,MAAM;;;;;AAMtB,SAAS,sBAAsB,OAG7B;AACA,KAAI,OAAO,UAAU,SACnB,QAAO;EAAE,QAAQ,CAAC,GAAG,MAAM,IAAI;EAAE,YAAY,EAAE;EAAE;AAEnD,KAAI,CAAC,MAAO,QAAO;EAAE,QAAQ,EAAE;EAAE,YAAY,EAAE;EAAE;AACjD,KAAI,UAAU,KAAM,SAAQ;CAE5B,MAAM,EAAE,SAAS,EAAE,EAAE,OAAO,EAAE,KAAK,WAAW,MAAM,CAAC,OAAO,MAAM,EAAE;AAEpE,QAAO;EACL,QAAQ,OAAO,SAAS,SAAS,CAAC,IAAI;EACtC,YAAY,WAAW,MAAM,WAAW;EACzC;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BH,SAAgB,WAAW,EACzB,OACA,YACA,aACA,KACA,OACA,QACA,QASC;AAED,KACE,SAAS,QACT,cAAc,QACd,eAAe,QACf,OAAO,QACP,SAAS,QACT,UAAU,QACV,QAAQ,KAER,QAAO,EAAE;AAQX,KAFE,SAAS,QAAQ,cAAc,QAAQ,eAAe,MAE/B;EACvB,MAAM,SAAiC,EAAE;AAEzC,MAAI,OAAO,MAAM;GACf,MAAM,MAAM,gBAAgB,IAAI;AAChC,OAAI,IAAK,QAAO,SAAS;;AAE3B,MAAI,SAAS,MAAM;GACjB,MAAM,MAAM,gBAAgB,MAAM;AAClC,OAAI,IAAK,QAAO,WAAW;;AAE7B,MAAI,UAAU,MAAM;GAClB,MAAM,MAAM,gBAAgB,OAAO;AACnC,OAAI,IAAK,QAAO,YAAY;;AAE9B,MAAI,QAAQ,MAAM;GAChB,MAAM,MAAM,gBAAgB,KAAK;AACjC,OAAI,IAAK,QAAO,UAAU;;AAG5B,SAAO;;CAKT,IAAI,CAAC,QAAQ,UAAU,WAAW,WAAW;EAAC;EAAQ;EAAQ;EAAQ;EAAO;AAG7E,KAAI,SAAS,MAAM;EACjB,MAAM,EAAE,QAAQ,eAAe,sBAAsB,MAAM;AAE3D,MAAI,OAAO,OACT,KAAI,WAAW,WAAW,GAAG;AAC3B,YAAS,OAAO;AAChB,cAAW,OAAO,MAAM,OAAO;AAC/B,eAAY,OAAO,MAAM,OAAO;AAChC,aAAU,OAAO,MAAM,OAAO,MAAM,OAAO;QAI3C,YAAW,SAAS,KAAK,MAAM;GAC7B,MAAM,MAAM,OAAO,MAAM,OAAO;AAChC,OAAI,QAAQ,MAAO,UAAS;YACnB,QAAQ,QAAS,YAAW;YAC5B,QAAQ,SAAU,aAAY;YAC9B,QAAQ,OAAQ,WAAU;IACnC;;AAMR,KAAI,cAAc,MAAM;EACtB,MAAM,MAAM,gBAAgB,WAAW;AACvC,MAAI,IAAK,UAAS,YAAY;;AAEhC,KAAI,eAAe,MAAM;EACvB,MAAM,MAAM,gBAAgB,YAAY;AACxC,MAAI,IAAK,WAAU,WAAW;;AAIhC,KAAI,OAAO,MAAM;EACf,MAAM,MAAM,gBAAgB,IAAI;AAChC,MAAI,IAAK,UAAS;;AAEpB,KAAI,SAAS,MAAM;EACjB,MAAM,MAAM,gBAAgB,MAAM;AAClC,MAAI,IAAK,YAAW;;AAEtB,KAAI,UAAU,MAAM;EAClB,MAAM,MAAM,gBAAgB,OAAO;AACnC,MAAI,IAAK,aAAY;;AAEvB,KAAI,QAAQ,MAAM;EAChB,MAAM,MAAM,gBAAgB,KAAK;AACjC,MAAI,IAAK,WAAU;;AAIrB,KAAI,WAAW,YAAY,aAAa,aAAa,cAAc,QACjE,QAAO,EAAE,OAAO,QAAQ;AAE1B,KAAI,WAAW,aAAa,YAAY,SACtC,QAAO,EAAE,OAAO,GAAG,OAAO,GAAG,WAAW;AAG1C,QAAO,EAAE,OAAO,GAAG,OAAO,GAAG,SAAS,GAAG,UAAU,GAAG,WAAW;;AAGnE,WAAW,iBAAiB;CAC1B;CACA;CACA;CACA;CACA;CACA;CACA;CACD"}
|
package/dist/styles/justify.mjs
DELETED
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
//#region src/styles/justify.ts
|
|
2
|
-
function justifyStyle({ justify }) {
|
|
3
|
-
if (typeof justify !== "string") return;
|
|
4
|
-
if (!justify) return;
|
|
5
|
-
return {
|
|
6
|
-
"justify-items": justify,
|
|
7
|
-
"justify-content": justify
|
|
8
|
-
};
|
|
9
|
-
}
|
|
10
|
-
justifyStyle.__lookupStyles = ["justify"];
|
|
11
|
-
|
|
12
|
-
//#endregion
|
|
13
|
-
export { justifyStyle };
|
|
14
|
-
//# sourceMappingURL=justify.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"justify.mjs","names":[],"sources":["../../src/styles/justify.ts"],"sourcesContent":["export function justifyStyle({ justify }) {\n if (typeof justify !== 'string') return;\n\n if (!justify) return;\n\n return {\n 'justify-items': justify,\n 'justify-content': justify,\n };\n}\n\njustifyStyle.__lookupStyles = ['justify'];\n"],"mappings":";AAAA,SAAgB,aAAa,EAAE,WAAW;AACxC,KAAI,OAAO,YAAY,SAAU;AAEjC,KAAI,CAAC,QAAS;AAEd,QAAO;EACL,iBAAiB;EACjB,mBAAmB;EACpB;;AAGH,aAAa,iBAAiB,CAAC,UAAU"}
|
package/dist/styles/margin.mjs
DELETED
|
@@ -1,96 +0,0 @@
|
|
|
1
|
-
import { DIRECTIONS, filterMods, parseStyle } from "../utils/styles.mjs";
|
|
2
|
-
|
|
3
|
-
//#region src/styles/margin.ts
|
|
4
|
-
/**
|
|
5
|
-
* Parse a margin value and return the first processed value
|
|
6
|
-
*/
|
|
7
|
-
function parseMarginValue(value) {
|
|
8
|
-
if (typeof value === "number") return `${value}px`;
|
|
9
|
-
if (!value) return null;
|
|
10
|
-
if (value === true) value = "1x";
|
|
11
|
-
const { values } = parseStyle(value).groups[0] ?? { values: [] };
|
|
12
|
-
return values[0] || "var(--gap)";
|
|
13
|
-
}
|
|
14
|
-
/**
|
|
15
|
-
* Parse margin value with optional directions (like "1x top" or "2x left right")
|
|
16
|
-
*/
|
|
17
|
-
function parseDirectionalMargin(value) {
|
|
18
|
-
if (typeof value === "number") return {
|
|
19
|
-
values: [`${value}px`],
|
|
20
|
-
directions: []
|
|
21
|
-
};
|
|
22
|
-
if (!value) return {
|
|
23
|
-
values: [],
|
|
24
|
-
directions: []
|
|
25
|
-
};
|
|
26
|
-
if (value === true) value = "1x";
|
|
27
|
-
const { values = [], mods = [] } = parseStyle(value).groups[0] ?? {};
|
|
28
|
-
return {
|
|
29
|
-
values: values.length ? values : ["var(--gap)"],
|
|
30
|
-
directions: filterMods(mods, DIRECTIONS)
|
|
31
|
-
};
|
|
32
|
-
}
|
|
33
|
-
function marginStyle({ margin, marginBlock, marginInline, marginTop, marginRight, marginBottom, marginLeft }) {
|
|
34
|
-
if (margin == null && marginBlock == null && marginInline == null && marginTop == null && marginRight == null && marginBottom == null && marginLeft == null) return {};
|
|
35
|
-
let [top, right, bottom, left] = [
|
|
36
|
-
"0",
|
|
37
|
-
"0",
|
|
38
|
-
"0",
|
|
39
|
-
"0"
|
|
40
|
-
];
|
|
41
|
-
if (margin != null) {
|
|
42
|
-
const { values, directions } = parseDirectionalMargin(margin);
|
|
43
|
-
if (values.length) if (directions.length === 0) {
|
|
44
|
-
top = values[0];
|
|
45
|
-
right = values[1] || values[0];
|
|
46
|
-
bottom = values[2] || values[0];
|
|
47
|
-
left = values[3] || values[1] || values[0];
|
|
48
|
-
} else directions.forEach((dir, i) => {
|
|
49
|
-
const val = values[i] ?? values[0];
|
|
50
|
-
if (dir === "top") top = val;
|
|
51
|
-
else if (dir === "right") right = val;
|
|
52
|
-
else if (dir === "bottom") bottom = val;
|
|
53
|
-
else if (dir === "left") left = val;
|
|
54
|
-
});
|
|
55
|
-
}
|
|
56
|
-
if (marginBlock != null) {
|
|
57
|
-
const val = parseMarginValue(marginBlock);
|
|
58
|
-
if (val) top = bottom = val;
|
|
59
|
-
}
|
|
60
|
-
if (marginInline != null) {
|
|
61
|
-
const val = parseMarginValue(marginInline);
|
|
62
|
-
if (val) left = right = val;
|
|
63
|
-
}
|
|
64
|
-
if (marginTop != null) {
|
|
65
|
-
const val = parseMarginValue(marginTop);
|
|
66
|
-
if (val) top = val;
|
|
67
|
-
}
|
|
68
|
-
if (marginRight != null) {
|
|
69
|
-
const val = parseMarginValue(marginRight);
|
|
70
|
-
if (val) right = val;
|
|
71
|
-
}
|
|
72
|
-
if (marginBottom != null) {
|
|
73
|
-
const val = parseMarginValue(marginBottom);
|
|
74
|
-
if (val) bottom = val;
|
|
75
|
-
}
|
|
76
|
-
if (marginLeft != null) {
|
|
77
|
-
const val = parseMarginValue(marginLeft);
|
|
78
|
-
if (val) left = val;
|
|
79
|
-
}
|
|
80
|
-
if (top === right && right === bottom && bottom === left) return { margin: top };
|
|
81
|
-
if (top === bottom && left === right) return { margin: `${top} ${left}` };
|
|
82
|
-
return { margin: `${top} ${right} ${bottom} ${left}` };
|
|
83
|
-
}
|
|
84
|
-
marginStyle.__lookupStyles = [
|
|
85
|
-
"margin",
|
|
86
|
-
"marginTop",
|
|
87
|
-
"marginRight",
|
|
88
|
-
"marginBottom",
|
|
89
|
-
"marginLeft",
|
|
90
|
-
"marginBlock",
|
|
91
|
-
"marginInline"
|
|
92
|
-
];
|
|
93
|
-
|
|
94
|
-
//#endregion
|
|
95
|
-
export { marginStyle };
|
|
96
|
-
//# sourceMappingURL=margin.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"margin.mjs","names":[],"sources":["../../src/styles/margin.ts"],"sourcesContent":["import { DIRECTIONS, filterMods, parseStyle } from '../utils/styles';\n\n/**\n * Parse a margin value and return the first processed value\n */\nfunction parseMarginValue(value: string | number | boolean): string | null {\n if (typeof value === 'number') return `${value}px`;\n if (!value) return null;\n if (value === true) value = '1x';\n\n const { values } = parseStyle(value).groups[0] ?? { values: [] };\n\n return values[0] || 'var(--gap)';\n}\n\n/**\n * Parse margin value with optional directions (like \"1x top\" or \"2x left right\")\n */\nfunction parseDirectionalMargin(value: string | number | boolean): {\n values: string[];\n directions: string[];\n} {\n if (typeof value === 'number') {\n return { values: [`${value}px`], directions: [] };\n }\n if (!value) return { values: [], directions: [] };\n if (value === true) value = '1x';\n\n const { values = [], mods = [] } = parseStyle(value).groups[0] ?? {};\n\n return {\n values: values.length ? values : ['var(--gap)'],\n directions: filterMods(mods, DIRECTIONS),\n };\n}\n\nexport function marginStyle({\n margin,\n marginBlock,\n marginInline,\n marginTop,\n marginRight,\n marginBottom,\n marginLeft,\n}: {\n margin?: string | number | boolean;\n marginBlock?: string | number | boolean;\n marginInline?: string | number | boolean;\n marginTop?: string | number | boolean;\n marginRight?: string | number | boolean;\n marginBottom?: string | number | boolean;\n marginLeft?: string | number | boolean;\n}) {\n // If no margin is defined, return empty object\n if (\n margin == null &&\n marginBlock == null &&\n marginInline == null &&\n marginTop == null &&\n marginRight == null &&\n marginBottom == null &&\n marginLeft == null\n ) {\n return {};\n }\n\n // Initialize all directions to 0\n let [top, right, bottom, left] = ['0', '0', '0', '0'];\n\n // Priority 1 (lowest): margin\n if (margin != null) {\n const { values, directions } = parseDirectionalMargin(margin);\n\n if (values.length) {\n if (directions.length === 0) {\n top = values[0];\n right = values[1] || values[0];\n bottom = values[2] || values[0];\n left = values[3] || values[1] || values[0];\n } else {\n // Assign values to directions in the order they appear\n // e.g., 'right 1x top 2x' → right: 1x, top: 2x\n directions.forEach((dir, i) => {\n const val = values[i] ?? values[0];\n if (dir === 'top') top = val;\n else if (dir === 'right') right = val;\n else if (dir === 'bottom') bottom = val;\n else if (dir === 'left') left = val;\n });\n }\n }\n }\n\n // Priority 2 (medium): marginBlock/marginInline\n if (marginBlock != null) {\n const val = parseMarginValue(marginBlock);\n if (val) top = bottom = val;\n }\n if (marginInline != null) {\n const val = parseMarginValue(marginInline);\n if (val) left = right = val;\n }\n\n // Priority 3 (highest): individual directions\n if (marginTop != null) {\n const val = parseMarginValue(marginTop);\n if (val) top = val;\n }\n if (marginRight != null) {\n const val = parseMarginValue(marginRight);\n if (val) right = val;\n }\n if (marginBottom != null) {\n const val = parseMarginValue(marginBottom);\n if (val) bottom = val;\n }\n if (marginLeft != null) {\n const val = parseMarginValue(marginLeft);\n if (val) left = val;\n }\n\n // Optimize output: 1 value if all same, 2 values if top==bottom && left==right\n if (top === right && right === bottom && bottom === left) {\n return { margin: top };\n }\n if (top === bottom && left === right) {\n return { margin: `${top} ${left}` };\n }\n\n return { margin: `${top} ${right} ${bottom} ${left}` };\n}\n\nmarginStyle.__lookupStyles = [\n 'margin',\n 'marginTop',\n 'marginRight',\n 'marginBottom',\n 'marginLeft',\n 'marginBlock',\n 'marginInline',\n];\n"],"mappings":";;;;;;AAKA,SAAS,iBAAiB,OAAiD;AACzE,KAAI,OAAO,UAAU,SAAU,QAAO,GAAG,MAAM;AAC/C,KAAI,CAAC,MAAO,QAAO;AACnB,KAAI,UAAU,KAAM,SAAQ;CAE5B,MAAM,EAAE,WAAW,WAAW,MAAM,CAAC,OAAO,MAAM,EAAE,QAAQ,EAAE,EAAE;AAEhE,QAAO,OAAO,MAAM;;;;;AAMtB,SAAS,uBAAuB,OAG9B;AACA,KAAI,OAAO,UAAU,SACnB,QAAO;EAAE,QAAQ,CAAC,GAAG,MAAM,IAAI;EAAE,YAAY,EAAE;EAAE;AAEnD,KAAI,CAAC,MAAO,QAAO;EAAE,QAAQ,EAAE;EAAE,YAAY,EAAE;EAAE;AACjD,KAAI,UAAU,KAAM,SAAQ;CAE5B,MAAM,EAAE,SAAS,EAAE,EAAE,OAAO,EAAE,KAAK,WAAW,MAAM,CAAC,OAAO,MAAM,EAAE;AAEpE,QAAO;EACL,QAAQ,OAAO,SAAS,SAAS,CAAC,aAAa;EAC/C,YAAY,WAAW,MAAM,WAAW;EACzC;;AAGH,SAAgB,YAAY,EAC1B,QACA,aACA,cACA,WACA,aACA,cACA,cASC;AAED,KACE,UAAU,QACV,eAAe,QACf,gBAAgB,QAChB,aAAa,QACb,eAAe,QACf,gBAAgB,QAChB,cAAc,KAEd,QAAO,EAAE;CAIX,IAAI,CAAC,KAAK,OAAO,QAAQ,QAAQ;EAAC;EAAK;EAAK;EAAK;EAAI;AAGrD,KAAI,UAAU,MAAM;EAClB,MAAM,EAAE,QAAQ,eAAe,uBAAuB,OAAO;AAE7D,MAAI,OAAO,OACT,KAAI,WAAW,WAAW,GAAG;AAC3B,SAAM,OAAO;AACb,WAAQ,OAAO,MAAM,OAAO;AAC5B,YAAS,OAAO,MAAM,OAAO;AAC7B,UAAO,OAAO,MAAM,OAAO,MAAM,OAAO;QAIxC,YAAW,SAAS,KAAK,MAAM;GAC7B,MAAM,MAAM,OAAO,MAAM,OAAO;AAChC,OAAI,QAAQ,MAAO,OAAM;YAChB,QAAQ,QAAS,SAAQ;YACzB,QAAQ,SAAU,UAAS;YAC3B,QAAQ,OAAQ,QAAO;IAChC;;AAMR,KAAI,eAAe,MAAM;EACvB,MAAM,MAAM,iBAAiB,YAAY;AACzC,MAAI,IAAK,OAAM,SAAS;;AAE1B,KAAI,gBAAgB,MAAM;EACxB,MAAM,MAAM,iBAAiB,aAAa;AAC1C,MAAI,IAAK,QAAO,QAAQ;;AAI1B,KAAI,aAAa,MAAM;EACrB,MAAM,MAAM,iBAAiB,UAAU;AACvC,MAAI,IAAK,OAAM;;AAEjB,KAAI,eAAe,MAAM;EACvB,MAAM,MAAM,iBAAiB,YAAY;AACzC,MAAI,IAAK,SAAQ;;AAEnB,KAAI,gBAAgB,MAAM;EACxB,MAAM,MAAM,iBAAiB,aAAa;AAC1C,MAAI,IAAK,UAAS;;AAEpB,KAAI,cAAc,MAAM;EACtB,MAAM,MAAM,iBAAiB,WAAW;AACxC,MAAI,IAAK,QAAO;;AAIlB,KAAI,QAAQ,SAAS,UAAU,UAAU,WAAW,KAClD,QAAO,EAAE,QAAQ,KAAK;AAExB,KAAI,QAAQ,UAAU,SAAS,MAC7B,QAAO,EAAE,QAAQ,GAAG,IAAI,GAAG,QAAQ;AAGrC,QAAO,EAAE,QAAQ,GAAG,IAAI,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ;;AAGxD,YAAY,iBAAiB;CAC3B;CACA;CACA;CACA;CACA;CACA;CACA;CACD"}
|