@greensight/gts 1.0.0-alpha.16 → 1.0.0-alpha.18
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/commands/generate/index.d.ts.map +1 -1
- package/index.cjs +71 -25
- package/index.mjs +726 -671
- package/modules/breakpoints/breakpointsFromTokenManager/module.d.ts +2 -7
- package/modules/breakpoints/breakpointsFromTokenManager/module.d.ts.map +1 -1
- package/modules/breakpoints/breakpointsFromTokenManager/utils.d.ts +3 -17
- package/modules/breakpoints/breakpointsFromTokenManager/utils.d.ts.map +1 -1
- package/modules/breakpoints/index.d.ts +0 -1
- package/modules/breakpoints/index.d.ts.map +1 -1
- package/modules/breakpoints/types.d.ts +0 -5
- package/modules/breakpoints/types.d.ts.map +1 -1
- package/modules/colors/colorsFromTokenManager/module.d.ts +2 -5
- package/modules/colors/colorsFromTokenManager/module.d.ts.map +1 -1
- package/modules/colors/utils.d.ts +8 -7
- package/modules/colors/utils.d.ts.map +1 -1
- package/modules/container/containerFromTokenManager/module.d.ts +2 -5
- package/modules/container/containerFromTokenManager/module.d.ts.map +1 -1
- package/modules/container/types.d.ts +2 -13
- package/modules/container/types.d.ts.map +1 -1
- package/modules/container/utils.d.ts +3 -7
- package/modules/container/utils.d.ts.map +1 -1
- package/modules/shadows/shadowsFromTokenManager.d.ts +2 -6
- package/modules/shadows/shadowsFromTokenManager.d.ts.map +1 -1
- package/modules/shadows/utils.d.ts +9 -8
- package/modules/shadows/utils.d.ts.map +1 -1
- package/modules/typography/typographyFromTokenManager/module.d.ts +5 -6
- package/modules/typography/typographyFromTokenManager/module.d.ts.map +1 -1
- package/modules/typography/utils.d.ts +16 -12
- package/modules/typography/utils.d.ts.map +1 -1
- package/package.json +1 -1
- package/modules/breakpoints/breakpointsListFromTokenManager/index.d.ts +0 -2
- package/modules/breakpoints/breakpointsListFromTokenManager/index.d.ts.map +0 -1
- package/modules/breakpoints/breakpointsListFromTokenManager/module.d.ts +0 -14
- package/modules/breakpoints/breakpointsListFromTokenManager/module.d.ts.map +0 -1
- package/modules/breakpoints/breakpointsListFromTokenManager/utils.d.ts +0 -9
- package/modules/breakpoints/breakpointsListFromTokenManager/utils.d.ts.map +0 -1
package/index.mjs
CHANGED
|
@@ -1,89 +1,89 @@
|
|
|
1
|
-
var
|
|
2
|
-
var
|
|
3
|
-
var
|
|
4
|
-
import
|
|
5
|
-
import { tsImport as
|
|
6
|
-
import { existsSync as
|
|
7
|
-
import { readFile as
|
|
8
|
-
import { resolve as
|
|
9
|
-
const
|
|
1
|
+
var ne = Object.defineProperty;
|
|
2
|
+
var se = (o, e, r) => e in o ? ne(o, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : o[e] = r;
|
|
3
|
+
var m = (o, e, r) => se(o, typeof e != "symbol" ? e + "" : e, r);
|
|
4
|
+
import k from "path";
|
|
5
|
+
import { tsImport as ae } from "ts-import";
|
|
6
|
+
import { existsSync as O } from "node:fs";
|
|
7
|
+
import { readFile as E, mkdir as ie, writeFile as le, rm as ce } from "node:fs/promises";
|
|
8
|
+
import { resolve as V } from "node:path";
|
|
9
|
+
const y = class y {
|
|
10
10
|
static resolveReadPath(e) {
|
|
11
11
|
if (!e || !e.trim())
|
|
12
12
|
throw new Error("File path must be a non-empty string");
|
|
13
|
-
return
|
|
13
|
+
return V(y.baseDir, e);
|
|
14
14
|
}
|
|
15
|
-
static resolveWritePath(e,
|
|
16
|
-
const
|
|
15
|
+
static resolveWritePath(e, r) {
|
|
16
|
+
const t = V(y.baseDir, r ?? "");
|
|
17
17
|
return {
|
|
18
|
-
targetDir:
|
|
19
|
-
targetPath:
|
|
18
|
+
targetDir: t,
|
|
19
|
+
targetPath: V(t, e)
|
|
20
20
|
};
|
|
21
21
|
}
|
|
22
|
-
static handleReadError(e,
|
|
23
|
-
throw e.code === "ENOENT" ? new Error(`File not found: ${
|
|
24
|
-
`Failed to read file "${
|
|
22
|
+
static handleReadError(e, r) {
|
|
23
|
+
throw e.code === "ENOENT" ? new Error(`File not found: ${r}`) : new Error(
|
|
24
|
+
`Failed to read file "${r}": ${e.message ?? String(e)}`
|
|
25
25
|
);
|
|
26
26
|
}
|
|
27
|
-
static async read(e,
|
|
28
|
-
const
|
|
27
|
+
static async read(e, r = "utf8") {
|
|
28
|
+
const t = y.resolveReadPath(e);
|
|
29
29
|
try {
|
|
30
|
-
return await
|
|
31
|
-
} catch (
|
|
32
|
-
|
|
30
|
+
return await E(t, { encoding: r });
|
|
31
|
+
} catch (n) {
|
|
32
|
+
y.handleReadError(n, t);
|
|
33
33
|
}
|
|
34
34
|
}
|
|
35
35
|
static async readBuffer(e) {
|
|
36
|
-
const
|
|
36
|
+
const r = y.resolveReadPath(e);
|
|
37
37
|
try {
|
|
38
|
-
return await
|
|
39
|
-
} catch (
|
|
40
|
-
|
|
38
|
+
return await E(r);
|
|
39
|
+
} catch (t) {
|
|
40
|
+
y.handleReadError(t, r);
|
|
41
41
|
}
|
|
42
42
|
}
|
|
43
43
|
static async readJson(e) {
|
|
44
|
-
const
|
|
44
|
+
const r = y.resolveReadPath(e);
|
|
45
45
|
try {
|
|
46
|
-
const
|
|
46
|
+
const t = await E(r, { encoding: "utf8" });
|
|
47
47
|
try {
|
|
48
|
-
return JSON.parse(
|
|
49
|
-
} catch (
|
|
50
|
-
throw new Error(`Failed to parse JSON from "${
|
|
48
|
+
return JSON.parse(t);
|
|
49
|
+
} catch (n) {
|
|
50
|
+
throw new Error(`Failed to parse JSON from "${r}": ${n.message}`);
|
|
51
51
|
}
|
|
52
|
-
} catch (
|
|
53
|
-
|
|
52
|
+
} catch (t) {
|
|
53
|
+
y.handleReadError(t, r);
|
|
54
54
|
}
|
|
55
55
|
}
|
|
56
|
-
static async write(e,
|
|
57
|
-
const { directory:
|
|
58
|
-
if (!s &&
|
|
56
|
+
static async write(e, r = "", t = {}) {
|
|
57
|
+
const { directory: n, overwrite: s = !0 } = t, { targetDir: a, targetPath: i } = y.resolveWritePath(e, n);
|
|
58
|
+
if (!s && O(i))
|
|
59
59
|
throw new Error(`File ${i} already exists`);
|
|
60
|
-
return await
|
|
60
|
+
return await ie(a, { recursive: !0 }), await le(i, r, { encoding: "utf8" }), i;
|
|
61
61
|
}
|
|
62
|
-
static async writeWithExtension(e,
|
|
63
|
-
const s =
|
|
64
|
-
return
|
|
62
|
+
static async writeWithExtension(e, r, t = "", n) {
|
|
63
|
+
const s = r.startsWith(".") ? r : `.${r}`, a = `${e}${s}`;
|
|
64
|
+
return y.write(a, t, n);
|
|
65
65
|
}
|
|
66
66
|
static exists(e) {
|
|
67
|
-
const
|
|
68
|
-
return
|
|
67
|
+
const r = y.resolveReadPath(e);
|
|
68
|
+
return O(r);
|
|
69
69
|
}
|
|
70
|
-
static async delete(e,
|
|
71
|
-
const { targetPath:
|
|
72
|
-
|
|
70
|
+
static async delete(e, r) {
|
|
71
|
+
const { targetPath: t } = y.resolveWritePath(e, r);
|
|
72
|
+
O(t) && await ce(t, { recursive: !0, force: !0 });
|
|
73
73
|
}
|
|
74
74
|
};
|
|
75
|
-
y
|
|
76
|
-
let
|
|
77
|
-
const
|
|
75
|
+
m(y, "baseDir", process.cwd());
|
|
76
|
+
let u = y;
|
|
77
|
+
const $ = class $ {
|
|
78
78
|
static async create() {
|
|
79
|
-
if (
|
|
79
|
+
if (u.exists($.configFileName))
|
|
80
80
|
throw new Error("The file already exists");
|
|
81
|
-
await
|
|
81
|
+
await u.write($.configFileName, "", { overwrite: !1 });
|
|
82
82
|
}
|
|
83
83
|
async load() {
|
|
84
84
|
try {
|
|
85
|
-
const e = await
|
|
86
|
-
`${
|
|
85
|
+
const e = await ae.compile(
|
|
86
|
+
`${k.resolve(process.cwd(), $.configFileName)}`
|
|
87
87
|
);
|
|
88
88
|
if (!e) throw new Error();
|
|
89
89
|
return e.default;
|
|
@@ -92,61 +92,61 @@ const b = class b {
|
|
|
92
92
|
}
|
|
93
93
|
}
|
|
94
94
|
};
|
|
95
|
-
|
|
96
|
-
let
|
|
97
|
-
const
|
|
95
|
+
m($, "configFileName", "gts.config.ts");
|
|
96
|
+
let j = $;
|
|
97
|
+
const ue = (o) => {
|
|
98
98
|
const e = new URLSearchParams();
|
|
99
|
-
return Object.keys(
|
|
100
|
-
Array.isArray(
|
|
99
|
+
return Object.keys(o).forEach((r) => {
|
|
100
|
+
Array.isArray(o[r]) ? o[r].forEach((t) => e.append(`${r}[]`, t)) : e.append(r, o[r]);
|
|
101
101
|
}), e;
|
|
102
|
-
},
|
|
103
|
-
const
|
|
104
|
-
for (let
|
|
105
|
-
|
|
106
|
-
return
|
|
102
|
+
}, de = (o, e = 50) => {
|
|
103
|
+
const r = [];
|
|
104
|
+
for (let t = 0; t < o.length; t += e)
|
|
105
|
+
r.push(o.slice(t, t + e));
|
|
106
|
+
return r;
|
|
107
107
|
};
|
|
108
|
-
class
|
|
109
|
-
constructor(e,
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
this.figmaToken = e, this.fileId =
|
|
108
|
+
class N {
|
|
109
|
+
constructor(e, r) {
|
|
110
|
+
m(this, "figmaToken");
|
|
111
|
+
m(this, "fileId");
|
|
112
|
+
m(this, "onTimeMeasureHandler");
|
|
113
|
+
this.figmaToken = e, this.fileId = r;
|
|
114
114
|
}
|
|
115
115
|
setOnTimeMeasureHandler(e) {
|
|
116
116
|
this.onTimeMeasureHandler = e;
|
|
117
117
|
}
|
|
118
118
|
static async returnJSON(e) {
|
|
119
|
-
const
|
|
119
|
+
const r = await e.json();
|
|
120
120
|
if (!e.ok) {
|
|
121
|
-
let
|
|
122
|
-
throw new Error(
|
|
121
|
+
let t = "Request failed";
|
|
122
|
+
throw new Error(t);
|
|
123
123
|
}
|
|
124
|
-
return
|
|
124
|
+
return r;
|
|
125
125
|
}
|
|
126
|
-
async performControlledRequest(e, { params:
|
|
127
|
-
var
|
|
126
|
+
async performControlledRequest(e, { params: r = {}, timeout: t = 3e4, abortController: n = new AbortController() } = {}) {
|
|
127
|
+
var b;
|
|
128
128
|
if (!this.figmaToken || !this.fileId)
|
|
129
129
|
throw new Error("Добавьте figmaToken и figmaId");
|
|
130
|
-
const s = Object.entries(
|
|
130
|
+
const s = Object.entries(r).reduce((T, [f, h]) => typeof h < "u" ? { ...T, [f]: h } : T, {}), a = `https://api.figma.com/v1${e}${s && Object.keys(s).length ? `?${ue(s)}` : ""}`;
|
|
131
131
|
console.log("endpoinWithParams=", a);
|
|
132
|
-
const i = setTimeout(() =>
|
|
132
|
+
const i = setTimeout(() => n.abort(), t), l = {
|
|
133
133
|
"Content-Type": "application/json",
|
|
134
134
|
...this.figmaToken && { "X-Figma-Token": this.figmaToken }
|
|
135
135
|
}, c = {
|
|
136
136
|
method: "GET",
|
|
137
137
|
headers: l,
|
|
138
|
-
signal:
|
|
139
|
-
},
|
|
138
|
+
signal: n.signal
|
|
139
|
+
}, d = performance.now(), p = await fetch(`${a}`, c);
|
|
140
140
|
clearTimeout(i);
|
|
141
|
-
const
|
|
142
|
-
return (
|
|
141
|
+
const g = performance.now() - d;
|
|
142
|
+
return (b = this.onTimeMeasureHandler) == null || b.call(this, a, l, g), p;
|
|
143
143
|
}
|
|
144
|
-
async request(e,
|
|
145
|
-
var
|
|
146
|
-
const
|
|
147
|
-
...
|
|
144
|
+
async request(e, r) {
|
|
145
|
+
var n;
|
|
146
|
+
const t = await this.performControlledRequest(e, {
|
|
147
|
+
...r
|
|
148
148
|
});
|
|
149
|
-
return (
|
|
149
|
+
return (n = t.headers.get("content-type")) != null && n.includes("application/json") ? N.returnJSON(t) : t;
|
|
150
150
|
}
|
|
151
151
|
async getComponents() {
|
|
152
152
|
return this.request(`/files/${this.fileId}/components`);
|
|
@@ -155,88 +155,88 @@ class v {
|
|
|
155
155
|
return this.request(`/files/${this.fileId}/styles`);
|
|
156
156
|
}
|
|
157
157
|
async getNodes(e) {
|
|
158
|
-
const
|
|
158
|
+
const r = de(e).map(
|
|
159
159
|
(s) => this.request(`/files/${this.fileId}/nodes`, { params: { ids: s.join(",") } })
|
|
160
|
-
),
|
|
160
|
+
), t = await Promise.all(r);
|
|
161
161
|
return {
|
|
162
|
-
...
|
|
163
|
-
nodes:
|
|
162
|
+
...t[0],
|
|
163
|
+
nodes: t.reduce((s, a) => ({ ...s, ...a.nodes }), {})
|
|
164
164
|
};
|
|
165
165
|
}
|
|
166
166
|
}
|
|
167
|
-
const
|
|
168
|
-
const
|
|
169
|
-
let
|
|
170
|
-
for (const
|
|
171
|
-
if (
|
|
172
|
-
|
|
167
|
+
const fe = (o, e) => {
|
|
168
|
+
const r = Array.isArray(e) ? e : e.split(".");
|
|
169
|
+
let t = o;
|
|
170
|
+
for (const n of r) {
|
|
171
|
+
if (t == null || typeof t != "object") return;
|
|
172
|
+
t = t[n];
|
|
173
173
|
}
|
|
174
|
-
return r;
|
|
175
|
-
}, B = (n, e) => {
|
|
176
|
-
if (!e || typeof e != "object") return n;
|
|
177
|
-
if (!n || typeof n != "object") return e;
|
|
178
|
-
const t = { ...n };
|
|
179
|
-
for (const r in e)
|
|
180
|
-
e.hasOwnProperty(r) && (typeof e[r] == "object" && e[r] !== null && typeof t[r] == "object" && t[r] !== null ? t[r] = B(t[r], e[r]) : t[r] = e[r]);
|
|
181
174
|
return t;
|
|
175
|
+
}, H = (o, e) => {
|
|
176
|
+
if (!e || typeof e != "object") return o;
|
|
177
|
+
if (!o || typeof o != "object") return e;
|
|
178
|
+
const r = { ...o };
|
|
179
|
+
for (const t in e)
|
|
180
|
+
e.hasOwnProperty(t) && (typeof e[t] == "object" && e[t] !== null && typeof r[t] == "object" && r[t] !== null ? r[t] = H(r[t], e[t]) : r[t] = e[t]);
|
|
181
|
+
return r;
|
|
182
182
|
};
|
|
183
|
-
function
|
|
184
|
-
if (
|
|
183
|
+
function v(o, e) {
|
|
184
|
+
if (o === e)
|
|
185
185
|
return !0;
|
|
186
|
-
if (
|
|
187
|
-
return
|
|
188
|
-
if (typeof
|
|
186
|
+
if (o == null || e == null)
|
|
187
|
+
return o === e;
|
|
188
|
+
if (typeof o != typeof e)
|
|
189
189
|
return !1;
|
|
190
|
-
if (
|
|
191
|
-
return
|
|
192
|
-
if (
|
|
193
|
-
return
|
|
194
|
-
if (Array.isArray(
|
|
195
|
-
if (
|
|
190
|
+
if (o instanceof Date && e instanceof Date)
|
|
191
|
+
return o.getTime() === e.getTime();
|
|
192
|
+
if (o instanceof RegExp && e instanceof RegExp)
|
|
193
|
+
return o.toString() === e.toString();
|
|
194
|
+
if (Array.isArray(o) && Array.isArray(e)) {
|
|
195
|
+
if (o.length !== e.length)
|
|
196
196
|
return !1;
|
|
197
|
-
for (let
|
|
198
|
-
if (!
|
|
197
|
+
for (let r = 0; r < o.length; r++)
|
|
198
|
+
if (!v(o[r], e[r]))
|
|
199
199
|
return !1;
|
|
200
200
|
return !0;
|
|
201
201
|
}
|
|
202
|
-
if (typeof
|
|
203
|
-
const
|
|
204
|
-
if (
|
|
202
|
+
if (typeof o == "object" && typeof e == "object") {
|
|
203
|
+
const r = Object.keys(o), t = Object.keys(e);
|
|
204
|
+
if (r.length !== t.length)
|
|
205
205
|
return !1;
|
|
206
|
-
for (const
|
|
207
|
-
if (!
|
|
206
|
+
for (const n of r)
|
|
207
|
+
if (!t.includes(n) || !v(o[n], e[n]))
|
|
208
208
|
return !1;
|
|
209
209
|
return !0;
|
|
210
210
|
}
|
|
211
211
|
return !1;
|
|
212
212
|
}
|
|
213
|
-
const
|
|
213
|
+
const B = {
|
|
214
214
|
color: {},
|
|
215
215
|
effect: {},
|
|
216
216
|
text: {},
|
|
217
217
|
grid: {}
|
|
218
218
|
};
|
|
219
|
-
class
|
|
219
|
+
class pe {
|
|
220
220
|
constructor(e) {
|
|
221
221
|
// files
|
|
222
|
-
|
|
223
|
-
|
|
222
|
+
m(this, "tokensDir");
|
|
223
|
+
m(this, "manifestPath");
|
|
224
224
|
// result data
|
|
225
|
-
|
|
226
|
-
|
|
225
|
+
m(this, "variables");
|
|
226
|
+
m(this, "styles");
|
|
227
227
|
// flags
|
|
228
|
-
|
|
229
|
-
this.tokensDir = e || "", this.manifestPath =
|
|
228
|
+
m(this, "loaded", !1);
|
|
229
|
+
this.tokensDir = e || "", this.manifestPath = k.join(this.tokensDir, "manifest.json");
|
|
230
230
|
}
|
|
231
231
|
isLoaded() {
|
|
232
232
|
return this.loaded && !!this.variables && !!this.styles;
|
|
233
233
|
}
|
|
234
234
|
/** to camelCase */
|
|
235
235
|
normalizeKey(e) {
|
|
236
|
-
const
|
|
237
|
-
return
|
|
238
|
-
const s =
|
|
239
|
-
return
|
|
236
|
+
const r = e.trim();
|
|
237
|
+
return r && r.replace(/[-_\s]+/g, " ").split(" ").filter((t) => t.length).map((t, n) => {
|
|
238
|
+
const s = t.charAt(0), a = t.slice(1);
|
|
239
|
+
return n === 0 ? t.toLowerCase() : s.toUpperCase() + a;
|
|
240
240
|
}).join("");
|
|
241
241
|
}
|
|
242
242
|
/**
|
|
@@ -244,10 +244,10 @@ class ee {
|
|
|
244
244
|
*/
|
|
245
245
|
parseVariableString(e) {
|
|
246
246
|
if (typeof e != "string") return e;
|
|
247
|
-
const
|
|
248
|
-
if (
|
|
249
|
-
const
|
|
250
|
-
return `{${this.normalizeKey(
|
|
247
|
+
const r = /^\{(.+)\}$/, t = e.match(r);
|
|
248
|
+
if (t) {
|
|
249
|
+
const n = t[1].trim();
|
|
250
|
+
return `{${this.normalizeKey(n)}}`;
|
|
251
251
|
}
|
|
252
252
|
return e;
|
|
253
253
|
}
|
|
@@ -256,59 +256,59 @@ class ee {
|
|
|
256
256
|
*/
|
|
257
257
|
createVariableFileList(e) {
|
|
258
258
|
return Object.entries(e).flatMap(
|
|
259
|
-
([
|
|
260
|
-
([
|
|
259
|
+
([r, t]) => Object.entries(t.modes).flatMap(
|
|
260
|
+
([n, s]) => s.map((a) => ({
|
|
261
261
|
fileName: a,
|
|
262
|
-
modeName: this.normalizeKey(
|
|
263
|
-
collectionName:
|
|
262
|
+
modeName: this.normalizeKey(n.trim()),
|
|
263
|
+
collectionName: r
|
|
264
264
|
}))
|
|
265
265
|
)
|
|
266
266
|
);
|
|
267
267
|
}
|
|
268
268
|
parseValue(e) {
|
|
269
|
-
return e && (typeof e == "string" ? this.parseVariableString(e) : typeof e != "object" ? e : Array.isArray(e) ? e.map((
|
|
269
|
+
return e && (typeof e == "string" ? this.parseVariableString(e) : typeof e != "object" ? e : Array.isArray(e) ? e.map((r) => this.parseValue(r)) : Object.entries(e).reduce((r, [t, n]) => ({ ...r, [t]: this.parseValue(n) }), {}));
|
|
270
270
|
}
|
|
271
|
-
getTokensFromFile(e,
|
|
272
|
-
return Object.entries(e).reduce((
|
|
273
|
-
...
|
|
274
|
-
[this.normalizeKey(
|
|
271
|
+
getTokensFromFile(e, r) {
|
|
272
|
+
return Object.entries(e).reduce((t, [n, s]) => "$type" in s && "$value" in s ? {
|
|
273
|
+
...t,
|
|
274
|
+
[this.normalizeKey(n)]: {
|
|
275
275
|
type: s.$type,
|
|
276
276
|
description: s.$description,
|
|
277
|
-
value:
|
|
277
|
+
value: r ? { [this.normalizeKey(r)]: this.parseValue(s.$value) } : this.parseValue(s.$value)
|
|
278
278
|
}
|
|
279
|
-
} : { ...
|
|
279
|
+
} : { ...t, [this.normalizeKey(n)]: this.getTokensFromFile(s, r) }, {});
|
|
280
280
|
}
|
|
281
|
-
processTokensFile(e,
|
|
282
|
-
const
|
|
283
|
-
return { [
|
|
281
|
+
processTokensFile(e, r, t) {
|
|
282
|
+
const n = this.normalizeKey(t), s = this.getTokensFromFile(e, r);
|
|
283
|
+
return { [n]: s };
|
|
284
284
|
}
|
|
285
285
|
/**
|
|
286
286
|
* Loads all variable files in parallel and returns processed results
|
|
287
287
|
*/
|
|
288
288
|
async loadVariableFiles(e) {
|
|
289
289
|
return Promise.all(
|
|
290
|
-
e.map(async ({ fileName:
|
|
290
|
+
e.map(async ({ fileName: r, modeName: t, collectionName: n }) => {
|
|
291
291
|
try {
|
|
292
|
-
const s =
|
|
293
|
-
return this.processTokensFile(a,
|
|
292
|
+
const s = k.join(this.tokensDir, r), a = await u.readJson(s);
|
|
293
|
+
return this.processTokensFile(a, t, n);
|
|
294
294
|
} catch (s) {
|
|
295
|
-
return console.warn(`Failed to load variable file: ${
|
|
295
|
+
return console.warn(`Failed to load variable file: ${k.join(this.tokensDir, r)}`, s), {};
|
|
296
296
|
}
|
|
297
297
|
})
|
|
298
298
|
);
|
|
299
299
|
}
|
|
300
300
|
mergeVariables(e) {
|
|
301
|
-
return e.reduce((
|
|
301
|
+
return e.reduce((r, t) => H(r, t), {});
|
|
302
302
|
}
|
|
303
303
|
/**
|
|
304
304
|
* Loads and processes all token variables from manifest collections
|
|
305
305
|
*/
|
|
306
306
|
async loadTokenVariables(e) {
|
|
307
307
|
try {
|
|
308
|
-
const
|
|
309
|
-
return this.mergeVariables(
|
|
310
|
-
} catch (
|
|
311
|
-
throw new Error(`Failed to load token variables from ${this.tokensDir}: ${
|
|
308
|
+
const r = this.createVariableFileList(e), t = await this.loadVariableFiles(r);
|
|
309
|
+
return this.mergeVariables(t);
|
|
310
|
+
} catch (r) {
|
|
311
|
+
throw new Error(`Failed to load token variables from ${this.tokensDir}: ${r}`);
|
|
312
312
|
}
|
|
313
313
|
}
|
|
314
314
|
/**
|
|
@@ -316,9 +316,9 @@ class ee {
|
|
|
316
316
|
*/
|
|
317
317
|
createStyleFileList(e) {
|
|
318
318
|
return Object.entries(e).flatMap(
|
|
319
|
-
([
|
|
320
|
-
styleType:
|
|
321
|
-
fileName:
|
|
319
|
+
([r, t]) => (t == null ? void 0 : t.map((n) => ({
|
|
320
|
+
styleType: r,
|
|
321
|
+
fileName: n
|
|
322
322
|
}))) || []
|
|
323
323
|
);
|
|
324
324
|
}
|
|
@@ -327,18 +327,18 @@ class ee {
|
|
|
327
327
|
*/
|
|
328
328
|
async loadStyleFiles(e) {
|
|
329
329
|
return (await Promise.all(
|
|
330
|
-
e.map(async ({ styleType:
|
|
330
|
+
e.map(async ({ styleType: t, fileName: n }) => {
|
|
331
331
|
try {
|
|
332
|
-
const s =
|
|
333
|
-
return { styleType:
|
|
332
|
+
const s = k.join(this.tokensDir, n), a = await u.readJson(s);
|
|
333
|
+
return { styleType: t, styleTokens: a };
|
|
334
334
|
} catch (s) {
|
|
335
|
-
return console.warn(`Failed to load style file: ${
|
|
335
|
+
return console.warn(`Failed to load style file: ${k.join(this.tokensDir, n)}`, s), { styleType: t, styleTokens: {} };
|
|
336
336
|
}
|
|
337
337
|
})
|
|
338
338
|
)).reduce(
|
|
339
|
-
(
|
|
339
|
+
(t, n) => ({ ...t, [n.styleType]: this.getTokensFromFile(n.styleTokens, "") }),
|
|
340
340
|
{
|
|
341
|
-
...
|
|
341
|
+
...B
|
|
342
342
|
}
|
|
343
343
|
);
|
|
344
344
|
}
|
|
@@ -346,13 +346,13 @@ class ee {
|
|
|
346
346
|
* Loads and processes all style tokens from manifest
|
|
347
347
|
*/
|
|
348
348
|
async loadStyles(e) {
|
|
349
|
-
if (!e) return { ...
|
|
350
|
-
const
|
|
351
|
-
return await this.loadStyleFiles(
|
|
349
|
+
if (!e) return { ...B };
|
|
350
|
+
const r = this.createStyleFileList(e);
|
|
351
|
+
return await this.loadStyleFiles(r);
|
|
352
352
|
}
|
|
353
353
|
async load() {
|
|
354
354
|
if (this.loaded) return;
|
|
355
|
-
const e = await
|
|
355
|
+
const e = await u.readJson(this.manifestPath);
|
|
356
356
|
if (!e)
|
|
357
357
|
throw new Error(`Failed to load manifest file from: ${this.manifestPath}`);
|
|
358
358
|
this.variables = await this.loadTokenVariables(e.collections), this.styles = await this.loadStyles(e.styles), this.loaded = !0;
|
|
@@ -397,9 +397,9 @@ class ee {
|
|
|
397
397
|
*/
|
|
398
398
|
resolveVariableValue(e) {
|
|
399
399
|
if (typeof e == "object")
|
|
400
|
-
return Object.keys(e).reduce((
|
|
401
|
-
const
|
|
402
|
-
return s && (t
|
|
400
|
+
return Object.keys(e).reduce((r, t) => {
|
|
401
|
+
const n = e[t], s = this.resolveVariableValueString(n, t);
|
|
402
|
+
return s && (r[t] = s), r;
|
|
403
403
|
}, {});
|
|
404
404
|
}
|
|
405
405
|
/**
|
|
@@ -408,38 +408,38 @@ class ee {
|
|
|
408
408
|
* @param mode - Mode name to get value for (optional)
|
|
409
409
|
* @returns resolved token variable or undefined if not found or invalid
|
|
410
410
|
*/
|
|
411
|
-
resolveVariableValueString(e,
|
|
411
|
+
resolveVariableValueString(e, r) {
|
|
412
412
|
if (!this.isVariableReference(e)) return e;
|
|
413
|
-
const
|
|
414
|
-
if (
|
|
415
|
-
return this.resolveVariableValueString(
|
|
413
|
+
const t = this.getVariablePath(e), n = this.getToken(t, r);
|
|
414
|
+
if (n)
|
|
415
|
+
return this.resolveVariableValueString(n, r);
|
|
416
416
|
}
|
|
417
417
|
/**
|
|
418
418
|
* Gets a nested token value by path, similar to lodash.get
|
|
419
419
|
* @param variablePath - Dot-separated string path or array of path segments
|
|
420
420
|
* @param mode - Mode name to get value for (optional)
|
|
421
421
|
*/
|
|
422
|
-
getToken(e,
|
|
422
|
+
getToken(e, r) {
|
|
423
423
|
if (!this.loaded || !this.variables)
|
|
424
424
|
throw new Error("Tokens not loaded. Call load() first.");
|
|
425
|
-
for (const
|
|
426
|
-
const
|
|
427
|
-
if (
|
|
428
|
-
if (
|
|
425
|
+
for (const t of Object.values(this.variables)) {
|
|
426
|
+
const n = fe(t, e);
|
|
427
|
+
if (n != null && n.value && typeof n.value == "object") {
|
|
428
|
+
if (r) return n.value[r];
|
|
429
429
|
{
|
|
430
|
-
const s = Object.keys(
|
|
431
|
-
return
|
|
430
|
+
const s = Object.keys(n.value)[0];
|
|
431
|
+
return n.value[s];
|
|
432
432
|
}
|
|
433
433
|
}
|
|
434
434
|
}
|
|
435
435
|
}
|
|
436
436
|
}
|
|
437
|
-
const
|
|
438
|
-
const e = await new
|
|
437
|
+
const yt = async () => {
|
|
438
|
+
const e = await new j().load();
|
|
439
439
|
if (!e)
|
|
440
440
|
throw new Error("Заполнить ошибку через нейронку");
|
|
441
|
-
const { figmaToken:
|
|
442
|
-
s &&
|
|
441
|
+
const { figmaToken: r, fileId: t, modules: n, manifest: s } = e, a = new N(r, t), i = new pe(s);
|
|
442
|
+
s && u.exists(s) && await i.load(), await Promise.all(
|
|
443
443
|
// [
|
|
444
444
|
// colorsFromTokenManager({
|
|
445
445
|
// input: {
|
|
@@ -492,7 +492,6 @@ const ot = async () => {
|
|
|
492
492
|
// }),
|
|
493
493
|
// typographyFromTokenManager({
|
|
494
494
|
// input: {
|
|
495
|
-
// isModule: true,
|
|
496
495
|
// breakpoints: {
|
|
497
496
|
// desktop: '1440',
|
|
498
497
|
// mobile: '768',
|
|
@@ -500,516 +499,477 @@ const ot = async () => {
|
|
|
500
499
|
// },
|
|
501
500
|
// },
|
|
502
501
|
// output: {
|
|
503
|
-
//
|
|
504
|
-
//
|
|
502
|
+
// dir: './typography',
|
|
503
|
+
// },
|
|
504
|
+
// }),
|
|
505
|
+
// ].map(module => module.executor({ figmaApiClient, tokenManagerClient }))
|
|
506
|
+
// [
|
|
507
|
+
// colorsFromTokenManager({
|
|
508
|
+
// input: {
|
|
509
|
+
// includeVariables: ['colors'],
|
|
510
|
+
// // includeStyles: false,
|
|
511
|
+
// },
|
|
512
|
+
// output: {
|
|
513
|
+
// dir: './colors',
|
|
514
|
+
// },
|
|
515
|
+
// }),
|
|
516
|
+
// shadowsFromTokenManager({
|
|
517
|
+
// input: {
|
|
518
|
+
// // includeVariables: ['colors'],
|
|
519
|
+
// // includeStyles: false,
|
|
520
|
+
// },
|
|
521
|
+
// output: {
|
|
522
|
+
// dir: './shadows',
|
|
523
|
+
// },
|
|
524
|
+
// }),
|
|
525
|
+
// typographyFromTokenManager({
|
|
526
|
+
// input: {
|
|
527
|
+
// breakpoints: {
|
|
528
|
+
// desktop: '1440',
|
|
529
|
+
// mobile: '768',
|
|
530
|
+
// blabla: '761',
|
|
531
|
+
// },
|
|
532
|
+
// fontFamily: {
|
|
533
|
+
// 'Sana Sans Alt': 'var(--sans-sans-alt)',
|
|
534
|
+
// },
|
|
535
|
+
// },
|
|
536
|
+
// output: {
|
|
537
|
+
// dir: './typography',
|
|
538
|
+
// },
|
|
539
|
+
// }),
|
|
540
|
+
// breakpointsFromTokenManager({
|
|
541
|
+
// input: {
|
|
542
|
+
// names: ['xxxl', 'xl', 'lg', 'md', 'sm', 'xs', 'xxs', 'xxxs'],
|
|
543
|
+
// },
|
|
544
|
+
// output: {
|
|
545
|
+
// dir: './breakpoints',
|
|
546
|
+
// },
|
|
547
|
+
// }),
|
|
548
|
+
// containerFromTokenManager({
|
|
549
|
+
// input: {
|
|
550
|
+
// layer: 'lalala',
|
|
551
|
+
// },
|
|
552
|
+
// output: {
|
|
553
|
+
// dir: './container',
|
|
505
554
|
// },
|
|
506
555
|
// }),
|
|
507
556
|
// ].map(module => module.executor({ figmaApiClient, tokenManagerClient }))
|
|
508
|
-
|
|
557
|
+
n.map((l) => l.executor({ figmaApiClient: a, tokenManagerClient: i }))
|
|
509
558
|
);
|
|
510
|
-
},
|
|
511
|
-
await
|
|
512
|
-
},
|
|
513
|
-
(e,
|
|
559
|
+
}, ht = async () => {
|
|
560
|
+
await j.create(), console.log("\x1B[32m%s\x1B[0m", "✔️ Configuration file created gts.config.ts");
|
|
561
|
+
}, ge = ["xxxl", "xxl", "xl", "lg", "md", "sm", "xs", "xxs", "xxxs"], ye = (o) => parseInt(o.value, 10), he = (o) => o.reduce(
|
|
562
|
+
(e, r) => ({
|
|
514
563
|
...e,
|
|
515
|
-
[
|
|
564
|
+
[r.name]: ye(r)
|
|
516
565
|
}),
|
|
517
566
|
{}
|
|
518
|
-
),
|
|
519
|
-
await
|
|
520
|
-
},
|
|
521
|
-
await
|
|
522
|
-
},
|
|
523
|
-
await
|
|
524
|
-
},
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
`
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
},
|
|
532
|
-
|
|
533
|
-
const e =
|
|
534
|
-
return
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
|
|
558
|
-
|
|
559
|
-
|
|
567
|
+
), me = async (o, e) => {
|
|
568
|
+
await u.delete(o, e);
|
|
569
|
+
}, be = async (o, e, r) => {
|
|
570
|
+
await u.write(o, e, { directory: r });
|
|
571
|
+
}, x = async (o, e, r) => {
|
|
572
|
+
await me(o, r), await be(o, e, r);
|
|
573
|
+
}, we = (o) => {
|
|
574
|
+
const e = o.map(({ name: r, value: t }) => ` --${r}: ${t};`);
|
|
575
|
+
return e.length ? `.breakpoint-variables {
|
|
576
|
+
${e.join(`
|
|
577
|
+
`)}
|
|
578
|
+
}
|
|
579
|
+
` : "";
|
|
580
|
+
}, ke = (o) => {
|
|
581
|
+
var t;
|
|
582
|
+
const e = o.map(({ name: n, value: s }) => ` ${n}: ${s}`), r = (t = o.at(-1)) == null ? void 0 : t.name;
|
|
583
|
+
return !e.length || !r ? "" : `$breakpointList: (
|
|
584
|
+
${e.join(`,
|
|
585
|
+
`)}
|
|
586
|
+
);
|
|
587
|
+
|
|
588
|
+
$defaultBreakpoint: '${r}';
|
|
589
|
+
`;
|
|
590
|
+
}, $e = (o) => [
|
|
591
|
+
`const breakpoints = ${JSON.stringify(o, null, 4)} as const;`,
|
|
592
|
+
"",
|
|
593
|
+
"const BREAKPOINTS_NAMES = Object.keys(breakpoints);",
|
|
594
|
+
"",
|
|
595
|
+
"type BreakpointsKeysType = keyof typeof breakpoints;",
|
|
596
|
+
"type AllowMedia = 'all' | BreakpointsKeysType;",
|
|
597
|
+
"",
|
|
598
|
+
"export { breakpoints, BREAKPOINTS_NAMES };",
|
|
599
|
+
"export type { BreakpointsKeysType, AllowMedia };",
|
|
600
|
+
""
|
|
601
|
+
].join(`
|
|
602
|
+
`), Te = async ({ breakpointTokens: o, dir: e }) => {
|
|
603
|
+
const r = he(o), t = we(o), n = ke(o), s = $e(r);
|
|
604
|
+
await Promise.all([
|
|
605
|
+
x("styles.css", t, e),
|
|
606
|
+
x("styles.scss", n, e),
|
|
607
|
+
x("index.ts", s, e)
|
|
608
|
+
]);
|
|
609
|
+
}, Se = (o, e) => {
|
|
610
|
+
const r = Object.keys(o).filter((s) => !isNaN(Number(s))).sort((s, a) => Number(s) - Number(a));
|
|
611
|
+
if (r.length > e.length)
|
|
560
612
|
throw new Error(
|
|
561
|
-
`Not enough breakpoint names provided. Found ${
|
|
613
|
+
`Not enough breakpoint names provided. Found ${r.length} breakpoints in data, but only ${e.length} names specified: ${e.join(", ")}`
|
|
562
614
|
);
|
|
563
|
-
const
|
|
564
|
-
if (
|
|
615
|
+
const n = Object.keys(o).filter((s) => isNaN(Number(s)));
|
|
616
|
+
if (n.length > 0)
|
|
565
617
|
throw new Error(
|
|
566
|
-
`Found non-numeric breakpoint keys in grid data: ${
|
|
618
|
+
`Found non-numeric breakpoint keys in grid data: ${n.join(", ")}. All breakpoint keys must be numeric values.`
|
|
567
619
|
);
|
|
568
|
-
return
|
|
620
|
+
return r.map((s, a) => ({
|
|
569
621
|
name: e[e.length - 1 - a] || `bp-${s}`,
|
|
570
622
|
value: s
|
|
571
623
|
}));
|
|
572
|
-
},
|
|
573
|
-
input:
|
|
574
|
-
output: {
|
|
624
|
+
}, mt = ({
|
|
625
|
+
input: o = {},
|
|
626
|
+
output: { dir: e }
|
|
575
627
|
}) => ({
|
|
576
628
|
name: "breakpoints/tokenManager",
|
|
577
|
-
executor: async ({ tokenManagerClient:
|
|
629
|
+
executor: async ({ tokenManagerClient: r }) => {
|
|
578
630
|
try {
|
|
579
631
|
console.log("[breakpoints/tokenManager] Generating breakpoints from TokenManager...");
|
|
580
|
-
const {
|
|
581
|
-
if (!
|
|
632
|
+
const { names: t = ge } = o;
|
|
633
|
+
if (!r.isLoaded())
|
|
582
634
|
throw new Error("TokenManager is not loaded. Tokens must be loaded before using this module.");
|
|
583
|
-
const
|
|
584
|
-
if (!
|
|
635
|
+
const n = r.getStyles();
|
|
636
|
+
if (!n.grid)
|
|
585
637
|
throw new Error("No grid styles found in TokenManager. Grid tokens must be loaded.");
|
|
586
638
|
console.log("[breakpoints/tokenManager] Extracting breakpoints from grid styles...");
|
|
587
|
-
const
|
|
588
|
-
if (!
|
|
639
|
+
const s = Se(n.grid, t);
|
|
640
|
+
if (!s.length) {
|
|
589
641
|
console.warn("[breakpoints/tokenManager] No breakpoints found in grid styles.");
|
|
590
642
|
return;
|
|
591
643
|
}
|
|
592
644
|
console.log(
|
|
593
|
-
`[breakpoints/tokenManager] Found ${
|
|
594
|
-
), await
|
|
595
|
-
breakpointTokens:
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
}), console.log("[breakpoints/tokenManager] Breakpoints generated successfully.");
|
|
602
|
-
} catch (a) {
|
|
603
|
-
throw console.error("[breakpoints/tokenManager] Error:", a), a;
|
|
604
|
-
}
|
|
605
|
-
}
|
|
606
|
-
}), ye = (n) => {
|
|
607
|
-
const e = A(n), t = Object.entries(e).map(([o, s]) => ` ${o}: ${s}`).join(`,
|
|
608
|
-
`), r = n.length > 0 ? n[n.length - 1].name : "xxxl";
|
|
609
|
-
return `$breakpointList: (
|
|
610
|
-
${t}
|
|
611
|
-
);
|
|
612
|
-
$defaultBreakpoint: '${r}';`;
|
|
613
|
-
}, me = async (n, e, t) => {
|
|
614
|
-
await w(t, n, e);
|
|
615
|
-
}, be = async ({
|
|
616
|
-
breakpointTokens: n,
|
|
617
|
-
stylesDir: e,
|
|
618
|
-
fileName: t
|
|
619
|
-
}) => {
|
|
620
|
-
const r = ye(n);
|
|
621
|
-
await me(r, e, `${t}.scss`);
|
|
622
|
-
}, ke = (n, e) => {
|
|
623
|
-
const t = Object.keys(n).filter((r) => !isNaN(Number(r))).sort((r, o) => Number(r) - Number(o));
|
|
624
|
-
if (t.length > e.length)
|
|
625
|
-
throw new Error(
|
|
626
|
-
`Not enough breakpoint names provided. Found ${t.length} breakpoints in data, but only ${e.length} names specified: ${e.join(", ")}`
|
|
627
|
-
);
|
|
628
|
-
return t.map((r, o) => ({
|
|
629
|
-
name: e[e.length - 1 - o] || `bp-${r}`,
|
|
630
|
-
value: r
|
|
631
|
-
}));
|
|
632
|
-
}, it = ({
|
|
633
|
-
input: n = {},
|
|
634
|
-
output: { stylesDir: e, fileName: t = "breakpointList" }
|
|
635
|
-
}) => ({
|
|
636
|
-
name: "breakpointsList/tokenManager",
|
|
637
|
-
executor: async ({ tokenManagerClient: r }) => {
|
|
638
|
-
try {
|
|
639
|
-
console.log("[breakpointsList/tokenManager] Generating SCSS breakpoint map...");
|
|
640
|
-
const { names: o = L } = n;
|
|
641
|
-
if (!r.isLoaded())
|
|
642
|
-
throw new Error("TokenManager is not loaded. Tokens must be loaded before using this module.");
|
|
643
|
-
const s = r.getStyles();
|
|
644
|
-
if (!s.grid)
|
|
645
|
-
throw new Error("No grid styles found in TokenManager. Grid tokens must be loaded.");
|
|
646
|
-
console.log("[breakpointsList/tokenManager] Extracting breakpoints for SCSS map...");
|
|
647
|
-
const a = ke(s.grid, o);
|
|
648
|
-
if (!a.length) {
|
|
649
|
-
console.warn("[breakpointsList/tokenManager] No breakpoints found in grid styles.");
|
|
650
|
-
return;
|
|
651
|
-
}
|
|
652
|
-
console.log(
|
|
653
|
-
`[breakpointsList/tokenManager] Found ${a.length} breakpoints for map: ${a.map((i) => i.name).join(", ")}`
|
|
654
|
-
), await be({
|
|
655
|
-
breakpointTokens: a,
|
|
656
|
-
stylesDir: e,
|
|
657
|
-
fileName: t
|
|
658
|
-
}), console.log("[breakpointsList/tokenManager] SCSS breakpoint map generated successfully.");
|
|
659
|
-
} catch (o) {
|
|
660
|
-
throw console.error("[breakpointsList/tokenManager] Error:", o), o;
|
|
645
|
+
`[breakpoints/tokenManager] Found ${s.length} breakpoints: ${s.map((a) => a.name).join(", ")}`
|
|
646
|
+
), console.log(`[breakpoints/tokenManager] Writing files to ${e}...`), await Te({
|
|
647
|
+
breakpointTokens: s,
|
|
648
|
+
dir: e
|
|
649
|
+
}), console.log("[breakpoints/tokenManager] ✅ Successfully generated breakpoint files");
|
|
650
|
+
} catch (t) {
|
|
651
|
+
const n = t instanceof Error ? t.message : String(t);
|
|
652
|
+
throw console.error("[breakpoints/tokenManager] ❌ Failed to generate breakpoints:", n), t instanceof Error && t.stack && console.error("[breakpoints/tokenManager] Stack trace:", t.stack), t;
|
|
661
653
|
}
|
|
662
654
|
}
|
|
663
|
-
}),
|
|
655
|
+
}), je = "styles.css", Fe = "index.ts", D = (o, e) => {
|
|
664
656
|
if (!e.length) return "";
|
|
665
|
-
const
|
|
657
|
+
const r = e.map((t) => ` ${t}`).join(`
|
|
666
658
|
`);
|
|
667
|
-
return `${
|
|
668
|
-
${
|
|
659
|
+
return `${o} {
|
|
660
|
+
${r}
|
|
669
661
|
}`;
|
|
670
|
-
},
|
|
671
|
-
(e,
|
|
672
|
-
const
|
|
673
|
-
return typeof
|
|
674
|
-
e[
|
|
675
|
-
}) : e.root.push(`${
|
|
662
|
+
}, Ce = (o) => `.${o.replace(/\s+/g, "-").toLowerCase()}`, U = (o) => `--cl-${o}`, Me = (o) => o.reduce(
|
|
663
|
+
(e, r) => {
|
|
664
|
+
const t = U(r.name);
|
|
665
|
+
return typeof r.value == "object" ? Object.entries(r.value).forEach(([n, s]) => {
|
|
666
|
+
e[n] || (e[n] = []), e[n].push(`${t}: ${s};`);
|
|
667
|
+
}) : e.root.push(`${t}: ${r.value};`), e;
|
|
676
668
|
},
|
|
677
669
|
{ root: [] }
|
|
678
|
-
),
|
|
679
|
-
const e =
|
|
680
|
-
if (
|
|
681
|
-
const a =
|
|
682
|
-
return a &&
|
|
670
|
+
), Oe = (o) => {
|
|
671
|
+
const e = D(".color-variables", o.root), r = Object.entries(o).reduce((t, [n, s]) => {
|
|
672
|
+
if (n === "root" || !s.length) return t;
|
|
673
|
+
const a = D(Ce(`${n}-color-variables`), s);
|
|
674
|
+
return a && t.push(a), t;
|
|
683
675
|
}, []).join(`
|
|
684
676
|
|
|
685
677
|
`);
|
|
686
|
-
return [e,
|
|
678
|
+
return [e, r].filter(Boolean).join(`
|
|
687
679
|
|
|
688
680
|
`);
|
|
689
|
-
},
|
|
690
|
-
|
|
691
|
-
|
|
692
|
-
}
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
cssFileName: o
|
|
681
|
+
}, Ee = (o) => `${`const colors = {
|
|
682
|
+
${o.map((t) => ` '${t.name}': 'var(${U(t.name)})'`).join(`,
|
|
683
|
+
`)}
|
|
684
|
+
} as const;`}
|
|
685
|
+
|
|
686
|
+
type ColorsKeysType = keyof typeof colors;
|
|
687
|
+
|
|
688
|
+
export { colors, type ColorsKeysType };
|
|
689
|
+
`, Ve = async ({
|
|
690
|
+
tsContent: o,
|
|
691
|
+
cssContent: e,
|
|
692
|
+
dir: r
|
|
702
693
|
}) => {
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
},
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
|
|
722
|
-
|
|
723
|
-
|
|
724
|
-
|
|
694
|
+
await u.delete(r);
|
|
695
|
+
const t = u.write(Fe, o, { directory: r }), n = u.write(je, e, { directory: r });
|
|
696
|
+
await Promise.all([t, n]);
|
|
697
|
+
}, xe = async ({ colorTokens: o, dir: e }) => {
|
|
698
|
+
const r = Me(o), t = Oe(r), n = Ee(o);
|
|
699
|
+
await Ve({ tsContent: n, cssContent: t, dir: e });
|
|
700
|
+
}, C = (o) => o.reduce((e, r) => {
|
|
701
|
+
const t = Number((r.position * 100).toFixed(1));
|
|
702
|
+
return [...e, `${r.color}${t > 0 && t < 100 ? ` ${t}%` : ""}`];
|
|
703
|
+
}, []).join(", "), ve = (o) => {
|
|
704
|
+
const e = C(o.stops);
|
|
705
|
+
return `linear-gradient(${o.angle}deg, ${e})`;
|
|
706
|
+
}, Pe = (o) => `radial-gradient(circle, ${C(o.stops)})`, Ne = (o) => {
|
|
707
|
+
const e = C(o.stops);
|
|
708
|
+
return `conic-gradient(from ${o.angle}deg, ${e})`;
|
|
709
|
+
}, Ae = (o) => {
|
|
710
|
+
const e = C(o.stops);
|
|
711
|
+
return `linear-gradient(${o.angle}deg, ${e})`;
|
|
712
|
+
}, K = (o) => typeof o == "string" ? o : o.type === "linear" ? ve(o) : o.type === "radial" ? Pe(o) : o.type === "conic" ? Ne(o) : o.type === "diamond" ? Ae(o) : "", Q = (o, e) => Object.keys(o).reduce(
|
|
713
|
+
(r, t) => {
|
|
714
|
+
const n = o[t], s = e ? `${e}-${t}` : t;
|
|
715
|
+
if (n && typeof n == "object" && "type" in n && "value" in n) {
|
|
716
|
+
const i = Object.keys(n.value), l = i.length > 1 ? n.value : n.value[i[0]], c = typeof l == "object" ? Object.keys(l).reduce(
|
|
717
|
+
(p, g) => ({
|
|
718
|
+
...p,
|
|
719
|
+
[g]: K(l[g])
|
|
725
720
|
}),
|
|
726
721
|
{}
|
|
727
|
-
) :
|
|
728
|
-
return { ...
|
|
722
|
+
) : K(l), d = { [s]: c };
|
|
723
|
+
return { ...r, ...d };
|
|
729
724
|
}
|
|
730
|
-
const a =
|
|
731
|
-
return { ...
|
|
725
|
+
const a = Q(n, s);
|
|
726
|
+
return { ...r, ...a };
|
|
732
727
|
},
|
|
733
728
|
{}
|
|
734
|
-
),
|
|
735
|
-
const
|
|
736
|
-
if (
|
|
737
|
-
if (
|
|
738
|
-
const a = typeof
|
|
739
|
-
return a ? { ...
|
|
729
|
+
), Z = (o, e) => Object.keys(o).reduce((r, t) => {
|
|
730
|
+
const n = o[t];
|
|
731
|
+
if (n.type && n.type !== "color") return r;
|
|
732
|
+
if (n.type && n.value) {
|
|
733
|
+
const a = typeof n.value == "string" ? e.resolveVariableValueString(n.value, t) : e.resolveVariableValue(n.value);
|
|
734
|
+
return a ? { ...r, [t]: { ...n, value: a } } : r;
|
|
740
735
|
}
|
|
741
|
-
const s =
|
|
742
|
-
return s ? { ...
|
|
743
|
-
}, {}),
|
|
744
|
-
input: n = {},
|
|
745
|
-
output: { jsonDir: e, stylesDir: t, jsonFileName: r = "colors.json", cssFileName: o = "colors.css" }
|
|
746
|
-
}) => ({
|
|
736
|
+
const s = Z(n, e);
|
|
737
|
+
return s ? { ...r, [t]: s } : r;
|
|
738
|
+
}, {}), bt = ({ input: o = {}, output: { dir: e } }) => ({
|
|
747
739
|
name: "colors/tokenManager",
|
|
748
|
-
executor: async ({ tokenManagerClient:
|
|
740
|
+
executor: async ({ tokenManagerClient: r }) => {
|
|
749
741
|
try {
|
|
750
742
|
console.log("[colors/tokenManager] Generating colors from TokenManager...");
|
|
751
|
-
const { includeVariables:
|
|
752
|
-
if (!(
|
|
743
|
+
const { includeVariables: t, includeStyles: n = !0 } = o;
|
|
744
|
+
if (!(t != null && t.length) && !n)
|
|
753
745
|
throw new Error("Either includeVariables or includeStyles must be enabled");
|
|
754
|
-
if (!
|
|
746
|
+
if (!r.isLoaded())
|
|
755
747
|
throw new Error("TokenManager is not loaded. Tokens must be loaded before using this module.");
|
|
756
|
-
const
|
|
757
|
-
if (
|
|
758
|
-
const
|
|
759
|
-
console.log("[colors/tokenManager] Processing styles for colors..."),
|
|
748
|
+
const s = [], a = r.getVariables();
|
|
749
|
+
if (n) {
|
|
750
|
+
const l = r.getStyles();
|
|
751
|
+
console.log("[colors/tokenManager] Processing styles for colors..."), l.color && s.push(l.color);
|
|
760
752
|
}
|
|
761
|
-
if (
|
|
762
|
-
console.log(`[colors/tokenManager] Processing ${
|
|
763
|
-
const
|
|
764
|
-
|
|
753
|
+
if (t != null && t.length) {
|
|
754
|
+
console.log(`[colors/tokenManager] Processing ${t.length} variable groups...`);
|
|
755
|
+
const l = t.map((c) => a[c]).filter(Boolean);
|
|
756
|
+
s.push(...l);
|
|
765
757
|
}
|
|
766
|
-
const
|
|
767
|
-
(
|
|
768
|
-
(
|
|
758
|
+
const i = s.map((l) => Z(l, r)).flatMap(
|
|
759
|
+
(l) => Object.entries(Q(l, "")).reduce(
|
|
760
|
+
(c, [d, p]) => [...c, { name: d, value: p }],
|
|
769
761
|
[]
|
|
770
762
|
)
|
|
771
763
|
);
|
|
772
|
-
if (
|
|
764
|
+
if (i.length === 0) {
|
|
773
765
|
console.warn("[colors/tokenManager] No color tokens generated");
|
|
774
766
|
return;
|
|
775
767
|
}
|
|
776
|
-
console.log(`[colors/tokenManager] Generated ${
|
|
777
|
-
colorTokens:
|
|
778
|
-
|
|
779
|
-
stylesDir: t,
|
|
780
|
-
jsonFileName: r,
|
|
781
|
-
cssFileName: o
|
|
768
|
+
console.log(`[colors/tokenManager] Generated ${i.length} color tokens`), console.log(`[colors/tokenManager] Writing files to ${e}...`), await xe({
|
|
769
|
+
colorTokens: i,
|
|
770
|
+
dir: e
|
|
782
771
|
}), console.log("[colors/tokenManager] ✅ Successfully generated color files");
|
|
783
|
-
} catch (
|
|
784
|
-
const
|
|
785
|
-
throw console.error("[colors/tokenManager] ❌ Failed to generate colors:",
|
|
772
|
+
} catch (t) {
|
|
773
|
+
const n = t instanceof Error ? t.message : String(t);
|
|
774
|
+
throw console.error("[colors/tokenManager] ❌ Failed to generate colors:", n), t instanceof Error && t.stack && console.error("[colors/tokenManager] Stack trace:", t.stack), t;
|
|
786
775
|
}
|
|
787
776
|
}
|
|
788
|
-
}),
|
|
789
|
-
|
|
790
|
-
|
|
777
|
+
}), Re = (o) => ` @media (width <= ${o.breakpoint}px) {
|
|
778
|
+
.container {
|
|
779
|
+
padding-left: ${o.offset};
|
|
780
|
+
padding-right: ${o.offset};
|
|
781
|
+
}
|
|
782
|
+
|
|
783
|
+
.containerTablet {
|
|
784
|
+
padding-left: ${o.offset};
|
|
785
|
+
padding-right: ${o.offset};
|
|
786
|
+
}
|
|
787
|
+
}`, Be = (o, e) => {
|
|
788
|
+
const r = e || "components", t = o.map((n) => Re(n)).join(`
|
|
789
|
+
|
|
791
790
|
`);
|
|
792
|
-
return
|
|
791
|
+
return `@layer ${r} {
|
|
793
792
|
${t}
|
|
794
793
|
}`;
|
|
795
|
-
},
|
|
796
|
-
if (!e.length) return "";
|
|
797
|
-
const t = n - 1, r = e.map((o) => ` ${o}`).join(`
|
|
798
|
-
`);
|
|
799
|
-
return `@media (max-width: ${t}px) {
|
|
800
|
-
${r}
|
|
801
|
-
}`;
|
|
802
|
-
}, xe = (n, e) => {
|
|
803
|
-
const t = [];
|
|
804
|
-
n.forEach((a, i) => {
|
|
805
|
-
const l = parseInt(a.name.split("_")[0]), c = [], u = i > 0 ? n[i - 1] : null;
|
|
806
|
-
if (a.value.alignment === "center" && a.value.width && (c.push(`max-width: ${a.value.width};`), c.push("margin-left: auto;"), c.push("margin-right: auto;"), u && u.value.alignment !== "center" && (c.push("padding-left: 0;"), c.push("padding-right: 0;"))), a.value.alignment === "stretch" && u && u.value.alignment !== "stretch" && (c.push("max-width: none;"), c.push("margin-left: 0;"), c.push("margin-right: 0;")), a.value.alignment === "stretch" && (c.push(`padding-left: ${a.value.margin};`), c.push(`padding-right: ${a.value.margin};`)), c.length > 0) {
|
|
807
|
-
const d = Oe(".container", c);
|
|
808
|
-
if (i === 0)
|
|
809
|
-
t.push(d);
|
|
810
|
-
else {
|
|
811
|
-
const p = Pe(l, [d]);
|
|
812
|
-
t.push(p);
|
|
813
|
-
}
|
|
814
|
-
}
|
|
815
|
-
});
|
|
816
|
-
const o = t.filter(Boolean).join(`
|
|
794
|
+
}, De = () => `import styles from './styles.module.css';
|
|
817
795
|
|
|
818
|
-
|
|
819
|
-
|
|
820
|
-
|
|
821
|
-
}
|
|
822
|
-
},
|
|
823
|
-
|
|
824
|
-
|
|
825
|
-
|
|
826
|
-
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
|
|
830
|
-
|
|
831
|
-
|
|
832
|
-
|
|
833
|
-
|
|
834
|
-
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
|
|
841
|
-
|
|
842
|
-
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
|
|
846
|
-
|
|
847
|
-
|
|
848
|
-
|
|
849
|
-
}), c.alignment === "stretch") {
|
|
850
|
-
const u = e.resolveVariableValueString(c.offset);
|
|
851
|
-
if (!u) return;
|
|
852
|
-
r.push({
|
|
853
|
-
name: a,
|
|
854
|
-
value: {
|
|
855
|
-
alignment: "stretch",
|
|
856
|
-
margin: u
|
|
857
|
-
}
|
|
858
|
-
});
|
|
859
|
-
}
|
|
860
|
-
});
|
|
861
|
-
}), r.sort((a, i) => {
|
|
862
|
-
const l = parseInt(a.name);
|
|
863
|
-
return parseInt(i.name) - l;
|
|
864
|
-
}).reduce((a, i) => {
|
|
865
|
-
const l = a[a.length - 1];
|
|
866
|
-
return l && E(l.value, i.value) || a.push(i), a;
|
|
867
|
-
}, []);
|
|
868
|
-
}, ct = ({
|
|
869
|
-
input: n = {},
|
|
870
|
-
output: { stylesDir: e, fileName: t = "container" }
|
|
796
|
+
export const conatinerClassName = styles.container;
|
|
797
|
+
export const conatinerTabletClassName = styles.containerTablet;
|
|
798
|
+
`, z = async (o, e, r) => {
|
|
799
|
+
await u.delete(o, r), await u.write(o, e, { directory: r });
|
|
800
|
+
}, Ke = async ({ containerTokens: o, dir: e, layer: r }) => {
|
|
801
|
+
const t = Be(o, r), n = De();
|
|
802
|
+
await z("styles.module.css", t, e), await z("index.ts", n, e);
|
|
803
|
+
}, ze = (o) => {
|
|
804
|
+
const e = o.trim().toLowerCase();
|
|
805
|
+
return e === "0" || e === "0px";
|
|
806
|
+
}, Le = (o, e) => Object.keys(o).filter((s) => !isNaN(Number(s))).sort((s, a) => Number(a) - Number(s)).reduce((s, a) => {
|
|
807
|
+
const i = o[a];
|
|
808
|
+
if (!i || !("value" in i) || !Array.isArray(i.value))
|
|
809
|
+
return s;
|
|
810
|
+
const l = i.value.find((d) => d.pattern === "columns");
|
|
811
|
+
if (!(l != null && l.offset))
|
|
812
|
+
return s;
|
|
813
|
+
const c = e.resolveVariableValueString(l.offset);
|
|
814
|
+
return !c || typeof c != "string" || ze(c) ? s : [
|
|
815
|
+
...s,
|
|
816
|
+
{
|
|
817
|
+
breakpoint: Number(a),
|
|
818
|
+
offset: c
|
|
819
|
+
}
|
|
820
|
+
];
|
|
821
|
+
}, []).reduce((s, a) => {
|
|
822
|
+
const i = s[s.length - 1];
|
|
823
|
+
return i && v(i.offset, a.offset) || s.push(a), s;
|
|
824
|
+
}, []), wt = ({
|
|
825
|
+
input: o = {},
|
|
826
|
+
output: { dir: e }
|
|
871
827
|
}) => ({
|
|
872
828
|
name: "container/tokenManager",
|
|
873
829
|
executor: async ({ tokenManagerClient: r }) => {
|
|
874
830
|
try {
|
|
875
831
|
console.log("[container/tokenManager] Generating container styles...");
|
|
876
|
-
const {
|
|
832
|
+
const { layer: t } = o;
|
|
877
833
|
if (!r.isLoaded())
|
|
878
834
|
throw new Error("TokenManager is not loaded. Tokens must be loaded before using this module.");
|
|
879
835
|
console.log("[container/tokenManager] Extracting container tokens...");
|
|
880
|
-
const
|
|
881
|
-
if (!
|
|
836
|
+
const n = r.getStyles();
|
|
837
|
+
if (!n.grid)
|
|
882
838
|
throw new Error("No grid styles found in TokenManager. Grid tokens must be loaded.");
|
|
883
|
-
const
|
|
884
|
-
if (!
|
|
839
|
+
const s = Le(n.grid, r);
|
|
840
|
+
if (!s.length) {
|
|
885
841
|
console.warn("[container/tokenManager] No container tokens found.");
|
|
886
842
|
return;
|
|
887
843
|
}
|
|
888
844
|
console.log(
|
|
889
|
-
`[container/tokenManager] Found ${
|
|
890
|
-
), await
|
|
891
|
-
containerTokens:
|
|
892
|
-
|
|
893
|
-
|
|
894
|
-
|
|
895
|
-
|
|
896
|
-
|
|
897
|
-
|
|
898
|
-
throw console.error("[container/tokenManager] Error:", o), o;
|
|
845
|
+
`[container/tokenManager] Found ${s.length} container tokens: ${s.map((a) => a.breakpoint).join(", ")}`
|
|
846
|
+
), console.log(`[container/tokenManager] Writing files to ${e}...`), await Ke({
|
|
847
|
+
containerTokens: s,
|
|
848
|
+
dir: e,
|
|
849
|
+
layer: t
|
|
850
|
+
}), console.log("[container/tokenManager] ✅ Successfully generated container files");
|
|
851
|
+
} catch (t) {
|
|
852
|
+
const n = t instanceof Error ? t.message : String(t);
|
|
853
|
+
throw console.error("[container/tokenManager] ❌ Failed to generate container:", n), t instanceof Error && t.stack && console.error("[container/tokenManager] Stack trace:", t.stack), t;
|
|
899
854
|
}
|
|
900
855
|
}
|
|
901
|
-
}),
|
|
856
|
+
}), We = "styles.css", Ie = "index.ts", L = (o, e) => {
|
|
902
857
|
if (!e.length) return "";
|
|
903
|
-
const
|
|
858
|
+
const r = e.map((t) => ` ${t}`).join(`
|
|
904
859
|
`);
|
|
905
|
-
return `${
|
|
906
|
-
${
|
|
860
|
+
return `${o} {
|
|
861
|
+
${r}
|
|
907
862
|
}`;
|
|
908
|
-
},
|
|
909
|
-
(e,
|
|
910
|
-
const
|
|
911
|
-
return typeof
|
|
912
|
-
|
|
913
|
-
|
|
863
|
+
}, Ge = (o) => `.${o.replace(/\s+/g, "-").toLowerCase()}`, X = (o) => `--${o}`, Je = ({ offsetX: o, offsetY: e, blur: r, spread: t, color: n }) => `${o} ${e} ${r} ${t} ${n}`, qe = (o) => o.reduce(
|
|
864
|
+
(e, r) => {
|
|
865
|
+
const t = X(r.name);
|
|
866
|
+
return typeof r.value != "object" ? (e.root.push(`${t}: ${r.value};`), e) : Object.entries(r.value).reduce((n, [s, a]) => {
|
|
867
|
+
const i = n[s] ?? [];
|
|
868
|
+
return { ...n, [s]: [...i, `${t}: ${a};`] };
|
|
869
|
+
}, e);
|
|
914
870
|
},
|
|
915
871
|
{ root: [] }
|
|
916
|
-
),
|
|
917
|
-
const e =
|
|
918
|
-
if (
|
|
919
|
-
const a =
|
|
920
|
-
return a &&
|
|
872
|
+
), He = (o) => {
|
|
873
|
+
const e = L(".shadow-variables", o.root), r = Object.entries(o).reduce((t, [n, s]) => {
|
|
874
|
+
if (n === "root" || !s.length) return t;
|
|
875
|
+
const a = L(Ge(`${n}-shadow-variables`), s);
|
|
876
|
+
return a && t.push(a), t;
|
|
921
877
|
}, []).join(`
|
|
922
878
|
|
|
923
879
|
`);
|
|
924
|
-
return [e,
|
|
880
|
+
return [e, r].filter(Boolean).join(`
|
|
925
881
|
|
|
926
882
|
`);
|
|
927
|
-
},
|
|
928
|
-
|
|
929
|
-
|
|
930
|
-
}
|
|
931
|
-
|
|
932
|
-
|
|
933
|
-
|
|
934
|
-
|
|
935
|
-
|
|
936
|
-
|
|
937
|
-
|
|
938
|
-
|
|
939
|
-
cssFileName: o
|
|
883
|
+
}, Ue = (o) => `${`const shadows = {
|
|
884
|
+
${o.map((t) => ` '${t.name}': 'var(${X(t.name)})'`).join(`,
|
|
885
|
+
`)}
|
|
886
|
+
} as const;`}
|
|
887
|
+
|
|
888
|
+
type ShadowsKeysType = keyof typeof shadows;
|
|
889
|
+
|
|
890
|
+
export { shadows, type ShadowsKeysType };
|
|
891
|
+
`, Qe = async ({
|
|
892
|
+
tsContent: o,
|
|
893
|
+
cssContent: e,
|
|
894
|
+
dir: r
|
|
940
895
|
}) => {
|
|
941
|
-
|
|
942
|
-
|
|
943
|
-
|
|
944
|
-
|
|
945
|
-
|
|
946
|
-
|
|
896
|
+
await u.delete(r);
|
|
897
|
+
const t = u.write(Ie, o, { directory: r }), n = u.write(We, e, { directory: r });
|
|
898
|
+
await Promise.all([t, n]);
|
|
899
|
+
}, Ze = async ({ shadowTokens: o, dir: e }) => {
|
|
900
|
+
const r = qe(o), t = He(r), n = Ue(o);
|
|
901
|
+
await Qe({ tsContent: n, cssContent: t, dir: e });
|
|
902
|
+
}, Y = (o, e) => Object.keys(o).reduce(
|
|
903
|
+
(r, t) => {
|
|
904
|
+
const n = o[t], s = e ? `${e}-${t}` : t;
|
|
905
|
+
if (n && typeof n == "object" && "type" in n && "value" in n) {
|
|
947
906
|
const i = {
|
|
948
|
-
[s]:
|
|
907
|
+
[s]: n.value.map(Je).join(", ")
|
|
949
908
|
};
|
|
950
|
-
return { ...
|
|
909
|
+
return { ...r, ...i };
|
|
951
910
|
}
|
|
952
|
-
const a =
|
|
953
|
-
return { ...
|
|
911
|
+
const a = Y(n, s);
|
|
912
|
+
return { ...r, ...a };
|
|
954
913
|
},
|
|
955
914
|
{}
|
|
956
|
-
),
|
|
957
|
-
input: n = {},
|
|
958
|
-
output: { jsonDir: e, stylesDir: t, jsonFileName: r = "shadows.json", cssFileName: o = "shadows.css" }
|
|
959
|
-
}) => ({
|
|
915
|
+
), kt = ({ input: o = {}, output: { dir: e } }) => ({
|
|
960
916
|
name: "shadows/tokenManager",
|
|
961
|
-
executor: async ({ tokenManagerClient:
|
|
917
|
+
executor: async ({ tokenManagerClient: r }) => {
|
|
962
918
|
try {
|
|
963
919
|
console.log("[shadows/tokenManager] Generating shadows from TokenManager...");
|
|
964
|
-
const {
|
|
965
|
-
if (!
|
|
966
|
-
throw new Error("
|
|
967
|
-
if (!
|
|
920
|
+
const { includeStyles: t = !0 } = o;
|
|
921
|
+
if (!t)
|
|
922
|
+
throw new Error("includeStyles must be enabled for shadows generation");
|
|
923
|
+
if (!r.isLoaded())
|
|
968
924
|
throw new Error("TokenManager is not loaded. Tokens must be loaded before using this module.");
|
|
969
|
-
const
|
|
970
|
-
if (
|
|
971
|
-
const
|
|
972
|
-
console.log("[shadows/tokenManager] Processing styles for shadows..."),
|
|
925
|
+
const n = [];
|
|
926
|
+
if (t) {
|
|
927
|
+
const a = r.getStyles();
|
|
928
|
+
console.log("[shadows/tokenManager] Processing styles for shadows..."), a.effect && n.push(a.effect);
|
|
973
929
|
}
|
|
974
|
-
const
|
|
975
|
-
(
|
|
976
|
-
(
|
|
930
|
+
const s = n.flatMap(
|
|
931
|
+
(a) => Object.entries(Y(a, "")).reduce(
|
|
932
|
+
(i, [l, c]) => [...i, { name: l, value: c }],
|
|
977
933
|
[]
|
|
978
934
|
)
|
|
979
935
|
);
|
|
980
|
-
if (
|
|
936
|
+
if (s.length === 0) {
|
|
981
937
|
console.warn("[shadows/tokenManager] No shadow tokens generated");
|
|
982
938
|
return;
|
|
983
939
|
}
|
|
984
|
-
console.log(`[shadows/tokenManager] Generated ${
|
|
985
|
-
shadowTokens:
|
|
986
|
-
|
|
987
|
-
stylesDir: t,
|
|
988
|
-
jsonFileName: r,
|
|
989
|
-
cssFileName: o
|
|
940
|
+
console.log(`[shadows/tokenManager] Generated ${s.length} shadow tokens`), console.log(`[shadows/tokenManager] Writing files to ${e}...`), await Ze({
|
|
941
|
+
shadowTokens: s,
|
|
942
|
+
dir: e
|
|
990
943
|
}), console.log("[shadows/tokenManager] ✅ Successfully generated shadow files");
|
|
991
|
-
} catch (
|
|
992
|
-
const
|
|
993
|
-
throw console.error("[shadows/tokenManager] ❌ Failed to generate shadows:",
|
|
944
|
+
} catch (t) {
|
|
945
|
+
const n = t instanceof Error ? t.message : String(t);
|
|
946
|
+
throw console.error("[shadows/tokenManager] ❌ Failed to generate shadows:", n), t instanceof Error && t.stack && console.error("[shadows/tokenManager] Stack trace:", t.stack), t;
|
|
994
947
|
}
|
|
995
948
|
}
|
|
996
|
-
}),
|
|
997
|
-
|
|
998
|
-
|
|
999
|
-
|
|
1000
|
-
|
|
1001
|
-
|
|
1002
|
-
|
|
1003
|
-
|
|
949
|
+
}), Xe = "styles.module.css", Ye = "index.ts", _e = "typography.ts", W = "sans-serif", _ = (o, e) => {
|
|
950
|
+
if (typeof o != "string") return o;
|
|
951
|
+
const r = e[o] ?? o;
|
|
952
|
+
return r.trim().toLowerCase().endsWith(W) ? r : `${r}, ${W}`;
|
|
953
|
+
}, I = (o, e) => typeof o.fontFamily != "string" ? o : {
|
|
954
|
+
...o,
|
|
955
|
+
fontFamily: _(o.fontFamily, e)
|
|
956
|
+
}, F = (o, e) => {
|
|
957
|
+
const r = {};
|
|
958
|
+
return Object.entries(o).forEach(([t, n]) => {
|
|
959
|
+
const s = t === "fontFamily" ? _(n, e) : n, a = t.replace(/([A-Z])/g, "-$1").toLowerCase();
|
|
960
|
+
r[a] = s;
|
|
961
|
+
}), r;
|
|
962
|
+
}, et = (o, e, r) => {
|
|
963
|
+
const t = Object.keys(o.breakpoints), n = F(o.base, r);
|
|
1004
964
|
return t.reduce(
|
|
1005
|
-
(
|
|
1006
|
-
const
|
|
1007
|
-
return
|
|
965
|
+
(s, a, i) => {
|
|
966
|
+
const l = F(o.breakpoints[a], r);
|
|
967
|
+
return i ? [...s, { breakpoint: Number(e[a]), css: l }] : [
|
|
1008
968
|
{
|
|
1009
969
|
breakpoint: null,
|
|
1010
970
|
css: {
|
|
1011
|
-
...
|
|
1012
|
-
...
|
|
971
|
+
...n,
|
|
972
|
+
...l
|
|
1013
973
|
}
|
|
1014
974
|
}
|
|
1015
975
|
];
|
|
@@ -1017,121 +977,216 @@ ${t}
|
|
|
1017
977
|
[
|
|
1018
978
|
{
|
|
1019
979
|
breakpoint: null,
|
|
1020
|
-
css:
|
|
980
|
+
css: n
|
|
1021
981
|
}
|
|
1022
982
|
]
|
|
1023
983
|
);
|
|
1024
|
-
},
|
|
1025
|
-
|
|
1026
|
-
|
|
1027
|
-
}
|
|
1028
|
-
|
|
1029
|
-
|
|
1030
|
-
|
|
1031
|
-
|
|
1032
|
-
|
|
1033
|
-
|
|
1034
|
-
|
|
1035
|
-
|
|
984
|
+
}, ee = () => ({
|
|
985
|
+
base: {},
|
|
986
|
+
breakpoints: {}
|
|
987
|
+
}), P = (o, e, r, t) => {
|
|
988
|
+
Object.keys(t).length && (o.breakpoints[e] || (o.breakpoints[e] = {}), o.breakpoints[e][r] = {
|
|
989
|
+
...o.breakpoints[e][r],
|
|
990
|
+
...t
|
|
991
|
+
});
|
|
992
|
+
}, S = (o, e, r, t) => {
|
|
993
|
+
et(e.value, r, t).forEach(({ breakpoint: s, css: a }) => {
|
|
994
|
+
if (s === null) {
|
|
995
|
+
o.base[e.name] = a;
|
|
996
|
+
return;
|
|
997
|
+
}
|
|
998
|
+
P(o, s, e.name, a);
|
|
999
|
+
});
|
|
1000
|
+
}, te = (o) => {
|
|
1001
|
+
const e = G(o.base), r = Object.keys(o.breakpoints).reduce((t, n) => {
|
|
1002
|
+
const s = Number(n), a = o.breakpoints[s];
|
|
1003
|
+
return t + `@media (max-width: ${s}px) { ${G(a)} }`;
|
|
1036
1004
|
}, "");
|
|
1037
|
-
return
|
|
1038
|
-
},
|
|
1039
|
-
const
|
|
1040
|
-
return
|
|
1041
|
-
},
|
|
1042
|
-
|
|
1043
|
-
|
|
1044
|
-
|
|
1045
|
-
|
|
1046
|
-
|
|
1047
|
-
|
|
1048
|
-
|
|
1049
|
-
|
|
1050
|
-
|
|
1051
|
-
|
|
1052
|
-
|
|
1005
|
+
return e + r;
|
|
1006
|
+
}, tt = (o, e, r) => {
|
|
1007
|
+
const t = o.reduce((n, s) => (S(n, s, e, r), n), ee());
|
|
1008
|
+
return te(t);
|
|
1009
|
+
}, G = (o) => Object.keys(o).reduce((e, r) => {
|
|
1010
|
+
const t = o[r], n = Object.keys(t).map((s) => `${s}: ${t[s]}`).join(";");
|
|
1011
|
+
return e + `.typo-${r} { ${n} }`;
|
|
1012
|
+
}, ""), J = (o) => {
|
|
1013
|
+
if (typeof o == "number") return Number.isFinite(o) ? o : null;
|
|
1014
|
+
const e = Number.parseFloat(o);
|
|
1015
|
+
return Number.isFinite(e) ? e : null;
|
|
1016
|
+
}, q = (o) => {
|
|
1017
|
+
if (typeof o == "number") return o / 16;
|
|
1018
|
+
const e = o.trim().toLowerCase();
|
|
1019
|
+
if (e.endsWith("rem")) return J(e);
|
|
1020
|
+
if (e.endsWith("px")) {
|
|
1021
|
+
const r = J(e);
|
|
1022
|
+
return r === null ? null : r / 16;
|
|
1023
|
+
}
|
|
1024
|
+
return null;
|
|
1025
|
+
}, rt = (o) => {
|
|
1026
|
+
const { minValueRem: e, maxValueRem: r, minVwRem: t, maxVwRem: n } = o, s = r - e;
|
|
1027
|
+
return `calc(${e}rem + ((100vw - ${t}rem) / (${n}rem - ${t}rem)) * ${s}rem)`;
|
|
1028
|
+
}, ot = (o, e, r, t) => {
|
|
1029
|
+
const n = ["font-size", "line-height"], s = Object.entries(e.value.breakpoints).map(([f, h]) => {
|
|
1030
|
+
const w = Number.parseInt(r[f], 10);
|
|
1031
|
+
return { breakpointName: f, width: w, typography: h };
|
|
1032
|
+
}).filter((f) => Number.isFinite(f.width)).sort((f, h) => h.width - f.width);
|
|
1033
|
+
if (s.length < 2) {
|
|
1034
|
+
S(o, e, r, t);
|
|
1035
|
+
return;
|
|
1036
|
+
}
|
|
1037
|
+
const a = s[0], i = s[s.length - 1];
|
|
1038
|
+
if (a.width <= i.width) {
|
|
1039
|
+
S(o, e, r, t);
|
|
1040
|
+
return;
|
|
1041
|
+
}
|
|
1042
|
+
const l = F(a.typography, t), c = F(i.typography, t), d = a.width / 16, p = i.width / 16;
|
|
1043
|
+
if (d === p) {
|
|
1044
|
+
S(o, e, r, t);
|
|
1045
|
+
return;
|
|
1046
|
+
}
|
|
1047
|
+
o.base[e.name] = l;
|
|
1048
|
+
const g = n.reduce((f, h) => {
|
|
1049
|
+
const w = l[h], M = c[h];
|
|
1050
|
+
if (w === void 0 || M === void 0 || w === M)
|
|
1051
|
+
return f;
|
|
1052
|
+
const A = q(w), R = q(M);
|
|
1053
|
+
return A === null || R === null ? f : {
|
|
1054
|
+
...f,
|
|
1055
|
+
[h]: rt({ minValueRem: R, maxValueRem: A, minVwRem: p, maxVwRem: d })
|
|
1056
|
+
};
|
|
1057
|
+
}, {});
|
|
1058
|
+
P(o, a.width, e.name, g);
|
|
1059
|
+
const b = !Object.keys(g).includes("font-size") && l["font-size"] !== c["font-size"], T = Object.entries(c).filter(([f, h]) => l[f] === h ? !1 : !n.includes(f) || f === "font-size" && b ? !0 : !Object.keys(g).includes(f)).reduce(
|
|
1060
|
+
(f, [h, w]) => ({
|
|
1061
|
+
...f,
|
|
1062
|
+
[h]: w
|
|
1063
|
+
}),
|
|
1064
|
+
{}
|
|
1065
|
+
);
|
|
1066
|
+
P(o, i.width, e.name, T);
|
|
1067
|
+
}, nt = (o, e, r, t) => {
|
|
1068
|
+
if (!t) return tt(o, e, r);
|
|
1069
|
+
const n = o.reduce((s, a) => (ot(s, a, e, r), s), ee());
|
|
1070
|
+
return te(n);
|
|
1071
|
+
}, st = (o) => o.length ? `import styles from './styles.module.css';
|
|
1072
|
+
import { typography } from './typography';
|
|
1073
|
+
|
|
1074
|
+
type TypographyKeysType = keyof typeof typography;
|
|
1075
|
+
|
|
1076
|
+
const getTypographyClass = (typographyKey: TypographyKeysType) => styles[\`typo-\${typographyKey}\`];
|
|
1077
|
+
|
|
1078
|
+
export { typography, getTypographyClass, type TypographyKeysType };
|
|
1079
|
+
` : "", at = (o, e) => o.length ? `const typography = {
|
|
1080
|
+
${o.map((t) => {
|
|
1081
|
+
const n = I(t.value.base, e), s = Object.entries(t.value.breakpoints).reduce(
|
|
1082
|
+
(a, [i, l]) => ({
|
|
1083
|
+
...a,
|
|
1084
|
+
[i]: I(l, e)
|
|
1085
|
+
}),
|
|
1086
|
+
{}
|
|
1087
|
+
);
|
|
1088
|
+
return ` '${t.name}': {
|
|
1089
|
+
base: ${JSON.stringify(n, null, 8).replace(/\n/g, `
|
|
1090
|
+
`)},
|
|
1091
|
+
breakpoints: ${JSON.stringify(s, null, 8).replace(/\n/g, `
|
|
1092
|
+
`)}
|
|
1093
|
+
}`;
|
|
1094
|
+
}).join(`,
|
|
1095
|
+
`)}
|
|
1096
|
+
} as const;
|
|
1097
|
+
|
|
1098
|
+
export { typography };
|
|
1099
|
+
` : "", it = async ({
|
|
1100
|
+
indexTSContent: o,
|
|
1101
|
+
typographyTSContent: e,
|
|
1102
|
+
cssContent: r,
|
|
1103
|
+
dir: t
|
|
1104
|
+
}) => {
|
|
1105
|
+
await u.delete(t);
|
|
1106
|
+
const n = u.write(Ye, o, { directory: t }), s = u.write(_e, e, { directory: t }), a = u.write(Xe, r, { directory: t });
|
|
1107
|
+
await Promise.all([n, s, a]);
|
|
1108
|
+
}, lt = async ({
|
|
1109
|
+
typographyTokens: o,
|
|
1110
|
+
dir: e,
|
|
1111
|
+
breakpoints: r,
|
|
1112
|
+
fontFamily: t,
|
|
1113
|
+
fluid: n
|
|
1053
1114
|
}) => {
|
|
1054
|
-
const
|
|
1055
|
-
await
|
|
1056
|
-
},
|
|
1057
|
-
const s = n
|
|
1058
|
-
if (typeof s != "object" || Array.isArray(s)) return
|
|
1115
|
+
const s = nt(o, r, t, n), a = at(o, t), i = st(o);
|
|
1116
|
+
await it({ indexTSContent: i, typographyTSContent: a, cssContent: s, dir: e });
|
|
1117
|
+
}, re = (o, e, r) => Object.keys(o).reduce((t, n) => {
|
|
1118
|
+
const s = o[n];
|
|
1119
|
+
if (typeof s != "object" || Array.isArray(s)) return t;
|
|
1059
1120
|
if (!("type" in s) || !("value" in s))
|
|
1060
|
-
return { ...
|
|
1061
|
-
if (s.type !== "typography") return
|
|
1121
|
+
return { ...t, [n]: re(s, e, r) };
|
|
1122
|
+
if (s.type !== "typography") return t;
|
|
1062
1123
|
const a = s.value, i = Object.entries(a).reduce(
|
|
1063
|
-
(l, [c,
|
|
1064
|
-
const
|
|
1065
|
-
if (
|
|
1066
|
-
|
|
1067
|
-
const
|
|
1068
|
-
|
|
1124
|
+
(l, [c, d]) => {
|
|
1125
|
+
const p = Object.keys(r.breakpoints);
|
|
1126
|
+
if (p.length)
|
|
1127
|
+
p.forEach((g) => {
|
|
1128
|
+
const b = e.resolveVariableValueString(d, g);
|
|
1129
|
+
b && (b === d ? l.base = { ...l.base, [c]: b } : l.breakpoints[g] = { ...l.breakpoints[g], [c]: b });
|
|
1069
1130
|
});
|
|
1070
1131
|
else {
|
|
1071
|
-
const
|
|
1072
|
-
|
|
1132
|
+
const g = e.resolveVariableValueString(d);
|
|
1133
|
+
g && (l.base = { ...l.base, [c]: g });
|
|
1073
1134
|
}
|
|
1074
1135
|
return l;
|
|
1075
1136
|
},
|
|
1076
1137
|
{ base: {}, breakpoints: {} }
|
|
1077
1138
|
);
|
|
1078
|
-
return { ...
|
|
1079
|
-
}, {}),
|
|
1080
|
-
const
|
|
1139
|
+
return { ...t, [n]: { type: "typography", value: i } };
|
|
1140
|
+
}, {}), oe = (o, e) => Object.keys(o).reduce((r, t) => {
|
|
1141
|
+
const n = e ? `${e}-${t}` : t, s = o[t];
|
|
1081
1142
|
if (!("type" in s) || !("value" in s))
|
|
1082
|
-
return { ...
|
|
1143
|
+
return { ...r, ...oe(s, n) };
|
|
1083
1144
|
const a = s.value;
|
|
1084
|
-
return { ...
|
|
1085
|
-
}, {}),
|
|
1086
|
-
input: n,
|
|
1087
|
-
output: { jsonDir: e, stylesDir: t, jsonFileName: r = "typography", cssFileName: o = "typography" }
|
|
1088
|
-
}) => ({
|
|
1145
|
+
return { ...r, [n]: a };
|
|
1146
|
+
}, {}), $t = ({ input: o, output: { dir: e } }) => ({
|
|
1089
1147
|
name: "typography/tokenManager",
|
|
1090
|
-
executor: async ({ tokenManagerClient:
|
|
1148
|
+
executor: async ({ tokenManagerClient: r }) => {
|
|
1091
1149
|
try {
|
|
1092
1150
|
console.log("[typography/tokenManager] Generating typography from TokenManager...");
|
|
1093
|
-
const { breakpoints:
|
|
1094
|
-
if (!
|
|
1151
|
+
const { breakpoints: t, fontFamily: n } = o, s = o.fluid ?? !0;
|
|
1152
|
+
if (!r.isLoaded())
|
|
1095
1153
|
throw new Error("TokenManager is not loaded. Tokens must be loaded before using this module.");
|
|
1096
|
-
const
|
|
1097
|
-
console.log("[typography/tokenManager] Processing styles for typography..."),
|
|
1098
|
-
const
|
|
1154
|
+
const a = [], i = r.getStyles();
|
|
1155
|
+
console.log("[typography/tokenManager] Processing styles for typography..."), i.text && a.push(i.text);
|
|
1156
|
+
const l = a.reduce(
|
|
1099
1157
|
(d, p) => ({
|
|
1100
1158
|
...d,
|
|
1101
|
-
...
|
|
1159
|
+
...re(p, r, { breakpoints: o.breakpoints })
|
|
1102
1160
|
}),
|
|
1103
1161
|
{}
|
|
1104
|
-
),
|
|
1162
|
+
), c = Object.entries(oe(l)).map(
|
|
1105
1163
|
([d, p]) => ({ name: d, value: p })
|
|
1106
1164
|
);
|
|
1107
|
-
if (
|
|
1165
|
+
if (c.length === 0) {
|
|
1108
1166
|
console.warn("[typography/tokenManager] No typography tokens generated");
|
|
1109
1167
|
return;
|
|
1110
1168
|
}
|
|
1111
|
-
console.log(`[typography/tokenManager] Generated ${
|
|
1112
|
-
typographyTokens:
|
|
1113
|
-
|
|
1114
|
-
|
|
1115
|
-
|
|
1116
|
-
|
|
1117
|
-
breakpoints: a,
|
|
1118
|
-
isModule: i
|
|
1169
|
+
console.log(`[typography/tokenManager] Generated ${c.length} typography tokens`), console.log(`[typography/tokenManager] Writing files to ${e}...`), await lt({
|
|
1170
|
+
typographyTokens: c,
|
|
1171
|
+
dir: e,
|
|
1172
|
+
breakpoints: t,
|
|
1173
|
+
fontFamily: n || {},
|
|
1174
|
+
fluid: s
|
|
1119
1175
|
}), console.log("[typography/tokenManager] ✅ Successfully generated typography files");
|
|
1120
|
-
} catch (
|
|
1121
|
-
const
|
|
1122
|
-
throw console.error("[typography/tokenManager] ❌ Failed to generate typography:",
|
|
1176
|
+
} catch (t) {
|
|
1177
|
+
const n = t instanceof Error ? t.message : String(t);
|
|
1178
|
+
throw console.error("[typography/tokenManager] ❌ Failed to generate typography:", n), t instanceof Error && t.stack && console.error("[typography/tokenManager] Stack trace:", t.stack), t;
|
|
1123
1179
|
}
|
|
1124
1180
|
}
|
|
1125
1181
|
});
|
|
1126
1182
|
export {
|
|
1127
|
-
|
|
1128
|
-
|
|
1129
|
-
|
|
1130
|
-
|
|
1131
|
-
|
|
1132
|
-
|
|
1133
|
-
|
|
1134
|
-
|
|
1135
|
-
|
|
1136
|
-
dt as typographyFromTokenManager
|
|
1183
|
+
ge as BREAKPOINTS_NAMES,
|
|
1184
|
+
pe as TokenManager,
|
|
1185
|
+
mt as breakpointsFromTokenManager,
|
|
1186
|
+
bt as colorsFromTokenManager,
|
|
1187
|
+
wt as containerFromTokenManager,
|
|
1188
|
+
yt as generate,
|
|
1189
|
+
ht as init,
|
|
1190
|
+
kt as shadowsFromTokenManager,
|
|
1191
|
+
$t as typographyFromTokenManager
|
|
1137
1192
|
};
|