@pure-ds/storybook 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (129) hide show
  1. package/.storybook/addons/description/preview.js +15 -0
  2. package/.storybook/addons/description/register.js +60 -0
  3. package/.storybook/addons/html-preview/Panel.jsx +327 -0
  4. package/.storybook/addons/html-preview/constants.js +6 -0
  5. package/.storybook/addons/html-preview/preview.js +178 -0
  6. package/.storybook/addons/html-preview/register.js +16 -0
  7. package/.storybook/addons/pds-configurator/SearchTool.js +44 -0
  8. package/.storybook/addons/pds-configurator/Tool.js +30 -0
  9. package/.storybook/addons/pds-configurator/constants.js +9 -0
  10. package/.storybook/addons/pds-configurator/preview.js +159 -0
  11. package/.storybook/addons/pds-configurator/register.js +24 -0
  12. package/.storybook/docs.css +35 -0
  13. package/.storybook/htmlPreview.css +103 -0
  14. package/.storybook/htmlPreview.js +271 -0
  15. package/.storybook/main.js +160 -0
  16. package/.storybook/preview-body.html +48 -0
  17. package/.storybook/preview-head.html +11 -0
  18. package/.storybook/preview.js +1563 -0
  19. package/README.md +266 -0
  20. package/bin/index.js +40 -0
  21. package/dist/pds-reference.json +2101 -0
  22. package/package.json +45 -0
  23. package/pds.config.js +6 -0
  24. package/public/assets/css/app.css +1216 -0
  25. package/public/assets/data/auto-design-advanced.json +704 -0
  26. package/public/assets/data/auto-design-simple.json +123 -0
  27. package/public/assets/img/icon-512x512.png +0 -0
  28. package/public/assets/img/logo-trans.png +0 -0
  29. package/public/assets/img/logo.png +0 -0
  30. package/public/assets/js/app.js +15088 -0
  31. package/public/assets/js/app.js.map +7 -0
  32. package/public/assets/js/lit.js +1176 -0
  33. package/public/assets/js/lit.js.map +7 -0
  34. package/public/assets/js/pds.js +9801 -0
  35. package/public/assets/js/pds.js.map +7 -0
  36. package/public/assets/pds/components/pds-calendar.js +837 -0
  37. package/public/assets/pds/components/pds-drawer.js +857 -0
  38. package/public/assets/pds/components/pds-icon.js +338 -0
  39. package/public/assets/pds/components/pds-jsonform.js +1775 -0
  40. package/public/assets/pds/components/pds-richtext.js +1035 -0
  41. package/public/assets/pds/components/pds-scrollrow.js +331 -0
  42. package/public/assets/pds/components/pds-splitpanel.js +401 -0
  43. package/public/assets/pds/components/pds-tabstrip.js +251 -0
  44. package/public/assets/pds/components/pds-toaster.js +446 -0
  45. package/public/assets/pds/components/pds-upload.js +657 -0
  46. package/public/assets/pds/custom-elements.json +2003 -0
  47. package/public/assets/pds/icons/pds-icons.svg +498 -0
  48. package/public/assets/pds/pds-css-complete.json +1861 -0
  49. package/public/assets/pds/pds-runtime-config.json +11 -0
  50. package/public/assets/pds/pds.css-data.json +2152 -0
  51. package/public/assets/pds/styles/pds-components.css +1944 -0
  52. package/public/assets/pds/styles/pds-components.css.js +3895 -0
  53. package/public/assets/pds/styles/pds-primitives.css +352 -0
  54. package/public/assets/pds/styles/pds-primitives.css.js +711 -0
  55. package/public/assets/pds/styles/pds-styles.css +3761 -0
  56. package/public/assets/pds/styles/pds-styles.css.js +7529 -0
  57. package/public/assets/pds/styles/pds-tokens.css +699 -0
  58. package/public/assets/pds/styles/pds-tokens.css.js +1405 -0
  59. package/public/assets/pds/styles/pds-utilities.css +763 -0
  60. package/public/assets/pds/styles/pds-utilities.css.js +1533 -0
  61. package/public/assets/pds/vscode-custom-data.json +824 -0
  62. package/scripts/build-pds-reference.mjs +807 -0
  63. package/scripts/generate-stories.js +542 -0
  64. package/scripts/package-build.js +86 -0
  65. package/src/js/app.js +17 -0
  66. package/src/js/common/ask.js +208 -0
  67. package/src/js/common/common.js +20 -0
  68. package/src/js/common/font-loader.js +200 -0
  69. package/src/js/common/msg.js +90 -0
  70. package/src/js/lit.js +40 -0
  71. package/src/js/pds-core/pds-config.js +1162 -0
  72. package/src/js/pds-core/pds-enhancer-metadata.js +75 -0
  73. package/src/js/pds-core/pds-enhancers.js +357 -0
  74. package/src/js/pds-core/pds-enums.js +86 -0
  75. package/src/js/pds-core/pds-generator.js +5317 -0
  76. package/src/js/pds-core/pds-ontology.js +256 -0
  77. package/src/js/pds-core/pds-paths.js +109 -0
  78. package/src/js/pds-core/pds-query.js +571 -0
  79. package/src/js/pds-core/pds-registry.js +129 -0
  80. package/src/js/pds-core/pds.d.ts +129 -0
  81. package/src/js/pds.d.ts +408 -0
  82. package/src/js/pds.js +1579 -0
  83. package/src/pds-core/pds-api.js +105 -0
  84. package/stories/GettingStarted.md +96 -0
  85. package/stories/GettingStarted.stories.js +144 -0
  86. package/stories/WhatIsPDS.md +194 -0
  87. package/stories/WhatIsPDS.stories.js +144 -0
  88. package/stories/components/PdsCalendar.stories.js +263 -0
  89. package/stories/components/PdsDrawer.stories.js +623 -0
  90. package/stories/components/PdsIcon.stories.js +78 -0
  91. package/stories/components/PdsJsonform.stories.js +1444 -0
  92. package/stories/components/PdsRichtext.stories.js +367 -0
  93. package/stories/components/PdsScrollrow.stories.js +140 -0
  94. package/stories/components/PdsSplitpanel.stories.js +502 -0
  95. package/stories/components/PdsTabstrip.stories.js +442 -0
  96. package/stories/components/PdsToaster.stories.js +186 -0
  97. package/stories/components/PdsUpload.stories.js +66 -0
  98. package/stories/enhancements/Dropdowns.stories.js +185 -0
  99. package/stories/enhancements/InteractiveStates.stories.js +625 -0
  100. package/stories/enhancements/MeshGradients.stories.js +320 -0
  101. package/stories/enhancements/OpenGroups.stories.js +227 -0
  102. package/stories/enhancements/RangeSliders.stories.js +232 -0
  103. package/stories/enhancements/RequiredFields.stories.js +189 -0
  104. package/stories/enhancements/Toggles.stories.js +167 -0
  105. package/stories/foundations/Colors.stories.js +283 -0
  106. package/stories/foundations/Icons.stories.js +305 -0
  107. package/stories/foundations/SmartSurfaces.stories.js +367 -0
  108. package/stories/foundations/Spacing.stories.js +175 -0
  109. package/stories/foundations/Typography.stories.js +960 -0
  110. package/stories/foundations/ZIndex.stories.js +325 -0
  111. package/stories/patterns/BorderEffects.stories.js +72 -0
  112. package/stories/patterns/Layout.stories.js +99 -0
  113. package/stories/patterns/Utilities.stories.js +107 -0
  114. package/stories/primitives/Accordion.stories.js +359 -0
  115. package/stories/primitives/Alerts.stories.js +64 -0
  116. package/stories/primitives/Badges.stories.js +183 -0
  117. package/stories/primitives/Buttons.stories.js +229 -0
  118. package/stories/primitives/Cards.stories.js +353 -0
  119. package/stories/primitives/FormGroups.stories.js +569 -0
  120. package/stories/primitives/Forms.stories.js +131 -0
  121. package/stories/primitives/Media.stories.js +203 -0
  122. package/stories/primitives/Tables.stories.js +232 -0
  123. package/stories/reference/ReferenceCatalog.stories.js +28 -0
  124. package/stories/reference/reference-catalog.js +413 -0
  125. package/stories/reference/reference-docs.js +302 -0
  126. package/stories/reference/reference-helpers.js +310 -0
  127. package/stories/utilities/GridSystem.stories.js +208 -0
  128. package/stories/utils/PdsAsk.stories.js +420 -0
  129. package/stories/utils/toast-utils.js +148 -0
