@pure-ds/core 0.4.23 → 0.4.24

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.
Files changed (15) hide show
  1. package/.github/copilot-instructions.md +45 -0
  2. package/dist/types/public/assets/js/pds.d.ts +2 -2
  3. package/dist/types/public/assets/js/pds.d.ts.map +1 -1
  4. package/dist/types/public/assets/pds/components/pds-form.d.ts.map +1 -1
  5. package/dist/types/src/js/pds-core/pds-config.d.ts +0 -1
  6. package/dist/types/src/js/pds-core/pds-config.d.ts.map +1 -1
  7. package/package.json +4 -3
  8. package/packages/pds-cli/bin/pds-init-config.js +34 -0
  9. package/packages/pds-cli/bin/{postinstall.js → postinstall.mjs} +85 -1
  10. package/public/assets/js/app.js +13 -8
  11. package/public/assets/js/pds.js +14 -9
  12. package/public/assets/pds/components/pds-form.js +29 -8
  13. package/readme.md +83 -3
  14. package/src/js/pds-core/pds-config.js +1 -2
  15. package/src/js/pds.js +21 -4
package/.github/copilot-instructions.md CHANGED
@@ -67,6 +67,49 @@ prompt("name?"); // → await PDS.ask("name?", { type: "prompt" })
67
67
 
68
68
  // ❌ NEVER: Manual dropdown/modal/tab implementations
69
69
  // → Use <nav data-dropdown>, PDS.ask(), <pds-tabstrip>
70
+
71
+ // ❌ NEVER: Access lazy-loaded component APIs before they're defined
72
+ const form = document.querySelector('pds-form');
73
+ form.getFormData(); // May fail - component not loaded yet
74
+ ```
75
+
76
+ ---
77
+
78
+ ## ⚡ Lit Components & Import Maps
79
+
80
+ **Components that require Lit:** `pds-form`
81
+
82
+ This component uses `import { ... } from "#pds/lit"` and **requires** an import map:
83
+
84
+ ```html
85
+ <!-- REQUIRED in HTML <head> for Lit components -->
86
+ <script type="importmap">
87
+ {
88
+ "imports": {
89
+ "#pds/lit": "/assets/js/lit.js"
90
+ }
91
+ }
92
+ </script>
93
+ ```
94
+
95
+ **When generating code with lazy-loaded components, ALWAYS wait for definition:**
96
+
97
+ ```javascript
98
+ // ✅ CORRECT: Wait for component to load
99
+ await customElements.whenDefined('pds-form');
100
+ const form = document.querySelector('pds-form');
101
+ form.getFormData(); // Safe
102
+
103
+ // ✅ CORRECT: Alternative pattern
104
+ const FormClass = await customElements.get('pds-form');
105
+ if (FormClass) {
106
+ const form = document.createElement('pds-form');
107
+ // ...
108
+ }
109
+
110
+ // ❌ WRONG: Direct access without waiting
111
+ const form = document.querySelector('pds-form');
112
+ form.getFormData(); // May throw error
70
113
  ```
71
114
 
72
115
  ---
@@ -166,3 +209,5 @@ Before generating code:
166
209
  6. ✅ **Apply enhancements via data-* attributes** — See `pds-enhancer-metadata.js`
167
210
  7. ✅ **Components as last resort** — Only when native HTML can't achieve it
168
211
  8. ✅ **Prefer primitives** — `.card`, `.badge`, `.alert` over custom components
212
+ 9. ✅ **Wait for lazy components** — Use `await customElements.whenDefined()` before accessing APIs
213
+ 10. ✅ **Include import map** — When using `pds-form` or `pds-drawer`, ensure `#pds/lit` is mapped
package/dist/types/public/assets/js/pds.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- declare var f: {
1
+ declare var b: {
2
2
  addEventListener(type: string, callback: EventListenerOrEventListenerObject | null, options?: AddEventListenerOptions | boolean): void;
3
3
  dispatchEvent(event: Event): boolean;
4
4
  removeEventListener(type: string, callback: EventListenerOrEventListenerObject | null, options?: EventListenerOptions | boolean): void;
@@ -19,5 +19,5 @@ declare function Et(n?: {}, e?: {}): {
19
19
  context?: undefined;
20
20
  })[];
21
21
  };
22
- export { f as PDS, Et as validateDesign };
22
+ export { b as PDS, Et as validateDesign };
23
23
  //# sourceMappingURL=pds.d.ts.map
