@pure-ds/core 0.5.9 → 0.5.11
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/src/js/pds-core/pds-live.d.ts.map +1 -1
- package/dist/types/src/js/pds-core/pds-start-helpers.d.ts +3 -0
- 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/pds-bootstrap.js +163 -11
- package/public/assets/js/app.js +141 -141
- package/public/assets/js/pds-manager.js +67 -67
- package/public/assets/js/pds.js +5 -5
- package/src/js/pds-core/pds-live.js +18 -51
- package/src/js/pds-core/pds-start-helpers.js +60 -0
- package/src/js/pds.js +8 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pds-live.d.ts","sourceRoot":"","sources":["../../../../../src/js/pds-core/pds-live.js"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"pds-live.d.ts","sourceRoot":"","sources":["../../../../../src/js/pds-core/pds-live.js"],"names":[],"mappings":"AAwKA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6NC;0BAjYyB,oBAAoB"}
|
|
@@ -48,6 +48,9 @@ export function resolveThemeAndApply({ manageTheme, themeStorageKey, applyResolv
|
|
|
48
48
|
resolvedTheme: string;
|
|
49
49
|
storedTheme: string;
|
|
50
50
|
};
|
|
51
|
+
export function createSetTheme({ PDS, defaultStorageKey, setupSystemListenerIfNeeded, onApply, }?: {
|
|
52
|
+
defaultStorageKey?: string;
|
|
53
|
+
}): (theme: any, options?: {}) => Promise<any>;
|
|
51
54
|
export function resolveRuntimeAssetRoot(config: any, { resolvePublicAssetURL }: {
|
|
52
55
|
resolvePublicAssetURL: any;
|
|
53
56
|
}): any;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pds-start-helpers.d.ts","sourceRoot":"","sources":["../../../../../src/js/pds-core/pds-start-helpers.js"],"names":[],"mappings":"AAmBA,sEAgCC;AAiBD,mDASC;AA6BD,8CAsBC;AAGD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuGC;AAGD;;;;;;;;EAmCC;AAED;;QASC;AAGD;;;;;GAmIC;
|
|
1
|
+
{"version":3,"file":"pds-start-helpers.d.ts","sourceRoot":"","sources":["../../../../../src/js/pds-core/pds-start-helpers.js"],"names":[],"mappings":"AAmBA,sEAgCC;AAiBD,mDASC;AA6BD,8CAsBC;AAGD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuGC;AAGD;;;;;;;;EAmCC;AAGD;;KAMiC,UAAK,EAAE,YAAY,kBAmDnD;AAED;;QASC;AAGD;;;;;GAmIC;AA/cM,qDAGI"}
|
package/package.json
CHANGED
|
@@ -42,7 +42,7 @@ async function writePackageJson(pkgPath, pkg) {
|
|
|
42
42
|
await writeFile(pkgPath, JSON.stringify(pkg, null, 2) + '\n');
|
|
43
43
|
}
|
|
44
44
|
|
|
45
|
-
function buildIndexHtml() {
|
|
45
|
+
function buildIndexHtml({ version, generatedAt }) {
|
|
46
46
|
return `<!doctype html>
|
|
47
47
|
<html lang="en">
|
|
48
48
|
<head>
|
|
@@ -62,15 +62,16 @@ function buildIndexHtml() {
|
|
|
62
62
|
}
|
|
63
63
|
</script>
|
|
64
64
|
|
|
65
|
+
<!-- Dev live-reload (safe in production, no-op without server) -->
|
|
66
|
+
<script type="module" src="/assets/js/dev-reload.js" defer></script>
|
|
67
|
+
|
|
65
68
|
<!-- App Script -->
|
|
66
69
|
<script type="module" src="/assets/js/app.js" defer></script>
|
|
67
70
|
</head>
|
|
68
71
|
|
|
69
72
|
<body class="container">
|
|
70
73
|
<header class="stack-sm">
|
|
71
|
-
<p class="
|
|
72
|
-
<h1>Design systems, generated.</h1>
|
|
73
|
-
<p class="text-muted">This starter is ready for your custom tokens, components, and brand.</p>
|
|
74
|
+
<p class="text-muted">Auto-generated by PDS ${version} at ${generatedAt}</p>
|
|
74
75
|
</header>
|
|
75
76
|
|
|
76
77
|
<main></main>
|
|
@@ -83,11 +84,46 @@ function buildIndexHtml() {
|
|
|
83
84
|
`;
|
|
84
85
|
}
|
|
85
86
|
|
|
87
|
+
function buildDevReloadJs() {
|
|
88
|
+
return `const shouldConnect =
|
|
89
|
+
location.hostname === 'localhost' || location.hostname === '127.0.0.1';
|
|
90
|
+
|
|
91
|
+
if (shouldConnect) {
|
|
92
|
+
const reloadPort = 4174;
|
|
93
|
+
const endpoint =
|
|
94
|
+
<h1>Welcome to your new App</h1>
|
|
95
|
+
source.onmessage = (event) => {
|
|
96
|
+
if (event.data === 'reload') {
|
|
97
|
+
This <code><wc-home></code> Web Component is lazy-loaded and styled with Pure Design System.
|
|
98
|
+
};
|
|
99
|
+
|
|
100
|
+
source.onerror = () => {
|
|
101
|
+
<a target="_blank" href="https://github.com/Pure-Web-Foundation/pure-ds/blob/main/packages/pds-storybook/stories/GettingStarted.md" class="btn btn-primary btn-lg">
|
|
102
|
+
<pds-icon icon="rocket"></pds-icon> Get Started
|
|
103
|
+
</a>
|
|
104
|
+
<a target="_blank" href="https://puredesignsystem.z6.web.core.windows.net/storybook/" class="btn btn-secondary btn-lg">
|
|
105
|
+
<pds-icon icon="book-open"></pds-icon> Storybook
|
|
106
|
+
</a>
|
|
107
|
+
}
|
|
108
|
+
`;
|
|
109
|
+
}
|
|
110
|
+
|
|
86
111
|
function buildAppCss() {
|
|
87
112
|
return `html:not(.pds-ready) {
|
|
88
113
|
opacity: 0;
|
|
89
114
|
}
|
|
90
115
|
|
|
116
|
+
async function getPdsCoreVersion() {
|
|
117
|
+
try {
|
|
118
|
+
const pkgPath = path.join(projectRoot, 'node_modules', '@pure-ds', 'core', 'package.json');
|
|
119
|
+
const raw = await readFile(pkgPath, 'utf8');
|
|
120
|
+
const pkg = JSON.parse(raw);
|
|
121
|
+
return pkg?.version || 'unknown';
|
|
122
|
+
} catch {
|
|
123
|
+
return 'unknown';
|
|
124
|
+
}
|
|
125
|
+
}
|
|
126
|
+
|
|
91
127
|
main {
|
|
92
128
|
margin-top: var(--spacing-8);
|
|
93
129
|
}
|
|
@@ -103,7 +139,7 @@ function buildWcHome() {
|
|
|
103
139
|
<article class="card text-center border-gradient surface-translucent-50">
|
|
104
140
|
<header>
|
|
105
141
|
<h1>Welcome to Pure Design System</h1>
|
|
106
|
-
<h2>
|
|
142
|
+
<h2 class="text-muted">Build on What Lasts</h2>
|
|
107
143
|
</header>
|
|
108
144
|
<div class="stack-lg">
|
|
109
145
|
<p>
|
|
@@ -115,9 +151,9 @@ function buildWcHome() {
|
|
|
115
151
|
<button class="btn-primary btn-lg" data-enhanced-btn-working="true">
|
|
116
152
|
Get Started
|
|
117
153
|
</button>
|
|
118
|
-
<
|
|
154
|
+
<a href="https://pureweb.dev" class="btn btn-secondary btn-lg" data-enhanced-btn-working="true">
|
|
119
155
|
Learn More
|
|
120
|
-
</
|
|
156
|
+
</a>
|
|
121
157
|
</nav>
|
|
122
158
|
</article>
|
|
123
159
|
\`;
|
|
@@ -145,8 +181,60 @@ if (main && !main.querySelector('wc-home')) {
|
|
|
145
181
|
|
|
146
182
|
function buildEsbuildDevCjs() {
|
|
147
183
|
return `const esbuild = require('esbuild');
|
|
184
|
+
const http = require('http');
|
|
185
|
+
|
|
186
|
+
const reloadPort = 4174;
|
|
187
|
+
const reloadClients = new Set();
|
|
188
|
+
|
|
189
|
+
function startReloadServer() {
|
|
190
|
+
const server = http.createServer((req, res) => {
|
|
191
|
+
if (req.url !== '/events') {
|
|
192
|
+
res.writeHead(404);
|
|
193
|
+
res.end();
|
|
194
|
+
return;
|
|
195
|
+
}
|
|
196
|
+
|
|
197
|
+
res.writeHead(200, {
|
|
198
|
+
'Content-Type': 'text/event-stream',
|
|
199
|
+
'Cache-Control': 'no-cache',
|
|
200
|
+
Connection: 'keep-alive',
|
|
201
|
+
'Access-Control-Allow-Origin': '*'
|
|
202
|
+
});
|
|
203
|
+
|
|
204
|
+
res.write('retry: 1000\n\n');
|
|
205
|
+
reloadClients.add(res);
|
|
206
|
+
|
|
207
|
+
req.on('close', () => {
|
|
208
|
+
reloadClients.delete(res);
|
|
209
|
+
});
|
|
210
|
+
});
|
|
211
|
+
|
|
212
|
+
server.listen(reloadPort, () => {
|
|
213
|
+
console.log('Live reload listening on http://localhost:' + reloadPort + '/events');
|
|
214
|
+
});
|
|
215
|
+
}
|
|
216
|
+
|
|
217
|
+
function notifyReload() {
|
|
218
|
+
for (const client of reloadClients) {
|
|
219
|
+
client.write('data: reload\n\n');
|
|
220
|
+
}
|
|
221
|
+
}
|
|
222
|
+
|
|
223
|
+
function liveReloadPlugin() {
|
|
224
|
+
return {
|
|
225
|
+
name: 'live-reload',
|
|
226
|
+
setup(build) {
|
|
227
|
+
build.onEnd((result) => {
|
|
228
|
+
if (!result.errors.length) {
|
|
229
|
+
notifyReload();
|
|
230
|
+
}
|
|
231
|
+
});
|
|
232
|
+
}
|
|
233
|
+
};
|
|
234
|
+
}
|
|
148
235
|
|
|
149
236
|
async function start() {
|
|
237
|
+
startReloadServer();
|
|
150
238
|
const ctx = await esbuild.context({
|
|
151
239
|
entryPoints: ['src/js/app.js'],
|
|
152
240
|
outdir: 'public/assets/js',
|
|
@@ -155,7 +243,8 @@ async function start() {
|
|
|
155
243
|
sourcemap: true,
|
|
156
244
|
publicPath: '/assets/js',
|
|
157
245
|
external: ['/assets/wc/*'],
|
|
158
|
-
logLevel: 'info'
|
|
246
|
+
logLevel: 'info',
|
|
247
|
+
plugins: [liveReloadPlugin()]
|
|
159
248
|
});
|
|
160
249
|
|
|
161
250
|
await ctx.watch();
|
|
@@ -172,6 +261,59 @@ start().catch((err) => {
|
|
|
172
261
|
|
|
173
262
|
function buildEsbuildDevEsm() {
|
|
174
263
|
return `import esbuild from 'esbuild';
|
|
264
|
+
import http from 'http';
|
|
265
|
+
|
|
266
|
+
const reloadPort = 4174;
|
|
267
|
+
const reloadClients = new Set();
|
|
268
|
+
|
|
269
|
+
function startReloadServer() {
|
|
270
|
+
const server = http.createServer((req, res) => {
|
|
271
|
+
if (req.url !== '/events') {
|
|
272
|
+
res.writeHead(404);
|
|
273
|
+
res.end();
|
|
274
|
+
return;
|
|
275
|
+
}
|
|
276
|
+
|
|
277
|
+
res.writeHead(200, {
|
|
278
|
+
'Content-Type': 'text/event-stream',
|
|
279
|
+
'Cache-Control': 'no-cache',
|
|
280
|
+
Connection: 'keep-alive',
|
|
281
|
+
'Access-Control-Allow-Origin': '*'
|
|
282
|
+
});
|
|
283
|
+
|
|
284
|
+
res.write('retry: 1000\n\n');
|
|
285
|
+
reloadClients.add(res);
|
|
286
|
+
|
|
287
|
+
req.on('close', () => {
|
|
288
|
+
reloadClients.delete(res);
|
|
289
|
+
});
|
|
290
|
+
});
|
|
291
|
+
|
|
292
|
+
server.listen(reloadPort, () => {
|
|
293
|
+
console.log('Live reload listening on http://localhost:' + reloadPort + '/events');
|
|
294
|
+
});
|
|
295
|
+
}
|
|
296
|
+
|
|
297
|
+
function notifyReload() {
|
|
298
|
+
for (const client of reloadClients) {
|
|
299
|
+
client.write('data: reload\n\n');
|
|
300
|
+
}
|
|
301
|
+
}
|
|
302
|
+
|
|
303
|
+
function liveReloadPlugin() {
|
|
304
|
+
return {
|
|
305
|
+
name: 'live-reload',
|
|
306
|
+
setup(build) {
|
|
307
|
+
build.onEnd((result) => {
|
|
308
|
+
if (!result.errors.length) {
|
|
309
|
+
notifyReload();
|
|
310
|
+
}
|
|
311
|
+
});
|
|
312
|
+
}
|
|
313
|
+
};
|
|
314
|
+
}
|
|
315
|
+
|
|
316
|
+
startReloadServer();
|
|
175
317
|
|
|
176
318
|
const ctx = await esbuild.context({
|
|
177
319
|
entryPoints: ['src/js/app.js'],
|
|
@@ -181,12 +323,12 @@ const ctx = await esbuild.context({
|
|
|
181
323
|
sourcemap: true,
|
|
182
324
|
publicPath: '/assets/js',
|
|
183
325
|
external: ['/assets/wc/*'],
|
|
184
|
-
logLevel: 'info'
|
|
326
|
+
logLevel: 'info',
|
|
327
|
+
plugins: [liveReloadPlugin()]
|
|
185
328
|
});
|
|
186
329
|
|
|
187
330
|
await ctx.watch();
|
|
188
331
|
const { host, port } = await ctx.serve({ servedir: 'public', port: 4173 });
|
|
189
|
-
console.log('Dev server running at http://' + host + ':' + port);
|
|
190
332
|
`;
|
|
191
333
|
}
|
|
192
334
|
|
|
@@ -294,9 +436,19 @@ async function main() {
|
|
|
294
436
|
await ensurePackageScripts(pkg, pkgPath);
|
|
295
437
|
await ensureEsbuildDependency(pkg, pkgPath);
|
|
296
438
|
|
|
297
|
-
|
|
439
|
+
const version = await getPdsCoreVersion();
|
|
440
|
+
const generatedAt = new Date().toLocaleString();
|
|
441
|
+
|
|
442
|
+
await writeFileIfMissing(
|
|
443
|
+
path.join(projectRoot, 'public', 'index.html'),
|
|
444
|
+
buildIndexHtml({ version, generatedAt })
|
|
445
|
+
);
|
|
298
446
|
await writeFileIfMissing(path.join(projectRoot, 'public', 'assets', 'css', 'app.css'), buildAppCss());
|
|
299
447
|
await writeFileIfMissing(path.join(projectRoot, 'src', 'js', 'app.js'), buildAppJs());
|
|
448
|
+
await writeFileIfMissing(
|
|
449
|
+
path.join(projectRoot, 'public', 'assets', 'js', 'dev-reload.js'),
|
|
450
|
+
buildDevReloadJs()
|
|
451
|
+
);
|
|
300
452
|
await writeFileIfMissing(
|
|
301
453
|
path.join(projectRoot, 'public', 'assets', 'wc', 'wc-home.js'),
|
|
302
454
|
buildWcHome()
|