@@ -0,0 +1,2101 @@
1
+ {
2
+ "generatedAt": "2025-12-16T11:37:45.268Z",
3
+ "sources": {
4
+ "customElements": "custom-elements.json",
5
+ "ontology": "src\\js\\pds-core\\pds-ontology.js",
6
+ "storiesRoot": "stories",
7
+ "enhancers": "src\\js\\pds-core\\pds-enhancers.js"
8
+ },
9
+ "components": {
10
+ "pds-calendar": {
11
+ "tag": "pds-calendar",
12
+ "className": "anonymous_0",
13
+ "displayName": "Pds Calendar",
14
+ "storyTitle": "Components/Pds Calendar",
15
+ "category": "Components",
16
+ "description": null,
17
+ "docsDescription": "A fully featured calendar component with month navigation, event display, and expandable day views",
18
+ "pdsTags": [
19
+ "autodocs"
20
+ ],
21
+ "ontology": null,
22
+ "stories": [
23
+ {
24
+ "exportName": "Default",
25
+ "name": "Default",
26
+ "id": "components-pds-calendar--default",
27
+ "tags": [],
28
+ "description": null,
29
+ "source": "stories\\components\\PdsCalendar.stories.js"
30
+ },
31
+ {
32
+ "exportName": "DynamicEvents",
33
+ "name": "DynamicEvents",
34
+ "id": "components-pds-calendar--dynamic-events",
35
+ "tags": [],
36
+ "description": null,
37
+ "source": "stories\\components\\PdsCalendar.stories.js"
38
+ },
39
+ {
40
+ "exportName": "EventTypes",
41
+ "name": "EventTypes",
42
+ "id": "components-pds-calendar--event-types",
43
+ "tags": [],
44
+ "description": null,
45
+ "source": "stories\\components\\PdsCalendar.stories.js"
46
+ },
47
+ {
48
+ "exportName": "WithManyEvents",
49
+ "name": "WithManyEvents",
50
+ "id": "components-pds-calendar--with-many-events",
51
+ "tags": [],
52
+ "description": null,
53
+ "source": "stories\\components\\PdsCalendar.stories.js"
54
+ },
55
+ {
56
+ "exportName": "WithSpecificDate",
57
+ "name": "WithSpecificDate",
58
+ "id": "components-pds-calendar--with-specific-date",
59
+ "tags": [],
60
+ "description": null,
61
+ "source": "stories\\components\\PdsCalendar.stories.js"
62
+ }
63
+ ],
64
+ "sourceModule": "public/assets/pds/components/pds-calendar.js",
65
+ "superclass": "HTMLElement",
66
+ "attributes": [
67
+ {
68
+ "name": "date",
69
+ "description": null,
70
+ "type": null,
71
+ "default": null,
72
+ "fieldName": null
73
+ }
74
+ ],
75
+ "properties": [
76
+ {
77
+ "name": "date",
78
+ "attribute": "date",
79
+ "description": "Gets the current date",
80
+ "type": null,
81
+ "default": null,
82
+ "reflects": false,
83
+ "privacy": "public"
84
+ },
85
+ {
86
+ "name": "dateHelper",
87
+ "attribute": null,
88
+ "description": null,
89
+ "type": null,
90
+ "default": "new DateHelper()",
91
+ "reflects": false,
92
+ "privacy": "public"
93
+ }
94
+ ],
95
+ "methods": [
96
+ {
97
+ "name": "refresh",
98
+ "description": "Refreshes the calendar display",
99
+ "parameters": [],
100
+ "return": null
101
+ }
102
+ ],
103
+ "events": [
104
+ {
105
+ "name": "month-rendered",
106
+ "description": null,
107
+ "type": "CustomEvent"
108
+ }
109
+ ],
110
+ "slots": [],
111
+ "cssParts": [],
112
+ "notes": []
113
+ },
114
+ "pds-drawer": {
115
+ "tag": "pds-drawer",
116
+ "className": "anonymous_0",
117
+ "displayName": "pds-drawer",
118
+ "storyTitle": "PDS/Components/pds-drawer",
119
+ "category": "PDS/Components",
120
+ "description": null,
121
+ "docsDescription": "Slide-out panels from any edge",
122
+ "pdsTags": [],
123
+ "ontology": {
124
+ "id": "pds-drawer",
125
+ "name": "Drawer",
126
+ "selectors": [
127
+ "pds-drawer"
128
+ ]
129
+ },
130
+ "stories": [
131
+ {
132
+ "exportName": "Default",
133
+ "name": "Default",
134
+ "id": "pds-components-pds-drawer--default",
135
+ "tags": [],
136
+ "description": null,
137
+ "source": "stories\\components\\PdsDrawer.stories.js"
138
+ }
139
+ ],
140
+ "sourceModule": "public/assets/pds/components/pds-drawer.js",
141
+ "superclass": "HTMLElement",
142
+ "attributes": [
143
+ {
144
+ "name": "open",
145
+ "description": "Controls whether the drawer is open or closed",
146
+ "type": "boolean",
147
+ "default": null,
148
+ "fieldName": "open"
149
+ },
150
+ {
151
+ "name": "position",
152
+ "description": "Position of the drawer relative to the viewport",
153
+ "type": "\"bottom\" | \"top\" | \"left\" | \"right\"",
154
+ "default": "\"bottom\"",
155
+ "fieldName": "position"
156
+ },
157
+ {
158
+ "name": "drag",
159
+ "description": "Controls drag interaction behavior",
160
+ "type": "\"header\" | \"none\"",
161
+ "default": "\"header\"",
162
+ "fieldName": "drag"
163
+ },
164
+ {
165
+ "name": "max-height",
166
+ "description": "Maximum height for top/bottom positioned drawers (CSS value)",
167
+ "type": "string",
168
+ "default": "\"70vh\"",
169
+ "fieldName": "maxHeight"
170
+ },
171
+ {
172
+ "name": "min-height",
173
+ "description": "Minimum height for top/bottom positioned drawers (CSS value)",
174
+ "type": "string",
175
+ "default": "\"auto\"",
176
+ "fieldName": "minHeight"
177
+ },
178
+ {
179
+ "name": "show-close",
180
+ "description": "Whether to show the close button in the header",
181
+ "type": "boolean",
182
+ "default": "false",
183
+ "fieldName": "showClose"
184
+ }
185
+ ],
186
+ "properties": [
187
+ {
188
+ "name": "drag",
189
+ "attribute": "drag",
190
+ "description": "Controls drag interaction behavior",
191
+ "type": "\"header\" | \"none\"",
192
+ "default": "\"header\"",
193
+ "reflects": false,
194
+ "privacy": "public"
195
+ },
196
+ {
197
+ "name": "maxHeight",
198
+ "attribute": "max-height",
199
+ "description": "Maximum height for top/bottom positioned drawers (CSS value)",
200
+ "type": "string",
201
+ "default": "\"70vh\"",
202
+ "reflects": false,
203
+ "privacy": "public"
204
+ },
205
+ {
206
+ "name": "minHeight",
207
+ "attribute": "min-height",
208
+ "description": "Minimum height for top/bottom positioned drawers (CSS value)",
209
+ "type": "string",
210
+ "default": "\"auto\"",
211
+ "reflects": false,
212
+ "privacy": "public"
213
+ },
214
+ {
215
+ "name": "open",
216
+ "attribute": "open",
217
+ "description": "Controls whether the drawer is open or closed",
218
+ "type": "boolean",
219
+ "default": null,
220
+ "reflects": false,
221
+ "privacy": "public"
222
+ },
223
+ {
224
+ "name": "position",
225
+ "attribute": "position",
226
+ "description": "Position of the drawer relative to the viewport",
227
+ "type": "\"bottom\" | \"top\" | \"left\" | \"right\"",
228
+ "default": "\"bottom\"",
229
+ "reflects": false,
230
+ "privacy": "public"
231
+ },
232
+ {
233
+ "name": "showClose",
234
+ "attribute": "show-close",
235
+ "description": "Whether to show the close button in the header",
236
+ "type": "boolean",
237
+ "default": "false",
238
+ "reflects": false,
239
+ "privacy": "public"
240
+ }
241
+ ],
242
+ "methods": [
243
+ {
244
+ "name": "clearContent",
245
+ "description": "Clear drawer content (removes all slotted content)",
246
+ "parameters": [],
247
+ "return": null
248
+ },
249
+ {
250
+ "name": "closeDrawer",
251
+ "description": "Closes the drawer",
252
+ "parameters": [],
253
+ "return": null
254
+ },
255
+ {
256
+ "name": "openDrawer",
257
+ "description": "Opens the drawer",
258
+ "parameters": [],
259
+ "return": null
260
+ },
261
+ {
262
+ "name": "setContent",
263
+ "description": "Set the content of the drawer",
264
+ "parameters": [
265
+ {
266
+ "name": "bodyContent",
267
+ "type": "any|HTMLElement|string",
268
+ "description": "Content for the drawer body"
269
+ },
270
+ {
271
+ "name": "headerContent",
272
+ "type": "any|HTMLElement|string",
273
+ "description": "Optional header content"
274
+ }
275
+ ],
276
+ "return": "Promise<void>"
277
+ },
278
+ {
279
+ "name": "show",
280
+ "description": "Configure and open the drawer in one call",
281
+ "parameters": [
282
+ {
283
+ "name": "htmlContent",
284
+ "type": "any|HTMLElement|string",
285
+ "description": "The main content to display"
286
+ },
287
+ {
288
+ "name": "options",
289
+ "type": "@param {any|HTMLElement|string} [options.header] - Header content\n * @param {\"bottom\"|\"top\"|\"left\"|\"right\"} [options.position] - Drawer position\n * @param {string} [options.maxHeight] - Maximum height (CSS value)\n * @param {string} [options.minHeight] - Minimum height (CSS value)\n * @param {boolean} [options.showClose] - Show close button\n * @param {boolean} [options.waitForMedia=true] - Wait for images/videos to load\n * @param {number} [options.mediaTimeout=500] - Media load timeout in ms\n * ",
290
+ "description": "Configuration options"
291
+ }
292
+ ],
293
+ "return": "Promise<this>"
294
+ },
295
+ {
296
+ "name": "toggleDrawer",
297
+ "description": "Toggles the drawer open/closed state",
298
+ "parameters": [],
299
+ "return": null
300
+ }
301
+ ],
302
+ "events": [],
303
+ "slots": [],
304
+ "cssParts": [],
305
+ "notes": []
306
+ },
307
+ "pds-icon": {
308
+ "tag": "pds-icon",
309
+ "className": "SvgIcon",
310
+ "displayName": "pds-icon",
311
+ "storyTitle": "PDS/Components/pds-icon",
312
+ "category": "PDS/Components",
313
+ "description": "SVG Icon Web Component",
314
+ "docsDescription": "SVG sprite icons with fallbacks",
315
+ "pdsTags": [],
316
+ "ontology": null,
317
+ "stories": [
318
+ {
319
+ "exportName": "Default",
320
+ "name": "Default",
321
+ "id": "pds-components-pds-icon--default",
322
+ "tags": [],
323
+ "description": null,
324
+ "source": "stories\\components\\PdsIcon.stories.js"
325
+ }
326
+ ],
327
+ "sourceModule": "public/assets/pds/components/pds-icon.js",
328
+ "superclass": "HTMLElement",
329
+ "attributes": [
330
+ {
331
+ "name": "icon",
332
+ "description": "Icon name from the sprite sheet",
333
+ "type": "string",
334
+ "default": null,
335
+ "fieldName": null
336
+ },
337
+ {
338
+ "name": "size",
339
+ "description": "Icon size in pixels or named size (xs, sm, md, lg, xl, 2xl)",
340
+ "type": "string|number",
341
+ "default": null,
342
+ "fieldName": null
343
+ },
344
+ {
345
+ "name": "color",
346
+ "description": "Icon color (CSS color value, default: currentColor)",
347
+ "type": "string",
348
+ "default": null,
349
+ "fieldName": null
350
+ },
351
+ {
352
+ "name": "label",
353
+ "description": "Accessible label for the icon (adds role=\"img\")",
354
+ "type": "string",
355
+ "default": null,
356
+ "fieldName": null
357
+ },
358
+ {
359
+ "name": "rotate",
360
+ "description": "Rotation angle in degrees",
361
+ "type": "number",
362
+ "default": null,
363
+ "fieldName": null
364
+ },
365
+ {
366
+ "name": "sprite",
367
+ "description": "Override sprite sheet path",
368
+ "type": "string",
369
+ "default": null,
370
+ "fieldName": null
371
+ },
372
+ {
373
+ "name": "no-sprite",
374
+ "description": "Force fallback icon rendering",
375
+ "type": "boolean",
376
+ "default": null,
377
+ "fieldName": null
378
+ }
379
+ ],
380
+ "properties": [
381
+ {
382
+ "name": "inlineSprites",
383
+ "attribute": null,
384
+ "description": null,
385
+ "type": null,
386
+ "default": "new Map()",
387
+ "reflects": false,
388
+ "privacy": "public"
389
+ },
390
+ {
391
+ "name": "instances",
392
+ "attribute": null,
393
+ "description": null,
394
+ "type": null,
395
+ "default": "new Set()",
396
+ "reflects": false,
397
+ "privacy": "public"
398
+ },
399
+ {
400
+ "name": "spritePromises",
401
+ "attribute": null,
402
+ "description": null,
403
+ "type": null,
404
+ "default": "new Map()",
405
+ "reflects": false,
406
+ "privacy": "public"
407
+ }
408
+ ],
409
+ "methods": [
410
+ {
411
+ "name": "ensureInlineSprite",
412
+ "description": null,
413
+ "parameters": [
414
+ {
415
+ "name": "spriteURL",
416
+ "type": null,
417
+ "description": null
418
+ }
419
+ ],
420
+ "return": null
421
+ },
422
+ {
423
+ "name": "notifyInstances",
424
+ "description": null,
425
+ "parameters": [],
426
+ "return": null
427
+ },
428
+ {
429
+ "name": "spriteAvailable",
430
+ "description": "Check if sprite sheet is available",
431
+ "parameters": [],
432
+ "return": "boolean"
433
+ }
434
+ ],
435
+ "events": [],
436
+ "slots": [],
437
+ "cssParts": [],
438
+ "notes": []
439
+ },
440
+ "pds-jsonform": {
441
+ "tag": "pds-jsonform",
442
+ "className": "SchemaForm",
443
+ "displayName": "PDS JSON Schema Form",
444
+ "storyTitle": "Components/Pds Jsonform",
445
+ "category": "Components",
446
+ "description": "<pds-jsonform>\n\nForm Actions:\nBy default, the form includes Submit and Reset buttons inside the <form> element.\n\nUsage options:\n1. Default buttons:\n <pds-jsonform .jsonSchema=${schema}></pds-jsonform>\n\n2. Customize labels:\n <pds-jsonform .jsonSchema=${schema} submit-label=\"Save\" reset-label=\"Clear\"></pds-jsonform>\n\n3. Hide reset button:\n <pds-jsonform .jsonSchema=${schema} hide-reset></pds-jsonform>\n\n4. Add extra buttons (slot):\n <pds-jsonform .jsonSchema=${schema}>\n <button type=\"button\" slot=\"actions\"",
447
+ "docsDescription": "**⭐ Recommended for modern applications** - Automatically generate complete forms from JSON Schema definitions.\n\n### Key Features\n- 🎯 **Zero boilerplate** - Define form structure in JSON, get a working form with validation\n- ✅ **Built-in validation** - Automatic validation based on schema rules (required, min/max, patterns, etc.)\n- 🔄 **Data binding** - Two-way data binding with form state management\n- 🎨 **PDS styled** - Uses all PDS design tokens automatically\n- 📱 **Responsive** - Mobile-friendly layouts out of the box\n- 🧩 **Conditional logic** - Show/hide fields based on other field values\n- 🌐 **Nested objects** - Support for complex nested data structures\n- 🔧 **Extensible** - Custom field types and validators\n\n### Why JSON Schema Forms?\nInstead of manually writing HTML for every form field, validation rule, and error message, you define your data schema once and get:\n- Form UI generation\n- Client-side validation\n- Server-side validation (same schema)\n- API documentation\n- Type definitions\n- Database schemas\n\nSee the examples below to get started, or check the [primitive forms](/story/primitives-forms--default) for manual form building.",
448
+ "pdsTags": [
449
+ "autodocs",
450
+ "buttons",
451
+ "forms",
452
+ "interaction"
453
+ ],
454
+ "ontology": null,
455
+ "stories": [
456
+ {
457
+ "exportName": "WithAccordionLayout",
458
+ "name": "Accordion Layout",
459
+ "id": "components-pds-jsonform--with-accordion-layout",
460
+ "tags": [],
461
+ "description": null,
462
+ "source": "stories\\components\\PdsJsonform.stories.js"
463
+ },
464
+ {
465
+ "exportName": "ComprehensiveExample",
466
+ "name": "All Features Combined",
467
+ "id": "components-pds-jsonform--comprehensive-example",
468
+ "tags": [],
469
+ "description": null,
470
+ "source": "stories\\components\\PdsJsonform.stories.js"
471
+ },
472
+ {
473
+ "exportName": "ComplexForm",
474
+ "name": "ComplexForm",
475
+ "id": "components-pds-jsonform--complex-form",
476
+ "tags": [],
477
+ "description": null,
478
+ "source": "stories\\components\\PdsJsonform.stories.js"
479
+ },
480
+ {
481
+ "exportName": "CustomFormActions",
482
+ "name": "Custom Form Actions",
483
+ "id": "components-pds-jsonform--custom-form-actions",
484
+ "tags": [],
485
+ "description": "Demonstrates using `hide-actions` to provide custom form submission buttons and handling.\n \nWhen `hide-actions` is set, the default Submit and Reset buttons are hidden, allowing you to create custom action buttons in the `actions` slot. You can then handle form submission programmatically using the form's `submit()` method or by manually triggering the form element.",
486
+ "source": "stories\\components\\PdsJsonform.stories.js"
487
+ },
488
+ {
489
+ "exportName": "WithDatalistAutocomplete",
490
+ "name": "Datalist Autocomplete",
491
+ "id": "components-pds-jsonform--with-datalist-autocomplete",
492
+ "tags": [],
493
+ "description": null,
494
+ "source": "stories\\components\\PdsJsonform.stories.js"
495
+ },
496
+ {
497
+ "exportName": "WithDialogForms",
498
+ "name": "Dialog-Based Nested Forms",
499
+ "id": "components-pds-jsonform--with-dialog-forms",
500
+ "tags": [],
501
+ "description": "Dialog-based forms use `ui:dialog` to edit nested objects in modal dialogs. State is transferred via FormData when using `PDS.ask()` with `useForm: true`. Click \"Edit\" buttons to modify nested data, then submit the main form to see all changes preserved.",
502
+ "source": "stories\\components\\PdsJsonform.stories.js"
503
+ },
504
+ {
505
+ "exportName": "WithArrayFields",
506
+ "name": "Dynamic Arrays (Add/Remove)",
507
+ "id": "components-pds-jsonform--with-array-fields",
508
+ "tags": [],
509
+ "description": "Arrays in JSON Schema forms allow users to dynamically add and remove items. This is perfect for managing lists like team members, tasks, or any collection that can grow or shrink.\n\n### Features:\n- **Add items** - Click \"Add\" button to create new entries\n- **Remove items** - Delete individual items with the \"Remove\" button\n- **Reorder items** - Use up/down arrows to change order\n- **Nested objects** - Each array item can contain complex nested data\n- **Initial values** - Pre-populate with default items\n- **Radio Group Open** - Arrays with `maxItems: 1` render as radio buttons for single selection",
510
+ "source": "stories\\components\\PdsJsonform.stories.js"
511
+ },
512
+ {
513
+ "exportName": "WithPdsUpload",
514
+ "name": "File Upload (pds-upload)",
515
+ "id": "components-pds-jsonform--with-pds-upload",
516
+ "tags": [],
517
+ "description": null,
518
+ "source": "stories\\components\\PdsJsonform.stories.js"
519
+ },
520
+ {
521
+ "exportName": "WithFlexLayout",
522
+ "name": "Flex Layout",
523
+ "id": "components-pds-jsonform--with-flex-layout",
524
+ "tags": [],
525
+ "description": null,
526
+ "source": "stories\\components\\PdsJsonform.stories.js"
527
+ },
528
+ {
529
+ "exportName": "WithGridLayout",
530
+ "name": "Grid Layout",
531
+ "id": "components-pds-jsonform--with-grid-layout",
532
+ "tags": [],
533
+ "description": null,
534
+ "source": "stories\\components\\PdsJsonform.stories.js"
535
+ },
536
+ {
537
+ "exportName": "WithIcons",
538
+ "name": "Icon-Enhanced Inputs",
539
+ "id": "components-pds-jsonform--with-icons",
540
+ "tags": [],
541
+ "description": null,
542
+ "source": "stories\\components\\PdsJsonform.stories.js"
543
+ },
544
+ {
545
+ "exportName": "WithRadioGroupOpen",
546
+ "name": "Radio Group Open (Single Selection)",
547
+ "id": "components-pds-jsonform--with-radio-group-open",
548
+ "tags": [],
549
+ "description": "When an array has `maxItems: 1`, it renders as a Radio Group Open, allowing single selection with the ability to add custom options.\n \nThis is perfect for scenarios where users can choose one option from predefined choices or add their own custom value. The `data-open` enhancement automatically provides an input field to add new options dynamically.\n\n### Key Features:\n- **Single selection** - Only one option can be selected at a time (radio buttons)\n- **Add custom options** - Users can type new options in the input field\n- **Remove options** - Click the × button to remove options\n- **Pre-populated** - Start with default options from the schema\n\nThis pattern is ideal for fields like \"Priority\", \"Status\", \"Category\", or any single-choice field where users might need custom values.",
550
+ "source": "stories\\components\\PdsJsonform.stories.js"
551
+ },
552
+ {
553
+ "exportName": "WithRangeSliders",
554
+ "name": "Range Sliders with Output",
555
+ "id": "components-pds-jsonform--with-range-sliders",
556
+ "tags": [],
557
+ "description": null,
558
+ "source": "stories\\components\\PdsJsonform.stories.js"
559
+ },
560
+ {
561
+ "exportName": "WithPdsRichtext",
562
+ "name": "Rich Text Editor (pds-richtext)",
563
+ "id": "components-pds-jsonform--with-pds-richtext",
564
+ "tags": [],
565
+ "description": null,
566
+ "source": "stories\\components\\PdsJsonform.stories.js"
567
+ },
568
+ {
569
+ "exportName": "SimpleForm",
570
+ "name": "SimpleForm",
571
+ "id": "components-pds-jsonform--simple-form",
572
+ "tags": [],
573
+ "description": null,
574
+ "source": "stories\\components\\PdsJsonform.stories.js"
575
+ },
576
+ {
577
+ "exportName": "WithSurfaces",
578
+ "name": "Surface Wrapping (Cards)",
579
+ "id": "components-pds-jsonform--with-surfaces",
580
+ "tags": [],
581
+ "description": null,
582
+ "source": "stories\\components\\PdsJsonform.stories.js"
583
+ },
584
+ {
585
+ "exportName": "WithTabsLayout",
586
+ "name": "Tabs Layout (pds-tabstrip)",
587
+ "id": "components-pds-jsonform--with-tabs-layout",
588
+ "tags": [],
589
+ "description": null,
590
+ "source": "stories\\components\\PdsJsonform.stories.js"
591
+ },
592
+ {
593
+ "exportName": "WithTogglesSwitches",
594
+ "name": "Toggles & Switches",
595
+ "id": "components-pds-jsonform--with-toggles-switches",
596
+ "tags": [],
597
+ "description": null,
598
+ "source": "stories\\components\\PdsJsonform.stories.js"
599
+ },
600
+ {
601
+ "exportName": "WithInitialData",
602
+ "name": "WithInitialData",
603
+ "id": "components-pds-jsonform--with-initial-data",
604
+ "tags": [],
605
+ "description": null,
606
+ "source": "stories\\components\\PdsJsonform.stories.js"
607
+ }
608
+ ],
609
+ "sourceModule": "public/assets/pds/components/pds-jsonform.js",
610
+ "superclass": "LitElement",
611
+ "attributes": [
612
+ {
613
+ "name": "json-schema",
614
+ "description": null,
615
+ "type": "object",
616
+ "default": "undefined",
617
+ "fieldName": "jsonSchema"
618
+ },
619
+ {
620
+ "name": "ui-schema",
621
+ "description": null,
622
+ "type": "object",
623
+ "default": "undefined",
624
+ "fieldName": "uiSchema"
625
+ },
626
+ {
627
+ "name": "options",
628
+ "description": null,
629
+ "type": "object",
630
+ "default": "undefined",
631
+ "fieldName": "options"
632
+ },
633
+ {
634
+ "name": "values",
635
+ "description": null,
636
+ "type": "object",
637
+ "default": "undefined",
638
+ "fieldName": "values"
639
+ },
640
+ {
641
+ "name": "action",
642
+ "description": null,
643
+ "type": "string",
644
+ "default": null,
645
+ "fieldName": "action"
646
+ },
647
+ {
648
+ "name": "method",
649
+ "description": null,
650
+ "type": "string",
651
+ "default": "\"post\"",
652
+ "fieldName": "method"
653
+ },
654
+ {
655
+ "name": "disabled",
656
+ "description": null,
657
+ "type": "boolean",
658
+ "default": null,
659
+ "fieldName": "disabled"
660
+ },
661
+ {
662
+ "name": "hide-actions",
663
+ "description": null,
664
+ "type": "boolean",
665
+ "default": "false",
666
+ "fieldName": "hideActions"
667
+ },
668
+ {
669
+ "name": "submit-label",
670
+ "description": null,
671
+ "type": "string",
672
+ "default": "\"Submit\"",
673
+ "fieldName": "submitLabel"
674
+ },
675
+ {
676
+ "name": "reset-label",
677
+ "description": null,
678
+ "type": "string",
679
+ "default": "\"Reset\"",
680
+ "fieldName": "resetLabel"
681
+ },
682
+ {
683
+ "name": "hide-reset",
684
+ "description": null,
685
+ "type": "boolean",
686
+ "default": "false",
687
+ "fieldName": "hideReset"
688
+ },
689
+ {
690
+ "name": "hide-submit",
691
+ "description": null,
692
+ "type": "boolean",
693
+ "default": null,
694
+ "fieldName": "hideSubmit"
695
+ },
696
+ {
697
+ "name": "hide-legend",
698
+ "description": null,
699
+ "type": "boolean",
700
+ "default": "false",
701
+ "fieldName": "hideLegend"
702
+ }
703
+ ],
704
+ "properties": [
705
+ {
706
+ "name": "action",
707
+ "attribute": "action",
708
+ "description": null,
709
+ "type": "string",
710
+ "default": null,
711
+ "reflects": false,
712
+ "privacy": "public"
713
+ },
714
+ {
715
+ "name": "disabled",
716
+ "attribute": "disabled",
717
+ "description": null,
718
+ "type": "boolean",
719
+ "default": null,
720
+ "reflects": true,
721
+ "privacy": "public"
722
+ },
723
+ {
724
+ "name": "hideActions",
725
+ "attribute": "hide-actions",
726
+ "description": null,
727
+ "type": "boolean",
728
+ "default": "false",
729
+ "reflects": false,
730
+ "privacy": "public"
731
+ },
732
+ {
733
+ "name": "hideLegend",
734
+ "attribute": "hide-legend",
735
+ "description": null,
736
+ "type": "boolean",
737
+ "default": "false",
738
+ "reflects": false,
739
+ "privacy": "public"
740
+ },
741
+ {
742
+ "name": "hideReset",
743
+ "attribute": "hide-reset",
744
+ "description": null,
745
+ "type": "boolean",
746
+ "default": "false",
747
+ "reflects": false,
748
+ "privacy": "public"
749
+ },
750
+ {
751
+ "name": "hideSubmit",
752
+ "attribute": "hide-submit",
753
+ "description": null,
754
+ "type": "boolean",
755
+ "default": null,
756
+ "reflects": false,
757
+ "privacy": "public"
758
+ },
759
+ {
760
+ "name": "jsonSchema",
761
+ "attribute": "json-schema",
762
+ "description": "Primary schema input. Provide a JSON Schema object to generate the form layout and validation rules.",
763
+ "type": "JSONSchema7 (object)",
764
+ "default": "undefined",
765
+ "reflects": false,
766
+ "privacy": "public"
767
+ },
768
+ {
769
+ "name": "method",
770
+ "attribute": "method",
771
+ "description": null,
772
+ "type": "string",
773
+ "default": "\"post\"",
774
+ "reflects": false,
775
+ "privacy": "public"
776
+ },
777
+ {
778
+ "name": "options",
779
+ "attribute": "options",
780
+ "description": "Toolkit-level options that adjust widget families, layouts, and validation behavior. Supports path-specific overrides.",
781
+ "type": "JsonFormOptions",
782
+ "default": "undefined",
783
+ "reflects": false,
784
+ "privacy": "public"
785
+ },
786
+ {
787
+ "name": "resetLabel",
788
+ "attribute": "reset-label",
789
+ "description": null,
790
+ "type": "string",
791
+ "default": "\"Reset\"",
792
+ "reflects": false,
793
+ "privacy": "public"
794
+ },
795
+ {
796
+ "name": "submitLabel",
797
+ "attribute": "submit-label",
798
+ "description": null,
799
+ "type": "string",
800
+ "default": "\"Submit\"",
801
+ "reflects": false,
802
+ "privacy": "public"
803
+ },
804
+ {
805
+ "name": "uiSchema",
806
+ "attribute": "ui-schema",
807
+ "description": "Optional UI overrides keyed by JSON Pointer. Controls layout, widgets, surfaces, dialogs, and per-field hints.",
808
+ "type": "UISchema",
809
+ "default": "undefined",
810
+ "reflects": false,
811
+ "privacy": "public"
812
+ },
813
+ {
814
+ "name": "values",
815
+ "attribute": "values",
816
+ "description": "Initial data that pre-populates the generated form. Shape must match the JSON Schema.",
817
+ "type": "Record<string, any>",
818
+ "default": "undefined",
819
+ "reflects": false,
820
+ "privacy": "public"
821
+ }
822
+ ],
823
+ "methods": [
824
+ {
825
+ "name": "defineRenderer",
826
+ "description": null,
827
+ "parameters": [
828
+ {
829
+ "name": "widgetKey",
830
+ "type": null,
831
+ "description": null
832
+ },
833
+ {
834
+ "name": "fn",
835
+ "type": null,
836
+ "description": null
837
+ }
838
+ ],
839
+ "return": null
840
+ },
841
+ {
842
+ "name": "getValuesFlat",
843
+ "description": null,
844
+ "parameters": [],
845
+ "return": null
846
+ },
847
+ {
848
+ "name": "serialize",
849
+ "description": null,
850
+ "parameters": [],
851
+ "return": null
852
+ },
853
+ {
854
+ "name": "submit",
855
+ "description": null,
856
+ "parameters": [],
857
+ "return": null
858
+ },
859
+ {
860
+ "name": "useValidator",
861
+ "description": null,
862
+ "parameters": [
863
+ {
864
+ "name": "fn",
865
+ "type": null,
866
+ "description": null
867
+ }
868
+ ],
869
+ "return": null
870
+ }
871
+ ],
872
+ "events": [
873
+ {
874
+ "name": "pw:array-add",
875
+ "type": "CustomEvent<JsonFormArrayEventDetail>",
876
+ "description": "Triggered when an array item is appended. Carries the path and index metadata."
877
+ },
878
+ {
879
+ "name": "pw:array-remove",
880
+ "type": "CustomEvent<JsonFormArrayEventDetail>",
881
+ "description": "Triggered when an array item is removed."
882
+ },
883
+ {
884
+ "name": "pw:array-reorder",
885
+ "type": "CustomEvent<JsonFormArrayEventDetail>",
886
+ "description": "Triggered when array items are reordered (drag & drop scenarios)."
887
+ },
888
+ {
889
+ "name": "pw:dialog-open",
890
+ "type": "CustomEvent<JsonFormDialogEventDetail>",
891
+ "description": "Fires before a dialog-driven field opens (e.g. complex editors)."
892
+ },
893
+ {
894
+ "name": "pw:dialog-submit",
895
+ "type": "CustomEvent<JsonFormDialogEventDetail>",
896
+ "description": "Fires when a dialog-driven field is saved."
897
+ },
898
+ {
899
+ "name": "pw:submit",
900
+ "type": "CustomEvent<JsonFormSubmitDetail>",
901
+ "description": "Emitted after submission. `detail` includes `{ json, formData, valid, issues }` for server hand-off or additional processing."
902
+ },
903
+ {
904
+ "name": "pw:value-change",
905
+ "type": "CustomEvent<JsonFormValueChangeDetail>",
906
+ "description": "Live value updates whenever a field changes. `detail.name` contains the JSON Pointer-compatible path."
907
+ }
908
+ ],
909
+ "slots": [],
910
+ "cssParts": [],
911
+ "notes": [
912
+ "Typed interfaces for `JsonFormOptions`, `UISchema`, and related events live in `src/js/pds.d.ts`.",
913
+ "The form accepts standard JSON Schema (Draft 7) documents via the `jsonSchema` property. `uiSchema` and `options` fine-tune layout, widgets, and behaviors."
914
+ ]
915
+ },
916
+ "pds-richtext": {
917
+ "tag": "pds-richtext",
918
+ "className": "RichText",
919
+ "displayName": "Pds Richtext",
920
+ "storyTitle": "Components/Pds Richtext",
921
+ "category": "Components",
922
+ "description": null,
923
+ "docsDescription": "Rich text editor with markdown support and formatting toolbar. Provide a #showdown import-map entry for best performance; set format=\"markdown\" to keep submitted values as Markdown.",
924
+ "pdsTags": [
925
+ "autodocs",
926
+ "editor",
927
+ "forms",
928
+ "richtext"
929
+ ],
930
+ "ontology": null,
931
+ "stories": [
932
+ {
933
+ "exportName": "Default",
934
+ "name": "Default",
935
+ "id": "components-pds-richtext--default",
936
+ "tags": [],
937
+ "description": null,
938
+ "source": "stories\\components\\PdsRichtext.stories.js"
939
+ }
940
+ ],
941
+ "sourceModule": "public/assets/pds/components/pds-richtext.js",
942
+ "superclass": "HTMLElement",
943
+ "attributes": [
944
+ {
945
+ "name": "name",
946
+ "description": null,
947
+ "type": null,
948
+ "default": null,
949
+ "fieldName": null
950
+ },
951
+ {
952
+ "name": "placeholder",
953
+ "description": null,
954
+ "type": null,
955
+ "default": null,
956
+ "fieldName": null
957
+ },
958
+ {
959
+ "name": "disabled",
960
+ "description": null,
961
+ "type": null,
962
+ "default": null,
963
+ "fieldName": null
964
+ },
965
+ {
966
+ "name": "required",
967
+ "description": null,
968
+ "type": null,
969
+ "default": null,
970
+ "fieldName": null
971
+ },
972
+ {
973
+ "name": "submit-on-enter",
974
+ "description": null,
975
+ "type": null,
976
+ "default": null,
977
+ "fieldName": null
978
+ },
979
+ {
980
+ "name": "spellcheck",
981
+ "description": null,
982
+ "type": null,
983
+ "default": null,
984
+ "fieldName": null
985
+ },
986
+ {
987
+ "name": "toolbar",
988
+ "description": null,
989
+ "type": null,
990
+ "default": null,
991
+ "fieldName": null
992
+ },
993
+ {
994
+ "name": "value",
995
+ "description": null,
996
+ "type": null,
997
+ "default": null,
998
+ "fieldName": null
999
+ },
1000
+ {
1001
+ "name": "format",
1002
+ "description": null,
1003
+ "type": null,
1004
+ "default": null,
1005
+ "fieldName": null
1006
+ }
1007
+ ],
1008
+ "properties": [
1009
+ {
1010
+ "name": "disabled",
1011
+ "attribute": "disabled",
1012
+ "description": "Enable or disable user input.",
1013
+ "type": null,
1014
+ "default": null,
1015
+ "reflects": false,
1016
+ "privacy": "public"
1017
+ },
1018
+ {
1019
+ "name": "form",
1020
+ "attribute": null,
1021
+ "description": "Reference to the associated HTMLFormElement, when applicable.",
1022
+ "type": null,
1023
+ "default": null,
1024
+ "reflects": false,
1025
+ "privacy": "public"
1026
+ },
1027
+ {
1028
+ "name": "formAssociated",
1029
+ "attribute": null,
1030
+ "description": null,
1031
+ "type": "boolean",
1032
+ "default": "true",
1033
+ "reflects": false,
1034
+ "privacy": "public"
1035
+ },
1036
+ {
1037
+ "name": "format",
1038
+ "attribute": "format",
1039
+ "description": "Change the output format for future values.",
1040
+ "type": null,
1041
+ "default": null,
1042
+ "reflects": false,
1043
+ "privacy": "public"
1044
+ },
1045
+ {
1046
+ "name": "name",
1047
+ "attribute": "name",
1048
+ "description": "Update the form field name.",
1049
+ "type": null,
1050
+ "default": null,
1051
+ "reflects": false,
1052
+ "privacy": "public"
1053
+ },
1054
+ {
1055
+ "name": "placeholder",
1056
+ "attribute": "placeholder",
1057
+ "description": "Set the placeholder text.",
1058
+ "type": null,
1059
+ "default": null,
1060
+ "reflects": false,
1061
+ "privacy": "public"
1062
+ },
1063
+ {
1064
+ "name": "required",
1065
+ "attribute": "required",
1066
+ "description": "Toggle required validation.",
1067
+ "type": null,
1068
+ "default": null,
1069
+ "reflects": false,
1070
+ "privacy": "public"
1071
+ },
1072
+ {
1073
+ "name": "spellcheck",
1074
+ "attribute": "spellcheck",
1075
+ "description": "Toggle native spell checking support.",
1076
+ "type": null,
1077
+ "default": null,
1078
+ "reflects": false,
1079
+ "privacy": "public"
1080
+ },
1081
+ {
1082
+ "name": "submitOnEnter",
1083
+ "attribute": null,
1084
+ "description": "Enable or disable submit-on-enter behaviour.",
1085
+ "type": null,
1086
+ "default": null,
1087
+ "reflects": false,
1088
+ "privacy": "public"
1089
+ },
1090
+ {
1091
+ "name": "toolbar",
1092
+ "attribute": "toolbar",
1093
+ "description": "Show or hide the formatting toolbar.",
1094
+ "type": null,
1095
+ "default": null,
1096
+ "reflects": false,
1097
+ "privacy": "public"
1098
+ },
1099
+ {
1100
+ "name": "value",
1101
+ "attribute": "value",
1102
+ "description": "Update the editor value programmatically.",
1103
+ "type": null,
1104
+ "default": null,
1105
+ "reflects": false,
1106
+ "privacy": "public"
1107
+ }
1108
+ ],
1109
+ "methods": [
1110
+ {
1111
+ "name": "checkValidity",
1112
+ "description": "Run native form validation against the control.",
1113
+ "parameters": [],
1114
+ "return": "boolean"
1115
+ },
1116
+ {
1117
+ "name": "reportValidity",
1118
+ "description": "Report validity using the browser's built-in UI.",
1119
+ "parameters": [],
1120
+ "return": "boolean"
1121
+ }
1122
+ ],
1123
+ "events": [
1124
+ {
1125
+ "name": "input",
1126
+ "description": null,
1127
+ "type": "InputEvent"
1128
+ }
1129
+ ],
1130
+ "slots": [],
1131
+ "cssParts": [],
1132
+ "notes": []
1133
+ },
1134
+ "pds-scrollrow": {
1135
+ "tag": "pds-scrollrow",
1136
+ "className": "PdsScrollrow",
1137
+ "displayName": "Pds Scrollrow",
1138
+ "storyTitle": "Components/Pds Scrollrow",
1139
+ "category": "Components",
1140
+ "description": "Horizontal scrolling row with optional heading and snap alignment controls.",
1141
+ "docsDescription": "Horizontal scrolling container with navigation buttons",
1142
+ "pdsTags": [
1143
+ "autodocs",
1144
+ "layout"
1145
+ ],
1146
+ "ontology": null,
1147
+ "stories": [],
1148
+ "sourceModule": "public/assets/pds/components/pds-scrollrow.js",
1149
+ "superclass": "HTMLElement",
1150
+ "attributes": [
1151
+ {
1152
+ "name": "label",
1153
+ "description": "Accessible label for the scroll region; also used as fallback heading copy",
1154
+ "type": "string",
1155
+ "default": null,
1156
+ "fieldName": null
1157
+ },
1158
+ {
1159
+ "name": "snap",
1160
+ "description": "Snap alignment for tiles when scrolling (default: start)",
1161
+ "type": "\"start\"|\"center\"",
1162
+ "default": null,
1163
+ "fieldName": null
1164
+ }
1165
+ ],
1166
+ "properties": [
1167
+ {
1168
+ "name": "label",
1169
+ "attribute": "label",
1170
+ "description": "Update the accessible label and optional fallback heading text.",
1171
+ "type": null,
1172
+ "default": null,
1173
+ "reflects": false,
1174
+ "privacy": "public"
1175
+ },
1176
+ {
1177
+ "name": "snap",
1178
+ "attribute": "snap",
1179
+ "description": "Adjust the scroll snap alignment.",
1180
+ "type": null,
1181
+ "default": null,
1182
+ "reflects": false,
1183
+ "privacy": "public"
1184
+ }
1185
+ ],
1186
+ "methods": [
1187
+ {
1188
+ "name": "doPage",
1189
+ "description": "Scroll the viewport by roughly one page in the indicated direction.",
1190
+ "parameters": [
1191
+ {
1192
+ "name": "e",
1193
+ "type": "Event",
1194
+ "description": null
1195
+ }
1196
+ ],
1197
+ "return": null
1198
+ }
1199
+ ],
1200
+ "events": [],
1201
+ "slots": [
1202
+ {
1203
+ "name": "default",
1204
+ "description": "Scrollable tile content"
1205
+ },
1206
+ {
1207
+ "name": "heading",
1208
+ "description": "Optional heading content rendered in the component header"
1209
+ }
1210
+ ],
1211
+ "cssParts": [
1212
+ {
1213
+ "name": "viewport",
1214
+ "description": "The scrollable container element"
1215
+ }
1216
+ ],
1217
+ "notes": []
1218
+ },
1219
+ "pds-splitpanel": {
1220
+ "tag": "pds-splitpanel",
1221
+ "className": "anonymous_0",
1222
+ "displayName": "Pds Splitpanel",
1223
+ "storyTitle": "Components/Pds Splitpanel",
1224
+ "category": "Components",
1225
+ "description": null,
1226
+ "docsDescription": "Split panels divide content areas with a draggable divider for resizable layouts.",
1227
+ "pdsTags": [
1228
+ "autodocs",
1229
+ "interaction",
1230
+ "layout",
1231
+ "sizing"
1232
+ ],
1233
+ "ontology": null,
1234
+ "stories": [],
1235
+ "sourceModule": "public/assets/pds/components/pds-splitpanel.js",
1236
+ "superclass": "HTMLElement",
1237
+ "attributes": [
1238
+ {
1239
+ "name": "layout",
1240
+ "description": null,
1241
+ "type": null,
1242
+ "default": null,
1243
+ "fieldName": null
1244
+ },
1245
+ {
1246
+ "name": "defaultsplit",
1247
+ "description": null,
1248
+ "type": null,
1249
+ "default": null,
1250
+ "fieldName": null
1251
+ },
1252
+ {
1253
+ "name": "breakpoint",
1254
+ "description": null,
1255
+ "type": null,
1256
+ "default": null,
1257
+ "fieldName": null
1258
+ },
1259
+ {
1260
+ "name": "open",
1261
+ "description": null,
1262
+ "type": null,
1263
+ "default": null,
1264
+ "fieldName": null
1265
+ }
1266
+ ],
1267
+ "properties": [
1268
+ {
1269
+ "name": "breakpoint",
1270
+ "attribute": "breakpoint",
1271
+ "description": null,
1272
+ "type": null,
1273
+ "default": null,
1274
+ "reflects": false,
1275
+ "privacy": "public"
1276
+ },
1277
+ {
1278
+ "name": "defaultSplit",
1279
+ "attribute": null,
1280
+ "description": null,
1281
+ "type": null,
1282
+ "default": null,
1283
+ "reflects": false,
1284
+ "privacy": "public"
1285
+ },
1286
+ {
1287
+ "name": "isDragging",
1288
+ "attribute": null,
1289
+ "description": null,
1290
+ "type": "boolean",
1291
+ "default": "false",
1292
+ "reflects": false,
1293
+ "privacy": "public"
1294
+ },
1295
+ {
1296
+ "name": "layout",
1297
+ "attribute": "layout",
1298
+ "description": null,
1299
+ "type": null,
1300
+ "default": null,
1301
+ "reflects": false,
1302
+ "privacy": "public"
1303
+ },
1304
+ {
1305
+ "name": "open",
1306
+ "attribute": "open",
1307
+ "description": null,
1308
+ "type": null,
1309
+ "default": null,
1310
+ "reflects": false,
1311
+ "privacy": "public"
1312
+ }
1313
+ ],
1314
+ "methods": [
1315
+ {
1316
+ "name": "closeMobileView",
1317
+ "description": null,
1318
+ "parameters": [],
1319
+ "return": null
1320
+ },
1321
+ {
1322
+ "name": "drag",
1323
+ "description": null,
1324
+ "parameters": [
1325
+ {
1326
+ "name": "event",
1327
+ "type": null,
1328
+ "description": null
1329
+ }
1330
+ ],
1331
+ "return": null
1332
+ },
1333
+ {
1334
+ "name": "startDragging",
1335
+ "description": null,
1336
+ "parameters": [
1337
+ {
1338
+ "name": "event",
1339
+ "type": null,
1340
+ "description": null
1341
+ }
1342
+ ],
1343
+ "return": null
1344
+ },
1345
+ {
1346
+ "name": "stopDragging",
1347
+ "description": null,
1348
+ "parameters": [],
1349
+ "return": null
1350
+ },
1351
+ {
1352
+ "name": "toggleMobileView",
1353
+ "description": null,
1354
+ "parameters": [],
1355
+ "return": null
1356
+ },
1357
+ {
1358
+ "name": "updateLayout",
1359
+ "description": null,
1360
+ "parameters": [],
1361
+ "return": null
1362
+ }
1363
+ ],
1364
+ "events": [],
1365
+ "slots": [],
1366
+ "cssParts": [],
1367
+ "notes": []
1368
+ },
1369
+ "pds-tabpanel": {
1370
+ "tag": "pds-tabpanel",
1371
+ "className": "TabPanel",
1372
+ "displayName": "PDS Tabpanel",
1373
+ "storyTitle": null,
1374
+ "category": null,
1375
+ "description": null,
1376
+ "docsDescription": null,
1377
+ "pdsTags": [],
1378
+ "ontology": null,
1379
+ "stories": [],
1380
+ "sourceModule": "public/assets/pds/components/pds-tabstrip.js",
1381
+ "superclass": "HTMLElement",
1382
+ "attributes": [
1383
+ {
1384
+ "name": "label",
1385
+ "description": "Label for the tab button",
1386
+ "type": "string",
1387
+ "default": null,
1388
+ "fieldName": null
1389
+ },
1390
+ {
1391
+ "name": "id",
1392
+ "description": "Unique identifier for the panel (auto-generated if not provided)",
1393
+ "type": "string",
1394
+ "default": null,
1395
+ "fieldName": null
1396
+ }
1397
+ ],
1398
+ "properties": [
1399
+ {
1400
+ "name": "section",
1401
+ "attribute": null,
1402
+ "description": "The inner `<section>` that exposes the panel region semantics.",
1403
+ "type": null,
1404
+ "default": null,
1405
+ "reflects": false,
1406
+ "privacy": "public"
1407
+ }
1408
+ ],
1409
+ "methods": [],
1410
+ "events": [],
1411
+ "slots": [
1412
+ {
1413
+ "name": "",
1414
+ "description": "Content of the tab panel"
1415
+ }
1416
+ ],
1417
+ "cssParts": [],
1418
+ "notes": []
1419
+ },
1420
+ "pds-tabstrip": {
1421
+ "tag": "pds-tabstrip",
1422
+ "className": "TabStrip",
1423
+ "displayName": "pds-tabstrip",
1424
+ "storyTitle": "PDS/Components/pds-tabstrip",
1425
+ "category": "PDS/Components",
1426
+ "description": "Tab navigation component that pairs anchors with `pds-tabpanel` children.",
1427
+ "docsDescription": "Accessible tab interface with keyboard navigation",
1428
+ "pdsTags": [],
1429
+ "ontology": {
1430
+ "id": "pds-tabstrip",
1431
+ "name": "Tab Strip",
1432
+ "selectors": [
1433
+ "pds-tabstrip"
1434
+ ]
1435
+ },
1436
+ "stories": [],
1437
+ "sourceModule": "public/assets/pds/components/pds-tabstrip.js",
1438
+ "superclass": "HTMLElement",
1439
+ "attributes": [
1440
+ {
1441
+ "name": "label",
1442
+ "description": "Accessible label announced for the tablist",
1443
+ "type": "string",
1444
+ "default": null,
1445
+ "fieldName": null
1446
+ },
1447
+ {
1448
+ "name": "selected",
1449
+ "description": "Identifier of the currently active panel (synced with the location hash)",
1450
+ "type": "string",
1451
+ "default": null,
1452
+ "fieldName": null
1453
+ }
1454
+ ],
1455
+ "properties": [
1456
+ {
1457
+ "name": "innerHTML",
1458
+ "attribute": null,
1459
+ "description": null,
1460
+ "type": null,
1461
+ "default": "`\n <style>\n :host{display:block}\n nav{\n position:relative; display:inline-flex; gap:.5rem; align-items:flex-end;\n \n --pad-x:.5rem; --pad-y:.25rem;\n }\n nav a{\n color: currentColor;\n display:inline-block; padding:var(--pad-y) var(--pad-x);\n text-decoration:none; line-height:1.2; border-bottom:2px solid transparent;\n cursor:pointer;\n }\n nav a[aria-current=\"page\"]{ font-weight:600; }\n nav a:focus-visible{ outline:auto; outline-offset:2px; }\n .inkbar{\n position:absolute; inset-inline-start:0; bottom:-1px; height:2px; width:0;\n transform:translateX(0); transition:transform .25s ease, width .25s ease;\n background-color: var(--color-accent-400); pointer-events:none;\n }\n </style>\n <nav part=\"tabs\"></nav>\n <slot></slot>\n `",
1462
+ "reflects": false,
1463
+ "privacy": "public"
1464
+ }
1465
+ ],
1466
+ "methods": [],
1467
+ "events": [
1468
+ {
1469
+ "name": "tabchange",
1470
+ "description": "Fired when the active tab changes. Detail: `{ oldTab: string|null, newTab: string }`",
1471
+ "type": "CustomEvent"
1472
+ }
1473
+ ],
1474
+ "slots": [
1475
+ {
1476
+ "name": "",
1477
+ "description": "Collection of `pds-tabpanel` nodes representing individual tab panels"
1478
+ }
1479
+ ],
1480
+ "cssParts": [
1481
+ {
1482
+ "name": "tabs",
1483
+ "description": "Navigation container comprising the clickable tab buttons"
1484
+ }
1485
+ ],
1486
+ "notes": []
1487
+ },
1488
+ "pds-toaster": {
1489
+ "tag": "pds-toaster",
1490
+ "className": "AppToaster",
1491
+ "displayName": "Pds Toaster",
1492
+ "storyTitle": "Components/Pds Toaster",
1493
+ "category": "Components",
1494
+ "description": null,
1495
+ "docsDescription": "Toast notification system with auto-dismiss and stacking. Toast notifications appear in the top-right corner and auto-dismiss after a few seconds based on message length.",
1496
+ "pdsTags": [
1497
+ "autodocs",
1498
+ "interaction",
1499
+ "notifications"
1500
+ ],
1501
+ "ontology": null,
1502
+ "stories": [],
1503
+ "sourceModule": "public/assets/pds/components/pds-toaster.js",
1504
+ "superclass": "HTMLElement",
1505
+ "attributes": [],
1506
+ "properties": [
1507
+ {
1508
+ "name": "toasts",
1509
+ "attribute": null,
1510
+ "description": null,
1511
+ "type": "array",
1512
+ "default": "[]",
1513
+ "reflects": false,
1514
+ "privacy": "public"
1515
+ }
1516
+ ],
1517
+ "methods": [
1518
+ {
1519
+ "name": "createToastElement",
1520
+ "description": "Build a DOM node representing a single toast notification.",
1521
+ "parameters": [
1522
+ {
1523
+ "name": "id",
1524
+ "type": "string",
1525
+ "description": null
1526
+ },
1527
+ {
1528
+ "name": "message",
1529
+ "type": "string",
1530
+ "description": null
1531
+ },
1532
+ {
1533
+ "name": "type",
1534
+ "type": "\"information\"|\"success\"|\"warning\"|\"error\"",
1535
+ "description": null
1536
+ },
1537
+ {
1538
+ "name": "closable",
1539
+ "type": "boolean",
1540
+ "description": null
1541
+ },
1542
+ {
1543
+ "name": "duration",
1544
+ "type": "number",
1545
+ "description": null
1546
+ },
1547
+ {
1548
+ "name": "persistent",
1549
+ "type": "boolean",
1550
+ "description": null
1551
+ }
1552
+ ],
1553
+ "return": "HTMLElement"
1554
+ },
1555
+ {
1556
+ "name": "dismissAll",
1557
+ "description": "Close all active toasts.",
1558
+ "parameters": [],
1559
+ "return": null
1560
+ },
1561
+ {
1562
+ "name": "dismissToast",
1563
+ "description": "Dismiss a toast by ID",
1564
+ "parameters": [
1565
+ {
1566
+ "name": "toastId",
1567
+ "type": "string",
1568
+ "description": "The ID of the toast to dismiss"
1569
+ }
1570
+ ],
1571
+ "return": null
1572
+ },
1573
+ {
1574
+ "name": "toast",
1575
+ "description": "Display a toast notification",
1576
+ "parameters": [
1577
+ {
1578
+ "name": "message",
1579
+ "type": "string",
1580
+ "description": "The message to display"
1581
+ },
1582
+ {
1583
+ "name": "options",
1584
+ "type": "@param {\"information\"|\"success\"|\"warning\"|\"error\"} [options.type=\"information\"] - Toast type\n * @param {number} [options.duration] - Duration in ms (auto-calculated if not provided)\n * @param {boolean} [options.closable=true] - Whether toast can be closed manually\n * @param {boolean} [options.persistent=false] - If true, toast doesn't auto-dismiss\n * ",
1585
+ "description": "Toast configuration"
1586
+ }
1587
+ ],
1588
+ "return": "string"
1589
+ },
1590
+ {
1591
+ "name": "toastError",
1592
+ "description": "Display an error toast",
1593
+ "parameters": [
1594
+ {
1595
+ "name": "message",
1596
+ "type": "string",
1597
+ "description": "The message to display"
1598
+ },
1599
+ {
1600
+ "name": "options",
1601
+ "type": "Object",
1602
+ "description": "Toast configuration options"
1603
+ }
1604
+ ],
1605
+ "return": "string"
1606
+ },
1607
+ {
1608
+ "name": "toastInfo",
1609
+ "description": "Display an information toast",
1610
+ "parameters": [
1611
+ {
1612
+ "name": "message",
1613
+ "type": "string",
1614
+ "description": "The message to display"
1615
+ },
1616
+ {
1617
+ "name": "options",
1618
+ "type": "Object",
1619
+ "description": "Toast configuration options"
1620
+ }
1621
+ ],
1622
+ "return": "string"
1623
+ },
1624
+ {
1625
+ "name": "toastSuccess",
1626
+ "description": "Display a success toast",
1627
+ "parameters": [
1628
+ {
1629
+ "name": "message",
1630
+ "type": "string",
1631
+ "description": "The message to display"
1632
+ },
1633
+ {
1634
+ "name": "options",
1635
+ "type": "Object",
1636
+ "description": "Toast configuration options"
1637
+ }
1638
+ ],
1639
+ "return": "string"
1640
+ },
1641
+ {
1642
+ "name": "toastWarning",
1643
+ "description": "Display a warning toast",
1644
+ "parameters": [
1645
+ {
1646
+ "name": "message",
1647
+ "type": "string",
1648
+ "description": "The message to display"
1649
+ },
1650
+ {
1651
+ "name": "options",
1652
+ "type": "Object",
1653
+ "description": "Toast configuration options"
1654
+ }
1655
+ ],
1656
+ "return": "string"
1657
+ }
1658
+ ],
1659
+ "events": [
1660
+ {
1661
+ "name": "pds:toast",
1662
+ "description": "Global event for creating toasts",
1663
+ "type": null
1664
+ }
1665
+ ],
1666
+ "slots": [
1667
+ {
1668
+ "name": "",
1669
+ "description": "Toast messages are dynamically added to the shadow DOM"
1670
+ }
1671
+ ],
1672
+ "cssParts": [],
1673
+ "notes": []
1674
+ },
1675
+ "pds-upload": {
1676
+ "tag": "pds-upload",
1677
+ "className": "UploadArea",
1678
+ "displayName": "Pds Upload",
1679
+ "storyTitle": "Components/Pds Upload",
1680
+ "category": "Components",
1681
+ "description": "Drag-and-drop file uploader that participates in native forms.",
1682
+ "docsDescription": "File upload with preview and validation",
1683
+ "pdsTags": [
1684
+ "autodocs",
1685
+ "forms"
1686
+ ],
1687
+ "ontology": {
1688
+ "id": "pds-upload",
1689
+ "name": "Upload",
1690
+ "selectors": [
1691
+ "pds-upload"
1692
+ ]
1693
+ },
1694
+ "stories": [
1695
+ {
1696
+ "exportName": "Default",
1697
+ "name": "Default",
1698
+ "id": "components-pds-upload--default",
1699
+ "tags": [],
1700
+ "description": null,
1701
+ "source": "stories\\components\\PdsUpload.stories.js"
1702
+ }
1703
+ ],
1704
+ "sourceModule": "public/assets/pds/components/pds-upload.js",
1705
+ "superclass": "HTMLElement",
1706
+ "attributes": [
1707
+ {
1708
+ "name": "accept",
1709
+ "description": "Comma separated list of accepted MIME types and file extensions",
1710
+ "type": "string",
1711
+ "default": null,
1712
+ "fieldName": null
1713
+ },
1714
+ {
1715
+ "name": "multiple",
1716
+ "description": "Allows selecting more than one file",
1717
+ "type": "boolean",
1718
+ "default": null,
1719
+ "fieldName": null
1720
+ },
1721
+ {
1722
+ "name": "disabled",
1723
+ "description": "Disables interaction with the drop zone and button",
1724
+ "type": "boolean",
1725
+ "default": null,
1726
+ "fieldName": null
1727
+ },
1728
+ {
1729
+ "name": "max-files",
1730
+ "description": "Optional cap on the number of files the user may select",
1731
+ "type": "number",
1732
+ "default": null,
1733
+ "fieldName": null
1734
+ }
1735
+ ],
1736
+ "properties": [
1737
+ {
1738
+ "name": "value",
1739
+ "attribute": null,
1740
+ "description": "Value is derived from the selected files and cannot be set manually.",
1741
+ "type": null,
1742
+ "default": null,
1743
+ "reflects": false,
1744
+ "privacy": "public"
1745
+ }
1746
+ ],
1747
+ "methods": [
1748
+ {
1749
+ "name": "checkValidity",
1750
+ "description": "Run constraint validation leveraging ElementInternals.",
1751
+ "parameters": [],
1752
+ "return": "boolean"
1753
+ },
1754
+ {
1755
+ "name": "clear",
1756
+ "description": "Clear all selected files and update the UI accordingly.",
1757
+ "parameters": [],
1758
+ "return": null
1759
+ },
1760
+ {
1761
+ "name": "clear",
1762
+ "description": "Remove all files and emit a change notification.",
1763
+ "parameters": [],
1764
+ "return": null
1765
+ },
1766
+ {
1767
+ "name": "formAssociatedCallback",
1768
+ "description": "Invoked when the element becomes associated with a `<form>`.",
1769
+ "parameters": [],
1770
+ "return": null
1771
+ },
1772
+ {
1773
+ "name": "formDisabledCallback",
1774
+ "description": "Sync disabled state across internal controls when the host form toggles.",
1775
+ "parameters": [
1776
+ {
1777
+ "name": "disabled",
1778
+ "type": "boolean",
1779
+ "description": null
1780
+ }
1781
+ ],
1782
+ "return": null
1783
+ },
1784
+ {
1785
+ "name": "formResetCallback",
1786
+ "description": "Clear selected files when the host form resets.",
1787
+ "parameters": [],
1788
+ "return": null
1789
+ },
1790
+ {
1791
+ "name": "formStateRestoreCallback",
1792
+ "description": "Restore previously submitted files during BFCache or session restores.",
1793
+ "parameters": [
1794
+ {
1795
+ "name": "state",
1796
+ "type": "File[]",
1797
+ "description": null
1798
+ }
1799
+ ],
1800
+ "return": null
1801
+ },
1802
+ {
1803
+ "name": "getFiles",
1804
+ "description": "Retrieve a shallow copy of the current file selection.",
1805
+ "parameters": [],
1806
+ "return": "File[]"
1807
+ },
1808
+ {
1809
+ "name": "reportValidity",
1810
+ "description": "Report validity issues using the browser UI.",
1811
+ "parameters": [],
1812
+ "return": "boolean"
1813
+ }
1814
+ ],
1815
+ "events": [
1816
+ {
1817
+ "name": "files-changed",
1818
+ "description": null,
1819
+ "type": "CustomEvent"
1820
+ }
1821
+ ],
1822
+ "slots": [],
1823
+ "cssParts": [],
1824
+ "notes": []
1825
+ }
1826
+ },
1827
+ "primitives": {
1828
+ "primitives": [
1829
+ {
1830
+ "id": "badge",
1831
+ "name": "Badge / Pill",
1832
+ "selectors": [
1833
+ ".badge",
1834
+ ".pill",
1835
+ ".tag",
1836
+ ".chip"
1837
+ ]
1838
+ },
1839
+ {
1840
+ "id": "card",
1841
+ "name": "Card",
1842
+ "selectors": [
1843
+ ".card",
1844
+ ".card-basic",
1845
+ ".card-elevated",
1846
+ ".card-outlined",
1847
+ ".card-interactive"
1848
+ ]
1849
+ },
1850
+ {
1851
+ "id": "surface",
1852
+ "name": "Surface",
1853
+ "selectors": [
1854
+ ".surface",
1855
+ ".surface-base",
1856
+ ".surface-raised",
1857
+ ".surface-overlay",
1858
+ ".surface-subtle",
1859
+ ".surface-elevated",
1860
+ ".surface-sunken"
1861
+ ]
1862
+ },
1863
+ {
1864
+ "id": "alert",
1865
+ "name": "Alert",
1866
+ "selectors": [
1867
+ ".alert",
1868
+ ".alert-info",
1869
+ ".alert-success",
1870
+ ".alert-warning",
1871
+ ".alert-danger"
1872
+ ]
1873
+ },
1874
+ {
1875
+ "id": "dialog",
1876
+ "name": "Dialog",
1877
+ "selectors": [
1878
+ "dialog",
1879
+ ".dialog"
1880
+ ]
1881
+ },
1882
+ {
1883
+ "id": "table",
1884
+ "name": "Table",
1885
+ "selectors": [
1886
+ "table",
1887
+ ".table-responsive",
1888
+ ".data-table"
1889
+ ]
1890
+ },
1891
+ {
1892
+ "id": "button",
1893
+ "name": "Button",
1894
+ "selectors": [
1895
+ "button",
1896
+ "[class^='btn-']",
1897
+ ".icon-only"
1898
+ ]
1899
+ },
1900
+ {
1901
+ "id": "fieldset",
1902
+ "name": "Fieldset Group",
1903
+ "selectors": [
1904
+ "fieldset[role='group']",
1905
+ "fieldset[role='radiogroup']"
1906
+ ]
1907
+ },
1908
+ {
1909
+ "id": "label-field",
1910
+ "name": "Label+Input",
1911
+ "selectors": [
1912
+ "label"
1913
+ ]
1914
+ },
1915
+ {
1916
+ "id": "accordion",
1917
+ "name": "Accordion",
1918
+ "selectors": [
1919
+ ".accordion",
1920
+ ".accordion-item",
1921
+ "details"
1922
+ ]
1923
+ },
1924
+ {
1925
+ "id": "icon",
1926
+ "name": "Icon",
1927
+ "selectors": [
1928
+ "pds-icon",
1929
+ ".icon",
1930
+ ".icon-*"
1931
+ ]
1932
+ },
1933
+ {
1934
+ "id": "figure",
1935
+ "name": "Figure/Media",
1936
+ "selectors": [
1937
+ "figure",
1938
+ "figure.media"
1939
+ ]
1940
+ },
1941
+ {
1942
+ "id": "gallery",
1943
+ "name": "Gallery",
1944
+ "selectors": [
1945
+ ".gallery",
1946
+ ".gallery-grid"
1947
+ ]
1948
+ }
1949
+ ],
1950
+ "layoutPatterns": [
1951
+ {
1952
+ "id": "grid",
1953
+ "name": "Grid Container",
1954
+ "description": "CSS Grid layout container",
1955
+ "selectors": [
1956
+ ".grid",
1957
+ ".demo-grid"
1958
+ ]
1959
+ },
1960
+ {
1961
+ "id": "grid-auto",
1962
+ "name": "Auto-fit Grid",
1963
+ "description": "Responsive auto-fit grid",
1964
+ "selectors": [
1965
+ ".grid-auto-sm",
1966
+ ".grid-auto-md",
1967
+ ".grid-auto-lg",
1968
+ ".grid-auto-xl"
1969
+ ]
1970
+ },
1971
+ {
1972
+ "id": "grid-cols",
1973
+ "name": "Grid Columns",
1974
+ "description": "Fixed column grid",
1975
+ "selectors": [
1976
+ ".grid-cols-1",
1977
+ ".grid-cols-2",
1978
+ ".grid-cols-3",
1979
+ ".grid-cols-4",
1980
+ ".grid-cols-6"
1981
+ ]
1982
+ },
1983
+ {
1984
+ "id": "flex",
1985
+ "name": "Flex Container",
1986
+ "description": "Flexbox layout container",
1987
+ "selectors": [
1988
+ ".flex",
1989
+ ".flex-wrap"
1990
+ ]
1991
+ },
1992
+ {
1993
+ "id": "container",
1994
+ "name": "Container",
1995
+ "description": "Centered max-width container",
1996
+ "selectors": [
1997
+ ".container"
1998
+ ]
1999
+ },
2000
+ {
2001
+ "id": "media-grid",
2002
+ "name": "Media Grid",
2003
+ "description": "Grid for media elements",
2004
+ "selectors": [
2005
+ ".media-grid"
2006
+ ]
2007
+ }
2008
+ ],
2009
+ "utilities": [
2010
+ ".btn-group",
2011
+ ".demo-grid",
2012
+ ".color-scale",
2013
+ ".gap-*",
2014
+ ".items-*",
2015
+ ".justify-*",
2016
+ ".border-gradient",
2017
+ ".border-gradient-primary",
2018
+ ".border-gradient-accent",
2019
+ ".border-gradient-secondary",
2020
+ ".border-gradient-soft",
2021
+ ".border-gradient-medium",
2022
+ ".border-gradient-strong",
2023
+ ".border-glow",
2024
+ ".border-glow-sm",
2025
+ ".border-glow-lg",
2026
+ ".border-gradient-glow",
2027
+ ".border-glow-*"
2028
+ ]
2029
+ },
2030
+ "enhancements": [
2031
+ {
2032
+ "id": "button-a-class-btn",
2033
+ "selector": "button, a[class*='btn-']",
2034
+ "description": "Automatically manages spinner icon for buttons with .btn-working class",
2035
+ "demoHtml": "<button class=\"btn-primary btn-working\">\n <span>Saving</span>\n </button>",
2036
+ "source": "src\\js\\pds-core\\pds-enhancers.js"
2037
+ },
2038
+ {
2039
+ "id": "fieldset-role-group-data-open",
2040
+ "selector": "fieldset[role=group][data-open]",
2041
+ "description": "Enhances a checkbox/radio group to be open (have a way to add and remove items).",
2042
+ "demoHtml": "<fieldset role=\"group\" data-open>\n <label>\n <span data-label>Test</span>\n <input value=\"lala\" name=\"test1\" type=\"radio\" />\n </label>\n </fieldset>",
2043
+ "source": "src\\js\\pds-core\\pds-enhancers.js"
2044
+ },
2045
+ {
2046
+ "id": "form-required",
2047
+ "selector": "form [required]",
2048
+ "description": "Enhances required form fields using an asterisk in the label.",
2049
+ "demoHtml": "<form action'#\" method=\"post\">\n <label>\n <span>Field Label</span>\n <input type=\"text\" required>\n </label>\n <nav class=\"form-actions\">\n <button type=\"submit\" class=\"btn-primary\">Submit</button>\n </nav>\n </form>",
2050
+ "source": "src\\js\\pds-core\\pds-enhancers.js"
2051
+ },
2052
+ {
2053
+ "id": "input-type-range",
2054
+ "selector": "input[type=\"range\"]",
2055
+ "description": "Enhances range inputs with an attached <output>.",
2056
+ "demoHtml": "<label class=\"range-output\">\n <span data-label>Volume</span>\n <input type=\"range\" min=\"0\" max=\"100\" value=\"40\">\n </label>",
2057
+ "source": "src\\js\\pds-core\\pds-enhancers.js"
2058
+ },
2059
+ {
2060
+ "id": "label-data-toggle",
2061
+ "selector": "label[data-toggle]",
2062
+ "description": "Creates a toggle switch element from a checkbox.",
2063
+ "demoHtml": "<label data-toggle>\n <input type=\"checkbox\">\n <span data-label>Enable notifications</span>\n </label>",
2064
+ "source": "src\\js\\pds-core\\pds-enhancers.js"
2065
+ },
2066
+ {
2067
+ "id": "nav-data-dropdown",
2068
+ "selector": "nav[data-dropdown]",
2069
+ "description": "Enhances a nav element with data-dropdown to function as a dropdown menu.",
2070
+ "demoHtml": "<nav data-dropdown>\n <button class=\"btn-primary\">Menu</button>\n <menu>\n <li><a href=\"#\">Item 1</a></li>\n <li><a href=\"#\">Item 2</a></li>\n </menu>\n </nav>",
2071
+ "source": "src\\js\\pds-core\\pds-enhancers.js"
2072
+ }
2073
+ ],
2074
+ "tokens": {
2075
+ "colors": [
2076
+ "primary",
2077
+ "secondary",
2078
+ "accent",
2079
+ "success",
2080
+ "warning",
2081
+ "danger",
2082
+ "info"
2083
+ ],
2084
+ "spacing": [
2085
+ "xs",
2086
+ "sm",
2087
+ "md",
2088
+ "lg",
2089
+ "xl"
2090
+ ],
2091
+ "typography": [
2092
+ "heading",
2093
+ "body",
2094
+ "mono"
2095
+ ],
2096
+ "themes": [
2097
+ "light",
2098
+ "dark"
2099
+ ]
2100
+ }
2101
+ }