@pure-ds/core 0.5.60 → 0.5.61
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/dist/types/pds.config.d.ts +4 -8
- package/dist/types/pds.config.d.ts.map +1 -1
- package/dist/types/pds.d.ts +0 -1
- package/dist/types/public/assets/js/pds-manager.d.ts +429 -144
- package/dist/types/public/assets/js/pds-manager.d.ts.map +1 -1
- package/dist/types/public/assets/js/pds.d.ts +4 -3
- package/dist/types/public/assets/js/pds.d.ts.map +1 -1
- package/dist/types/src/js/pds-core/pds-config.d.ts +454 -0
- package/dist/types/src/js/pds-core/pds-config.d.ts.map +1 -1
- package/dist/types/src/js/pds-core/pds-live.d.ts.map +1 -1
- package/dist/types/src/js/pds-core/pds-start-helpers.d.ts.map +1 -1
- package/package.json +1 -1
- package/packages/pds-cli/bin/templates/bootstrap/pds.config.js +9 -2
- package/public/assets/js/app.js +20 -20
- package/public/assets/js/pds-manager.js +75 -75
- package/public/assets/js/pds.js +8 -8
- package/src/js/pds-core/pds-config.js +686 -0
- package/src/js/pds-core/pds-live.js +366 -437
- package/src/js/pds-core/pds-start-helpers.js +15 -0
- package/src/js/pds.d.ts +0 -1
|
@@ -1,437 +1,366 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Live-mode initialization and API surface for PDS.
|
|
3
|
-
* Separated to keep the base runtime bundle lean for production/static usage.
|
|
4
|
-
*/
|
|
5
|
-
import { Generator } from "./pds-generator.js";
|
|
6
|
-
import { applyStyles, adoptLayers, adoptPrimitives } from "./pds-runtime.js";
|
|
7
|
-
import { presets, defaultLog } from "./pds-config.js";
|
|
8
|
-
import { defaultPDSEnhancers } from "./pds-enhancers.js";
|
|
9
|
-
import { defaultPDSEnhancerMetadata } from "./pds-enhancers-meta.js";
|
|
10
|
-
import { resolvePublicAssetURL } from "./pds-paths.js";
|
|
11
|
-
import { loadTypographyFonts } from "../common/font-loader.js";
|
|
12
|
-
import {
|
|
13
|
-
ensureAbsoluteAssetURL,
|
|
14
|
-
ensureTrailingSlash,
|
|
15
|
-
attachFoucListener,
|
|
16
|
-
normalizeInitConfig,
|
|
17
|
-
resolveRuntimeAssetRoot,
|
|
18
|
-
resolveThemeAndApply,
|
|
19
|
-
setupAutoDefinerAndEnhancers,
|
|
20
|
-
stripFunctions,
|
|
21
|
-
} from "./pds-start-helpers.js";
|
|
22
|
-
|
|
23
|
-
let __liveApiReady = false;
|
|
24
|
-
let __queryClass = null;
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
PDS.
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
PDS.
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
);
|
|
74
|
-
};
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
.
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
//
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
}
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
if (applyConfiguratorStyles) {
|
|
369
|
-
const channel = __getBroadcastChannel();
|
|
370
|
-
if (!channel) {
|
|
371
|
-
console.warn("[PDS Live] BroadcastChannel unavailable; configurator updates will not be received.");
|
|
372
|
-
}
|
|
373
|
-
if (channel && !__broadcastListenerAttached) {
|
|
374
|
-
__broadcastListenerAttached = true;
|
|
375
|
-
console.log("[PDS Live] Listening for configurator broadcasts.");
|
|
376
|
-
channel.addEventListener("message", async (event) => {
|
|
377
|
-
try {
|
|
378
|
-
const data = event?.data;
|
|
379
|
-
if (!data || data.type !== "pds:configurator:design") return;
|
|
380
|
-
if (data.sourceId && data.sourceId === __broadcastId) return;
|
|
381
|
-
|
|
382
|
-
console.log("[PDS Live] Received configurator broadcast.");
|
|
383
|
-
|
|
384
|
-
const incomingConfig = data.payload?.config;
|
|
385
|
-
if (!incomingConfig || typeof incomingConfig !== "object") return;
|
|
386
|
-
|
|
387
|
-
const incomingTheme = data.payload?.theme || null;
|
|
388
|
-
if (incomingTheme) {
|
|
389
|
-
try {
|
|
390
|
-
PDS.theme = incomingTheme;
|
|
391
|
-
} catch (ex) {
|
|
392
|
-
/* ignore theme errors */
|
|
393
|
-
}
|
|
394
|
-
}
|
|
395
|
-
|
|
396
|
-
if (incomingConfig.typography) {
|
|
397
|
-
try {
|
|
398
|
-
await loadTypographyFonts(incomingConfig.typography);
|
|
399
|
-
} catch (ex) {
|
|
400
|
-
/* ignore font loading errors */
|
|
401
|
-
}
|
|
402
|
-
}
|
|
403
|
-
|
|
404
|
-
const generatorOptions = {
|
|
405
|
-
design: structuredClone(incomingConfig),
|
|
406
|
-
};
|
|
407
|
-
if (incomingTheme) generatorOptions.theme = incomingTheme;
|
|
408
|
-
|
|
409
|
-
const incomingGenerator = new Generator(generatorOptions);
|
|
410
|
-
applyStyles(incomingGenerator);
|
|
411
|
-
console.log("[PDS Live] Applied configurator styles from broadcast.");
|
|
412
|
-
} catch (ex) {
|
|
413
|
-
console.warn("Failed to apply broadcasted configurator styles:", ex);
|
|
414
|
-
}
|
|
415
|
-
});
|
|
416
|
-
}
|
|
417
|
-
}
|
|
418
|
-
|
|
419
|
-
emitReady({
|
|
420
|
-
mode: "live",
|
|
421
|
-
generator,
|
|
422
|
-
config: resolvedConfig,
|
|
423
|
-
theme: resolvedTheme,
|
|
424
|
-
autoDefiner,
|
|
425
|
-
});
|
|
426
|
-
|
|
427
|
-
return {
|
|
428
|
-
generator,
|
|
429
|
-
config: resolvedConfig,
|
|
430
|
-
theme: resolvedTheme,
|
|
431
|
-
autoDefiner,
|
|
432
|
-
};
|
|
433
|
-
} catch (error) {
|
|
434
|
-
PDS.dispatchEvent(new CustomEvent("pds:error", { detail: { error } }));
|
|
435
|
-
throw error;
|
|
436
|
-
}
|
|
437
|
-
}
|
|
1
|
+
/**
|
|
2
|
+
* Live-mode initialization and API surface for PDS.
|
|
3
|
+
* Separated to keep the base runtime bundle lean for production/static usage.
|
|
4
|
+
*/
|
|
5
|
+
import { Generator } from "./pds-generator.js";
|
|
6
|
+
import { applyStyles, adoptLayers, adoptPrimitives } from "./pds-runtime.js";
|
|
7
|
+
import { presets, defaultLog } from "./pds-config.js";
|
|
8
|
+
import { defaultPDSEnhancers } from "./pds-enhancers.js";
|
|
9
|
+
import { defaultPDSEnhancerMetadata } from "./pds-enhancers-meta.js";
|
|
10
|
+
import { resolvePublicAssetURL } from "./pds-paths.js";
|
|
11
|
+
import { loadTypographyFonts } from "../common/font-loader.js";
|
|
12
|
+
import {
|
|
13
|
+
ensureAbsoluteAssetURL,
|
|
14
|
+
ensureTrailingSlash,
|
|
15
|
+
attachFoucListener,
|
|
16
|
+
normalizeInitConfig,
|
|
17
|
+
resolveRuntimeAssetRoot,
|
|
18
|
+
resolveThemeAndApply,
|
|
19
|
+
setupAutoDefinerAndEnhancers,
|
|
20
|
+
stripFunctions,
|
|
21
|
+
} from "./pds-start-helpers.js";
|
|
22
|
+
|
|
23
|
+
let __liveApiReady = false;
|
|
24
|
+
let __queryClass = null;
|
|
25
|
+
|
|
26
|
+
async function __attachLiveAPIs(PDS, { applyResolvedTheme, setupSystemListenerIfNeeded }) {
|
|
27
|
+
if (__liveApiReady) return;
|
|
28
|
+
|
|
29
|
+
const [ontologyModule, enumsModule, queryModule, commonModule] =
|
|
30
|
+
await Promise.all([
|
|
31
|
+
import("./pds-ontology.js"),
|
|
32
|
+
import("./pds-enums.js"),
|
|
33
|
+
import("./pds-query.js"),
|
|
34
|
+
import("../common/common.js"),
|
|
35
|
+
]);
|
|
36
|
+
|
|
37
|
+
const ontology = ontologyModule?.default || ontologyModule?.ontology;
|
|
38
|
+
const findComponentForElement = ontologyModule?.findComponentForElement;
|
|
39
|
+
const enums = enumsModule?.enums;
|
|
40
|
+
__queryClass = queryModule?.PDSQuery || queryModule?.default || null;
|
|
41
|
+
|
|
42
|
+
// Expose live-only APIs
|
|
43
|
+
PDS.ontology = ontology;
|
|
44
|
+
PDS.findComponentForElement = findComponentForElement;
|
|
45
|
+
PDS.enums = enums;
|
|
46
|
+
PDS.common = commonModule || {};
|
|
47
|
+
PDS.presets = presets;
|
|
48
|
+
PDS.enhancerMetadata = defaultPDSEnhancerMetadata;
|
|
49
|
+
PDS.applyStyles = function(generator) {
|
|
50
|
+
return applyStyles(generator || Generator.instance);
|
|
51
|
+
};
|
|
52
|
+
PDS.adoptLayers = function(shadowRoot, layers, additionalSheets) {
|
|
53
|
+
return adoptLayers(
|
|
54
|
+
shadowRoot,
|
|
55
|
+
layers,
|
|
56
|
+
additionalSheets,
|
|
57
|
+
Generator.instance
|
|
58
|
+
);
|
|
59
|
+
};
|
|
60
|
+
PDS.adoptPrimitives = function(shadowRoot, additionalSheets) {
|
|
61
|
+
return adoptPrimitives(shadowRoot, additionalSheets, Generator.instance);
|
|
62
|
+
};
|
|
63
|
+
PDS.getGenerator = async function() {
|
|
64
|
+
return Generator;
|
|
65
|
+
};
|
|
66
|
+
PDS.query = async function(question) {
|
|
67
|
+
if (!__queryClass) {
|
|
68
|
+
const mod = await import("./pds-query.js");
|
|
69
|
+
__queryClass = mod?.PDSQuery || mod?.default || null;
|
|
70
|
+
}
|
|
71
|
+
if (!__queryClass) return [];
|
|
72
|
+
const queryEngine = new __queryClass(PDS);
|
|
73
|
+
return await queryEngine.search(question);
|
|
74
|
+
};
|
|
75
|
+
|
|
76
|
+
// Live-only compiled getter
|
|
77
|
+
if (!Object.getOwnPropertyDescriptor(PDS, "compiled")) {
|
|
78
|
+
Object.defineProperty(PDS, "compiled", {
|
|
79
|
+
get() {
|
|
80
|
+
if (PDS.registry?.isLive && Generator.instance) {
|
|
81
|
+
return Generator.instance.compiled;
|
|
82
|
+
}
|
|
83
|
+
return null;
|
|
84
|
+
},
|
|
85
|
+
enumerable: true,
|
|
86
|
+
configurable: false,
|
|
87
|
+
});
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
// Live-only preload helper
|
|
91
|
+
PDS.preloadCritical = function(config, options = {}) {
|
|
92
|
+
if (typeof window === "undefined" || !document.head || !config) {
|
|
93
|
+
return;
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
const { theme, layers = ["tokens"] } = options;
|
|
97
|
+
|
|
98
|
+
try {
|
|
99
|
+
let resolvedTheme = theme || "light";
|
|
100
|
+
if (theme === "system" || !theme) {
|
|
101
|
+
const prefersDark =
|
|
102
|
+
window.matchMedia &&
|
|
103
|
+
window.matchMedia("(prefers-color-scheme: dark)").matches;
|
|
104
|
+
resolvedTheme = prefersDark ? "dark" : "light";
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
document.documentElement.setAttribute("data-theme", resolvedTheme);
|
|
108
|
+
|
|
109
|
+
const tempConfig = config.design
|
|
110
|
+
? { ...config, theme: resolvedTheme }
|
|
111
|
+
: { design: config, theme: resolvedTheme };
|
|
112
|
+
const tempGenerator = new Generator(tempConfig);
|
|
113
|
+
|
|
114
|
+
const criticalCSS = layers
|
|
115
|
+
.map((layer) => {
|
|
116
|
+
try {
|
|
117
|
+
return tempGenerator.css?.[layer] || "";
|
|
118
|
+
} catch (e) {
|
|
119
|
+
return "";
|
|
120
|
+
}
|
|
121
|
+
})
|
|
122
|
+
.filter((css) => css.trim())
|
|
123
|
+
.join("\n");
|
|
124
|
+
|
|
125
|
+
if (criticalCSS) {
|
|
126
|
+
const existing = document.head.querySelector("style[data-pds-preload]");
|
|
127
|
+
if (existing) existing.remove();
|
|
128
|
+
|
|
129
|
+
const styleEl = document.createElement("style");
|
|
130
|
+
styleEl.setAttribute("data-pds-preload", "");
|
|
131
|
+
styleEl.textContent = criticalCSS;
|
|
132
|
+
document.head.insertBefore(styleEl, document.head.firstChild);
|
|
133
|
+
}
|
|
134
|
+
} catch (error) {
|
|
135
|
+
console.warn("PDS preload failed:", error);
|
|
136
|
+
}
|
|
137
|
+
};
|
|
138
|
+
|
|
139
|
+
__liveApiReady = true;
|
|
140
|
+
}
|
|
141
|
+
|
|
142
|
+
|
|
143
|
+
export async function startLive(PDS, config, { emitReady, applyResolvedTheme, setupSystemListenerIfNeeded }) {
|
|
144
|
+
if (!config || typeof config !== "object") {
|
|
145
|
+
throw new Error(
|
|
146
|
+
"PDS.start({ mode: 'live', ... }) requires a valid configuration object"
|
|
147
|
+
);
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
// Attach live-only API surface (ontology, presets, query, etc.)
|
|
151
|
+
await __attachLiveAPIs(PDS, { applyResolvedTheme, setupSystemListenerIfNeeded });
|
|
152
|
+
attachFoucListener(PDS);
|
|
153
|
+
|
|
154
|
+
// FOUC Prevention: Use constructable stylesheet for synchronous, immediate effect
|
|
155
|
+
if (typeof document !== "undefined" && document.adoptedStyleSheets) {
|
|
156
|
+
const css = /*css*/`
|
|
157
|
+
html { opacity: 0; }
|
|
158
|
+
html.pds-ready { opacity: 1; transition: opacity 0.3s ease-in; }
|
|
159
|
+
`;
|
|
160
|
+
try {
|
|
161
|
+
const hasFoucSheet = document.adoptedStyleSheets.some((sheet) => sheet._pdsFouc);
|
|
162
|
+
if (!hasFoucSheet) {
|
|
163
|
+
const foucSheet = new CSSStyleSheet();
|
|
164
|
+
foucSheet.replaceSync(css);
|
|
165
|
+
foucSheet._pdsFouc = true;
|
|
166
|
+
document.adoptedStyleSheets = [foucSheet, ...document.adoptedStyleSheets];
|
|
167
|
+
}
|
|
168
|
+
} catch (e) {
|
|
169
|
+
console.warn("Constructable stylesheets not supported, using <style> tag fallback:", e);
|
|
170
|
+
const existingFoucStyle = document.head.querySelector("style[data-pds-fouc]");
|
|
171
|
+
if (!existingFoucStyle) {
|
|
172
|
+
const foucStyle = document.createElement("style");
|
|
173
|
+
foucStyle.setAttribute("data-pds-fouc", "");
|
|
174
|
+
foucStyle.textContent = css;
|
|
175
|
+
document.head.insertBefore(foucStyle, document.head.firstChild);
|
|
176
|
+
}
|
|
177
|
+
}
|
|
178
|
+
}
|
|
179
|
+
|
|
180
|
+
// Extract runtime flags directly from unified config
|
|
181
|
+
let applyGlobalStyles = config.applyGlobalStyles ?? true;
|
|
182
|
+
let manageTheme = config.manageTheme ?? true;
|
|
183
|
+
let themeStorageKey = config.themeStorageKey ?? "pure-ds-theme";
|
|
184
|
+
let preloadStyles = config.preloadStyles ?? false;
|
|
185
|
+
let criticalLayers = config.criticalLayers ?? ["tokens", "primitives"];
|
|
186
|
+
|
|
187
|
+
const cfgAuto = (config && config.autoDefine) || null;
|
|
188
|
+
|
|
189
|
+
try {
|
|
190
|
+
// 1) Handle theme preference
|
|
191
|
+
const { resolvedTheme } = resolveThemeAndApply({
|
|
192
|
+
manageTheme,
|
|
193
|
+
themeStorageKey,
|
|
194
|
+
applyResolvedTheme,
|
|
195
|
+
setupSystemListenerIfNeeded,
|
|
196
|
+
});
|
|
197
|
+
|
|
198
|
+
// 2) Normalize first-arg API: support { preset, design, enhancers }
|
|
199
|
+
const normalized = normalizeInitConfig(config, {}, { presets, defaultLog });
|
|
200
|
+
const userEnhancers = normalized.enhancers;
|
|
201
|
+
const { log: logFn, ...configToClone } = normalized.generatorConfig;
|
|
202
|
+
const generatorConfig = structuredClone(configToClone);
|
|
203
|
+
generatorConfig.log = logFn;
|
|
204
|
+
if (manageTheme) {
|
|
205
|
+
generatorConfig.theme = resolvedTheme;
|
|
206
|
+
}
|
|
207
|
+
|
|
208
|
+
const generator = new Generator(generatorConfig);
|
|
209
|
+
|
|
210
|
+
// 3) Load fonts from Google Fonts if needed (before applying styles)
|
|
211
|
+
if (generatorConfig.design?.typography) {
|
|
212
|
+
try {
|
|
213
|
+
await loadTypographyFonts(generatorConfig.design.typography);
|
|
214
|
+
} catch (ex) {
|
|
215
|
+
generatorConfig?.log?.("warn", "Failed to load some fonts from Google Fonts:", ex);
|
|
216
|
+
}
|
|
217
|
+
}
|
|
218
|
+
|
|
219
|
+
// 4) Preload critical styles synchronously to prevent flash
|
|
220
|
+
if (preloadStyles && typeof window !== "undefined" && document.head) {
|
|
221
|
+
try {
|
|
222
|
+
const criticalCSS = criticalLayers
|
|
223
|
+
.map((layer) => {
|
|
224
|
+
try {
|
|
225
|
+
return generator.css?.[layer] || "";
|
|
226
|
+
} catch (e) {
|
|
227
|
+
generatorConfig?.log?.(
|
|
228
|
+
"warn",
|
|
229
|
+
`Failed to generate critical CSS for layer "${layer}":`,
|
|
230
|
+
e
|
|
231
|
+
);
|
|
232
|
+
return "";
|
|
233
|
+
}
|
|
234
|
+
})
|
|
235
|
+
.filter((css) => css.trim())
|
|
236
|
+
.join("\n");
|
|
237
|
+
|
|
238
|
+
if (criticalCSS) {
|
|
239
|
+
const existingCritical = document.head.querySelector(
|
|
240
|
+
"style[data-pds-critical]"
|
|
241
|
+
);
|
|
242
|
+
if (existingCritical) {
|
|
243
|
+
existingCritical.remove();
|
|
244
|
+
}
|
|
245
|
+
|
|
246
|
+
const styleEl = document.createElement("style");
|
|
247
|
+
styleEl.setAttribute("data-pds-critical", "");
|
|
248
|
+
styleEl.textContent = criticalCSS;
|
|
249
|
+
|
|
250
|
+
const insertAfter = document.head.querySelector(
|
|
251
|
+
'meta[charset], meta[name="viewport"]'
|
|
252
|
+
);
|
|
253
|
+
if (insertAfter) {
|
|
254
|
+
insertAfter.parentNode.insertBefore(
|
|
255
|
+
styleEl,
|
|
256
|
+
insertAfter.nextSibling
|
|
257
|
+
);
|
|
258
|
+
} else {
|
|
259
|
+
document.head.insertBefore(styleEl, document.head.firstChild);
|
|
260
|
+
}
|
|
261
|
+
}
|
|
262
|
+
} catch (error) {
|
|
263
|
+
generatorConfig?.log?.("warn", "Failed to preload critical styles:", error);
|
|
264
|
+
}
|
|
265
|
+
}
|
|
266
|
+
|
|
267
|
+
// Set the registry to live mode
|
|
268
|
+
PDS.registry.setLiveMode();
|
|
269
|
+
|
|
270
|
+
// Log preset info if available
|
|
271
|
+
if (normalized.presetInfo?.name) {
|
|
272
|
+
generatorConfig?.log?.("log", `PDS live with preset "${normalized.presetInfo.name}"`);
|
|
273
|
+
} else {
|
|
274
|
+
generatorConfig?.log?.("log", "PDS live with custom config");
|
|
275
|
+
}
|
|
276
|
+
|
|
277
|
+
// Apply styles globally if requested (default behavior)
|
|
278
|
+
if (applyGlobalStyles) {
|
|
279
|
+
await applyStyles(Generator.instance);
|
|
280
|
+
|
|
281
|
+
if (typeof window !== "undefined") {
|
|
282
|
+
setTimeout(() => {
|
|
283
|
+
const criticalStyle = document.head.querySelector(
|
|
284
|
+
"style[data-pds-critical]"
|
|
285
|
+
);
|
|
286
|
+
if (criticalStyle) criticalStyle.remove();
|
|
287
|
+
|
|
288
|
+
const preloadStyle = document.head.querySelector(
|
|
289
|
+
"style[data-pds-preload]"
|
|
290
|
+
);
|
|
291
|
+
if (preloadStyle) preloadStyle.remove();
|
|
292
|
+
|
|
293
|
+
const legacyRuntime = document.getElementById(
|
|
294
|
+
"pds-runtime-stylesheet"
|
|
295
|
+
);
|
|
296
|
+
if (legacyRuntime) legacyRuntime.remove();
|
|
297
|
+
}, 100);
|
|
298
|
+
}
|
|
299
|
+
}
|
|
300
|
+
|
|
301
|
+
const assetRootURL = resolveRuntimeAssetRoot(config, { resolvePublicAssetURL });
|
|
302
|
+
|
|
303
|
+
let derivedAutoDefineBaseURL;
|
|
304
|
+
if (cfgAuto && cfgAuto.baseURL) {
|
|
305
|
+
derivedAutoDefineBaseURL = ensureTrailingSlash(
|
|
306
|
+
ensureAbsoluteAssetURL(cfgAuto.baseURL, { preferModule: false })
|
|
307
|
+
);
|
|
308
|
+
} else {
|
|
309
|
+
derivedAutoDefineBaseURL = `${assetRootURL}components/`;
|
|
310
|
+
}
|
|
311
|
+
|
|
312
|
+
// 5) Set up AutoDefiner + run enhancers (defaults merged with user)
|
|
313
|
+
let autoDefiner = null;
|
|
314
|
+
let mergedEnhancers = [];
|
|
315
|
+
|
|
316
|
+
try {
|
|
317
|
+
const res = await setupAutoDefinerAndEnhancers({
|
|
318
|
+
autoDefineBaseURL: derivedAutoDefineBaseURL,
|
|
319
|
+
autoDefinePreload:
|
|
320
|
+
(cfgAuto && Array.isArray(cfgAuto.predefine) && cfgAuto.predefine) ||
|
|
321
|
+
[],
|
|
322
|
+
autoDefineMapper:
|
|
323
|
+
(cfgAuto && typeof cfgAuto.mapper === "function" && cfgAuto.mapper) ||
|
|
324
|
+
null,
|
|
325
|
+
enhancers: userEnhancers,
|
|
326
|
+
autoDefineOverrides: cfgAuto || null,
|
|
327
|
+
autoDefinePreferModule: !(cfgAuto && cfgAuto.baseURL),
|
|
328
|
+
}, { baseEnhancers: defaultPDSEnhancers });
|
|
329
|
+
autoDefiner = res.autoDefiner;
|
|
330
|
+
mergedEnhancers = res.mergedEnhancers || [];
|
|
331
|
+
|
|
332
|
+
} catch (error) {
|
|
333
|
+
generatorConfig?.log?.("error", "❌ Failed to initialize AutoDefiner/Enhancers:", error);
|
|
334
|
+
}
|
|
335
|
+
|
|
336
|
+
const resolvedConfig = generator?.options || generatorConfig;
|
|
337
|
+
|
|
338
|
+
const cloneableConfig = stripFunctions(config);
|
|
339
|
+
PDS.currentConfig = Object.freeze({
|
|
340
|
+
mode: "live",
|
|
341
|
+
...structuredClone(cloneableConfig),
|
|
342
|
+
design: structuredClone(normalized.generatorConfig.design),
|
|
343
|
+
preset: normalized.generatorConfig.preset,
|
|
344
|
+
theme: resolvedTheme,
|
|
345
|
+
enhancers: mergedEnhancers,
|
|
346
|
+
});
|
|
347
|
+
|
|
348
|
+
emitReady({
|
|
349
|
+
mode: "live",
|
|
350
|
+
generator,
|
|
351
|
+
config: resolvedConfig,
|
|
352
|
+
theme: resolvedTheme,
|
|
353
|
+
autoDefiner,
|
|
354
|
+
});
|
|
355
|
+
|
|
356
|
+
return {
|
|
357
|
+
generator,
|
|
358
|
+
config: resolvedConfig,
|
|
359
|
+
theme: resolvedTheme,
|
|
360
|
+
autoDefiner,
|
|
361
|
+
};
|
|
362
|
+
} catch (error) {
|
|
363
|
+
PDS.dispatchEvent(new CustomEvent("pds:error", { detail: { error } }));
|
|
364
|
+
throw error;
|
|
365
|
+
}
|
|
366
|
+
}
|