package/dist/types/public/assets/js/pds.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"pds.d.ts","sourceRoot":"","sources":["../../../../../public/assets/js/pds.js"],"names":[],"mappings":"AAupG6nS;;;;EAAQ;AAAsnF;;;;;;;;;;;;;;;EAA8sE"}
1
+ {"version":3,"file":"pds.d.ts","sourceRoot":"","sources":["../../../../../public/assets/js/pds.js"],"names":[],"mappings":"AAksG6nS;;;;EAAQ;AAAsnF;;;;;;;;;;;;;;;EAA8sE"}
package/dist/types/public/assets/pds/components/pds-form.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"pds-form.d.ts","sourceRoot":"","sources":["../../../../../../public/assets/pds/components/pds-form.js"],"names":[],"mappings":"AAgCA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH;IACE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAcE;IAGF,yBAEC;IAgBC,gBAA2B;IAC3B,cAAyB;IACzB,aAAwB;IACxB,YAAuB;IACvB,eAAoB;IACpB,qBAAwB;IACxB,oBAA2B;IAC3B,mBAAyB;IACzB,mBAAsB;IACtB,oBAAuB;IAiBzB,8CAEC;IACD,4BAEC;IAGD,oBAEC;IAkBD;;;MAIC;IAED,uBAEC;IAED,cAIC;IAED,0BAcC;IAGD,+BAyBC;IA4eD,cA4CC;;CAumDF"}
1
+ {"version":3,"file":"pds-form.d.ts","sourceRoot":"","sources":["../../../../../../public/assets/pds/components/pds-form.js"],"names":[],"mappings":"AAgCA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH;IACE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAcE;IAGF,yBAEC;IAgBC,gBAA2B;IAC3B,cAAyB;IACzB,aAAwB;IACxB,YAAuB;IACvB,eAAoB;IACpB,qBAAwB;IACxB,oBAA2B;IAC3B,mBAAyB;IACzB,mBAAsB;IACtB,oBAAuB;IAiBzB,8CAEC;IACD,4BAEC;IAGD,oBAEC;IAkBD;;;MAIC;IAED,uBAEC;IAED,cAIC;IAED,0BAcC;IAGD,+BAyBC;IA2eD,cA4CC;;CA6nDF"}
package/dist/types/src/js/pds-core/pds-config.d.ts CHANGED
@@ -701,7 +701,6 @@ export const presets: {
701
701
  description: string;
702
702
  options: {
703
703
  liquidGlassEffects: boolean;
704
- backgroundMesh: number;
705
704
  };
706
705
  colors: {
707
706
  primary: string;
package/dist/types/src/js/pds-core/pds-config.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"pds-config.d.ts","sourceRoot":"","sources":["../../../../../src/js/pds-core/pds-config.js"],"names":[],"mappings":"AAunCA;;;;;;GAMG;AACH,kCAJW,MAAM,WACN,MAAM,WACH,GAAG,EAAA,QAchB;AAxoCD;;;GAGG;AACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqxBE"}
1
+ {"version":3,"file":"pds-config.d.ts","sourceRoot":"","sources":["../../../../../src/js/pds-core/pds-config.js"],"names":[],"mappings":"AAsnCA;;;;;;GAMG;AACH,kCAJW,MAAM,WACN,MAAM,WACH,GAAG,EAAA,QAchB;AAvoCD;;;GAGG;AACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoxBE"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@pure-ds/core",
3
3
  "shortname": "pds",
4
- "version": "0.4.23",
4
+ "version": "0.4.24",
5
5
  "description": "Pure Design System - Why develop a Design System when you can generate one?",
6
6
  "repository": {
7
7
  "type": "git",
@@ -29,7 +29,8 @@
29
29
  "pds-export": "packages/pds-cli/bin/pds-static.js",
30
30
  "pds-sync-assets": "packages/pds-cli/bin/sync-assets.js",
31
31
  "pds-build-icons": "packages/pds-cli/bin/pds-build-icons.js",
32
- "pds-setup-copilot": "packages/pds-cli/bin/pds-setup-copilot.js"
32
+ "pds-setup-copilot": "packages/pds-cli/bin/pds-setup-copilot.js",
33
+ "pds-init-config": "packages/pds-cli/bin/pds-init-config.js"
33
34
  },
34
35
  "exports": {
35
36
  ".": {
@@ -73,7 +74,7 @@
73
74
  "prebuild": "npm run types",
74
75
  "build": "node esbuild-build.js",
75
76
  "types": "tsc -p tsconfig.json && node scripts/sync-types.mjs",
76
- "postinstall": "node packages/pds-cli/bin/postinstall.js",
77
+ "postinstall": "node packages/pds-cli/bin/postinstall.mjs",
77
78
  "prepds:export": "npm run types",
78
79
  "pds:export": "node packages/pds-cli/bin/pds-static.js",
79
80
  "pds:build-icons": "node packages/pds-cli/bin/pds-build-icons.js",
package/packages/pds-cli/bin/pds-init-config.js ADDED
@@ -0,0 +1,34 @@
1
+ #!/usr/bin/env node
2
+
3
+ /**
4
+ * PDS Init Config - Create a default pds.config.js file
5
+ * Usage: npx pds-init-config [--force]
6
+ */
7
+
8
+ import { ensurePdsConfig } from './postinstall.js';
9
+ import { resolve } from 'path';
10
+
11
+ const args = process.argv.slice(2);
12
+ const force = args.includes('--force') || args.includes('-f');
13
+ const targetDir = args.find(arg => !arg.startsWith('-')) || process.cwd();
14
+
15
+ async function main() {
16
+ console.log('🎨 PDS Config Initialization\n');
17
+
18
+ const targetPath = resolve(targetDir);
19
+ console.log(`📁 Target directory: ${targetPath}\n`);
20
+
21
+ if (force) {
22
+ console.log('⚠️ Force mode enabled - will overwrite existing config\n');
23
+ }
24
+
25
+ await ensurePdsConfig(targetPath, force);
26
+
27
+ console.log('\n✨ Done! Edit pds.config.js to customize your design system.');
28
+ console.log('📚 Learn more: https://github.com/pure-ds/core#configuration\n');
29
+ }
30
+
31
+ main().catch((error) => {
32
+ console.error('❌ Error:', error.message);
33
+ process.exit(1);
34
+ });
package/packages/pds-cli/bin/{postinstall.js → postinstall.mjs} RENAMED
@@ -135,6 +135,87 @@ async function ensureExportScript(consumerRoot) {
135
135
  }
136
136
  }
137
137
 
138
+ /**
139
+ * Create default pds.config.js if it doesn't exist
140
+ * @param {string} consumerRoot - The root directory to create the config in
141
+ * @param {boolean} force - If true, overwrite existing config
142
+ */
143
+ async function ensurePdsConfig(consumerRoot, force = false) {
144
+ try {
145
+ const configPath = path.join(consumerRoot, 'pds.config.js');
146
+
147
+ // Check if config already exists
148
+ try {
149
+ await access(configPath);
150
+ if (!force) {
151
+ console.log('📝 pds.config.js already exists, skipping...');
152
+ return;
153
+ }
154
+ console.log('📝 Overwriting existing pds.config.js...');
155
+ } catch {
156
+ // File doesn't exist, create it
157
+ }
158
+
159
+ const defaultConfig = `export const config = {
160
+ mode: "live",
161
+ preset: "default",
162
+
163
+ // Uncomment to override preset design tokens:
164
+ // design: {
165
+ // colors: {
166
+ // primary: '#007acc',
167
+ // secondary: '#5c2d91',
168
+ // accent: '#ec4899'
169
+ // },
170
+ // typography: {
171
+ // fontFamilyHeadings: 'Inter, sans-serif',
172
+ // fontFamilyBody: 'Inter, sans-serif',
173
+ // baseFontSize: 16,
174
+ // fontScale: 1.25
175
+ // },
176
+ // spatialRhythm: {
177
+ // baseUnit: 8,
178
+ // scaleRatio: 1.5
179
+ // }
180
+ // },
181
+
182
+ // Uncomment to add custom progressive enhancers:
183
+ // enhancers: [
184
+ // {
185
+ // selector: '[data-tooltip]',
186
+ // description: 'Adds tooltip on hover',
187
+ // run: (element) => {
188
+ // const text = element.dataset.tooltip;
189
+ // element.addEventListener('mouseenter', () => {
190
+ // // Show tooltip implementation
191
+ // });
192
+ // }
193
+ // }
194
+ // ],
195
+
196
+ // Uncomment to customize lazy-loaded web components:
197
+ // autoDefine: {
198
+ // baseURL: '/pds/components/',
199
+ // predefine: ['pds-icon', 'pds-drawer', 'pds-toaster'],
200
+ //
201
+ // // Custom component paths
202
+ // mapper: (tag) => {
203
+ // if (tag.startsWith('my-')) {
204
+ // return \`/components/\${tag}.js\`;
205
+ // }
206
+ // // Return nothing to use PDS default mapping
207
+ // }
208
+ // }
209
+ };
210
+ `;
211
+
212
+ await writeFile(configPath, defaultConfig, 'utf8');
213
+ console.log('📝 Created default pds.config.js');
214
+ } catch (e) {
215
+ console.warn('⚠️ Could not create pds.config.js:', e.message);
216
+ }
217
+ }
218
+
138
219
  /**
139
220
  * Copy PDS Copilot instructions to consumer's .github folder
140
221
  */
@@ -331,6 +412,9 @@ async function copyPdsAssets() {
331
412
 
332
413
  console.log('📦 Proceeding with asset copying...');
333
414
 
415
+ // Create default pds.config.js if it doesn't exist
416
+ await ensurePdsConfig(consumerRoot);
417
+
334
418
  // Copy Copilot instructions to consumer project
335
419
  await copyCopilotInstructions(consumerRoot);
336
420
 
@@ -436,4 +520,4 @@ if (process.argv[1].endsWith('postinstall.js')) {
436
520
  copyPdsAssets().catch(console.error);
437
521
  }
438
522
 
439
- export { copyPdsAssets, discoverWebRoot };
523
+ export { copyPdsAssets, discoverWebRoot, ensurePdsConfig };