@plitzi/sdk-style 0.36.1 → 0.37.0
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/CHANGELOG.md +72 -0
- package/dist/StyleMap/StyleMap.d.ts +5 -21
- package/dist/StyleMap/helpers/isValueValid.d.ts +1 -0
- package/dist/StyleMap/helpers/isValueValid.mjs +3 -3
- package/dist/StyleMap/helpers/utils.d.ts +2 -2
- package/dist/StyleMap/helpers/utils.mjs +43 -28
- package/dist/StyleMap/methods/addSelector.d.ts +2 -7
- package/dist/StyleMap/methods/addSelector.mjs +4 -4
- package/dist/StyleMap/methods/updateSelector.d.ts +2 -5
- package/dist/StyleMap/methods/updateSelector.mjs +2 -2
- package/dist/StyleReducer.d.ts +3 -11
- package/dist/components/Selector/Selector.mjs +149 -125
- package/dist/components/Selector/SelectorHelper.d.ts +25 -0
- package/dist/components/Selector/SelectorHelper.mjs +43 -2
- package/dist/components/StyleInspector/Inspector.d.ts +2 -1
- package/dist/components/StyleInspector/Inspector.mjs +92 -87
- package/dist/components/StyleInspector/StyleInspector.mjs +240 -169
- package/dist/components/StyleInspector/StyleInspectorContext.d.ts +1 -0
- package/dist/components/StyleInspector/StyleInspectorProvider.d.ts +2 -1
- package/dist/components/StyleInspector/StyleInspectorProvider.mjs +37 -31
- package/dist/components/StyleInspector/categories/Others/Others.mjs +58 -48
- package/dist/components/StyleInspector/categories/Others/OthersScrollbar.d.ts +9 -0
- package/dist/components/StyleInspector/categories/Others/OthersScrollbar.mjs +36 -0
- package/dist/components/StyleInspector/categories/Typography/Typography.mjs +29 -45
- package/dist/components/StyleInspector/categories/Typography/TypographyFigures.d.ts +13 -0
- package/dist/components/StyleInspector/categories/Typography/TypographyFigures.mjs +61 -0
- package/dist/components/StyleInspector/components/AncestorRules/AncestorRuleChip.d.ts +10 -0
- package/dist/components/StyleInspector/components/AncestorRules/AncestorRuleChip.mjs +39 -0
- package/dist/components/StyleInspector/components/AncestorRules/AncestorRules.d.ts +14 -0
- package/dist/components/StyleInspector/components/AncestorRules/AncestorRules.mjs +36 -0
- package/dist/components/StyleInspector/components/AncestorRules/index.d.ts +3 -0
- package/dist/components/StyleInspector/components/AncestorRules/index.mjs +5 -0
- package/dist/components/StyleInspector/helpers.d.ts +36 -0
- package/dist/components/StyleInspector/helpers.mjs +54 -0
- package/dist/components/StyleInspector/hooks/useStyleInherit.d.ts +2 -1
- package/dist/components/StyleInspector/hooks/useStyleInherit.mjs +7 -5
- package/dist/components/StyleManager/ManagerSelector.d.ts +3 -2
- package/dist/components/StyleManager/ManagerSelector.mjs +114 -86
- package/dist/components/StyleManager/StyleManager.mjs +1 -0
- package/dist/components/StyleManager/StyleSelectorTag.d.ts +4 -1
- package/dist/components/StyleManager/StyleSelectorTag.mjs +36 -22
- package/dist/helpers/calculateInheriting.d.ts +1 -0
- package/dist/helpers/calculateInheriting.mjs +38 -28
- package/dist/helpers/processSelector.mjs +44 -21
- package/dist/helpers/processSelectorAttributes.d.ts +14 -6
- package/dist/helpers/processSelectorAttributes.mjs +38 -22
- package/package.json +18 -6
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
import e from "./processSelectorAttributes.mjs";
|
|
2
2
|
import t from "./processSelectorName.mjs";
|
|
3
3
|
import n from "./processSelectorVariables.mjs";
|
|
4
|
+
import { inCascadeOrder as r } from "@plitzi/sdk-shared/style/styleStates";
|
|
4
5
|
//#region src/helpers/processSelector.ts
|
|
5
|
-
var
|
|
6
|
-
let o = [], s =
|
|
6
|
+
var i = 2, a = (e = i) => " ".repeat(e), o = (e, t, n) => `${n || !t.length ? e : `${e}\n`}${t.join(n ? "" : "\n")}`, s = (e, t, n = !0, r = i) => {
|
|
7
|
+
let o = [], s = a(r), c = a(r + i);
|
|
7
8
|
for (let r of ["light", "dark"]) if (t[r].length) {
|
|
8
9
|
if (n) o.push(`@media(prefers-color-scheme:${r}){${e}{${t[r].join("")}}}`);
|
|
9
10
|
else {
|
|
@@ -12,30 +13,52 @@ var r = 2, i = (e = r) => " ".repeat(e), a = (e, t, n) => `${n || !t.length ? e
|
|
|
12
13
|
}
|
|
13
14
|
}
|
|
14
15
|
return o;
|
|
15
|
-
},
|
|
16
|
-
let
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
}
|
|
16
|
+
}, c = (e, t, n = "") => [`${e}[data-variant="${t}"]${n}`, `${e}--${t}${n}`], l = (e, t, n) => {
|
|
17
|
+
let i = t ? "," : ", ", a = [];
|
|
18
|
+
for (let [o, { default: s, states: l, variants: u }] of Object.entries(e)) {
|
|
19
|
+
s?.length && a.push(d(`:where(.${o}) &`, s, {}, t, n));
|
|
20
|
+
for (let [e, i] of r(l ?? {})) a.push(d(`:where(.${o}:${e}) &`, i, {}, t, n));
|
|
21
|
+
for (let [e, s] of Object.entries(u ?? {})) {
|
|
22
|
+
if (s.default.length) {
|
|
23
|
+
let r = c(`.${o}`, e).join(i);
|
|
24
|
+
a.push(d(`:where(${r}) &`, s.default, {}, t, n));
|
|
25
|
+
}
|
|
26
|
+
for (let [l, u] of r(s.states ?? {})) {
|
|
27
|
+
let r = c(`.${o}`, e, `:${l}`).join(i);
|
|
28
|
+
a.push(d(`:where(${r}) &`, u, {}, t, n));
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
return a;
|
|
33
|
+
}, u = (e, t, n, o = !0, s = i) => {
|
|
34
|
+
let { states: c, variants: u, ancestors: f } = n, p = o ? t.join("") : t.map((e) => `${a(s + i)}${e}`).join("\n").replaceAll(":", ": "), m = c ? r(c).map(([e, t]) => d(`&:${e}`, t, {}, o, s + i)) : [], h = e.replace("plitzi__", ""), g = u ? Object.entries(u).map(([e, t]) => d(`&[data-variant="${e}"]${o ? "," : ", "}&${h}--${e}`, t.default, { states: t.states }, o, s + i)) : [], _ = f ? l(f, o, s + i) : [];
|
|
35
|
+
if (o) return `${p}${m.join("")}${g.join("")}${_.join("")}`;
|
|
36
|
+
let v = p ? [p] : [];
|
|
37
|
+
for (let e of [
|
|
38
|
+
m,
|
|
39
|
+
g,
|
|
40
|
+
_
|
|
41
|
+
]) e.length && v.push(e.join("\n\n"));
|
|
42
|
+
return v.join("\n\n");
|
|
43
|
+
}, d = (e, t, n, r = !0, o = i) => {
|
|
44
|
+
let s = u(e, t, n, r, o);
|
|
45
|
+
return r ? `${e}{${s}}` : `${a(o)}${e} {\n${s}\n${a(o)}}`;
|
|
46
|
+
}, f = (e, t, n = !0, r = i) => {
|
|
24
47
|
let a = [];
|
|
25
|
-
for (let [o,
|
|
48
|
+
for (let [o, s] of Object.entries(t)) {
|
|
26
49
|
if (o === "base") {
|
|
27
|
-
let t =
|
|
50
|
+
let t = u(e, s.default, s, n, r);
|
|
28
51
|
t && a.push(t);
|
|
29
52
|
continue;
|
|
30
53
|
}
|
|
31
|
-
a.push(
|
|
54
|
+
a.push(d(`${e}-${o}`, s.default, s, n, r + i));
|
|
32
55
|
}
|
|
33
56
|
return n ? `${e}{${a.join("")}}` : `${e} {\n${a.join("\n\n")}\n}`;
|
|
34
|
-
},
|
|
35
|
-
let
|
|
36
|
-
c &&
|
|
37
|
-
let
|
|
38
|
-
return
|
|
39
|
-
},
|
|
57
|
+
}, p = (r, i = !0) => {
|
|
58
|
+
let a = t(r), c = n(r), l = e(r), u = c ? s(a, c, i) : void 0;
|
|
59
|
+
c && l.attributes.base.default.push(...c.default);
|
|
60
|
+
let d = f(a, l.attributes, i, 0);
|
|
61
|
+
return u ? o(d, u, i) : d;
|
|
62
|
+
}, m = (e, t = !1) => e.map((e) => p(e, t));
|
|
40
63
|
//#endregion
|
|
41
|
-
export {
|
|
64
|
+
export { p as default, m as processSelectors };
|
|
@@ -1,11 +1,19 @@
|
|
|
1
1
|
import { StyleItem, StyleState } from '@plitzi/sdk-shared';
|
|
2
|
-
type
|
|
2
|
+
type ProcessedStates = Partial<Record<StyleState, string[]>>;
|
|
3
|
+
type ProcessedVariants = Record<string, {
|
|
3
4
|
default: string[];
|
|
4
|
-
states?:
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
5
|
+
states?: ProcessedStates;
|
|
6
|
+
}>;
|
|
7
|
+
export type ProcessedAncestors = Record<string, {
|
|
8
|
+
default?: string[];
|
|
9
|
+
states?: ProcessedStates;
|
|
10
|
+
variants?: ProcessedVariants;
|
|
11
|
+
}>;
|
|
12
|
+
export type Attributes = Record<string, {
|
|
13
|
+
default: string[];
|
|
14
|
+
states?: ProcessedStates;
|
|
15
|
+
variants?: ProcessedVariants;
|
|
16
|
+
ancestors?: ProcessedAncestors;
|
|
9
17
|
}>;
|
|
10
18
|
export declare const processCssString: (attribute: string, value?: string) => {
|
|
11
19
|
variables: string[];
|
|
@@ -60,35 +60,51 @@ var e = (e, t, n = !1) => n ? t : `${e}:${t};`, t = (e) => {
|
|
|
60
60
|
variables: Object.keys(n.variables).map((e) => `${e}:${n.variables[e]};`),
|
|
61
61
|
value: n.value
|
|
62
62
|
};
|
|
63
|
+
}, o = (e) => {
|
|
64
|
+
if (!e) return;
|
|
65
|
+
let n = {};
|
|
66
|
+
for (let [r, i] of Object.entries(e)) {
|
|
67
|
+
let e = t(i);
|
|
68
|
+
e.length && (n[r] = e);
|
|
69
|
+
}
|
|
70
|
+
return Object.keys(n).length ? n : void 0;
|
|
71
|
+
}, s = (e) => {
|
|
72
|
+
if (!e) return;
|
|
73
|
+
let n = {};
|
|
74
|
+
for (let [r, i] of Object.entries(e)) {
|
|
75
|
+
let e = o(i.states);
|
|
76
|
+
n[r] = {
|
|
77
|
+
default: t(i.default),
|
|
78
|
+
...e && { states: e }
|
|
79
|
+
};
|
|
80
|
+
}
|
|
81
|
+
return Object.keys(n).length ? n : void 0;
|
|
82
|
+
}, c = (e) => {
|
|
83
|
+
if (!e) return;
|
|
84
|
+
let n = {};
|
|
85
|
+
for (let [r, i] of Object.entries(e)) {
|
|
86
|
+
let e = t(i.default), a = o(i.states), c = s(i.variants);
|
|
87
|
+
(e.length || a || c) && (n[r] = {
|
|
88
|
+
...e.length && { default: e },
|
|
89
|
+
...a && { states: a },
|
|
90
|
+
...c && { variants: c }
|
|
91
|
+
});
|
|
92
|
+
}
|
|
93
|
+
return Object.keys(n).length ? n : void 0;
|
|
63
94
|
};
|
|
64
|
-
function
|
|
95
|
+
function l(e) {
|
|
65
96
|
if (!e?.attributes || !Object.keys(e.attributes).length) return { attributes: { base: { default: [] } } };
|
|
66
97
|
let n = {};
|
|
67
98
|
for (let r in e.attributes) {
|
|
68
|
-
let i = e.attributes[r], a =
|
|
69
|
-
if (i.states) for (let [e, n] of Object.entries(i.states)) {
|
|
70
|
-
let r = t(n);
|
|
71
|
-
r.length && (o[e] = r);
|
|
72
|
-
}
|
|
73
|
-
let s = {};
|
|
74
|
-
if (i.variants) for (let e in i.variants) {
|
|
75
|
-
let n = i.variants[e], r = t(n.default), a = {};
|
|
76
|
-
if (n.states) for (let [e, r] of Object.entries(n.states)) {
|
|
77
|
-
let n = t(r);
|
|
78
|
-
n.length && (a[e] = n);
|
|
79
|
-
}
|
|
80
|
-
s[e] = {
|
|
81
|
-
default: r,
|
|
82
|
-
...Object.keys(a).length && { states: a }
|
|
83
|
-
};
|
|
84
|
-
}
|
|
99
|
+
let i = e.attributes[r], a = o(i.states), l = s(i.variants), u = c(i.ancestors);
|
|
85
100
|
n[r] = {
|
|
86
|
-
default:
|
|
87
|
-
...
|
|
88
|
-
...
|
|
101
|
+
default: t(i.default),
|
|
102
|
+
...a && { states: a },
|
|
103
|
+
...l && { variants: l },
|
|
104
|
+
...u && { ancestors: u }
|
|
89
105
|
};
|
|
90
106
|
}
|
|
91
107
|
return { attributes: n };
|
|
92
108
|
}
|
|
93
109
|
//#endregion
|
|
94
|
-
export {
|
|
110
|
+
export { l as default, a as processCssString };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@plitzi/sdk-style",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.37.0",
|
|
4
4
|
"license": "AGPL-3.0",
|
|
5
5
|
"files": [
|
|
6
6
|
"dist"
|
|
@@ -526,6 +526,10 @@
|
|
|
526
526
|
"types": "./dist/components/StyleInspector/categories/Others/OthersOutline.d.ts",
|
|
527
527
|
"import": "./dist/components/StyleInspector/categories/Others/OthersOutline.mjs"
|
|
528
528
|
},
|
|
529
|
+
"./components/StyleInspector/categories/Others/OthersScrollbar": {
|
|
530
|
+
"types": "./dist/components/StyleInspector/categories/Others/OthersScrollbar.d.ts",
|
|
531
|
+
"import": "./dist/components/StyleInspector/categories/Others/OthersScrollbar.mjs"
|
|
532
|
+
},
|
|
529
533
|
"./components/StyleInspector/categories/Others/OthersSvg": {
|
|
530
534
|
"types": "./dist/components/StyleInspector/categories/Others/OthersSvg.d.ts",
|
|
531
535
|
"import": "./dist/components/StyleInspector/categories/Others/OthersSvg.mjs"
|
|
@@ -654,6 +658,10 @@
|
|
|
654
658
|
"types": "./dist/components/StyleInspector/categories/Typography/TypographyConstants.d.ts",
|
|
655
659
|
"import": "./dist/components/StyleInspector/categories/Typography/TypographyConstants.mjs"
|
|
656
660
|
},
|
|
661
|
+
"./components/StyleInspector/categories/Typography/TypographyFigures": {
|
|
662
|
+
"types": "./dist/components/StyleInspector/categories/Typography/TypographyFigures.d.ts",
|
|
663
|
+
"import": "./dist/components/StyleInspector/categories/Typography/TypographyFigures.mjs"
|
|
664
|
+
},
|
|
657
665
|
"./components/StyleInspector/categories/Typography/TypographyFont": {
|
|
658
666
|
"types": "./dist/components/StyleInspector/categories/Typography/TypographyFont.d.ts",
|
|
659
667
|
"import": "./dist/components/StyleInspector/categories/Typography/TypographyFont.mjs"
|
|
@@ -786,6 +794,10 @@
|
|
|
786
794
|
"types": "./dist/components/StyleInspector/components/InspectorLabel/index.d.ts",
|
|
787
795
|
"import": "./dist/components/StyleInspector/components/InspectorLabel/index.mjs"
|
|
788
796
|
},
|
|
797
|
+
"./components/StyleInspector/helpers": {
|
|
798
|
+
"types": "./dist/components/StyleInspector/helpers.d.ts",
|
|
799
|
+
"import": "./dist/components/StyleInspector/helpers.mjs"
|
|
800
|
+
},
|
|
789
801
|
"./components/StyleInspector/hooks/useInspectorValues": {
|
|
790
802
|
"types": "./dist/components/StyleInspector/hooks/useInspectorValues.d.ts",
|
|
791
803
|
"import": "./dist/components/StyleInspector/hooks/useInspectorValues.mjs"
|
|
@@ -909,18 +921,18 @@
|
|
|
909
921
|
},
|
|
910
922
|
"dependencies": {
|
|
911
923
|
"@plitzi/plitzi-ui": "^1.6.21",
|
|
912
|
-
"@plitzi/sdk-plugins": "0.
|
|
913
|
-
"@plitzi/sdk-shared": "0.
|
|
914
|
-
"@plitzi/sdk-variables": "0.
|
|
924
|
+
"@plitzi/sdk-plugins": "0.37.0",
|
|
925
|
+
"@plitzi/sdk-shared": "0.37.0",
|
|
926
|
+
"@plitzi/sdk-variables": "0.37.0",
|
|
915
927
|
"clsx": "^2.1.1",
|
|
916
928
|
"immer": "^11.1.18",
|
|
917
929
|
"prop-types": "^15.8.1",
|
|
918
|
-
"zod": "^4.6.
|
|
930
|
+
"zod": "^4.6.5"
|
|
919
931
|
},
|
|
920
932
|
"devDependencies": {
|
|
921
933
|
"eslint": "^9.39.5",
|
|
922
934
|
"typescript": "^6.0.3",
|
|
923
935
|
"vite": "^8.3.0",
|
|
924
|
-
"vitest": "^5.0.
|
|
936
|
+
"vitest": "^5.0.1"
|
|
925
937
|
}
|
|
926
938
|
}
|