dap-design-system 0.58.3 → 0.59.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 (17) hide show
  1. package/dist/components/datatable/datatable.component.d.ts +7 -0
  2. package/dist/components/pager/pager.component.d.ts +13 -0
  3. package/dist/{components-C1PeiTAk.js → components-CDc41tvu.js} +793 -749
  4. package/dist/components-CDc41tvu.js.map +1 -0
  5. package/dist/components.js +1 -1
  6. package/dist/dds.js +1 -1
  7. package/dist/manifest/types/vue/index.d.ts +557 -543
  8. package/dist/manifest/vscode.html-custom-data.json +449 -429
  9. package/dist/manifest/web-types.json +1062 -1022
  10. package/dist/react/dap-ds-datatable/index.d.ts +3 -0
  11. package/dist/react/dap-ds-pager/index.d.ts +6 -0
  12. package/dist/react/index.d.ts +16 -16
  13. package/dist/react-types.ts +17 -17
  14. package/dist/react.js +326 -326
  15. package/dist/react.js.map +1 -1
  16. package/package.json +1 -1
  17. package/dist/components-C1PeiTAk.js.map +0 -1
package/dist/manifest/web-types.json CHANGED
@@ -45,6 +45,33 @@
45
45
  "events": []
46
46
  }
47
47
  },
48
+ {
49
+ "name": "dap-ds-anchor-heading",
50
+ "description": "Anchor heading is a heading with an anchor link.\n---\n\n\n### **CSS Properties:**\n - **--dds-anchor-link-color** - The color of the anchor link (default: var(--dds-color-primary)) _(default: undefined)_\n- **--dds-anchor-link-opacity** - The opacity of the anchor link when not hovered (default: 0) _(default: undefined)_\n- **--dds-anchor-link-hover-opacity** - The opacity of the anchor link when hovered (default: 1) _(default: undefined)_\n- **--dds-anchor-link-transition** - The transition property for the anchor link opacity (default: opacity 0.2s ease-in-out) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main anchor heading container.\n- **link** - The link of the anchor heading. dap-ds-link element.\n- **link-base** - The base of the link part.\n- **text** - The text of the anchor heading.",
51
+ "doc-url": "",
52
+ "attributes": [
53
+ {
54
+ "name": "variant",
55
+ "description": "The variant of the heading. Default is `h2`. Can be `h1`, `h2`, `h3`, `h4`, `h5`, or `h6`.",
56
+ "value": { "type": "HeadingVariant" }
57
+ },
58
+ {
59
+ "name": "label",
60
+ "description": "The label of the heading.",
61
+ "value": { "type": "string" }
62
+ }
63
+ ],
64
+ "events": [],
65
+ "js": {
66
+ "properties": [
67
+ { "name": "variant", "type": "HeadingVariant" },
68
+ { "name": "label", "type": "string" },
69
+ { "name": "elementId" },
70
+ { "name": "anchorTitle" }
71
+ ],
72
+ "events": []
73
+ }
74
+ },
48
75
  {
49
76
  "name": "dap-ds-avatar",
50
77
  "description": "Avatar component can be used to display user profile images, initials, or icons.\n---\n\n\n### **Events:**\n - **dds-load** - Fired when the image loads successfully.\n- **dds-error** - Fired when the image fails to load.\n\n### **Slots:**\n - **icon** - The icon to display when variant is 'icon'.\n- **fallback** - Custom fallback content when image fails to load.\n\n### **CSS Properties:**\n - **--dds-avatar-border-radius** - The border radius of the avatar (default: 50%) _(default: undefined)_\n- **--dds-avatar-background-color** - The background color of the avatar (default: var(--dds-neutral-200)) _(default: undefined)_\n- **--dds-avatar-border-width** - The border width of the avatar (default: 0) _(default: undefined)_\n- **--dds-avatar-border-color** - The color of the avatar's border (default: transparent) _(default: undefined)_\n- **--dds-avatar-border-style** - The style of the avatar's border (default: solid) _(default: undefined)_\n- **--dds-avatar-transition** - The transition property for the avatar (default: all 0.2s ease-in-out) _(default: undefined)_\n- **--dds-avatar-text-color** - The text color for initials (default: var(--dds-text-neutral-strong)) _(default: undefined)_\n- **--dds-avatar-font-weight** - The font weight for initials (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-avatar-lg-size** - Size for large avatars (default: var(--dds-avatar-size-lg)) _(default: undefined)_\n- **--dds-avatar-md-size** - Size for medium avatars (default: var(--dds-avatar-size-md)) _(default: undefined)_\n- **--dds-avatar-sm-size** - Size for small avatars (default: var(--dds-avatar-size-sm)) _(default: undefined)_\n- **--dds-avatar-xs-size** - Size for extra small avatars (default: var(--dds-avatar-size-xs)) _(default: undefined)_\n- **--dds-avatar-xxs-size** - Size for extra extra small avatars (default: var(--dds-avatar-size-xxs)) _(default: undefined)_\n- **--dds-avatar-font-size-lg** - Font size for large avatars (default: var(--dds-font-2xl)) _(default: undefined)_\n- **--dds-avatar-font-size-md** - Font size for medium avatars (default: var(--dds-font-lg)) _(default: undefined)_\n- **--dds-avatar-font-size-sm** - Font size for small avatars (default: var(--dds-font-base)) _(default: undefined)_\n- **--dds-avatar-font-size-xs** - Font size for extra small avatars (default: var(--dds-font-sm)) _(default: undefined)_\n- **--dds-avatar-font-size-xxs** - Font size for extra extra small avatars (default: var(--dds-font-xs)) _(default: undefined)_\n- **--dds-avatar-hover-transform** - Transform applied on hover for interactive avatars (default: scale(1.05)) _(default: undefined)_\n- **--dds-avatar-active-transform** - Transform applied when active for interactive avatars (default: scale(0.95)) _(default: undefined)_\n- **--dds-avatar-focus-ring** - Focus ring style for interactive avatars (default: 0 0 0 2px var(--dds-focus-outer-ring)) _(default: undefined)_\n- **--dds-avatar-loading-background** - Background color when loading (default: var(--dds-neutral-100)) _(default: undefined)_\n- **--dds-avatar-error-background** - Background color when image fails to load (default: var(--dds-negative-100)) _(default: undefined)_\n- **--dds-avatar-error-color** - Text color when image fails to load (default: var(--dds-negative-600)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main avatar container.\n- **img** - The avatar image.\n- **initials** - The initials container.\n- **icon** - The icon container.\n- **fallback** - The fallback content container.\n- **loading** - The loading indicator.",
@@ -202,6 +229,105 @@
202
229
  ]
203
230
  }
204
231
  },
232
+ {
233
+ "name": "dap-ds-avatar-group",
234
+ "description": "Avatar group component displays multiple avatars in an organized layout with overflow management.\n---\n\n\n### **Events:**\n - **dds-overflow-click** - Fired when the overflow indicator is clicked.\n\n### **Slots:**\n - _default_ - The avatars to display in the group.\n\n### **CSS Properties:**\n - **--dds-avatar-group-gap** - Gap between avatars in grid layout (default: 0) _(default: undefined)_\n- **--dds-avatar-group-overlap** - Overlap amount for stacked layout (default: -8px) _(default: undefined)_\n- **--dds-avatar-group-border-width** - Border width for avatars (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-avatar-group-border-color** - Border color for avatars (default: var(--dds-border-neutral-divider)) _(default: undefined)_\n- **--dds-avatar-group-overflow-bg** - Background color for overflow indicator (default: var(--dds-neutral-300)) _(default: undefined)_\n- **--dds-avatar-group-overflow-color** - Text color for overflow indicator (default: var(--dds-neutral-700)) _(default: undefined)_\n- **--dds-avatar-group-overflow-border** - Border for overflow indicator (default: var(--dds-avatar-group-border-width) solid var(--dds-avatar-group-border-color)) _(default: undefined)_\n- **--dds-avatar-group-size-lg** - Size for large avatars (default: var(--dds-spacing-2000)) _(default: undefined)_\n- **--dds-avatar-group-size-md** - Size for medium avatars (default: var(--dds-spacing-1600)) _(default: undefined)_\n- **--dds-avatar-group-size-sm** - Size for small avatars (default: var(--dds-spacing-1200)) _(default: undefined)_\n- **--dds-avatar-group-size-xs** - Size for extra small avatars (default: var(--dds-spacing-800)) _(default: undefined)_\n- **--dds-avatar-group-size-xxs** - Size for extra extra small avatars (default: var(--dds-spacing-400)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main container of the avatar group.\n- **avatars** - The container for the visible avatars.\n- **overflow** - The overflow indicator element.",
235
+ "doc-url": "",
236
+ "attributes": [
237
+ {
238
+ "name": "layout",
239
+ "description": "Layout type for the avatar group",
240
+ "value": { "type": "'stack' | 'grid'", "default": "'stack'" }
241
+ },
242
+ {
243
+ "name": "max",
244
+ "description": "Maximum number of avatars to show before showing overflow",
245
+ "value": { "type": "number", "default": "3" }
246
+ },
247
+ {
248
+ "name": "show-total",
249
+ "description": "Whether to show the total count in overflow indicator",
250
+ "value": { "type": "boolean", "default": "false" }
251
+ },
252
+ {
253
+ "name": "interactive-overflow",
254
+ "description": "Interactive overflow indicator",
255
+ "value": { "type": "boolean", "default": "false" }
256
+ },
257
+ {
258
+ "name": "label",
259
+ "description": "Accessible label for the avatar group",
260
+ "value": { "type": "string" }
261
+ },
262
+ {
263
+ "name": "overflow-label",
264
+ "description": "Accessible label for the overflow indicator",
265
+ "value": { "type": "string" }
266
+ }
267
+ ],
268
+ "slots": [
269
+ {
270
+ "name": "",
271
+ "description": "The avatars to display in the group."
272
+ }
273
+ ],
274
+ "events": [
275
+ {
276
+ "name": "dds-overflow-click",
277
+ "description": "Fired when the overflow indicator is clicked."
278
+ }
279
+ ],
280
+ "js": {
281
+ "properties": [
282
+ {
283
+ "name": "layout",
284
+ "description": "Layout type for the avatar group",
285
+ "type": "'stack' | 'grid'"
286
+ },
287
+ {
288
+ "name": "max",
289
+ "description": "Maximum number of avatars to show before showing overflow",
290
+ "type": "number"
291
+ },
292
+ {
293
+ "name": "showTotal",
294
+ "description": "Whether to show the total count in overflow indicator",
295
+ "type": "boolean"
296
+ },
297
+ {
298
+ "name": "interactiveOverflow",
299
+ "description": "Interactive overflow indicator",
300
+ "type": "boolean"
301
+ },
302
+ {
303
+ "name": "label",
304
+ "description": "Accessible label for the avatar group",
305
+ "type": "string"
306
+ },
307
+ {
308
+ "name": "overflowLabel",
309
+ "description": "Accessible label for the overflow indicator",
310
+ "type": "string"
311
+ },
312
+ {
313
+ "name": "size",
314
+ "description": "The size of avatars in the group. Default is `md`. See SizedMixin.",
315
+ "type": "'xxs' | 'xs' | 'sm' | 'md' | 'lg'"
316
+ },
317
+ {
318
+ "name": "sizeMap",
319
+ "description": "Responsive size map (e.g. \"md:lg\"); see SizedMixin.",
320
+ "type": "string"
321
+ }
322
+ ],
323
+ "events": [
324
+ {
325
+ "name": "dds-overflow-click",
326
+ "description": "Fired when the overflow indicator is clicked."
327
+ }
328
+ ]
329
+ }
330
+ },
205
331
  {
206
332
  "name": "dap-ds-accordion",
207
333
  "description": "An accordion is a vertically stacked list of interactive items that can be expanded or collapsed to reveal or hide content.\n---\n\n\n### **Events:**\n - **dds-opened** - Event fired when the accordion is opened.\n- **dds-closed** - Event fired when the accordion is closed.\n\n### **Slots:**\n - **default** - The content of the accordion.\n- **heading** - The heading of the accordion.\n- **icon-opened** - The icon when the accordion is opened.\n- **icon-closed** - The icon when the accordion is closed.\n\n### **CSS Properties:**\n - **--dds-accordion-border-width** - The width of the accordion border (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-accordion-border-style** - The style of the accordion border (default: solid) _(default: undefined)_\n- **--dds-accordion-border-radius** - The border radius of the accordion (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-accordion-border-color** - The color of the accordion border (default: var(--dds-border-neutral-divider)) _(default: undefined)_\n- **--dds-accordion-background-color** - The background color of the accordion (default: var(--dds-background-neutral-subtle)) _(default: undefined)_\n- **--dds-accordion-text-color** - The text color of the accordion (default: var(--dds-text-neutral-strong)) _(default: undefined)_\n- **--dds-accordion-hover-background** - The background color when hovering over the accordion (default: var(--dds-background-neutral-base)) _(default: undefined)_\n- **--dds-accordion-active-background** - The background color when the accordion is active (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-accordion-icon-background** - The background color of the accordion icon (default: var(--dds-transparent-black-subtle)) _(default: undefined)_\n- **--dds-accordion-icon-color** - The color of the accordion icon (default: var(--dds-icon-neutral-base)) _(default: undefined)_\n- **--dds-accordion-icon-hover-background** - The background color of the accordion icon when hovered (default: var(--dds-transparent-black-base)) _(default: undefined)_\n- **--dds-accordion-icon-active-background** - The background color of the accordion icon when active (default: var(--dds-transparent-black-strong)) _(default: undefined)_\n- **--dds-accordion-icon-hover-color** - The color of the accordion icon when hovered (default: var(--dds-icon-neutral-strong)) _(default: undefined)_\n- **--dds-accordion-icon-active-color** - The color of the accordion icon when active (default: var(--dds-icon-neutral-strong)) _(default: undefined)_\n- **--dds-accordion-content-color** - The color of the accordion content (default: var(--dds-text-text-neutral)) _(default: undefined)_\n- **--dds-accordion-transition-duration** - The duration of the accordion transitions (default: var(--dds-transition-fast)) _(default: undefined)_\n- **--dds-accordion-transition-timing** - The timing function of the accordion transitions (default: var(--dds-easing-ease-in-out)) _(default: undefined)_\n- **--dds-accordion-divider-color** - The color of the divider between accordion items (default: var(--dds-border-neutral-divider)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main accordion container.\n- **heading** - The heading of the accordion.\n- **button** - The button of the accordion.\n- **content** - The content of the accordion.\n- **content-container** - The container of the accordion content.\n- **icon-wrapper** - The icon wrapper of the accordion.\n- **open-icon** - The icon when the accordion is opened.\n- **open-icon-base** - The base of the icon when the accordion is opened.\n- **close-icon** - The icon when the accordion is closed.\n- **close-icon-base** - The base of the icon when the accordion is closed.",
@@ -310,102 +436,63 @@
310
436
  }
311
437
  },
312
438
  {
313
- "name": "dap-ds-avatar-group",
314
- "description": "Avatar group component displays multiple avatars in an organized layout with overflow management.\n---\n\n\n### **Events:**\n - **dds-overflow-click** - Fired when the overflow indicator is clicked.\n\n### **Slots:**\n - _default_ - The avatars to display in the group.\n\n### **CSS Properties:**\n - **--dds-avatar-group-gap** - Gap between avatars in grid layout (default: 0) _(default: undefined)_\n- **--dds-avatar-group-overlap** - Overlap amount for stacked layout (default: -8px) _(default: undefined)_\n- **--dds-avatar-group-border-width** - Border width for avatars (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-avatar-group-border-color** - Border color for avatars (default: var(--dds-border-neutral-divider)) _(default: undefined)_\n- **--dds-avatar-group-overflow-bg** - Background color for overflow indicator (default: var(--dds-neutral-300)) _(default: undefined)_\n- **--dds-avatar-group-overflow-color** - Text color for overflow indicator (default: var(--dds-neutral-700)) _(default: undefined)_\n- **--dds-avatar-group-overflow-border** - Border for overflow indicator (default: var(--dds-avatar-group-border-width) solid var(--dds-avatar-group-border-color)) _(default: undefined)_\n- **--dds-avatar-group-size-lg** - Size for large avatars (default: var(--dds-spacing-2000)) _(default: undefined)_\n- **--dds-avatar-group-size-md** - Size for medium avatars (default: var(--dds-spacing-1600)) _(default: undefined)_\n- **--dds-avatar-group-size-sm** - Size for small avatars (default: var(--dds-spacing-1200)) _(default: undefined)_\n- **--dds-avatar-group-size-xs** - Size for extra small avatars (default: var(--dds-spacing-800)) _(default: undefined)_\n- **--dds-avatar-group-size-xxs** - Size for extra extra small avatars (default: var(--dds-spacing-400)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main container of the avatar group.\n- **avatars** - The container for the visible avatars.\n- **overflow** - The overflow indicator element.",
439
+ "name": "dap-ds-badge",
440
+ "description": "A badge is a small status descriptor for UI elements.\n---\n\n\n### **Slots:**\n - _default_ - The content of the badge.\n- **icon** - The icon of the badge.\n\n### **CSS Properties:**\n - **--dds-badge-border-width** - The width of the badge's border (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-badge-border-style** - The style of the badge's border (default: solid) _(default: undefined)_\n- **--dds-badge-border-radius** - The border radius of the badge (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-badge-font-weight** - The font weight of the badge text (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-badge-line-height** - The line height of the badge text (default: 1.2) _(default: undefined)_\n- **--dds-badge-transition** - The transition property for the badge (default: all 0.2s ease-in-out) _(default: undefined)_\n- **--dds-badge-padding-sm** - The padding of the small badge (default: var(--dds-spacing-100) var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-badge-padding-lg** - The padding of the large badge (default: var(--dds-spacing-100) var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-badge-font-size-sm** - The font size of the small badge (default: var(--dds-font-xs)) _(default: undefined)_\n- **--dds-badge-font-size-lg** - The font size of the large badge (default: var(--dds-font-sm)) _(default: undefined)_\n- **--dds-badge-neutral-border-color** - The border color of the neutral badge (default: var(--dds-border-neutral-base)) _(default: undefined)_\n- **--dds-badge-neutral-background** - The background color of the neutral badge (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-badge-neutral-color** - The text color of the neutral badge (default: var(--dds-text-neutral-subtle)) _(default: undefined)_\n- **--dds-badge-brand-border-color** - The border color of the brand badge (default: var(--dds-border-brand-base)) _(default: undefined)_\n- **--dds-badge-brand-background** - The background color of the brand badge (default: var(--dds-background-brand-medium)) _(default: undefined)_\n- **--dds-badge-brand-color** - The text color of the brand badge (default: var(--dds-text-brand-subtle)) _(default: undefined)_\n- **--dds-badge-info-border-color** - The border color of the info badge (default: var(--dds-border-informative-base)) _(default: undefined)_\n- **--dds-badge-info-background** - The background color of the info badge (default: var(--dds-background-informative-medium)) _(default: undefined)_\n- **--dds-badge-info-color** - The text color of the info badge (default: var(--dds-text-informative-subtle)) _(default: undefined)_\n- **--dds-badge-positive-border-color** - The border color of the positive badge (default: var(--dds-border-positive-base)) _(default: undefined)_\n- **--dds-badge-positive-background** - The background color of the positive badge (default: var(--dds-background-positive-medium)) _(default: undefined)_\n- **--dds-badge-positive-color** - The text color of the positive badge (default: var(--dds-text-positive-subtle)) _(default: undefined)_\n- **--dds-badge-warning-border-color** - The border color of the warning badge (default: var(--dds-border-warning-subtle)) _(default: undefined)_\n- **--dds-badge-warning-background** - The background color of the warning badge (default: var(--dds-background-warning-medium)) _(default: undefined)_\n- **--dds-badge-warning-color** - The text color of the warning badge (default: var(--dds-text-warning-subtle)) _(default: undefined)_\n- **--dds-badge-negative-border-color** - The border color of the negative badge (default: var(--dds-border-negative-base)) _(default: undefined)_\n- **--dds-badge-negative-background** - The background color of the negative badge (default: var(--dds-background-negative-medium)) _(default: undefined)_\n- **--dds-badge-negative-color** - The text color of the negative badge (default: var(--dds-text-negative-subtle)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main container of the badge.\n- **icon** - The icon of the badge.\n- **content** - The content of the badge.\n- **icon-base** - The base of the icon.",
315
441
  "doc-url": "",
316
442
  "attributes": [
317
443
  {
318
- "name": "layout",
319
- "description": "Layout type for the avatar group",
320
- "value": { "type": "'stack' | 'grid'", "default": "'stack'" }
321
- },
322
- {
323
- "name": "max",
324
- "description": "Maximum number of avatars to show before showing overflow",
325
- "value": { "type": "number", "default": "3" }
444
+ "name": "type",
445
+ "description": "The type of the badge",
446
+ "value": {
447
+ "type": "'neutral' | 'brand' | 'info' | 'positive' | 'warning' | 'negative'",
448
+ "default": "'neutral'"
449
+ }
326
450
  },
327
451
  {
328
- "name": "show-total",
329
- "description": "Whether to show the total count in overflow indicator",
330
- "value": { "type": "boolean", "default": "false" }
452
+ "name": "icon",
453
+ "description": "The icon of the badge, this is a name of a built in icon",
454
+ "value": { "type": "string | undefined" }
331
455
  },
332
456
  {
333
- "name": "interactive-overflow",
334
- "description": "Interactive overflow indicator",
457
+ "name": "live",
458
+ "description": "Whether the badge represents dynamic content that should announce changes",
335
459
  "value": { "type": "boolean", "default": "false" }
336
- },
337
- {
338
- "name": "label",
339
- "description": "Accessible label for the avatar group",
340
- "value": { "type": "string" }
341
- },
342
- {
343
- "name": "overflow-label",
344
- "description": "Accessible label for the overflow indicator",
345
- "value": { "type": "string" }
346
460
  }
347
461
  ],
348
462
  "slots": [
349
- {
350
- "name": "",
351
- "description": "The avatars to display in the group."
352
- }
353
- ],
354
- "events": [
355
- {
356
- "name": "dds-overflow-click",
357
- "description": "Fired when the overflow indicator is clicked."
358
- }
463
+ { "name": "", "description": "The content of the badge." },
464
+ { "name": "icon", "description": "The icon of the badge." }
359
465
  ],
466
+ "events": [],
360
467
  "js": {
361
468
  "properties": [
362
469
  {
363
- "name": "layout",
364
- "description": "Layout type for the avatar group",
365
- "type": "'stack' | 'grid'"
366
- },
367
- {
368
- "name": "max",
369
- "description": "Maximum number of avatars to show before showing overflow",
370
- "type": "number"
470
+ "name": "type",
471
+ "description": "The type of the badge",
472
+ "type": "'neutral' | 'brand' | 'info' | 'positive' | 'warning' | 'negative'"
371
473
  },
372
474
  {
373
- "name": "showTotal",
374
- "description": "Whether to show the total count in overflow indicator",
375
- "type": "boolean"
475
+ "name": "icon",
476
+ "description": "The icon of the badge, this is a name of a built in icon",
477
+ "type": "string | undefined"
376
478
  },
377
479
  {
378
- "name": "interactiveOverflow",
379
- "description": "Interactive overflow indicator",
480
+ "name": "live",
481
+ "description": "Whether the badge represents dynamic content that should announce changes",
380
482
  "type": "boolean"
381
483
  },
382
- {
383
- "name": "label",
384
- "description": "Accessible label for the avatar group",
385
- "type": "string"
386
- },
387
- {
388
- "name": "overflowLabel",
389
- "description": "Accessible label for the overflow indicator",
390
- "type": "string"
391
- },
392
484
  {
393
485
  "name": "size",
394
- "description": "The size of avatars in the group. Default is `md`. See SizedMixin.",
395
- "type": "'xxs' | 'xs' | 'sm' | 'md' | 'lg'"
486
+ "description": "The size of the badge. Default is `sm`.",
487
+ "type": "'sm' | 'lg'"
396
488
  },
397
489
  {
398
490
  "name": "sizeMap",
399
- "description": "Responsive size map (e.g. \"md:lg\"); see SizedMixin.",
491
+ "description": "Responsive size map (e.g. \"md:lg\").",
400
492
  "type": "string"
401
493
  }
402
494
  ],
403
- "events": [
404
- {
405
- "name": "dds-overflow-click",
406
- "description": "Fired when the overflow indicator is clicked."
407
- }
408
- ]
495
+ "events": []
409
496
  }
410
497
  },
411
498
  {
@@ -547,124 +634,37 @@
547
634
  }
548
635
  },
549
636
  {
550
- "name": "dap-ds-anchor-heading",
551
- "description": "Anchor heading is a heading with an anchor link.\n---\n\n\n### **CSS Properties:**\n - **--dds-anchor-link-color** - The color of the anchor link (default: var(--dds-color-primary)) _(default: undefined)_\n- **--dds-anchor-link-opacity** - The opacity of the anchor link when not hovered (default: 0) _(default: undefined)_\n- **--dds-anchor-link-hover-opacity** - The opacity of the anchor link when hovered (default: 1) _(default: undefined)_\n- **--dds-anchor-link-transition** - The transition property for the anchor link opacity (default: opacity 0.2s ease-in-out) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main anchor heading container.\n- **link** - The link of the anchor heading. dap-ds-link element.\n- **link-base** - The base of the link part.\n- **text** - The text of the anchor heading.",
637
+ "name": "dap-ds-breadcrumb-item",
638
+ "description": "A breadcrumb item is a secondary navigation scheme that reveals the user's location in a website or Web application.\n---\n\n\n### **Slots:**\n - _default_ - The content of the breadcrumb item.\n- **separator** - The separator between breadcrumb items. Default is an arrow-right-s-line icon.\n\n### **CSS Properties:**\n - **--dds-breadcrumb-item-display** - The display property of the breadcrumb item (default: inline-flex) _(default: undefined)_\n- **--dds-breadcrumb-item-flex-wrap** - The flex-wrap property of the breadcrumb item (default: nowrap) _(default: undefined)_\n- **--dds-breadcrumb-item-align-items** - The align-items property of the breadcrumb item (default: center) _(default: undefined)_\n- **--dds-breadcrumb-item-color** - The text color of the breadcrumb item (default: var(--dds-text-neutral-base)) _(default: undefined)_\n- **--dds-breadcrumb-item-transition** - The transition property for the breadcrumb item (default: all 0.2s ease-in-out) _(default: undefined)_\n- **--dds-breadcrumb-item-gap** - The gap between the breadcrumb item and the separator (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-breadcrumb-item-padding** - The padding of the breadcrumb item (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-breadcrumb-item-font-size** - The font size of the breadcrumb item (default: var(--dds-font-sm)) _(default: undefined)_\n- **--dds-breadcrumb-item-font-weight** - The font weight of the breadcrumb item (default: var(--dds-font-weight-medium)) _(default: undefined)_\n- **--dds-breadcrumb-item-font-weight-bold** - The bold font weight of the breadcrumb item (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-breadcrumb-item-separator-color** - The color of the separator (default: var(--dds-text-neutral-disabled)) _(default: undefined)_\n- **--dds-breadcrumb-item-link-color** - The color of the link (default: var(--dds-link-neutral-enabled)) _(default: undefined)_\n- **--dds-breadcrumb-item-inverted-color** - The text color when inverted (default: var(--dds-text-neutral-inverted)) _(default: undefined)_\n- **--dds-breadcrumb-item-inverted-link-color** - The link color when inverted (default: var(--dds-text-neutral-inverted)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main breadcrumb item container. The li element.\n- **link** - The link of the breadcrumb item. The dds-link component.\n- **link-base** - The base part of the link part. The dds-link components base part.\n- **item-nolink** - The item of the breadcrumb item without a link. The span element.\n- **separator** - The separator of the breadcrumb item.",
552
639
  "doc-url": "",
553
640
  "attributes": [
554
641
  {
555
- "name": "variant",
556
- "description": "The variant of the heading. Default is `h2`. Can be `h1`, `h2`, `h3`, `h4`, `h5`, or `h6`.",
557
- "value": { "type": "HeadingVariant" }
642
+ "name": "href",
643
+ "description": "The URL of the breadcrumb item.",
644
+ "value": { "type": "string | undefined" }
558
645
  },
559
646
  {
560
- "name": "label",
561
- "description": "The label of the heading.",
562
- "value": { "type": "string" }
563
- }
564
- ],
565
- "events": [],
566
- "js": {
567
- "properties": [
568
- { "name": "variant", "type": "HeadingVariant" },
569
- { "name": "label", "type": "string" },
570
- { "name": "elementId" },
571
- { "name": "anchorTitle" }
572
- ],
573
- "events": []
574
- }
575
- },
576
- {
577
- "name": "dap-ds-badge",
578
- "description": "A badge is a small status descriptor for UI elements.\n---\n\n\n### **Slots:**\n - _default_ - The content of the badge.\n- **icon** - The icon of the badge.\n\n### **CSS Properties:**\n - **--dds-badge-border-width** - The width of the badge's border (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-badge-border-style** - The style of the badge's border (default: solid) _(default: undefined)_\n- **--dds-badge-border-radius** - The border radius of the badge (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-badge-font-weight** - The font weight of the badge text (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-badge-line-height** - The line height of the badge text (default: 1.2) _(default: undefined)_\n- **--dds-badge-transition** - The transition property for the badge (default: all 0.2s ease-in-out) _(default: undefined)_\n- **--dds-badge-padding-sm** - The padding of the small badge (default: var(--dds-spacing-100) var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-badge-padding-lg** - The padding of the large badge (default: var(--dds-spacing-100) var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-badge-font-size-sm** - The font size of the small badge (default: var(--dds-font-xs)) _(default: undefined)_\n- **--dds-badge-font-size-lg** - The font size of the large badge (default: var(--dds-font-sm)) _(default: undefined)_\n- **--dds-badge-neutral-border-color** - The border color of the neutral badge (default: var(--dds-border-neutral-base)) _(default: undefined)_\n- **--dds-badge-neutral-background** - The background color of the neutral badge (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-badge-neutral-color** - The text color of the neutral badge (default: var(--dds-text-neutral-subtle)) _(default: undefined)_\n- **--dds-badge-brand-border-color** - The border color of the brand badge (default: var(--dds-border-brand-base)) _(default: undefined)_\n- **--dds-badge-brand-background** - The background color of the brand badge (default: var(--dds-background-brand-medium)) _(default: undefined)_\n- **--dds-badge-brand-color** - The text color of the brand badge (default: var(--dds-text-brand-subtle)) _(default: undefined)_\n- **--dds-badge-info-border-color** - The border color of the info badge (default: var(--dds-border-informative-base)) _(default: undefined)_\n- **--dds-badge-info-background** - The background color of the info badge (default: var(--dds-background-informative-medium)) _(default: undefined)_\n- **--dds-badge-info-color** - The text color of the info badge (default: var(--dds-text-informative-subtle)) _(default: undefined)_\n- **--dds-badge-positive-border-color** - The border color of the positive badge (default: var(--dds-border-positive-base)) _(default: undefined)_\n- **--dds-badge-positive-background** - The background color of the positive badge (default: var(--dds-background-positive-medium)) _(default: undefined)_\n- **--dds-badge-positive-color** - The text color of the positive badge (default: var(--dds-text-positive-subtle)) _(default: undefined)_\n- **--dds-badge-warning-border-color** - The border color of the warning badge (default: var(--dds-border-warning-subtle)) _(default: undefined)_\n- **--dds-badge-warning-background** - The background color of the warning badge (default: var(--dds-background-warning-medium)) _(default: undefined)_\n- **--dds-badge-warning-color** - The text color of the warning badge (default: var(--dds-text-warning-subtle)) _(default: undefined)_\n- **--dds-badge-negative-border-color** - The border color of the negative badge (default: var(--dds-border-negative-base)) _(default: undefined)_\n- **--dds-badge-negative-background** - The background color of the negative badge (default: var(--dds-background-negative-medium)) _(default: undefined)_\n- **--dds-badge-negative-color** - The text color of the negative badge (default: var(--dds-text-negative-subtle)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main container of the badge.\n- **icon** - The icon of the badge.\n- **content** - The content of the badge.\n- **icon-base** - The base of the icon.",
579
- "doc-url": "",
580
- "attributes": [
581
- {
582
- "name": "type",
583
- "description": "The type of the badge",
584
- "value": {
585
- "type": "'neutral' | 'brand' | 'info' | 'positive' | 'warning' | 'negative'",
586
- "default": "'neutral'"
587
- }
588
- },
589
- {
590
- "name": "icon",
591
- "description": "The icon of the badge, this is a name of a built in icon",
592
- "value": { "type": "string | undefined" }
593
- },
594
- {
595
- "name": "live",
596
- "description": "Whether the badge represents dynamic content that should announce changes",
597
- "value": { "type": "boolean", "default": "false" }
598
- }
599
- ],
600
- "slots": [
601
- { "name": "", "description": "The content of the badge." },
602
- { "name": "icon", "description": "The icon of the badge." }
603
- ],
604
- "events": [],
605
- "js": {
606
- "properties": [
607
- {
608
- "name": "type",
609
- "description": "The type of the badge",
610
- "type": "'neutral' | 'brand' | 'info' | 'positive' | 'warning' | 'negative'"
611
- },
612
- {
613
- "name": "icon",
614
- "description": "The icon of the badge, this is a name of a built in icon",
615
- "type": "string | undefined"
616
- },
617
- {
618
- "name": "live",
619
- "description": "Whether the badge represents dynamic content that should announce changes",
620
- "type": "boolean"
621
- },
622
- {
623
- "name": "size",
624
- "description": "The size of the badge. Default is `sm`.",
625
- "type": "'sm' | 'lg'"
626
- },
627
- {
628
- "name": "sizeMap",
629
- "description": "Responsive size map (e.g. \"md:lg\").",
630
- "type": "string"
631
- }
632
- ],
633
- "events": []
634
- }
635
- },
636
- {
637
- "name": "dap-ds-breadcrumb-item",
638
- "description": "A breadcrumb item is a secondary navigation scheme that reveals the user's location in a website or Web application.\n---\n\n\n### **Slots:**\n - _default_ - The content of the breadcrumb item.\n- **separator** - The separator between breadcrumb items. Default is an arrow-right-s-line icon.\n\n### **CSS Properties:**\n - **--dds-breadcrumb-item-display** - The display property of the breadcrumb item (default: inline-flex) _(default: undefined)_\n- **--dds-breadcrumb-item-flex-wrap** - The flex-wrap property of the breadcrumb item (default: nowrap) _(default: undefined)_\n- **--dds-breadcrumb-item-align-items** - The align-items property of the breadcrumb item (default: center) _(default: undefined)_\n- **--dds-breadcrumb-item-color** - The text color of the breadcrumb item (default: var(--dds-text-neutral-base)) _(default: undefined)_\n- **--dds-breadcrumb-item-transition** - The transition property for the breadcrumb item (default: all 0.2s ease-in-out) _(default: undefined)_\n- **--dds-breadcrumb-item-gap** - The gap between the breadcrumb item and the separator (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-breadcrumb-item-padding** - The padding of the breadcrumb item (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-breadcrumb-item-font-size** - The font size of the breadcrumb item (default: var(--dds-font-sm)) _(default: undefined)_\n- **--dds-breadcrumb-item-font-weight** - The font weight of the breadcrumb item (default: var(--dds-font-weight-medium)) _(default: undefined)_\n- **--dds-breadcrumb-item-font-weight-bold** - The bold font weight of the breadcrumb item (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-breadcrumb-item-separator-color** - The color of the separator (default: var(--dds-text-neutral-disabled)) _(default: undefined)_\n- **--dds-breadcrumb-item-link-color** - The color of the link (default: var(--dds-link-neutral-enabled)) _(default: undefined)_\n- **--dds-breadcrumb-item-inverted-color** - The text color when inverted (default: var(--dds-text-neutral-inverted)) _(default: undefined)_\n- **--dds-breadcrumb-item-inverted-link-color** - The link color when inverted (default: var(--dds-text-neutral-inverted)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main breadcrumb item container. The li element.\n- **link** - The link of the breadcrumb item. The dds-link component.\n- **link-base** - The base part of the link part. The dds-link components base part.\n- **item-nolink** - The item of the breadcrumb item without a link. The span element.\n- **separator** - The separator of the breadcrumb item.",
639
- "doc-url": "",
640
- "attributes": [
641
- {
642
- "name": "href",
643
- "description": "The URL of the breadcrumb item.",
644
- "value": { "type": "string | undefined" }
645
- },
646
- {
647
- "name": "target",
648
- "description": "The target of the breadcrumb item.",
649
- "value": { "type": "'_blank' | '_self' | '_parent' | '_top'" }
650
- },
651
- {
652
- "name": "rel",
653
- "description": "The rel of the breadcrumb item link.",
654
- "value": { "type": "string", "default": "'noreferrer noopener'" }
655
- },
656
- {
657
- "name": "disabled",
658
- "description": "Whether the breadcrumb item is disabled.",
659
- "value": { "type": "boolean", "default": "false" }
660
- },
661
- {
662
- "name": "variant",
663
- "description": "The variant of the breadcrumb item.",
664
- "value": {
665
- "type": "'normal' | 'inverted'",
666
- "default": "'normal'"
667
- }
647
+ "name": "target",
648
+ "description": "The target of the breadcrumb item.",
649
+ "value": { "type": "'_blank' | '_self' | '_parent' | '_top'" }
650
+ },
651
+ {
652
+ "name": "rel",
653
+ "description": "The rel of the breadcrumb item link.",
654
+ "value": { "type": "string", "default": "'noreferrer noopener'" }
655
+ },
656
+ {
657
+ "name": "disabled",
658
+ "description": "Whether the breadcrumb item is disabled.",
659
+ "value": { "type": "boolean", "default": "false" }
660
+ },
661
+ {
662
+ "name": "variant",
663
+ "description": "The variant of the breadcrumb item.",
664
+ "value": {
665
+ "type": "'normal' | 'inverted'",
666
+ "default": "'normal'"
667
+ }
668
668
  }
669
669
  ],
670
670
  "slots": [
@@ -888,6 +888,140 @@
888
888
  ]
889
889
  }
890
890
  },
891
+ {
892
+ "name": "dap-ds-callout",
893
+ "description": "`dap-ds-callout` is a custom callout component.\n---\n\n\n### **Events:**\n - **dds-close** - Fired when the close button is clicked.\n\n### **Slots:**\n - _default_ - The content of the callout.\n- **title** - The title of the callout.\n- **icon** - The icon of the callout.\n- **actions** - The actions of the callout.\n- **close** - The close button of the callout.\n\n### **CSS Properties:**\n - **--dds-callout-padding** - Padding of the callout content. (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-callout-gap** - Gap between elements in horizontal layout. (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-callout-icon-size** - Size of the icon. (default: var(--dds-spacing-600)) _(default: undefined)_\n- **--dds-callout-title-color** - Color of the title text. (default: var(--dds-text-neutral-strong)) _(default: undefined)_\n- **--dds-callout-description-color** - Color of the description text. (default: var(--dds-text-neutral-base)) _(default: undefined)_\n- **--dds-callout-title-font-size** - Font size of the title. (default: var(--dds-font-base)) _(default: undefined)_\n- **--dds-callout-description-font-size** - Font size of the description. (default: var(--dds-font-base)) _(default: undefined)_\n- **--dds-callout-title-font-weight** - Font weight of the title. (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-callout-description-font-weight** - Font weight of the description. (default: var(--dds-font-weight-medium)) _(default: undefined)_\n- **--dds-callout-actions-font-weight** - Font weight of the actions. (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-callout-actions-gap** - Gap between action items. (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-callout-content-gap** - Gap between content elements. (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-callout-border-radius** - Border radius of the callout. (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-callout-brand-background** - Brand variant background color. (default: var(--dds-background-brand-base)) _(default: undefined)_\n- **--dds-callout-brand-background-subtle** - Brand variant subtle background color. (default: var(--dds-background-brand-subtle)) _(default: undefined)_\n- **--dds-callout-brand-background-medium** - Brand variant medium background color. (default: var(--dds-background-brand-medium)) _(default: undefined)_\n- **--dds-callout-brand-background-strong** - Brand variant strong background color. (default: var(--dds-background-brand-strong)) _(default: undefined)_\n- **--dds-callout-brand-icon** - Brand variant icon color. (default: var(--dds-icon-brand-subtle)) _(default: undefined)_\n- **--dds-callout-brand-border** - Brand variant border color. (default: var(--dds-border-brand-subtle)) _(default: undefined)_\n- **--dds-callout-info-background** - Info variant background color. (default: var(--dds-background-informative-base)) _(default: undefined)_\n- **--dds-callout-info-background-subtle** - Info variant subtle background color. (default: var(--dds-background-informative-subtle)) _(default: undefined)_\n- **--dds-callout-info-background-medium** - Info variant medium background color. (default: var(--dds-background-informative-medium)) _(default: undefined)_\n- **--dds-callout-info-background-strong** - Info variant strong background color. (default: var(--dds-background-informative-strong)) _(default: undefined)_\n- **--dds-callout-info-icon** - Info variant icon color. (default: var(--dds-icon-informative-subtle)) _(default: undefined)_\n- **--dds-callout-info-border** - Info variant border color. (default: var(--dds-border-informative-subtle)) _(default: undefined)_\n- **--dds-callout-positive-background** - Positive variant background color. (default: var(--dds-background-positive-base)) _(default: undefined)_\n- **--dds-callout-positive-background-subtle** - Positive variant subtle background color. (default: var(--dds-background-positive-subtle)) _(default: undefined)_\n- **--dds-callout-positive-background-medium** - Positive variant medium background color. (default: var(--dds-background-positive-medium)) _(default: undefined)_\n- **--dds-callout-positive-background-strong** - Positive variant strong background color. (default: var(--dds-background-positive-strong)) _(default: undefined)_\n- **--dds-callout-positive-icon** - Positive variant icon color. (default: var(--dds-icon-positive-subtle)) _(default: undefined)_\n- **--dds-callout-positive-border** - Positive variant border color. (default: var(--dds-border-positive-subtle)) _(default: undefined)_\n- **--dds-callout-warning-background** - Warning variant background color. (default: var(--dds-background-warning-base)) _(default: undefined)_\n- **--dds-callout-warning-background-subtle** - Warning variant subtle background color. (default: var(--dds-background-warning-subtle)) _(default: undefined)_\n- **--dds-callout-warning-background-medium** - Warning variant medium background color. (default: var(--dds-background-warning-medium)) _(default: undefined)_\n- **--dds-callout-warning-background-strong** - Warning variant strong background color. (default: var(--dds-background-warning-strong)) _(default: undefined)_\n- **--dds-callout-warning-icon** - Warning variant icon color. (default: var(--dds-icon-neutral-strong)) _(default: undefined)_\n- **--dds-callout-warning-border** - Warning variant border color. (default: var(--dds-border-warning-subtle)) _(default: undefined)_\n- **--dds-callout-negative-background** - Negative variant background color. (default: var(--dds-background-negative-base)) _(default: undefined)_\n- **--dds-callout-negative-background-subtle** - Negative variant subtle background color. (default: var(--dds-background-negative-subtle)) _(default: undefined)_\n- **--dds-callout-negative-background-medium** - Negative variant medium background color. (default: var(--dds-background-negative-medium)) _(default: undefined)_\n- **--dds-callout-negative-background-strong** - Negative variant strong background color. (default: var(--dds-background-negative-strong)) _(default: undefined)_\n- **--dds-callout-negative-icon** - Negative variant icon color. (default: var(--dds-icon-negative-subtle)) _(default: undefined)_\n- **--dds-callout-negative-border** - Negative variant border color. (default: var(--dds-border-negative-subtle)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main callout container.\n- **content** - The content of the callout.\n- **card-content** - The content of the card.\n- **icon** - The icon of the callout.\n- **title** - The title of the callout.\n- **description** - The description of the callout.\n- **actions** - The actions of the callout.\n- **close** - The close button of the callout.",
894
+ "doc-url": "",
895
+ "attributes": [
896
+ {
897
+ "name": "variant",
898
+ "description": "The variant of the callout",
899
+ "value": {
900
+ "type": "'brand' | 'positive' | 'info' | 'warning' | 'negative'",
901
+ "default": "'brand'"
902
+ }
903
+ },
904
+ {
905
+ "name": "alignment",
906
+ "description": "The alignment of the callout. Can be `vertical` or `horizontal`.",
907
+ "value": {
908
+ "type": "'vertical' | 'horizontal'",
909
+ "default": "'horizontal'"
910
+ }
911
+ },
912
+ {
913
+ "name": "shade",
914
+ "description": "The strongness of the callout colors. Can be `subtle`, `base`, `medium`, or `strong`.",
915
+ "value": {
916
+ "type": "'subtle' | 'base' | 'medium' | 'strong'",
917
+ "default": "'base'"
918
+ }
919
+ },
920
+ {
921
+ "name": "noBorder",
922
+ "description": "If the callout has a border",
923
+ "value": { "type": "string", "default": "'true'" }
924
+ },
925
+ {
926
+ "name": "closeable",
927
+ "description": "If the callout has a close button",
928
+ "value": { "type": "boolean", "default": "false" }
929
+ },
930
+ {
931
+ "name": "title",
932
+ "description": "The header of the callout",
933
+ "value": { "type": "string" }
934
+ },
935
+ {
936
+ "name": "closeButtonLabel",
937
+ "description": "The label of the close button",
938
+ "value": { "type": "string" }
939
+ },
940
+ {
941
+ "name": "closeButtonTestId",
942
+ "description": "`data-testid` for the default close button.",
943
+ "value": { "type": "string", "default": "'callout-close-button'" }
944
+ },
945
+ {
946
+ "name": "opened",
947
+ "description": "If the callout is opened",
948
+ "value": { "type": "string", "default": "'true'" }
949
+ }
950
+ ],
951
+ "slots": [
952
+ { "name": "", "description": "The content of the callout." },
953
+ { "name": "title", "description": "The title of the callout." },
954
+ { "name": "icon", "description": "The icon of the callout." },
955
+ { "name": "actions", "description": "The actions of the callout." },
956
+ {
957
+ "name": "close",
958
+ "description": "The close button of the callout."
959
+ }
960
+ ],
961
+ "events": [
962
+ {
963
+ "name": "dds-close",
964
+ "type": "{ void }",
965
+ "description": "Fired when the close button is clicked."
966
+ }
967
+ ],
968
+ "js": {
969
+ "properties": [
970
+ {
971
+ "name": "variant",
972
+ "description": "The variant of the callout",
973
+ "type": "'brand' | 'positive' | 'info' | 'warning' | 'negative'"
974
+ },
975
+ {
976
+ "name": "alignment",
977
+ "description": "The alignment of the callout. Can be `vertical` or `horizontal`.",
978
+ "type": "'vertical' | 'horizontal'"
979
+ },
980
+ {
981
+ "name": "shade",
982
+ "description": "The strongness of the callout colors. Can be `subtle`, `base`, `medium`, or `strong`.",
983
+ "type": "'subtle' | 'base' | 'medium' | 'strong'"
984
+ },
985
+ {
986
+ "name": "noBorder",
987
+ "description": "If the callout has a border",
988
+ "type": "string"
989
+ },
990
+ {
991
+ "name": "closeable",
992
+ "description": "If the callout has a close button",
993
+ "type": "boolean"
994
+ },
995
+ {
996
+ "name": "title",
997
+ "description": "The header of the callout",
998
+ "type": "string"
999
+ },
1000
+ {
1001
+ "name": "closeButtonLabel",
1002
+ "description": "The label of the close button",
1003
+ "type": "string"
1004
+ },
1005
+ {
1006
+ "name": "closeButtonTestId",
1007
+ "description": "`data-testid` for the default close button.",
1008
+ "type": "string"
1009
+ },
1010
+ {
1011
+ "name": "opened",
1012
+ "description": "If the callout is opened",
1013
+ "type": "string"
1014
+ }
1015
+ ],
1016
+ "events": [
1017
+ {
1018
+ "name": "dds-close",
1019
+ "type": "{ void }",
1020
+ "description": "Fired when the close button is clicked."
1021
+ }
1022
+ ]
1023
+ }
1024
+ },
891
1025
  {
892
1026
  "name": "dap-ds-calendar-cell",
893
1027
  "description": "Calendar cell represents a single cell in the calendar.\n---\n\n\n### **Slots:**\n - _default_ - The content of the calendar cell.\n\n### **CSS Properties:**\n - **--dds-calendar-cell-display** - The display property of the calendar cell host (default: flex) _(default: undefined)_\n- **--dds-calendar-cell-position** - The position property of the calendar cell host (default: relative) _(default: undefined)_\n- **--dds-calendar-cell-border-radius** - The border radius of the calendar cell (default: var(--dds-radius-rounded)) _(default: undefined)_\n- **--dds-calendar-cell-min-width** - The minimum width of the calendar cell (default: var(--dds-spacing-1000)) _(default: undefined)_\n- **--dds-calendar-cell-height** - The height of the calendar cell (default: var(--dds-spacing-1000)) _(default: undefined)_\n- **--dds-calendar-cell-min-height** - The minimum height of the calendar cell (default: var(--dds-spacing-1000)) _(default: undefined)_\n- **--dds-calendar-cell-color** - The text color of the calendar cell (default: var(--dds-button-subtle-text-neutral-enabled)) _(default: undefined)_\n- **--dds-calendar-cell-font-size** - The font size of the calendar cell (default: var(--dds-font-sm)) _(default: undefined)_\n- **--dds-calendar-cell-font-weight** - The font weight of the calendar cell (default: var(--dds-font-weight-medium)) _(default: undefined)_\n- **--dds-calendar-cell-text-align** - The text alignment of the calendar cell (default: center) _(default: undefined)_\n- **--dds-calendar-cell-cursor** - The cursor style of the calendar cell (default: pointer) _(default: undefined)_\n- **--dds-calendar-cell-background-hover** - The background color of the calendar cell on hover (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-calendar-cell-background-active** - The background color of the calendar cell when active (default: var(--dds-background-neutral-strong)) _(default: undefined)_\n- **--dds-calendar-cell-selected-background** - The background color of the selected calendar cell (default: var(--dds-button-primary-background-enabled)) _(default: undefined)_\n- **--dds-calendar-cell-selected-color** - The text color of the selected calendar cell (default: var(--dds-button-primary-text-enabled)) _(default: undefined)_\n- **--dds-calendar-cell-selected-background-hover** - The background color of the selected calendar cell on hover (default: var(--dds-button-primary-background-hover)) _(default: undefined)_\n- **--dds-calendar-cell-selected-background-pressed** - The background color of the selected calendar cell when pressed (default: var(--dds-button-primary-background-pressed)) _(default: undefined)_\n- **--dds-calendar-cell-selected-today-mark-background** - The background color of the today mark in selected calendar cell (default: var(--dds-text-neutral-on-inverted)) _(default: undefined)_\n- **--dds-calendar-cell-disabled-color** - The text color of the disabled calendar cell (default: var(--dds-text-neutral-disabled)) _(default: undefined)_\n- **--dds-calendar-cell-disabled-cursor** - The cursor style of the disabled calendar cell (default: not-allowed) _(default: undefined)_\n- **--dds-calendar-cell-out-of-range-color** - The text color of the out-of-range calendar cell (default: var(--dds-text-neutral-placeholder)) _(default: undefined)_\n- **--dds-calendar-cell-today-font-weight** - The font weight of the today calendar cell (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-calendar-cell-header-background** - The background color of the header calendar cell (default: transparent) _(default: undefined)_\n- **--dds-calendar-cell-header-color** - The text color of the header calendar cell (default: var(--dds-text-neutral-base)) _(default: undefined)_\n- **--dds-calendar-cell-header-text-transform** - The text transform of the header calendar cell (default: capitalize) _(default: undefined)_\n- **--dds-calendar-cell-header-cursor** - The cursor style of the header calendar cell (default: default) _(default: undefined)_\n- **--dds-calendar-cell-in-range-color** - The text color of the in-range calendar cell (default: var(--dds-button-primary-text-enabled)) _(default: undefined)_\n- **--dds-calendar-cell-in-range-background-hover** - The background color of the in-range calendar cell on hover (default: var(--dds-button-primary-background-hover)) _(default: undefined)_\n- **--dds-calendar-cell-in-range-background-pressed** - The background color of the in-range calendar cell when pressed (default: var(--dds-button-primary-background-pressed)) _(default: undefined)_\n- **--dds-calendar-cell-range-background** - The background color of the range start/end calendar cell (default: var(--dds-button-primary-background-enabled)) _(default: undefined)_\n- **--dds-calendar-cell-range-color** - The text color of the range start/end calendar cell (default: var(--dds-button-primary-text-enabled)) _(default: undefined)_\n- **--dds-calendar-cell-range-today-mark-background** - The background color of the today mark in range start/end calendar cell (default: var(--dds-text-neutral-on-inverted)) _(default: undefined)_\n- **--dds-calendar-cell-today-mark-bottom** - The bottom position of the today mark (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-calendar-cell-today-mark-width** - The width of the today mark (default: 5px) _(default: undefined)_\n- **--dds-calendar-cell-today-mark-height** - The height of the today mark (default: 5px) _(default: undefined)_\n- **--dds-calendar-cell-today-mark-stroke** - The stroke color of the today mark (default: var(--dds-border-neutral-transparent)) _(default: undefined)_\n- **--dds-calendar-cell-today-mark-background** - The background color of the today mark (default: var(--dds-background-neutral-medium-inverted)) _(default: undefined)_\n- **--dds-calendar-cell-today-mark-fill** - The fill color of the today mark (default: var(--dds-background-neutral-medium-inverted)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main calendar cell container.\n- **today-mark** - The today mark of the calendar cell.",
@@ -1134,347 +1268,8 @@
1134
1268
  }
1135
1269
  },
1136
1270
  {
1137
- "name": "dap-ds-callout",
1138
- "description": "`dap-ds-callout` is a custom callout component.\n---\n\n\n### **Events:**\n - **dds-close** - Fired when the close button is clicked.\n\n### **Slots:**\n - _default_ - The content of the callout.\n- **title** - The title of the callout.\n- **icon** - The icon of the callout.\n- **actions** - The actions of the callout.\n- **close** - The close button of the callout.\n\n### **CSS Properties:**\n - **--dds-callout-padding** - Padding of the callout content. (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-callout-gap** - Gap between elements in horizontal layout. (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-callout-icon-size** - Size of the icon. (default: var(--dds-spacing-600)) _(default: undefined)_\n- **--dds-callout-title-color** - Color of the title text. (default: var(--dds-text-neutral-strong)) _(default: undefined)_\n- **--dds-callout-description-color** - Color of the description text. (default: var(--dds-text-neutral-base)) _(default: undefined)_\n- **--dds-callout-title-font-size** - Font size of the title. (default: var(--dds-font-base)) _(default: undefined)_\n- **--dds-callout-description-font-size** - Font size of the description. (default: var(--dds-font-base)) _(default: undefined)_\n- **--dds-callout-title-font-weight** - Font weight of the title. (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-callout-description-font-weight** - Font weight of the description. (default: var(--dds-font-weight-medium)) _(default: undefined)_\n- **--dds-callout-actions-font-weight** - Font weight of the actions. (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-callout-actions-gap** - Gap between action items. (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-callout-content-gap** - Gap between content elements. (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-callout-border-radius** - Border radius of the callout. (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-callout-brand-background** - Brand variant background color. (default: var(--dds-background-brand-base)) _(default: undefined)_\n- **--dds-callout-brand-background-subtle** - Brand variant subtle background color. (default: var(--dds-background-brand-subtle)) _(default: undefined)_\n- **--dds-callout-brand-background-medium** - Brand variant medium background color. (default: var(--dds-background-brand-medium)) _(default: undefined)_\n- **--dds-callout-brand-background-strong** - Brand variant strong background color. (default: var(--dds-background-brand-strong)) _(default: undefined)_\n- **--dds-callout-brand-icon** - Brand variant icon color. (default: var(--dds-icon-brand-subtle)) _(default: undefined)_\n- **--dds-callout-brand-border** - Brand variant border color. (default: var(--dds-border-brand-subtle)) _(default: undefined)_\n- **--dds-callout-info-background** - Info variant background color. (default: var(--dds-background-informative-base)) _(default: undefined)_\n- **--dds-callout-info-background-subtle** - Info variant subtle background color. (default: var(--dds-background-informative-subtle)) _(default: undefined)_\n- **--dds-callout-info-background-medium** - Info variant medium background color. (default: var(--dds-background-informative-medium)) _(default: undefined)_\n- **--dds-callout-info-background-strong** - Info variant strong background color. (default: var(--dds-background-informative-strong)) _(default: undefined)_\n- **--dds-callout-info-icon** - Info variant icon color. (default: var(--dds-icon-informative-subtle)) _(default: undefined)_\n- **--dds-callout-info-border** - Info variant border color. (default: var(--dds-border-informative-subtle)) _(default: undefined)_\n- **--dds-callout-positive-background** - Positive variant background color. (default: var(--dds-background-positive-base)) _(default: undefined)_\n- **--dds-callout-positive-background-subtle** - Positive variant subtle background color. (default: var(--dds-background-positive-subtle)) _(default: undefined)_\n- **--dds-callout-positive-background-medium** - Positive variant medium background color. (default: var(--dds-background-positive-medium)) _(default: undefined)_\n- **--dds-callout-positive-background-strong** - Positive variant strong background color. (default: var(--dds-background-positive-strong)) _(default: undefined)_\n- **--dds-callout-positive-icon** - Positive variant icon color. (default: var(--dds-icon-positive-subtle)) _(default: undefined)_\n- **--dds-callout-positive-border** - Positive variant border color. (default: var(--dds-border-positive-subtle)) _(default: undefined)_\n- **--dds-callout-warning-background** - Warning variant background color. (default: var(--dds-background-warning-base)) _(default: undefined)_\n- **--dds-callout-warning-background-subtle** - Warning variant subtle background color. (default: var(--dds-background-warning-subtle)) _(default: undefined)_\n- **--dds-callout-warning-background-medium** - Warning variant medium background color. (default: var(--dds-background-warning-medium)) _(default: undefined)_\n- **--dds-callout-warning-background-strong** - Warning variant strong background color. (default: var(--dds-background-warning-strong)) _(default: undefined)_\n- **--dds-callout-warning-icon** - Warning variant icon color. (default: var(--dds-icon-neutral-strong)) _(default: undefined)_\n- **--dds-callout-warning-border** - Warning variant border color. (default: var(--dds-border-warning-subtle)) _(default: undefined)_\n- **--dds-callout-negative-background** - Negative variant background color. (default: var(--dds-background-negative-base)) _(default: undefined)_\n- **--dds-callout-negative-background-subtle** - Negative variant subtle background color. (default: var(--dds-background-negative-subtle)) _(default: undefined)_\n- **--dds-callout-negative-background-medium** - Negative variant medium background color. (default: var(--dds-background-negative-medium)) _(default: undefined)_\n- **--dds-callout-negative-background-strong** - Negative variant strong background color. (default: var(--dds-background-negative-strong)) _(default: undefined)_\n- **--dds-callout-negative-icon** - Negative variant icon color. (default: var(--dds-icon-negative-subtle)) _(default: undefined)_\n- **--dds-callout-negative-border** - Negative variant border color. (default: var(--dds-border-negative-subtle)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main callout container.\n- **content** - The content of the callout.\n- **card-content** - The content of the card.\n- **icon** - The icon of the callout.\n- **title** - The title of the callout.\n- **description** - The description of the callout.\n- **actions** - The actions of the callout.\n- **close** - The close button of the callout.",
1139
- "doc-url": "",
1140
- "attributes": [
1141
- {
1142
- "name": "variant",
1143
- "description": "The variant of the callout",
1144
- "value": {
1145
- "type": "'brand' | 'positive' | 'info' | 'warning' | 'negative'",
1146
- "default": "'brand'"
1147
- }
1148
- },
1149
- {
1150
- "name": "alignment",
1151
- "description": "The alignment of the callout. Can be `vertical` or `horizontal`.",
1152
- "value": {
1153
- "type": "'vertical' | 'horizontal'",
1154
- "default": "'horizontal'"
1155
- }
1156
- },
1157
- {
1158
- "name": "shade",
1159
- "description": "The strongness of the callout colors. Can be `subtle`, `base`, `medium`, or `strong`.",
1160
- "value": {
1161
- "type": "'subtle' | 'base' | 'medium' | 'strong'",
1162
- "default": "'base'"
1163
- }
1164
- },
1165
- {
1166
- "name": "noBorder",
1167
- "description": "If the callout has a border",
1168
- "value": { "type": "string", "default": "'true'" }
1169
- },
1170
- {
1171
- "name": "closeable",
1172
- "description": "If the callout has a close button",
1173
- "value": { "type": "boolean", "default": "false" }
1174
- },
1175
- {
1176
- "name": "title",
1177
- "description": "The header of the callout",
1178
- "value": { "type": "string" }
1179
- },
1180
- {
1181
- "name": "closeButtonLabel",
1182
- "description": "The label of the close button",
1183
- "value": { "type": "string" }
1184
- },
1185
- {
1186
- "name": "closeButtonTestId",
1187
- "description": "`data-testid` for the default close button.",
1188
- "value": { "type": "string", "default": "'callout-close-button'" }
1189
- },
1190
- {
1191
- "name": "opened",
1192
- "description": "If the callout is opened",
1193
- "value": { "type": "string", "default": "'true'" }
1194
- }
1195
- ],
1196
- "slots": [
1197
- { "name": "", "description": "The content of the callout." },
1198
- { "name": "title", "description": "The title of the callout." },
1199
- { "name": "icon", "description": "The icon of the callout." },
1200
- { "name": "actions", "description": "The actions of the callout." },
1201
- {
1202
- "name": "close",
1203
- "description": "The close button of the callout."
1204
- }
1205
- ],
1206
- "events": [
1207
- {
1208
- "name": "dds-close",
1209
- "type": "{ void }",
1210
- "description": "Fired when the close button is clicked."
1211
- }
1212
- ],
1213
- "js": {
1214
- "properties": [
1215
- {
1216
- "name": "variant",
1217
- "description": "The variant of the callout",
1218
- "type": "'brand' | 'positive' | 'info' | 'warning' | 'negative'"
1219
- },
1220
- {
1221
- "name": "alignment",
1222
- "description": "The alignment of the callout. Can be `vertical` or `horizontal`.",
1223
- "type": "'vertical' | 'horizontal'"
1224
- },
1225
- {
1226
- "name": "shade",
1227
- "description": "The strongness of the callout colors. Can be `subtle`, `base`, `medium`, or `strong`.",
1228
- "type": "'subtle' | 'base' | 'medium' | 'strong'"
1229
- },
1230
- {
1231
- "name": "noBorder",
1232
- "description": "If the callout has a border",
1233
- "type": "string"
1234
- },
1235
- {
1236
- "name": "closeable",
1237
- "description": "If the callout has a close button",
1238
- "type": "boolean"
1239
- },
1240
- {
1241
- "name": "title",
1242
- "description": "The header of the callout",
1243
- "type": "string"
1244
- },
1245
- {
1246
- "name": "closeButtonLabel",
1247
- "description": "The label of the close button",
1248
- "type": "string"
1249
- },
1250
- {
1251
- "name": "closeButtonTestId",
1252
- "description": "`data-testid` for the default close button.",
1253
- "type": "string"
1254
- },
1255
- {
1256
- "name": "opened",
1257
- "description": "If the callout is opened",
1258
- "type": "string"
1259
- }
1260
- ],
1261
- "events": [
1262
- {
1263
- "name": "dds-close",
1264
- "type": "{ void }",
1265
- "description": "Fired when the close button is clicked."
1266
- }
1267
- ]
1268
- }
1269
- },
1270
- {
1271
- "name": "dap-ds-checkbox",
1272
- "description": "A checkbox is a form element that allows the user to select one or more options from a set.\n---\n\n\n### **Events:**\n - **dds-change** - Fired when the checkbox is checked or unchecked.\n- **dds-blur** - Emitted when the checkbox loses focus.\n- **dds-focus** - Emitted when the checkbox gains focus.\n- **dds-input** - Emitted when the checkbox receives input.\n\n### **Methods:**\n - **focus(): _void_** - Programmatically focuses the checkbox input element.\n- **blur(): _void_** - Programmatically blurs the checkbox input element.\n\n### **CSS Properties:**\n - **--dds-checkbox-size** - The size of the checkbox. (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-checkbox-border-width** - The border width of the checkbox. (default: var(--dds-border-width-large)) _(default: undefined)_\n- **--dds-checkbox-border-radius** - The border radius of the checkbox. (default: var(--dds-radius-small)) _(default: undefined)_\n- **--dds-checkbox-border-color** - The border color of the checkbox. (default: var(--dds-border-neutral-base)) _(default: undefined)_\n- **--dds-checkbox-background-color** - The background color of the checkbox. (default: transparent) _(default: undefined)_\n- **--dds-checkbox-icon-color** - The color of the checkbox icon. (default: var(--dds-button-primary-icon-enabled)) _(default: undefined)_\n- **--dds-checkbox-hover-border-color** - The border color when hovering over the checkbox. (default: var(--dds-border-neutral-medium)) _(default: undefined)_\n- **--dds-checkbox-hover-background-color** - The background color when hovering over the checkbox. (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-checkbox-active-border-color** - The border color when the checkbox is active. (default: var(--dds-border-neutral-strong)) _(default: undefined)_\n- **--dds-checkbox-active-background-color** - The background color when the checkbox is active. (default: var(--dds-background-neutral-strong)) _(default: undefined)_\n- **--dds-checkbox-checked-border-color** - The border color when the checkbox is checked. (default: var(--dds-background-brand-base-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-background-color** - The background color when the checkbox is checked. (default: var(--dds-background-brand-base-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-hover-border-color** - The border color when hovering over a checked checkbox. (default: var(--dds-background-brand-medium-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-hover-background-color** - The background color when hovering over a checked checkbox. (default: var(--dds-background-brand-medium-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-active-border-color** - The border color when a checked checkbox is active. (default: var(--dds-background-brand-strong-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-active-background-color** - The background color when a checked checkbox is active. (default: var(--dds-background-brand-strong-inverted)) _(default: undefined)_\n- **--dds-checkbox-invalid-border-color** - The border color when the checkbox is invalid. (default: var(--dds-border-negative-base)) _(default: undefined)_\n- **--dds-checkbox-invalid-background-color** - The background color when the checkbox is invalid. (default: var(--dds-background-negative-base)) _(default: undefined)_\n- **--dds-checkbox-invalid-hover-border-color** - The border color when hovering over an invalid checkbox. (default: var(--dds-border-negative-medium)) _(default: undefined)_\n- **--dds-checkbox-invalid-hover-background-color** - The background color when hovering over an invalid checkbox. (default: var(--dds-background-negative-medium)) _(default: undefined)_\n- **--dds-checkbox-invalid-active-border-color** - The border color when an invalid checkbox is active. (default: var(--dds-border-negative-strong)) _(default: undefined)_\n- **--dds-checkbox-invalid-active-background-color** - The background color when an invalid checkbox is active. (default: var(--dds-background-negative-strong)) _(default: undefined)_\n- **--dds-checkbox-disabled-border-color** - The border color when the checkbox is disabled. (default: var(--dds-button-primary-background-disabled)) _(default: undefined)_\n- **--dds-checkbox-disabled-background-color** - The background color when the checkbox is disabled. (default: var(--dds-button-primary-background-disabled)) _(default: undefined)_\n- **--dds-checkbox-disabled-icon-color** - The color of the checkbox icon when disabled. (default: var(--dds-button-primary-icon-disabled)) _(default: undefined)_\n- **--dds-checkbox-readonly-border-color** - The border color when the checkbox is readonly. (default: var(--dds-border-neutral-subtle)) _(default: undefined)_\n- **--dds-checkbox-readonly-background-color** - The background color when the checkbox is readonly. (default: var(--dds-background-neutral-subtle)) _(default: undefined)_\n- **--dds-checkbox-readonly-icon-color** - The color of the checkbox icon when readonly. (default: var(--dds-text-neutral-base)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main checkbox container.\n- **label** - The label of the checkbox.\n- **input** - The input of the checkbox.\n- **control** - The control of the checkbox.\n- **icon** - The icon of the checkbox.\n- **icon-base** - The base icon container.\n- **label-container** - The label container of the checkbox.\n- **description** - The description of the checkbox.\n- **readonly** - The readonly state of the checkbox.",
1273
- "doc-url": "",
1274
- "attributes": [
1275
- {
1276
- "name": "indeterminate",
1277
- "description": "Whether the checkbox is indeterminate",
1278
- "value": { "type": "boolean", "default": "false" }
1279
- },
1280
- {
1281
- "name": "preventDefault",
1282
- "description": "Whether the checkbox should prevent the default action",
1283
- "value": { "type": "boolean", "default": "false" }
1284
- },
1285
- {
1286
- "name": "border",
1287
- "description": "This sets up border around the checkbox, when true.",
1288
- "value": { "type": "boolean", "default": "false" }
1289
- },
1290
- {
1291
- "name": "readonly",
1292
- "description": "Whether the checkbox is readonly (cannot be changed but value is submitted with form).",
1293
- "value": { "type": "boolean", "default": "false" }
1294
- },
1295
- {
1296
- "name": "type",
1297
- "description": "The type of the checkbox",
1298
- "value": {
1299
- "type": "'normal' | 'background'",
1300
- "default": "'normal'"
1301
- }
1302
- }
1303
- ],
1304
- "events": [
1305
- {
1306
- "name": "dds-change",
1307
- "type": "{ checked: boolean, indeterminate: boolean, value: string, disabled: boolean, readonly: boolean, type: 'checkbox' }",
1308
- "description": "Fired when the checkbox is checked or unchecked."
1309
- },
1310
- {
1311
- "name": "dds-blur",
1312
- "type": "{ void }",
1313
- "description": "Emitted when the checkbox loses focus."
1314
- },
1315
- {
1316
- "name": "dds-focus",
1317
- "type": "{ void }",
1318
- "description": "Emitted when the checkbox gains focus."
1319
- },
1320
- {
1321
- "name": "dds-input",
1322
- "type": "{ checked: boolean, indeterminate: boolean, value: string, disabled: boolean, readonly: boolean }",
1323
- "description": "Emitted when the checkbox receives input."
1324
- }
1325
- ],
1326
- "js": {
1327
- "properties": [
1328
- {
1329
- "name": "indeterminate",
1330
- "description": "Whether the checkbox is indeterminate",
1331
- "type": "boolean"
1332
- },
1333
- {
1334
- "name": "preventDefault",
1335
- "description": "Whether the checkbox should prevent the default action",
1336
- "type": "boolean"
1337
- },
1338
- {
1339
- "name": "border",
1340
- "description": "This sets up border around the checkbox, when true.",
1341
- "type": "boolean"
1342
- },
1343
- {
1344
- "name": "readonly",
1345
- "description": "Whether the checkbox is readonly (cannot be changed but value is submitted with form).",
1346
- "type": "boolean"
1347
- },
1348
- {
1349
- "name": "type",
1350
- "description": "The type of the checkbox",
1351
- "type": "'normal' | 'background'"
1352
- },
1353
- { "name": "focusElement", "type": "HTMLInputElement" },
1354
- { "name": "feedbackId" },
1355
- {
1356
- "name": "name",
1357
- "description": "The name of the checkbox.",
1358
- "type": "string"
1359
- },
1360
- {
1361
- "name": "value",
1362
- "description": "The value of the checkbox.",
1363
- "type": "string"
1364
- },
1365
- {
1366
- "name": "checked",
1367
- "description": "Whether the checkbox is checked.",
1368
- "type": "boolean"
1369
- },
1370
- {
1371
- "name": "label",
1372
- "description": "The label of the checkbox.",
1373
- "type": "string"
1374
- },
1375
- {
1376
- "name": "hideLabel",
1377
- "description": "Visually hides the label while keeping it available to assistive technology. (default: false)",
1378
- "type": "boolean"
1379
- },
1380
- {
1381
- "name": "description",
1382
- "description": "The description of the checkbox.",
1383
- "type": "string"
1384
- },
1385
- {
1386
- "name": "disabled",
1387
- "description": "Whether the checkbox is disabled.",
1388
- "type": "boolean"
1389
- },
1390
- {
1391
- "name": "required",
1392
- "description": "Whether the checkbox is required.",
1393
- "type": "boolean"
1394
- },
1395
- {
1396
- "name": "size",
1397
- "description": "The size of the checkbox. Default is 'sm'.",
1398
- "type": "'xs' | 'sm' | 'lg'"
1399
- },
1400
- {
1401
- "name": "sizeMap",
1402
- "description": "Responsive size map (e.g. \"md:lg\").",
1403
- "type": "string"
1404
- },
1405
- {
1406
- "name": "labelPlacement",
1407
- "description": "The placement of the label.",
1408
- "type": "'left' | 'right'"
1409
- },
1410
- {
1411
- "name": "descriptionPlacement",
1412
- "description": "The placement of the description.",
1413
- "type": "'top' | 'bottom'"
1414
- },
1415
- {
1416
- "name": "subtle",
1417
- "description": "The weight of the label.",
1418
- "type": "boolean"
1419
- },
1420
- {
1421
- "name": "feedback",
1422
- "description": "The feedback of the checkbox.",
1423
- "type": "string"
1424
- },
1425
- {
1426
- "name": "feedbackType",
1427
- "description": "The feedback type of the checkbox.",
1428
- "type": "'negative' | 'positive' | 'warning'"
1429
- },
1430
- {
1431
- "name": "invalid",
1432
- "description": "The invalid state of the checkbox.",
1433
- "type": "boolean"
1434
- },
1435
- {
1436
- "name": "optional",
1437
- "description": "The optional state of the checkbox.",
1438
- "type": "boolean"
1439
- },
1440
- {
1441
- "name": "optionalLabel",
1442
- "description": "The optional label of the checkbox.",
1443
- "type": "string"
1444
- },
1445
- {
1446
- "name": "requiredLabel",
1447
- "description": "The required indicator of the checkbox. (default: '*')",
1448
- "type": "string"
1449
- }
1450
- ],
1451
- "events": [
1452
- {
1453
- "name": "dds-change",
1454
- "type": "{ checked: boolean, indeterminate: boolean, value: string, disabled: boolean, readonly: boolean, type: 'checkbox' }",
1455
- "description": "Fired when the checkbox is checked or unchecked."
1456
- },
1457
- {
1458
- "name": "dds-blur",
1459
- "type": "{ void }",
1460
- "description": "Emitted when the checkbox loses focus."
1461
- },
1462
- {
1463
- "name": "dds-focus",
1464
- "type": "{ void }",
1465
- "description": "Emitted when the checkbox gains focus."
1466
- },
1467
- {
1468
- "name": "dds-input",
1469
- "type": "{ checked: boolean, indeterminate: boolean, value: string, disabled: boolean, readonly: boolean }",
1470
- "description": "Emitted when the checkbox receives input."
1471
- }
1472
- ]
1473
- }
1474
- },
1475
- {
1476
- "name": "dap-ds-card-actions",
1477
- "description": "A card actions is a container for actions in a card.\n---\n\n\n### **Slots:**\n - _default_ - The content of the card actions.\n\n### **CSS Properties:**\n - **--dds-card-actions-gap** - The gap between items in the card actions. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-card-actions-padding-lg** - The padding for large size card actions. (default: var(--dds-spacing-600)) _(default: undefined)_\n- **--dds-card-actions-padding-md** - The padding for medium size card actions. (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-card-actions-padding-sm** - The padding for small size card actions. (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-card-actions-margin-lg** - The margin for large size card actions spacing. (default: var(--dds-spacing-600)) _(default: undefined)_\n- **--dds-card-actions-margin-md** - The margin for medium size card actions spacing. (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-card-actions-margin-sm** - The margin for small size card actions spacing. (default: var(--dds-spacing-400)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main card actions container.",
1271
+ "name": "dap-ds-card-actions",
1272
+ "description": "A card actions is a container for actions in a card.\n---\n\n\n### **Slots:**\n - _default_ - The content of the card actions.\n\n### **CSS Properties:**\n - **--dds-card-actions-gap** - The gap between items in the card actions. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-card-actions-padding-lg** - The padding for large size card actions. (default: var(--dds-spacing-600)) _(default: undefined)_\n- **--dds-card-actions-padding-md** - The padding for medium size card actions. (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-card-actions-padding-sm** - The padding for small size card actions. (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-card-actions-margin-lg** - The margin for large size card actions spacing. (default: var(--dds-spacing-600)) _(default: undefined)_\n- **--dds-card-actions-margin-md** - The margin for medium size card actions spacing. (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-card-actions-margin-sm** - The margin for small size card actions spacing. (default: var(--dds-spacing-400)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main card actions container.",
1478
1273
  "doc-url": "",
1479
1274
  "attributes": [],
1480
1275
  "slots": [
@@ -1770,42 +1565,247 @@
1770
1565
  "type": "boolean"
1771
1566
  },
1772
1567
  {
1773
- "name": "noPadding",
1774
- "description": "Removes the padding around the card",
1568
+ "name": "noPadding",
1569
+ "description": "Removes the padding around the card",
1570
+ "type": "boolean"
1571
+ },
1572
+ {
1573
+ "name": "targetBlankText",
1574
+ "description": "The text for the target blank link, applicable when target is _blank. PRO TIP: Use parenthesis to wrap the text",
1575
+ "type": "string"
1576
+ },
1577
+ {
1578
+ "name": "target",
1579
+ "description": "The link target of the card",
1580
+ "type": "'_blank' | '_self' | '_parent' | '_top'"
1581
+ },
1582
+ {
1583
+ "name": "href",
1584
+ "description": "The URL of the card.",
1585
+ "type": "string"
1586
+ },
1587
+ {
1588
+ "name": "rel",
1589
+ "description": "The rel of the card link.",
1590
+ "type": "string"
1591
+ },
1592
+ {
1593
+ "name": "size",
1594
+ "description": "The size of the card. Default is `sm`.",
1595
+ "type": "'sm' | 'md' | 'lg'"
1596
+ },
1597
+ {
1598
+ "name": "sizeMap",
1599
+ "description": "Responsive size map (e.g. \"md:lg\").",
1600
+ "type": "string"
1601
+ }
1602
+ ],
1603
+ "events": []
1604
+ }
1605
+ },
1606
+ {
1607
+ "name": "dap-ds-checkbox",
1608
+ "description": "A checkbox is a form element that allows the user to select one or more options from a set.\n---\n\n\n### **Events:**\n - **dds-change** - Fired when the checkbox is checked or unchecked.\n- **dds-blur** - Emitted when the checkbox loses focus.\n- **dds-focus** - Emitted when the checkbox gains focus.\n- **dds-input** - Emitted when the checkbox receives input.\n\n### **Methods:**\n - **focus(): _void_** - Programmatically focuses the checkbox input element.\n- **blur(): _void_** - Programmatically blurs the checkbox input element.\n\n### **CSS Properties:**\n - **--dds-checkbox-size** - The size of the checkbox. (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-checkbox-border-width** - The border width of the checkbox. (default: var(--dds-border-width-large)) _(default: undefined)_\n- **--dds-checkbox-border-radius** - The border radius of the checkbox. (default: var(--dds-radius-small)) _(default: undefined)_\n- **--dds-checkbox-border-color** - The border color of the checkbox. (default: var(--dds-border-neutral-base)) _(default: undefined)_\n- **--dds-checkbox-background-color** - The background color of the checkbox. (default: transparent) _(default: undefined)_\n- **--dds-checkbox-icon-color** - The color of the checkbox icon. (default: var(--dds-button-primary-icon-enabled)) _(default: undefined)_\n- **--dds-checkbox-hover-border-color** - The border color when hovering over the checkbox. (default: var(--dds-border-neutral-medium)) _(default: undefined)_\n- **--dds-checkbox-hover-background-color** - The background color when hovering over the checkbox. (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-checkbox-active-border-color** - The border color when the checkbox is active. (default: var(--dds-border-neutral-strong)) _(default: undefined)_\n- **--dds-checkbox-active-background-color** - The background color when the checkbox is active. (default: var(--dds-background-neutral-strong)) _(default: undefined)_\n- **--dds-checkbox-checked-border-color** - The border color when the checkbox is checked. (default: var(--dds-background-brand-base-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-background-color** - The background color when the checkbox is checked. (default: var(--dds-background-brand-base-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-hover-border-color** - The border color when hovering over a checked checkbox. (default: var(--dds-background-brand-medium-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-hover-background-color** - The background color when hovering over a checked checkbox. (default: var(--dds-background-brand-medium-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-active-border-color** - The border color when a checked checkbox is active. (default: var(--dds-background-brand-strong-inverted)) _(default: undefined)_\n- **--dds-checkbox-checked-active-background-color** - The background color when a checked checkbox is active. (default: var(--dds-background-brand-strong-inverted)) _(default: undefined)_\n- **--dds-checkbox-invalid-border-color** - The border color when the checkbox is invalid. (default: var(--dds-border-negative-base)) _(default: undefined)_\n- **--dds-checkbox-invalid-background-color** - The background color when the checkbox is invalid. (default: var(--dds-background-negative-base)) _(default: undefined)_\n- **--dds-checkbox-invalid-hover-border-color** - The border color when hovering over an invalid checkbox. (default: var(--dds-border-negative-medium)) _(default: undefined)_\n- **--dds-checkbox-invalid-hover-background-color** - The background color when hovering over an invalid checkbox. (default: var(--dds-background-negative-medium)) _(default: undefined)_\n- **--dds-checkbox-invalid-active-border-color** - The border color when an invalid checkbox is active. (default: var(--dds-border-negative-strong)) _(default: undefined)_\n- **--dds-checkbox-invalid-active-background-color** - The background color when an invalid checkbox is active. (default: var(--dds-background-negative-strong)) _(default: undefined)_\n- **--dds-checkbox-disabled-border-color** - The border color when the checkbox is disabled. (default: var(--dds-button-primary-background-disabled)) _(default: undefined)_\n- **--dds-checkbox-disabled-background-color** - The background color when the checkbox is disabled. (default: var(--dds-button-primary-background-disabled)) _(default: undefined)_\n- **--dds-checkbox-disabled-icon-color** - The color of the checkbox icon when disabled. (default: var(--dds-button-primary-icon-disabled)) _(default: undefined)_\n- **--dds-checkbox-readonly-border-color** - The border color when the checkbox is readonly. (default: var(--dds-border-neutral-subtle)) _(default: undefined)_\n- **--dds-checkbox-readonly-background-color** - The background color when the checkbox is readonly. (default: var(--dds-background-neutral-subtle)) _(default: undefined)_\n- **--dds-checkbox-readonly-icon-color** - The color of the checkbox icon when readonly. (default: var(--dds-text-neutral-base)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main checkbox container.\n- **label** - The label of the checkbox.\n- **input** - The input of the checkbox.\n- **control** - The control of the checkbox.\n- **icon** - The icon of the checkbox.\n- **icon-base** - The base icon container.\n- **label-container** - The label container of the checkbox.\n- **description** - The description of the checkbox.\n- **readonly** - The readonly state of the checkbox.",
1609
+ "doc-url": "",
1610
+ "attributes": [
1611
+ {
1612
+ "name": "indeterminate",
1613
+ "description": "Whether the checkbox is indeterminate",
1614
+ "value": { "type": "boolean", "default": "false" }
1615
+ },
1616
+ {
1617
+ "name": "preventDefault",
1618
+ "description": "Whether the checkbox should prevent the default action",
1619
+ "value": { "type": "boolean", "default": "false" }
1620
+ },
1621
+ {
1622
+ "name": "border",
1623
+ "description": "This sets up border around the checkbox, when true.",
1624
+ "value": { "type": "boolean", "default": "false" }
1625
+ },
1626
+ {
1627
+ "name": "readonly",
1628
+ "description": "Whether the checkbox is readonly (cannot be changed but value is submitted with form).",
1629
+ "value": { "type": "boolean", "default": "false" }
1630
+ },
1631
+ {
1632
+ "name": "type",
1633
+ "description": "The type of the checkbox",
1634
+ "value": {
1635
+ "type": "'normal' | 'background'",
1636
+ "default": "'normal'"
1637
+ }
1638
+ }
1639
+ ],
1640
+ "events": [
1641
+ {
1642
+ "name": "dds-change",
1643
+ "type": "{ checked: boolean, indeterminate: boolean, value: string, disabled: boolean, readonly: boolean, type: 'checkbox' }",
1644
+ "description": "Fired when the checkbox is checked or unchecked."
1645
+ },
1646
+ {
1647
+ "name": "dds-blur",
1648
+ "type": "{ void }",
1649
+ "description": "Emitted when the checkbox loses focus."
1650
+ },
1651
+ {
1652
+ "name": "dds-focus",
1653
+ "type": "{ void }",
1654
+ "description": "Emitted when the checkbox gains focus."
1655
+ },
1656
+ {
1657
+ "name": "dds-input",
1658
+ "type": "{ checked: boolean, indeterminate: boolean, value: string, disabled: boolean, readonly: boolean }",
1659
+ "description": "Emitted when the checkbox receives input."
1660
+ }
1661
+ ],
1662
+ "js": {
1663
+ "properties": [
1664
+ {
1665
+ "name": "indeterminate",
1666
+ "description": "Whether the checkbox is indeterminate",
1667
+ "type": "boolean"
1668
+ },
1669
+ {
1670
+ "name": "preventDefault",
1671
+ "description": "Whether the checkbox should prevent the default action",
1672
+ "type": "boolean"
1673
+ },
1674
+ {
1675
+ "name": "border",
1676
+ "description": "This sets up border around the checkbox, when true.",
1677
+ "type": "boolean"
1678
+ },
1679
+ {
1680
+ "name": "readonly",
1681
+ "description": "Whether the checkbox is readonly (cannot be changed but value is submitted with form).",
1682
+ "type": "boolean"
1683
+ },
1684
+ {
1685
+ "name": "type",
1686
+ "description": "The type of the checkbox",
1687
+ "type": "'normal' | 'background'"
1688
+ },
1689
+ { "name": "focusElement", "type": "HTMLInputElement" },
1690
+ { "name": "feedbackId" },
1691
+ {
1692
+ "name": "name",
1693
+ "description": "The name of the checkbox.",
1694
+ "type": "string"
1695
+ },
1696
+ {
1697
+ "name": "value",
1698
+ "description": "The value of the checkbox.",
1699
+ "type": "string"
1700
+ },
1701
+ {
1702
+ "name": "checked",
1703
+ "description": "Whether the checkbox is checked.",
1704
+ "type": "boolean"
1705
+ },
1706
+ {
1707
+ "name": "label",
1708
+ "description": "The label of the checkbox.",
1709
+ "type": "string"
1710
+ },
1711
+ {
1712
+ "name": "hideLabel",
1713
+ "description": "Visually hides the label while keeping it available to assistive technology. (default: false)",
1714
+ "type": "boolean"
1715
+ },
1716
+ {
1717
+ "name": "description",
1718
+ "description": "The description of the checkbox.",
1719
+ "type": "string"
1720
+ },
1721
+ {
1722
+ "name": "disabled",
1723
+ "description": "Whether the checkbox is disabled.",
1724
+ "type": "boolean"
1725
+ },
1726
+ {
1727
+ "name": "required",
1728
+ "description": "Whether the checkbox is required.",
1729
+ "type": "boolean"
1730
+ },
1731
+ {
1732
+ "name": "size",
1733
+ "description": "The size of the checkbox. Default is 'sm'.",
1734
+ "type": "'xs' | 'sm' | 'lg'"
1735
+ },
1736
+ {
1737
+ "name": "sizeMap",
1738
+ "description": "Responsive size map (e.g. \"md:lg\").",
1739
+ "type": "string"
1740
+ },
1741
+ {
1742
+ "name": "labelPlacement",
1743
+ "description": "The placement of the label.",
1744
+ "type": "'left' | 'right'"
1745
+ },
1746
+ {
1747
+ "name": "descriptionPlacement",
1748
+ "description": "The placement of the description.",
1749
+ "type": "'top' | 'bottom'"
1750
+ },
1751
+ {
1752
+ "name": "subtle",
1753
+ "description": "The weight of the label.",
1754
+ "type": "boolean"
1755
+ },
1756
+ {
1757
+ "name": "feedback",
1758
+ "description": "The feedback of the checkbox.",
1759
+ "type": "string"
1760
+ },
1761
+ {
1762
+ "name": "feedbackType",
1763
+ "description": "The feedback type of the checkbox.",
1764
+ "type": "'negative' | 'positive' | 'warning'"
1765
+ },
1766
+ {
1767
+ "name": "invalid",
1768
+ "description": "The invalid state of the checkbox.",
1769
+ "type": "boolean"
1770
+ },
1771
+ {
1772
+ "name": "optional",
1773
+ "description": "The optional state of the checkbox.",
1775
1774
  "type": "boolean"
1776
1775
  },
1777
1776
  {
1778
- "name": "targetBlankText",
1779
- "description": "The text for the target blank link, applicable when target is _blank. PRO TIP: Use parenthesis to wrap the text",
1777
+ "name": "optionalLabel",
1778
+ "description": "The optional label of the checkbox.",
1780
1779
  "type": "string"
1781
1780
  },
1782
1781
  {
1783
- "name": "target",
1784
- "description": "The link target of the card",
1785
- "type": "'_blank' | '_self' | '_parent' | '_top'"
1786
- },
1787
- {
1788
- "name": "href",
1789
- "description": "The URL of the card.",
1782
+ "name": "requiredLabel",
1783
+ "description": "The required indicator of the checkbox. (default: '*')",
1790
1784
  "type": "string"
1785
+ }
1786
+ ],
1787
+ "events": [
1788
+ {
1789
+ "name": "dds-change",
1790
+ "type": "{ checked: boolean, indeterminate: boolean, value: string, disabled: boolean, readonly: boolean, type: 'checkbox' }",
1791
+ "description": "Fired when the checkbox is checked or unchecked."
1791
1792
  },
1792
1793
  {
1793
- "name": "rel",
1794
- "description": "The rel of the card link.",
1795
- "type": "string"
1794
+ "name": "dds-blur",
1795
+ "type": "{ void }",
1796
+ "description": "Emitted when the checkbox loses focus."
1796
1797
  },
1797
1798
  {
1798
- "name": "size",
1799
- "description": "The size of the card. Default is `sm`.",
1800
- "type": "'sm' | 'md' | 'lg'"
1799
+ "name": "dds-focus",
1800
+ "type": "{ void }",
1801
+ "description": "Emitted when the checkbox gains focus."
1801
1802
  },
1802
1803
  {
1803
- "name": "sizeMap",
1804
- "description": "Responsive size map (e.g. \"md:lg\").",
1805
- "type": "string"
1804
+ "name": "dds-input",
1805
+ "type": "{ checked: boolean, indeterminate: boolean, value: string, disabled: boolean, readonly: boolean }",
1806
+ "description": "Emitted when the checkbox receives input."
1806
1807
  }
1807
- ],
1808
- "events": []
1808
+ ]
1809
1809
  }
1810
1810
  },
1811
1811
  {
@@ -2993,7 +2993,7 @@
2993
2993
  },
2994
2994
  {
2995
2995
  "name": "dap-ds-datatable",
2996
- "description": "A data table is a component that displays data in a tabular format.\n---\n\n\n### **Events:**\n - **dds-sorting-change** - Fired when the sorting of the table changes.\n- **dds-selection-change** - Fired when the selection of the table changes.\n- **dds-pagination-change** - Fired when the pagination of the table changes.\n- **dds-row-click** - Fired when a row is clicked.\n\n### **Slots:**\n - **loading** - The loading content of the table.\n- **empty** - The empty content of the table.\n\n### **CSS Properties:**\n - **--dds-datatable-bg-color** - Background color of the table. (default: var(--dds-background-neutral-subtle)). _(default: undefined)_\n- **--dds-datatable-border-color** - Border color of the table cells. (default: var(--dds-border-neutral-divider)) _(default: undefined)_\n- **--dds-datatable-header-bg-color** - Background color of the table header. (default: var(--dds-background-neutral-subtle)) _(default: undefined)_\n- **--dds-datatable-header-text-color** - Text color of the table header. (default: var(--dds-text-neutral-strong)) _(default: undefined)_\n- **--dds-datatable-row-hover-bg-color** - Background color of hovered rows. (default: var(--dds-background-brand-strong)) _(default: undefined)_\n- **--dds-datatable-row-selected-bg-color** - Background color of selected rows. (default: var(--dds-background-brand-strong)) _(default: undefined)_\n- **--dds-datatable-cell-padding** - Padding of table cells. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-datatable-header-padding** - Padding of header cells. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-datatable-last-column-padding** - Padding of the last column. (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-datatable-first-column-padding** - Padding of the first column. (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-datatable-border-width** - Width of table borders. (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-datatable-stripe-color** - Background color for striped rows. (default: var(--dds-background-neutral-base)) _(default: undefined)_\n- **--dds-datatable-border-radius** - Border radius of the table. (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-datatable-shadow** - Box shadow of the table. (default: none) _(default: undefined)_\n- **--dds-datatable-transition-duration** - Duration of hover/selection transitions. (default: 0.2s) _(default: undefined)_\n- **--dds-datatable-z-index** - Z-index of the table. (default: 1) _(default: undefined)_\n- **--dds-datatable-min-height** - Minimum height of the table. (default: auto) _(default: undefined)_\n- **--dds-datatable-max-height** - Maximum height of the table. (default: none) _(default: undefined)_\n- **--dds-datatable-overflow-x** - Horizontal overflow behavior. (default: auto) _(default: undefined)_\n- **--dds-datatable-overflow-y** - Vertical overflow behavior. (default: auto) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main table container.\n- **header** - The header of the table.\n- **header-row** - The header row of the table.\n- **header-cell** - All cells of the header.\n- **body** - The body of the table.\n- **empty** - The empty content of the table.\n- **loading** - The loading content of the table.\n- **row** - All rows of the table.\n- **cell** - All cells of the table.\n- **pager** - The pager of the table.\n- **pager-base** - The base of the pager.\n- **pager-first** - The first button of the pager.\n- **pager-previous** - The previous button of the pager.\n- **pager-next** - The next button of the pager.\n- **pager-last** - The last button of the pager.\n- **pager-page-size-select** - The page size select of the pager.",
2996
+ "description": "A data table is a component that displays data in a tabular format.\n---\n\n\n### **Events:**\n - **dds-sorting-change** - Fired when the sorting of the table changes.\n- **dds-selection-change** - Fired when the selection of the table changes.\n- **dds-pagination-change** - Fired when the pagination of the table changes.\n- **dds-row-click** - Fired when a row is clicked.\n\n### **Slots:**\n - **loading** - The loading content of the table.\n- **empty** - The empty content of the table.\n\n### **CSS Properties:**\n - **--dds-datatable-bg-color** - Background color of the table. (default: var(--dds-background-neutral-subtle)). _(default: undefined)_\n- **--dds-datatable-border-color** - Border color of the table cells. (default: var(--dds-border-neutral-divider)) _(default: undefined)_\n- **--dds-datatable-header-bg-color** - Background color of the table header. (default: var(--dds-background-neutral-subtle)) _(default: undefined)_\n- **--dds-datatable-header-text-color** - Text color of the table header. (default: var(--dds-text-neutral-strong)) _(default: undefined)_\n- **--dds-datatable-row-hover-bg-color** - Background color of hovered rows. (default: var(--dds-background-brand-strong)) _(default: undefined)_\n- **--dds-datatable-row-selected-bg-color** - Background color of selected rows. (default: var(--dds-background-brand-strong)) _(default: undefined)_\n- **--dds-datatable-cell-padding** - Padding of table cells. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-datatable-header-padding** - Padding of header cells. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-datatable-last-column-padding** - Padding of the last column. (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-datatable-first-column-padding** - Padding of the first column. (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-datatable-border-width** - Width of table borders. (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-datatable-outer-border-width** - Width of the outer container border only. (default: var(--dds-datatable-border-width)) _(default: undefined)_\n- **--dds-datatable-header-border-width** - Width of the header row bottom border only. (default: var(--dds-datatable-border-width)) _(default: undefined)_\n- **--dds-datatable-row-border-width** - Width of the row (body cell) bottom borders only. (default: var(--dds-datatable-border-width)) _(default: undefined)_\n- **--dds-datatable-stripe-color** - Background color for striped rows. (default: var(--dds-background-neutral-base)) _(default: undefined)_\n- **--dds-datatable-border-radius** - Border radius of the table. (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-datatable-shadow** - Box shadow of the table. (default: none) _(default: undefined)_\n- **--dds-datatable-transition-duration** - Duration of hover/selection transitions. (default: 0.2s) _(default: undefined)_\n- **--dds-datatable-z-index** - Z-index of the table. (default: 1) _(default: undefined)_\n- **--dds-datatable-min-height** - Minimum height of the table. (default: auto) _(default: undefined)_\n- **--dds-datatable-max-height** - Maximum height of the table. (default: none) _(default: undefined)_\n- **--dds-datatable-overflow-x** - Horizontal overflow behavior. (default: auto) _(default: undefined)_\n- **--dds-datatable-overflow-y** - Vertical overflow behavior. (default: auto) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main table container.\n- **header** - The header of the table.\n- **header-row** - The header row of the table.\n- **header-cell** - All cells of the header.\n- **body** - The body of the table.\n- **empty** - The empty content of the table.\n- **loading** - The loading content of the table.\n- **row** - All rows of the table.\n- **cell** - All cells of the table.\n- **pager** - The pager of the table.\n- **pager-base** - The base of the pager.\n- **pager-first** - The first button of the pager.\n- **pager-previous** - The previous button of the pager.\n- **pager-next** - The next button of the pager.\n- **pager-last** - The last button of the pager.\n- **pager-page-size-select** - The page size select of the pager.",
2997
2997
  "doc-url": "",
2998
2998
  "attributes": [
2999
2999
  {
@@ -3143,6 +3143,16 @@
3143
3143
  "description": "Show the last button.",
3144
3144
  "value": { "type": "string", "default": "'true'" }
3145
3145
  },
3146
+ {
3147
+ "name": "showPageNumbers",
3148
+ "description": "Show numbered page buttons between the previous and next buttons.",
3149
+ "value": { "type": "string", "default": "'false'" }
3150
+ },
3151
+ {
3152
+ "name": "siblingCount",
3153
+ "description": "How many page numbers to show on each side of the current page.",
3154
+ "value": { "type": "number", "default": "1" }
3155
+ },
3146
3156
  {
3147
3157
  "name": "firstButtonLabel",
3148
3158
  "description": "The label of the first button",
@@ -3381,6 +3391,16 @@
3381
3391
  "description": "Show the last button.",
3382
3392
  "type": "string"
3383
3393
  },
3394
+ {
3395
+ "name": "showPageNumbers",
3396
+ "description": "Show numbered page buttons between the previous and next buttons.",
3397
+ "type": "string"
3398
+ },
3399
+ {
3400
+ "name": "siblingCount",
3401
+ "description": "How many page numbers to show on each side of the current page.",
3402
+ "type": "number"
3403
+ },
3384
3404
  {
3385
3405
  "name": "firstButtonLabel",
3386
3406
  "description": "The label of the first button",
@@ -7355,7 +7375,7 @@
7355
7375
  },
7356
7376
  {
7357
7377
  "name": "dap-ds-pager",
7358
- "description": "A pager is a component that displays pagination controls.\n---\n\n\n### **Events:**\n - **dds-pagination-change** - Event fired when the pagination changes\n\n### **CSS Properties:**\n - **--dds-pager-spacing-vertical** - The vertical spacing of the pager (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-pager-spacing-horizontal** - The horizontal spacing of the pager (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-pager-button-padding** - The padding of the pager buttons (default: var(--dds-spacing-150)) _(default: undefined)_\n- **--dds-pager-button-border-width** - The border width of the pager buttons (default: var(--dds-border-width-base, 1px)) _(default: undefined)_\n- **--dds-pager-button-border-color** - The border color of the pager buttons (default: var(--dds-button-subtle-border-neutral-enabled)) _(default: undefined)_\n- **--dds-pager-button-border-radius** - The border radius of the pager buttons (default: var(--dds-radius-rounded)) _(default: undefined)_\n- **--dds-pager-button-background** - The background color of the pager buttons (default: var(--dds-button-subtle-background-neutral-enabled)) _(default: undefined)_\n- **--dds-pager-button-font-size** - The font size of the pager buttons (default: var(--dds-font-sm, 14px)) _(default: undefined)_\n- **--dds-pager-button-font-weight** - The font weight of the pager buttons (default: var(--dds-font-weight-bold, 700)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main pager container.\n- **first** - The first page button.\n- **previous** - The previous page button.\n- **next** - The next page button.\n- **last** - The last page button.\n- **page-size** - The page size select.\n- **pager-button-first-base** - The base of the first page button.\n- **pager-button-first-content** - The content of the first page button.\n- **pager-button-previous-base** - The base of the previous page button.\n- **pager-button-previous-content** - The content of the previous page button.\n- **pager-button-next-base** - The base of the next page button.\n- **pager-button-next-content** - The content of the next page button.\n- **pager-button-last-base** - The base of the last page button.\n- **pager-button-last-content** - The content of the last page button.\n- **page-size-select-base** - The base of the page size select.\n- **page-size-select-trigger** - The trigger of the page size select.",
7378
+ "description": "A pager is a component that displays pagination controls.\n---\n\n\n### **Events:**\n - **dds-pagination-change** - Event fired when the pagination changes\n\n### **CSS Properties:**\n - **--dds-pager-spacing-vertical** - The vertical spacing of the pager (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-pager-spacing-horizontal** - The horizontal spacing of the pager (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-pager-button-padding** - The padding of the pager buttons (default: var(--dds-spacing-150)) _(default: undefined)_\n- **--dds-pager-button-border-width** - The border width of the pager buttons (default: var(--dds-border-width-base, 1px)) _(default: undefined)_\n- **--dds-pager-button-border-color** - The border color of the pager buttons (default: var(--dds-button-subtle-border-neutral-enabled)) _(default: undefined)_\n- **--dds-pager-button-border-radius** - The border radius of the pager buttons (default: var(--dds-radius-rounded)) _(default: undefined)_\n- **--dds-pager-button-background** - The background color of the pager buttons (default: var(--dds-button-subtle-background-neutral-enabled)) _(default: undefined)_\n- **--dds-pager-button-font-size** - The font size of the pager buttons (default: var(--dds-font-sm, 14px)) _(default: undefined)_\n- **--dds-pager-button-font-weight** - The font weight of the pager buttons (default: var(--dds-font-weight-bold, 700)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main pager container.\n- **first** - The first page button.\n- **previous** - The previous page button.\n- **next** - The next page button.\n- **last** - The last page button.\n- **page-size** - The page size select.\n- **pager-button-first-base** - The base of the first page button.\n- **pager-button-first-content** - The content of the first page button.\n- **pager-button-previous-base** - The base of the previous page button.\n- **pager-button-previous-content** - The content of the previous page button.\n- **pager-button-next-base** - The base of the next page button.\n- **pager-button-next-content** - The content of the next page button.\n- **pager-button-last-base** - The base of the last page button.\n- **pager-button-last-content** - The content of the last page button.\n- **page-size-select-base** - The base of the page size select.\n- **page-size-select-trigger** - The trigger of the page size select.\n- **page-numbers** - The container of the numbered page buttons (shown when showPageNumbers is 'true').\n- **page-number** - Each numbered page button.\n- **page-number-active** - The active (current) numbered page button.\n- **page-number-base** - The base of each numbered page button.\n- **page-number-content** - The content of each numbered page button.\n- **page-info** - The page info / total count text.",
7359
7379
  "doc-url": "",
7360
7380
  "attributes": [
7361
7381
  {
@@ -7423,6 +7443,16 @@
7423
7443
  "description": "Show the last button.",
7424
7444
  "value": { "type": "string", "default": "'true'" }
7425
7445
  },
7446
+ {
7447
+ "name": "showPageNumbers",
7448
+ "description": "Show numbered page buttons between the previous and next buttons.",
7449
+ "value": { "type": "string", "default": "'false'" }
7450
+ },
7451
+ {
7452
+ "name": "siblingCount",
7453
+ "description": "How many page numbers to show on each side of the current page.",
7454
+ "value": { "type": "number", "default": "1" }
7455
+ },
7426
7456
  {
7427
7457
  "name": "firstButtonLabel",
7428
7458
  "description": "The first button label.",
@@ -7523,6 +7553,16 @@
7523
7553
  "description": "Show the last button.",
7524
7554
  "type": "string"
7525
7555
  },
7556
+ {
7557
+ "name": "showPageNumbers",
7558
+ "description": "Show numbered page buttons between the previous and next buttons.",
7559
+ "type": "string"
7560
+ },
7561
+ {
7562
+ "name": "siblingCount",
7563
+ "description": "How many page numbers to show on each side of the current page.",
7564
+ "type": "number"
7565
+ },
7526
7566
  {
7527
7567
  "name": "firstButtonLabel",
7528
7568
  "description": "The first button label.",
@@ -8745,285 +8785,58 @@
8745
8785
  "name": "feedbackType",
8746
8786
  "description": "The feedback type of the select. Can be `negative`, `positive`, or `warning`.",
8747
8787
  "type": "negative | positive | warning"
8748
- },
8749
- {
8750
- "name": "status",
8751
- "description": "The status of the select. Can be `success` or `error`.",
8752
- "type": "string"
8753
- },
8754
- {
8755
- "name": "optional",
8756
- "description": "The optional state of the select.",
8757
- "type": "boolean"
8758
- },
8759
- {
8760
- "name": "optionalLabel",
8761
- "description": "The optional label of the select.",
8762
- "type": "string"
8763
- },
8764
- {
8765
- "name": "requiredLabel",
8766
- "description": "The required indicator of the select. (default: '*')",
8767
- "type": "string"
8768
- },
8769
- {
8770
- "name": "subtle",
8771
- "description": "The weight of the label. Default is `false`",
8772
- "type": "boolean"
8773
- }
8774
- ],
8775
- "events": [
8776
- {
8777
- "name": "dds-change",
8778
- "type": "{ value: string }",
8779
- "description": "Fired when the select value changes."
8780
- },
8781
- {
8782
- "name": "dds-blur",
8783
- "type": "{ void }",
8784
- "description": "Emitted when the select loses focus."
8785
- },
8786
- {
8787
- "name": "dds-focus",
8788
- "type": "{ void }",
8789
- "description": "Emitted when the select gains focus."
8790
- },
8791
- {
8792
- "name": "dds-opened",
8793
- "type": "{ void }",
8794
- "description": "Emitted when the select dropdown is opened."
8795
- },
8796
- {
8797
- "name": "dds-closed",
8798
- "type": "{ void }",
8799
- "description": "Emitted when the select dropdown is closed."
8800
- }
8801
- ]
8802
- }
8803
- },
8804
- {
8805
- "name": "dap-ds-sidenav-group",
8806
- "description": "Side navigation group\n---\n\n\n### **Slots:**\n - _default_ - The content of the side navigation group.\n- **submenu** - The submenu of the side navigation group.\n- **suffix** - The suffix of the side navigation group.\n\n### **CSS Properties:**\n - **--dds-sidenav-group-margin-bottom** - Default bottom margin of the sidenav group (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-sidenav-group-border-radius** - Border radius of the sidenav group (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-sidenav-group-spacing-margin** - Margin used for spacing variants (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-sidenav-group-item-min-height-xs** - Minimum height of the sidenav group item (default: var(--dds-spacing-800)) _(default: undefined)_\n- **--dds-sidenav-group-item-min-height-sm** - Minimum height of the sidenav group item (default: var(--dds-spacing-1000)) _(default: undefined)_\n- **--dds-sidenav-group-item-min-height-lg** - Minimum height of the sidenav group item (default: var(--dds-spacing-1200)) _(default: undefined)_\n- **--dds-sidenav-group-item-padding-xs** - Padding of the sidenav group item (default: var(--dds-spacing-100) var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-sidenav-group-item-padding-sm** - Padding of the sidenav group item (default: var(--dds-spacing-200) var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-sidenav-group-item-padding-lg** - Padding of the sidenav group item (default: var(--dds-spacing-300) var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-sidenav-group-item-color** - Text color of the sidenav group item (default: var(--dds-text-neutral-base)) _(default: undefined)_\n- **--dds-sidenav-group-item-font-size-xs** - Font size of the sidenav group item (default: var(--dds-font-sm)) _(default: undefined)_\n- **--dds-sidenav-group-item-font-size-sm** - Font size of the sidenav group item (default: var(--dds-font-base)) _(default: undefined)_\n- **--dds-sidenav-group-item-font-size-lg** - Font size of the sidenav group item (default: var(--dds-font-lg)) _(default: undefined)_\n- **--dds-sidenav-group-item-font-weight** - Font weight of the sidenav group item (default: var(--dds-font-weight-medium)) _(default: undefined)_\n- **--dds-sidenav-group-item-bg-active** - Background color when the item is active (default: var(--dds-transparent-black-subtle)) _(default: undefined)_\n- **--dds-sidenav-group-item-bg-hover** - Background color on hover and active states (default: var(--dds-transparent-black-base)) _(default: undefined)_\n- **--dds-sidenav-group-toggle-margin** - Margin for the toggle button (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-sidenav-group-submenu-padding** - Padding for the submenu (default: var(--dds-spacing-300) 0) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main side navigation group container.\n- **title** - The title of the side navigation group.\n- **link** - The link of the side navigation group.\n- **toggle** - The toggle button of the side navigation group.\n- **submenu** - The submenu of the side navigation group.",
8807
- "doc-url": "",
8808
- "attributes": [
8809
- {
8810
- "name": "href",
8811
- "description": "The href of the side navigation item",
8812
- "value": { "type": "string" }
8813
- },
8814
- {
8815
- "name": "active",
8816
- "description": "Whether the side navigation item is active",
8817
- "value": { "type": "boolean", "default": "false" }
8818
- },
8819
- {
8820
- "name": "spacing",
8821
- "description": "The spacing of the side navigation item",
8822
- "value": {
8823
- "type": "'top' | 'bottom' | 'both' | 'none'",
8824
- "default": "'none'"
8825
- }
8826
- },
8827
- {
8828
- "name": "open",
8829
- "description": "Whether the side navigation group is open",
8830
- "value": { "type": "boolean", "default": "false" }
8831
- },
8832
- {
8833
- "name": "size",
8834
- "description": "The size of the side navigation group",
8835
- "value": { "type": "'xs' | 'sm' | 'lg'", "default": "'xs'" }
8836
- }
8837
- ],
8838
- "slots": [
8839
- {
8840
- "name": "",
8841
- "description": "The content of the side navigation group."
8842
- },
8843
- {
8844
- "name": "submenu",
8845
- "description": "The submenu of the side navigation group."
8846
- },
8847
- {
8848
- "name": "suffix",
8849
- "description": "The suffix of the side navigation group."
8850
- }
8851
- ],
8852
- "events": [],
8853
- "js": {
8854
- "properties": [
8855
- {
8856
- "name": "href",
8857
- "description": "The href of the side navigation item",
8858
- "type": "string"
8859
- },
8860
- {
8861
- "name": "active",
8862
- "description": "Whether the side navigation item is active",
8863
- "type": "boolean"
8864
- },
8865
- {
8866
- "name": "spacing",
8867
- "description": "The spacing of the side navigation item",
8868
- "type": "'top' | 'bottom' | 'both' | 'none'"
8869
- },
8870
- {
8871
- "name": "open",
8872
- "description": "Whether the side navigation group is open",
8873
- "type": "boolean"
8874
- },
8875
- {
8876
- "name": "size",
8877
- "description": "The size of the side navigation group",
8878
- "type": "'xs' | 'sm' | 'lg'"
8879
- }
8880
- ],
8881
- "events": []
8882
- }
8883
- },
8884
- {
8885
- "name": "dap-ds-sidenav-item",
8886
- "description": "Side navigation item\n---\n\n\n### **Slots:**\n - _default_ - The content of the side navigation item.\n- **suffix** - The suffix of the side navigation item.\n\n### **CSS Properties:**\n - **--dds-sidenav-item-min-height-xs** - Minimum height of the sidenav item (default: var(--dds-spacing-800)) _(default: undefined)_\n- **--dds-sidenav-item-min-height-sm** - Minimum height of the sidenav item (default: var(--dds-spacing-1000)) _(default: undefined)_\n- **--dds-sidenav-item-min-height-lg** - Minimum height of the sidenav item (default: var(--dds-spacing-1200)) _(default: undefined)_\n- **--dds-sidenav-item-margin-bottom** - Default bottom margin of the sidenav item (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-sidenav-item-padding-xs** - Padding of the sidenav item (default: var(--dds-spacing-100) var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-sidenav-item-padding-sm** - Padding of the sidenav item (default: var(--dds-spacing-200) var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-sidenav-item-padding-lg** - Padding of the sidenav item (default: var(--dds-spacing-300) var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-sidenav-item-radius** - Border radius of the sidenav item (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-sidenav-item-color** - Text color of the sidenav item (default: var(--dds-text-neutral-base)) _(default: undefined)_\n- **--dds-sidenav-item-font-size-xs** - Font size of the sidenav item (default: var(--dds-font-sm)) _(default: undefined)_\n- **--dds-sidenav-item-font-size-sm** - Font size of the sidenav item (default: var(--dds-font-base)) _(default: undefined)_\n- **--dds-sidenav-item-font-size-lg** - Font size of the sidenav item (default: var(--dds-font-lg)) _(default: undefined)_\n- **--dds-sidenav-item-font-weight** - Font weight of the sidenav item (default: var(--dds-font-weight-medium)) _(default: undefined)_\n- **--dds-sidenav-item-spacing-margin** - Margin used for spacing variants (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-sidenav-item-bg-active** - Background color when the item is active (default: var(--dds-transparent-black-subtle)) _(default: undefined)_\n- **--dds-sidenav-item-bg-hover** - Background color on hover and active states (default: var(--dds-transparent-black-base)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main side navigation item container.\n- **link** - The link of the side navigation item.",
8887
- "doc-url": "",
8888
- "attributes": [
8889
- {
8890
- "name": "href",
8891
- "description": "The href of the side navigation item",
8892
- "value": { "type": "string" }
8893
- },
8894
- {
8895
- "name": "active",
8896
- "description": "Whether the side navigation item is active",
8897
- "value": { "type": "boolean", "default": "false" }
8898
- },
8899
- {
8900
- "name": "current",
8901
- "description": "Which `aria-current` token to expose on the link when `active` is set.\n\n`aria-current` has to sit on the anchor that assistive technology actually\nexposes. Setting it on this host does nothing: the host is a role-less custom\nelement, so the attribute is stranded there and screen-reader users cannot tell\nwhich item is current. Use `current=\"step\"` inside a stepper.",
8902
- "value": {
8903
- "type": "'page' | 'step' | 'location' | 'date' | 'time' | 'true'",
8904
- "default": "'page'"
8905
- }
8906
- },
8907
- {
8908
- "name": "spacing",
8909
- "description": "The spacing of the side navigation item",
8910
- "value": {
8911
- "type": "'top' | 'bottom' | 'both' | 'none'",
8912
- "default": "'none'"
8913
- }
8914
- },
8915
- {
8916
- "name": "size",
8917
- "description": "The size of the side navigation item",
8918
- "value": { "type": "'xs' | 'sm' | 'lg'", "default": "'xs'" }
8919
- }
8920
- ],
8921
- "slots": [
8922
- {
8923
- "name": "",
8924
- "description": "The content of the side navigation item."
8925
- },
8926
- {
8927
- "name": "suffix",
8928
- "description": "The suffix of the side navigation item."
8929
- }
8930
- ],
8931
- "events": [],
8932
- "js": {
8933
- "properties": [
8788
+ },
8934
8789
  {
8935
- "name": "href",
8936
- "description": "The href of the side navigation item",
8790
+ "name": "status",
8791
+ "description": "The status of the select. Can be `success` or `error`.",
8937
8792
  "type": "string"
8938
8793
  },
8939
8794
  {
8940
- "name": "active",
8941
- "description": "Whether the side navigation item is active",
8795
+ "name": "optional",
8796
+ "description": "The optional state of the select.",
8942
8797
  "type": "boolean"
8943
8798
  },
8944
8799
  {
8945
- "name": "current",
8946
- "description": "Which `aria-current` token to expose on the link when `active` is set.\n\n`aria-current` has to sit on the anchor that assistive technology actually\nexposes. Setting it on this host does nothing: the host is a role-less custom\nelement, so the attribute is stranded there and screen-reader users cannot tell\nwhich item is current. Use `current=\"step\"` inside a stepper.",
8947
- "type": "'page' | 'step' | 'location' | 'date' | 'time' | 'true'"
8800
+ "name": "optionalLabel",
8801
+ "description": "The optional label of the select.",
8802
+ "type": "string"
8948
8803
  },
8949
8804
  {
8950
- "name": "spacing",
8951
- "description": "The spacing of the side navigation item",
8952
- "type": "'top' | 'bottom' | 'both' | 'none'"
8805
+ "name": "requiredLabel",
8806
+ "description": "The required indicator of the select. (default: '*')",
8807
+ "type": "string"
8953
8808
  },
8954
8809
  {
8955
- "name": "size",
8956
- "description": "The size of the side navigation item",
8957
- "type": "'xs' | 'sm' | 'lg'"
8810
+ "name": "subtle",
8811
+ "description": "The weight of the label. Default is `false`",
8812
+ "type": "boolean"
8958
8813
  }
8959
8814
  ],
8960
- "events": []
8961
- }
8962
- },
8963
- {
8964
- "name": "dap-ds-sidenav",
8965
- "description": "Side navigation is a list of links that are used to navigate to different sections of a page.\n---\n\n\n### **Events:**\n - **dds-item-click** - Event fired when the side navigation item is clicked.\n\n### **Slots:**\n - _default_ - The content of the side navigation.\n\n### **CSS Parts:**\n - **base** - The main side navigation container.\n- **menu** - The menu of the side navigation.",
8966
- "doc-url": "",
8967
- "attributes": [
8968
- {
8969
- "name": "label",
8970
- "description": "The label of the side navigation, if aria label is not provided, it will be used as aria label",
8971
- "value": { "type": "string" }
8972
- },
8973
- {
8974
- "name": "activeHref",
8975
- "description": "The active href of the side navigation, to explicitly set the active item, if not provided, it will be set based on the current location",
8976
- "value": { "type": "string" }
8977
- },
8978
- {
8979
- "name": "size",
8980
- "description": "The size of the side navigation",
8981
- "value": { "type": "'xs' | 'sm' | 'lg'", "default": "'xs'" }
8982
- },
8983
- {
8984
- "name": "landmark",
8985
- "description": "The landmark element to render. `aside` exposes a complementary landmark; `nav`\nexposes a navigation landmark, so the sidenav is listed when a screen-reader user\nasks for the page's navigation.\n\nDefaults to `aside` because that is what this component has always rendered, and\nchanging the landmark of every existing sidenav is not this component's call: a\nsidenav that is genuinely a sidebar should stay complementary. Set `nav` when the\nsidenav is the primary way to move around the view.",
8986
- "value": { "type": "'aside' | 'nav'", "default": "'aside'" }
8987
- }
8988
- ],
8989
- "slots": [
8990
- { "name": "", "description": "The content of the side navigation." }
8991
- ],
8992
- "events": [
8993
- {
8994
- "name": "dds-item-click",
8995
- "type": "{ href: string, event: Event }",
8996
- "description": "Event fired when the side navigation item is clicked."
8997
- }
8998
- ],
8999
- "js": {
9000
- "properties": [
8815
+ "events": [
9001
8816
  {
9002
- "name": "label",
9003
- "description": "The label of the side navigation, if aria label is not provided, it will be used as aria label",
9004
- "type": "string"
8817
+ "name": "dds-change",
8818
+ "type": "{ value: string }",
8819
+ "description": "Fired when the select value changes."
9005
8820
  },
9006
8821
  {
9007
- "name": "activeHref",
9008
- "description": "The active href of the side navigation, to explicitly set the active item, if not provided, it will be set based on the current location",
9009
- "type": "string"
8822
+ "name": "dds-blur",
8823
+ "type": "{ void }",
8824
+ "description": "Emitted when the select loses focus."
9010
8825
  },
9011
8826
  {
9012
- "name": "size",
9013
- "description": "The size of the side navigation",
9014
- "type": "'xs' | 'sm' | 'lg'"
8827
+ "name": "dds-focus",
8828
+ "type": "{ void }",
8829
+ "description": "Emitted when the select gains focus."
9015
8830
  },
9016
8831
  {
9017
- "name": "landmark",
9018
- "description": "The landmark element to render. `aside` exposes a complementary landmark; `nav`\nexposes a navigation landmark, so the sidenav is listed when a screen-reader user\nasks for the page's navigation.\n\nDefaults to `aside` because that is what this component has always rendered, and\nchanging the landmark of every existing sidenav is not this component's call: a\nsidenav that is genuinely a sidebar should stay complementary. Set `nav` when the\nsidenav is the primary way to move around the view.",
9019
- "type": "'aside' | 'nav'"
9020
- }
9021
- ],
9022
- "events": [
8832
+ "name": "dds-opened",
8833
+ "type": "{ void }",
8834
+ "description": "Emitted when the select dropdown is opened."
8835
+ },
9023
8836
  {
9024
- "name": "dds-item-click",
9025
- "type": "{ href: string, event: Event }",
9026
- "description": "Event fired when the side navigation item is clicked."
8837
+ "name": "dds-closed",
8838
+ "type": "{ void }",
8839
+ "description": "Emitted when the select dropdown is closed."
9027
8840
  }
9028
8841
  ]
9029
8842
  }
@@ -9801,100 +9614,327 @@
9801
9614
  "js": {
9802
9615
  "properties": [
9803
9616
  {
9804
- "name": "last",
9805
- "description": "If the header cell is the last one.",
9617
+ "name": "last",
9618
+ "description": "If the header cell is the last one.",
9619
+ "type": "boolean"
9620
+ },
9621
+ {
9622
+ "name": "role",
9623
+ "description": "The html role of the header cell",
9624
+ "type": "string"
9625
+ }
9626
+ ],
9627
+ "events": []
9628
+ }
9629
+ },
9630
+ {
9631
+ "name": "dap-ds-table-row",
9632
+ "description": "Table row component.\n---\n\n\n### **Slots:**\n - _default_ - The default slot. Accepts `dap-ds-table-cell` and `dap-ds-table-header` elements.\n\n### **CSS Properties:**\n - **--dds-table-row-padding-right** - Padding right for the last table header, (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-table-row-padding-top** - Padding top for table headers in mobile view, (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-table-row-padding-bottom** - Padding bottom for the last table cell in mobile view, (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-table-row-border-color** - Border color for table cells and headers, (default: transparent) _(default: undefined)_",
9633
+ "doc-url": "",
9634
+ "attributes": [
9635
+ {
9636
+ "name": "role",
9637
+ "description": "The html role of the row",
9638
+ "value": { "type": "string", "default": "'row'" }
9639
+ },
9640
+ {
9641
+ "name": "mobile",
9642
+ "description": "If the row is mobile design",
9643
+ "value": { "type": "boolean", "default": "false" }
9644
+ }
9645
+ ],
9646
+ "slots": [
9647
+ {
9648
+ "name": "",
9649
+ "description": "The default slot. Accepts `dap-ds-table-cell` and `dap-ds-table-header` elements."
9650
+ }
9651
+ ],
9652
+ "events": [],
9653
+ "js": {
9654
+ "properties": [
9655
+ {
9656
+ "name": "role",
9657
+ "description": "The html role of the row",
9658
+ "type": "string"
9659
+ },
9660
+ {
9661
+ "name": "mobile",
9662
+ "description": "If the row is mobile design",
9663
+ "type": "boolean"
9664
+ }
9665
+ ],
9666
+ "events": []
9667
+ }
9668
+ },
9669
+ {
9670
+ "name": "dap-ds-table",
9671
+ "description": "Data table component.\n---\n\n\n### **Slots:**\n - _default_ - The default slot. Accepts `dap-ds-table-row` elements.\n\n### **CSS Properties:**\n - **--dds-table-border-width** - Width of the table border. (default: var(--dds-border-width-base, 1px)) _(default: undefined)_\n- **--dds-table-border-color** - Color of the table border. (default: var(--dds-border-neutral-subtle)) _(default: undefined)_\n- **--dds-table-border-radius** - Border radius of the table. (default: var(--dds-radius-small, 4px)) _(default: undefined)_\n- **--dds-table-row-divider-color** - Color of the divider between rows in mobile view. (default: var(--dds-border-neutral-subtle)) _(default: undefined)_",
9672
+ "doc-url": "",
9673
+ "attributes": [
9674
+ {
9675
+ "name": "role",
9676
+ "value": { "type": "string", "default": "'grid'" }
9677
+ },
9678
+ {
9679
+ "name": "mobile",
9680
+ "description": "If the table has mobile design",
9681
+ "value": { "type": "boolean", "default": "false" }
9682
+ },
9683
+ {
9684
+ "name": "caption",
9685
+ "description": "The caption of the table",
9686
+ "value": { "type": "string", "default": "''" }
9687
+ }
9688
+ ],
9689
+ "slots": [
9690
+ {
9691
+ "name": "",
9692
+ "description": "The default slot. Accepts `dap-ds-table-row` elements."
9693
+ }
9694
+ ],
9695
+ "events": [],
9696
+ "js": {
9697
+ "properties": [
9698
+ { "name": "role", "type": "string" },
9699
+ {
9700
+ "name": "mobile",
9701
+ "description": "If the table has mobile design",
9702
+ "type": "boolean"
9703
+ },
9704
+ {
9705
+ "name": "caption",
9706
+ "description": "The caption of the table",
9707
+ "type": "string"
9708
+ }
9709
+ ],
9710
+ "events": []
9711
+ }
9712
+ },
9713
+ {
9714
+ "name": "dap-ds-sidenav-group",
9715
+ "description": "Side navigation group\n---\n\n\n### **Slots:**\n - _default_ - The content of the side navigation group.\n- **submenu** - The submenu of the side navigation group.\n- **suffix** - The suffix of the side navigation group.\n\n### **CSS Properties:**\n - **--dds-sidenav-group-margin-bottom** - Default bottom margin of the sidenav group (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-sidenav-group-border-radius** - Border radius of the sidenav group (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-sidenav-group-spacing-margin** - Margin used for spacing variants (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-sidenav-group-item-min-height-xs** - Minimum height of the sidenav group item (default: var(--dds-spacing-800)) _(default: undefined)_\n- **--dds-sidenav-group-item-min-height-sm** - Minimum height of the sidenav group item (default: var(--dds-spacing-1000)) _(default: undefined)_\n- **--dds-sidenav-group-item-min-height-lg** - Minimum height of the sidenav group item (default: var(--dds-spacing-1200)) _(default: undefined)_\n- **--dds-sidenav-group-item-padding-xs** - Padding of the sidenav group item (default: var(--dds-spacing-100) var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-sidenav-group-item-padding-sm** - Padding of the sidenav group item (default: var(--dds-spacing-200) var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-sidenav-group-item-padding-lg** - Padding of the sidenav group item (default: var(--dds-spacing-300) var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-sidenav-group-item-color** - Text color of the sidenav group item (default: var(--dds-text-neutral-base)) _(default: undefined)_\n- **--dds-sidenav-group-item-font-size-xs** - Font size of the sidenav group item (default: var(--dds-font-sm)) _(default: undefined)_\n- **--dds-sidenav-group-item-font-size-sm** - Font size of the sidenav group item (default: var(--dds-font-base)) _(default: undefined)_\n- **--dds-sidenav-group-item-font-size-lg** - Font size of the sidenav group item (default: var(--dds-font-lg)) _(default: undefined)_\n- **--dds-sidenav-group-item-font-weight** - Font weight of the sidenav group item (default: var(--dds-font-weight-medium)) _(default: undefined)_\n- **--dds-sidenav-group-item-bg-active** - Background color when the item is active (default: var(--dds-transparent-black-subtle)) _(default: undefined)_\n- **--dds-sidenav-group-item-bg-hover** - Background color on hover and active states (default: var(--dds-transparent-black-base)) _(default: undefined)_\n- **--dds-sidenav-group-toggle-margin** - Margin for the toggle button (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-sidenav-group-submenu-padding** - Padding for the submenu (default: var(--dds-spacing-300) 0) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main side navigation group container.\n- **title** - The title of the side navigation group.\n- **link** - The link of the side navigation group.\n- **toggle** - The toggle button of the side navigation group.\n- **submenu** - The submenu of the side navigation group.",
9716
+ "doc-url": "",
9717
+ "attributes": [
9718
+ {
9719
+ "name": "href",
9720
+ "description": "The href of the side navigation item",
9721
+ "value": { "type": "string" }
9722
+ },
9723
+ {
9724
+ "name": "active",
9725
+ "description": "Whether the side navigation item is active",
9726
+ "value": { "type": "boolean", "default": "false" }
9727
+ },
9728
+ {
9729
+ "name": "spacing",
9730
+ "description": "The spacing of the side navigation item",
9731
+ "value": {
9732
+ "type": "'top' | 'bottom' | 'both' | 'none'",
9733
+ "default": "'none'"
9734
+ }
9735
+ },
9736
+ {
9737
+ "name": "open",
9738
+ "description": "Whether the side navigation group is open",
9739
+ "value": { "type": "boolean", "default": "false" }
9740
+ },
9741
+ {
9742
+ "name": "size",
9743
+ "description": "The size of the side navigation group",
9744
+ "value": { "type": "'xs' | 'sm' | 'lg'", "default": "'xs'" }
9745
+ }
9746
+ ],
9747
+ "slots": [
9748
+ {
9749
+ "name": "",
9750
+ "description": "The content of the side navigation group."
9751
+ },
9752
+ {
9753
+ "name": "submenu",
9754
+ "description": "The submenu of the side navigation group."
9755
+ },
9756
+ {
9757
+ "name": "suffix",
9758
+ "description": "The suffix of the side navigation group."
9759
+ }
9760
+ ],
9761
+ "events": [],
9762
+ "js": {
9763
+ "properties": [
9764
+ {
9765
+ "name": "href",
9766
+ "description": "The href of the side navigation item",
9767
+ "type": "string"
9768
+ },
9769
+ {
9770
+ "name": "active",
9771
+ "description": "Whether the side navigation item is active",
9806
9772
  "type": "boolean"
9807
9773
  },
9808
9774
  {
9809
- "name": "role",
9810
- "description": "The html role of the header cell",
9811
- "type": "string"
9775
+ "name": "spacing",
9776
+ "description": "The spacing of the side navigation item",
9777
+ "type": "'top' | 'bottom' | 'both' | 'none'"
9778
+ },
9779
+ {
9780
+ "name": "open",
9781
+ "description": "Whether the side navigation group is open",
9782
+ "type": "boolean"
9783
+ },
9784
+ {
9785
+ "name": "size",
9786
+ "description": "The size of the side navigation group",
9787
+ "type": "'xs' | 'sm' | 'lg'"
9812
9788
  }
9813
9789
  ],
9814
9790
  "events": []
9815
9791
  }
9816
9792
  },
9817
9793
  {
9818
- "name": "dap-ds-table-row",
9819
- "description": "Table row component.\n---\n\n\n### **Slots:**\n - _default_ - The default slot. Accepts `dap-ds-table-cell` and `dap-ds-table-header` elements.\n\n### **CSS Properties:**\n - **--dds-table-row-padding-right** - Padding right for the last table header, (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-table-row-padding-top** - Padding top for table headers in mobile view, (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-table-row-padding-bottom** - Padding bottom for the last table cell in mobile view, (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-table-row-border-color** - Border color for table cells and headers, (default: transparent) _(default: undefined)_",
9794
+ "name": "dap-ds-sidenav-item",
9795
+ "description": "Side navigation item\n---\n\n\n### **Slots:**\n - _default_ - The content of the side navigation item.\n- **suffix** - The suffix of the side navigation item.\n\n### **CSS Properties:**\n - **--dds-sidenav-item-min-height-xs** - Minimum height of the sidenav item (default: var(--dds-spacing-800)) _(default: undefined)_\n- **--dds-sidenav-item-min-height-sm** - Minimum height of the sidenav item (default: var(--dds-spacing-1000)) _(default: undefined)_\n- **--dds-sidenav-item-min-height-lg** - Minimum height of the sidenav item (default: var(--dds-spacing-1200)) _(default: undefined)_\n- **--dds-sidenav-item-margin-bottom** - Default bottom margin of the sidenav item (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-sidenav-item-padding-xs** - Padding of the sidenav item (default: var(--dds-spacing-100) var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-sidenav-item-padding-sm** - Padding of the sidenav item (default: var(--dds-spacing-200) var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-sidenav-item-padding-lg** - Padding of the sidenav item (default: var(--dds-spacing-300) var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-sidenav-item-radius** - Border radius of the sidenav item (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-sidenav-item-color** - Text color of the sidenav item (default: var(--dds-text-neutral-base)) _(default: undefined)_\n- **--dds-sidenav-item-font-size-xs** - Font size of the sidenav item (default: var(--dds-font-sm)) _(default: undefined)_\n- **--dds-sidenav-item-font-size-sm** - Font size of the sidenav item (default: var(--dds-font-base)) _(default: undefined)_\n- **--dds-sidenav-item-font-size-lg** - Font size of the sidenav item (default: var(--dds-font-lg)) _(default: undefined)_\n- **--dds-sidenav-item-font-weight** - Font weight of the sidenav item (default: var(--dds-font-weight-medium)) _(default: undefined)_\n- **--dds-sidenav-item-spacing-margin** - Margin used for spacing variants (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-sidenav-item-bg-active** - Background color when the item is active (default: var(--dds-transparent-black-subtle)) _(default: undefined)_\n- **--dds-sidenav-item-bg-hover** - Background color on hover and active states (default: var(--dds-transparent-black-base)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main side navigation item container.\n- **link** - The link of the side navigation item.",
9820
9796
  "doc-url": "",
9821
9797
  "attributes": [
9822
9798
  {
9823
- "name": "role",
9824
- "description": "The html role of the row",
9825
- "value": { "type": "string", "default": "'row'" }
9799
+ "name": "href",
9800
+ "description": "The href of the side navigation item",
9801
+ "value": { "type": "string" }
9826
9802
  },
9827
9803
  {
9828
- "name": "mobile",
9829
- "description": "If the row is mobile design",
9804
+ "name": "active",
9805
+ "description": "Whether the side navigation item is active",
9830
9806
  "value": { "type": "boolean", "default": "false" }
9807
+ },
9808
+ {
9809
+ "name": "current",
9810
+ "description": "Which `aria-current` token to expose on the link when `active` is set.\n\n`aria-current` has to sit on the anchor that assistive technology actually\nexposes. Setting it on this host does nothing: the host is a role-less custom\nelement, so the attribute is stranded there and screen-reader users cannot tell\nwhich item is current. Use `current=\"step\"` inside a stepper.",
9811
+ "value": {
9812
+ "type": "'page' | 'step' | 'location' | 'date' | 'time' | 'true'",
9813
+ "default": "'page'"
9814
+ }
9815
+ },
9816
+ {
9817
+ "name": "spacing",
9818
+ "description": "The spacing of the side navigation item",
9819
+ "value": {
9820
+ "type": "'top' | 'bottom' | 'both' | 'none'",
9821
+ "default": "'none'"
9822
+ }
9823
+ },
9824
+ {
9825
+ "name": "size",
9826
+ "description": "The size of the side navigation item",
9827
+ "value": { "type": "'xs' | 'sm' | 'lg'", "default": "'xs'" }
9831
9828
  }
9832
9829
  ],
9833
9830
  "slots": [
9834
9831
  {
9835
9832
  "name": "",
9836
- "description": "The default slot. Accepts `dap-ds-table-cell` and `dap-ds-table-header` elements."
9833
+ "description": "The content of the side navigation item."
9834
+ },
9835
+ {
9836
+ "name": "suffix",
9837
+ "description": "The suffix of the side navigation item."
9837
9838
  }
9838
9839
  ],
9839
9840
  "events": [],
9840
9841
  "js": {
9841
9842
  "properties": [
9842
9843
  {
9843
- "name": "role",
9844
- "description": "The html role of the row",
9844
+ "name": "href",
9845
+ "description": "The href of the side navigation item",
9845
9846
  "type": "string"
9846
9847
  },
9847
9848
  {
9848
- "name": "mobile",
9849
- "description": "If the row is mobile design",
9849
+ "name": "active",
9850
+ "description": "Whether the side navigation item is active",
9850
9851
  "type": "boolean"
9852
+ },
9853
+ {
9854
+ "name": "current",
9855
+ "description": "Which `aria-current` token to expose on the link when `active` is set.\n\n`aria-current` has to sit on the anchor that assistive technology actually\nexposes. Setting it on this host does nothing: the host is a role-less custom\nelement, so the attribute is stranded there and screen-reader users cannot tell\nwhich item is current. Use `current=\"step\"` inside a stepper.",
9856
+ "type": "'page' | 'step' | 'location' | 'date' | 'time' | 'true'"
9857
+ },
9858
+ {
9859
+ "name": "spacing",
9860
+ "description": "The spacing of the side navigation item",
9861
+ "type": "'top' | 'bottom' | 'both' | 'none'"
9862
+ },
9863
+ {
9864
+ "name": "size",
9865
+ "description": "The size of the side navigation item",
9866
+ "type": "'xs' | 'sm' | 'lg'"
9851
9867
  }
9852
9868
  ],
9853
9869
  "events": []
9854
9870
  }
9855
9871
  },
9856
9872
  {
9857
- "name": "dap-ds-table",
9858
- "description": "Data table component.\n---\n\n\n### **Slots:**\n - _default_ - The default slot. Accepts `dap-ds-table-row` elements.\n\n### **CSS Properties:**\n - **--dds-table-border-width** - Width of the table border. (default: var(--dds-border-width-base, 1px)) _(default: undefined)_\n- **--dds-table-border-color** - Color of the table border. (default: var(--dds-border-neutral-subtle)) _(default: undefined)_\n- **--dds-table-border-radius** - Border radius of the table. (default: var(--dds-radius-small, 4px)) _(default: undefined)_\n- **--dds-table-row-divider-color** - Color of the divider between rows in mobile view. (default: var(--dds-border-neutral-subtle)) _(default: undefined)_",
9873
+ "name": "dap-ds-sidenav",
9874
+ "description": "Side navigation is a list of links that are used to navigate to different sections of a page.\n---\n\n\n### **Events:**\n - **dds-item-click** - Event fired when the side navigation item is clicked.\n\n### **Slots:**\n - _default_ - The content of the side navigation.\n\n### **CSS Parts:**\n - **base** - The main side navigation container.\n- **menu** - The menu of the side navigation.",
9859
9875
  "doc-url": "",
9860
9876
  "attributes": [
9861
9877
  {
9862
- "name": "role",
9863
- "value": { "type": "string", "default": "'grid'" }
9878
+ "name": "label",
9879
+ "description": "The label of the side navigation, if aria label is not provided, it will be used as aria label",
9880
+ "value": { "type": "string" }
9864
9881
  },
9865
9882
  {
9866
- "name": "mobile",
9867
- "description": "If the table has mobile design",
9868
- "value": { "type": "boolean", "default": "false" }
9883
+ "name": "activeHref",
9884
+ "description": "The active href of the side navigation, to explicitly set the active item, if not provided, it will be set based on the current location",
9885
+ "value": { "type": "string" }
9869
9886
  },
9870
9887
  {
9871
- "name": "caption",
9872
- "description": "The caption of the table",
9873
- "value": { "type": "string", "default": "''" }
9888
+ "name": "size",
9889
+ "description": "The size of the side navigation",
9890
+ "value": { "type": "'xs' | 'sm' | 'lg'", "default": "'xs'" }
9891
+ },
9892
+ {
9893
+ "name": "landmark",
9894
+ "description": "The landmark element to render. `aside` exposes a complementary landmark; `nav`\nexposes a navigation landmark, so the sidenav is listed when a screen-reader user\nasks for the page's navigation.\n\nDefaults to `aside` because that is what this component has always rendered, and\nchanging the landmark of every existing sidenav is not this component's call: a\nsidenav that is genuinely a sidebar should stay complementary. Set `nav` when the\nsidenav is the primary way to move around the view.",
9895
+ "value": { "type": "'aside' | 'nav'", "default": "'aside'" }
9874
9896
  }
9875
9897
  ],
9876
9898
  "slots": [
9899
+ { "name": "", "description": "The content of the side navigation." }
9900
+ ],
9901
+ "events": [
9877
9902
  {
9878
- "name": "",
9879
- "description": "The default slot. Accepts `dap-ds-table-row` elements."
9903
+ "name": "dds-item-click",
9904
+ "type": "{ href: string, event: Event }",
9905
+ "description": "Event fired when the side navigation item is clicked."
9880
9906
  }
9881
9907
  ],
9882
- "events": [],
9883
9908
  "js": {
9884
9909
  "properties": [
9885
- { "name": "role", "type": "string" },
9886
9910
  {
9887
- "name": "mobile",
9888
- "description": "If the table has mobile design",
9889
- "type": "boolean"
9911
+ "name": "label",
9912
+ "description": "The label of the side navigation, if aria label is not provided, it will be used as aria label",
9913
+ "type": "string"
9890
9914
  },
9891
9915
  {
9892
- "name": "caption",
9893
- "description": "The caption of the table",
9916
+ "name": "activeHref",
9917
+ "description": "The active href of the side navigation, to explicitly set the active item, if not provided, it will be set based on the current location",
9894
9918
  "type": "string"
9919
+ },
9920
+ {
9921
+ "name": "size",
9922
+ "description": "The size of the side navigation",
9923
+ "type": "'xs' | 'sm' | 'lg'"
9924
+ },
9925
+ {
9926
+ "name": "landmark",
9927
+ "description": "The landmark element to render. `aside` exposes a complementary landmark; `nav`\nexposes a navigation landmark, so the sidenav is listed when a screen-reader user\nasks for the page's navigation.\n\nDefaults to `aside` because that is what this component has always rendered, and\nchanging the landmark of every existing sidenav is not this component's call: a\nsidenav that is genuinely a sidebar should stay complementary. Set `nav` when the\nsidenav is the primary way to move around the view.",
9928
+ "type": "'aside' | 'nav'"
9895
9929
  }
9896
9930
  ],
9897
- "events": []
9931
+ "events": [
9932
+ {
9933
+ "name": "dds-item-click",
9934
+ "type": "{ href: string, event: Event }",
9935
+ "description": "Event fired when the side navigation item is clicked."
9936
+ }
9937
+ ]
9898
9938
  }
9899
9939
  },
9900
9940
  {
@@ -11291,153 +11331,52 @@
11291
11331
  "properties": [
11292
11332
  {
11293
11333
  "name": "for",
11294
- "description": "The id of the form element that the label is associated with.",
11295
- "type": "string | undefined"
11296
- },
11297
- {
11298
- "name": "renderAs",
11299
- "description": "Whether the label should be rendered as text or a <label> tag. Default is label.",
11300
- "type": "string"
11301
- },
11302
- {
11303
- "name": "noMargin",
11304
- "description": "Whether the label should have no margin.",
11305
- "type": "boolean"
11306
- },
11307
- {
11308
- "name": "optionalLabel",
11309
- "description": "Label of optional text",
11310
- "type": "string"
11311
- },
11312
- {
11313
- "name": "subtle",
11314
- "description": "Text weight of the label.",
11315
- "type": "boolean"
11316
- },
11317
- {
11318
- "name": "optional",
11319
- "description": "If the label is optional.",
11320
- "type": "boolean"
11321
- },
11322
- {
11323
- "name": "required",
11324
- "description": "If the label is required.",
11325
- "type": "boolean"
11326
- },
11327
- {
11328
- "name": "requiredLabel",
11329
- "description": "Indicator of required text. (default: '*')",
11330
- "type": "string"
11331
- },
11332
- {
11333
- "name": "label",
11334
- "description": "The label text.",
11335
- "type": "string"
11336
- },
11337
- {
11338
- "name": "hideLabel",
11339
- "description": "Visually hides the label while keeping it available to assistive technology. (default: false)",
11340
- "type": "boolean"
11341
- }
11342
- ],
11343
- "events": []
11344
- }
11345
- },
11346
- {
11347
- "name": "dap-ds-input-group",
11348
- "description": "An input group is a container for inputs.\n---\n\n\n### **Slots:**\n - _default_ - The content of the input group items.\n- **feedback-icon** - The custom icon of the feedback.\n\n### **CSS Parts:**\n - **base** - The main input group container.\n- **label** - The label of the input group.\n- **description** - The description of the input group.\n- **tooltip** - The tooltip of the input group.\n- **container** - The container of the input group items.",
11349
- "doc-url": "",
11350
- "attributes": [],
11351
- "slots": [
11352
- {
11353
- "name": "",
11354
- "description": "The content of the input group items."
11355
- },
11356
- {
11357
- "name": "feedback-icon",
11358
- "description": "The custom icon of the feedback."
11359
- }
11360
- ],
11361
- "events": [],
11362
- "js": {
11363
- "properties": [
11364
- {
11365
- "name": "allInputs",
11366
- "type": "DapDSCheckbox[] | DapDSSwitch[]"
11367
- },
11368
- {
11369
- "name": "label",
11370
- "description": "The label of the input group.",
11371
- "type": "string"
11372
- },
11373
- {
11374
- "name": "hideLabel",
11375
- "description": "Visually hides the label while keeping it available to assistive technology. (default: false)",
11376
- "type": "boolean"
11377
- },
11378
- {
11379
- "name": "description",
11380
- "description": "The description of the input group.",
11381
- "type": "string"
11382
- },
11383
- {
11384
- "name": "tooltip",
11385
- "description": "The tooltip of the input group.",
11386
- "type": "string"
11387
- },
11388
- {
11389
- "name": "tooltipPlacement",
11390
- "description": "The tooltip placement of the input group.",
11391
- "type": "'top' | 'right' | 'bottom' | 'left'"
11392
- },
11393
- {
11394
- "name": "tooltipAriaLabel",
11395
- "description": "The aria label of the tooltip.",
11396
- "type": "string"
11397
- },
11398
- {
11399
- "name": "optionalLabel",
11400
- "description": "The label of the input group when it is optional.",
11401
- "type": "string"
11334
+ "description": "The id of the form element that the label is associated with.",
11335
+ "type": "string | undefined"
11402
11336
  },
11403
11337
  {
11404
- "name": "requiredLabel",
11405
- "description": "The indicator of the input group when it is required. (default: '*')",
11338
+ "name": "renderAs",
11339
+ "description": "Whether the label should be rendered as text or a <label> tag. Default is label.",
11406
11340
  "type": "string"
11407
11341
  },
11408
11342
  {
11409
- "name": "disabled",
11410
- "description": "Whether the input group is disabled.",
11343
+ "name": "noMargin",
11344
+ "description": "Whether the label should have no margin.",
11411
11345
  "type": "boolean"
11412
11346
  },
11413
11347
  {
11414
- "name": "size",
11415
- "description": "The size of the input group. Default is `sm`.",
11416
- "type": "'xs' | 'sm' | 'lg'"
11348
+ "name": "optionalLabel",
11349
+ "description": "Label of optional text",
11350
+ "type": "string"
11417
11351
  },
11418
11352
  {
11419
- "name": "required",
11420
- "description": "Whether the input group is required.",
11353
+ "name": "subtle",
11354
+ "description": "Text weight of the label.",
11421
11355
  "type": "boolean"
11422
11356
  },
11423
11357
  {
11424
11358
  "name": "optional",
11425
- "description": "Whether the input group is optional.",
11359
+ "description": "If the label is optional.",
11426
11360
  "type": "boolean"
11427
11361
  },
11428
11362
  {
11429
- "name": "feedback",
11430
- "description": "The feedback of the input.",
11363
+ "name": "required",
11364
+ "description": "If the label is required.",
11365
+ "type": "boolean"
11366
+ },
11367
+ {
11368
+ "name": "requiredLabel",
11369
+ "description": "Indicator of required text. (default: '*')",
11431
11370
  "type": "string"
11432
11371
  },
11433
11372
  {
11434
- "name": "feedbackType",
11435
- "description": "The type of the feedback.",
11373
+ "name": "label",
11374
+ "description": "The label text.",
11436
11375
  "type": "string"
11437
11376
  },
11438
11377
  {
11439
- "name": "subtle",
11440
- "description": "Whether the input group label is subtle.",
11378
+ "name": "hideLabel",
11379
+ "description": "Visually hides the label while keeping it available to assistive technology. (default: false)",
11441
11380
  "type": "boolean"
11442
11381
  }
11443
11382
  ],
@@ -11586,6 +11525,107 @@
11586
11525
  ]
11587
11526
  }
11588
11527
  },
11528
+ {
11529
+ "name": "dap-ds-input-group",
11530
+ "description": "An input group is a container for inputs.\n---\n\n\n### **Slots:**\n - _default_ - The content of the input group items.\n- **feedback-icon** - The custom icon of the feedback.\n\n### **CSS Parts:**\n - **base** - The main input group container.\n- **label** - The label of the input group.\n- **description** - The description of the input group.\n- **tooltip** - The tooltip of the input group.\n- **container** - The container of the input group items.",
11531
+ "doc-url": "",
11532
+ "attributes": [],
11533
+ "slots": [
11534
+ {
11535
+ "name": "",
11536
+ "description": "The content of the input group items."
11537
+ },
11538
+ {
11539
+ "name": "feedback-icon",
11540
+ "description": "The custom icon of the feedback."
11541
+ }
11542
+ ],
11543
+ "events": [],
11544
+ "js": {
11545
+ "properties": [
11546
+ {
11547
+ "name": "allInputs",
11548
+ "type": "DapDSCheckbox[] | DapDSSwitch[]"
11549
+ },
11550
+ {
11551
+ "name": "label",
11552
+ "description": "The label of the input group.",
11553
+ "type": "string"
11554
+ },
11555
+ {
11556
+ "name": "hideLabel",
11557
+ "description": "Visually hides the label while keeping it available to assistive technology. (default: false)",
11558
+ "type": "boolean"
11559
+ },
11560
+ {
11561
+ "name": "description",
11562
+ "description": "The description of the input group.",
11563
+ "type": "string"
11564
+ },
11565
+ {
11566
+ "name": "tooltip",
11567
+ "description": "The tooltip of the input group.",
11568
+ "type": "string"
11569
+ },
11570
+ {
11571
+ "name": "tooltipPlacement",
11572
+ "description": "The tooltip placement of the input group.",
11573
+ "type": "'top' | 'right' | 'bottom' | 'left'"
11574
+ },
11575
+ {
11576
+ "name": "tooltipAriaLabel",
11577
+ "description": "The aria label of the tooltip.",
11578
+ "type": "string"
11579
+ },
11580
+ {
11581
+ "name": "optionalLabel",
11582
+ "description": "The label of the input group when it is optional.",
11583
+ "type": "string"
11584
+ },
11585
+ {
11586
+ "name": "requiredLabel",
11587
+ "description": "The indicator of the input group when it is required. (default: '*')",
11588
+ "type": "string"
11589
+ },
11590
+ {
11591
+ "name": "disabled",
11592
+ "description": "Whether the input group is disabled.",
11593
+ "type": "boolean"
11594
+ },
11595
+ {
11596
+ "name": "size",
11597
+ "description": "The size of the input group. Default is `sm`.",
11598
+ "type": "'xs' | 'sm' | 'lg'"
11599
+ },
11600
+ {
11601
+ "name": "required",
11602
+ "description": "Whether the input group is required.",
11603
+ "type": "boolean"
11604
+ },
11605
+ {
11606
+ "name": "optional",
11607
+ "description": "Whether the input group is optional.",
11608
+ "type": "boolean"
11609
+ },
11610
+ {
11611
+ "name": "feedback",
11612
+ "description": "The feedback of the input.",
11613
+ "type": "string"
11614
+ },
11615
+ {
11616
+ "name": "feedbackType",
11617
+ "description": "The type of the feedback.",
11618
+ "type": "string"
11619
+ },
11620
+ {
11621
+ "name": "subtle",
11622
+ "description": "Whether the input group label is subtle.",
11623
+ "type": "boolean"
11624
+ }
11625
+ ],
11626
+ "events": []
11627
+ }
11628
+ },
11589
11629
  {
11590
11630
  "name": "dap-ds-icon-arrow-down-line",
11591
11631
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
@@ -11852,7 +11892,7 @@
11852
11892
  }
11853
11893
  },
11854
11894
  {
11855
- "name": "dap-ds-icon-arrow-left-line",
11895
+ "name": "dap-ds-icon-arrow-left-s-fill",
11856
11896
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
11857
11897
  "doc-url": "",
11858
11898
  "attributes": [
@@ -11905,7 +11945,7 @@
11905
11945
  }
11906
11946
  },
11907
11947
  {
11908
- "name": "dap-ds-icon-arrow-left-s-fill",
11948
+ "name": "dap-ds-icon-arrow-left-line",
11909
11949
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
11910
11950
  "doc-url": "",
11911
11951
  "attributes": [
@@ -12011,7 +12051,7 @@
12011
12051
  }
12012
12052
  },
12013
12053
  {
12014
- "name": "dap-ds-icon-arrow-left-up-line",
12054
+ "name": "dap-ds-icon-arrow-right-down-line",
12015
12055
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
12016
12056
  "doc-url": "",
12017
12057
  "attributes": [
@@ -12064,7 +12104,7 @@
12064
12104
  }
12065
12105
  },
12066
12106
  {
12067
- "name": "dap-ds-icon-arrow-right-down-line",
12107
+ "name": "dap-ds-icon-arrow-right-l-line",
12068
12108
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
12069
12109
  "doc-url": "",
12070
12110
  "attributes": [
@@ -12117,7 +12157,7 @@
12117
12157
  }
12118
12158
  },
12119
12159
  {
12120
- "name": "dap-ds-icon-arrow-right-l-line",
12160
+ "name": "dap-ds-icon-arrow-left-up-line",
12121
12161
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
12122
12162
  "doc-url": "",
12123
12163
  "attributes": [
@@ -13442,7 +13482,7 @@
13442
13482
  }
13443
13483
  },
13444
13484
  {
13445
- "name": "dap-ds-icon-cookie-line",
13485
+ "name": "dap-ds-icon-add-line",
13446
13486
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
13447
13487
  "doc-url": "",
13448
13488
  "attributes": [
@@ -13495,7 +13535,7 @@
13495
13535
  }
13496
13536
  },
13497
13537
  {
13498
- "name": "dap-ds-icon-account-circle-fill",
13538
+ "name": "dap-ds-icon-cookie-line",
13499
13539
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
13500
13540
  "doc-url": "",
13501
13541
  "attributes": [
@@ -13548,7 +13588,7 @@
13548
13588
  }
13549
13589
  },
13550
13590
  {
13551
- "name": "dap-ds-icon-account-circle-line",
13591
+ "name": "dap-ds-icon-alert-fill",
13552
13592
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
13553
13593
  "doc-url": "",
13554
13594
  "attributes": [
@@ -13601,7 +13641,7 @@
13601
13641
  }
13602
13642
  },
13603
13643
  {
13604
- "name": "dap-ds-icon-user-fill",
13644
+ "name": "dap-ds-icon-alert-line",
13605
13645
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
13606
13646
  "doc-url": "",
13607
13647
  "attributes": [
@@ -13654,7 +13694,7 @@
13654
13694
  }
13655
13695
  },
13656
13696
  {
13657
- "name": "dap-ds-icon-user-line",
13697
+ "name": "dap-ds-icon-check-line",
13658
13698
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
13659
13699
  "doc-url": "",
13660
13700
  "attributes": [
@@ -13707,7 +13747,7 @@
13707
13747
  }
13708
13748
  },
13709
13749
  {
13710
- "name": "dap-ds-icon-add-line",
13750
+ "name": "dap-ds-icon-check-line2",
13711
13751
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
13712
13752
  "doc-url": "",
13713
13753
  "attributes": [
@@ -13760,7 +13800,7 @@
13760
13800
  }
13761
13801
  },
13762
13802
  {
13763
- "name": "dap-ds-icon-alert-fill",
13803
+ "name": "dap-ds-icon-checkbox-blank-circle-fill",
13764
13804
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
13765
13805
  "doc-url": "",
13766
13806
  "attributes": [
@@ -13813,7 +13853,7 @@
13813
13853
  }
13814
13854
  },
13815
13855
  {
13816
- "name": "dap-ds-icon-alert-line",
13856
+ "name": "dap-ds-icon-checkbox-blank-circle-fill-check",
13817
13857
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
13818
13858
  "doc-url": "",
13819
13859
  "attributes": [
@@ -13866,7 +13906,7 @@
13866
13906
  }
13867
13907
  },
13868
13908
  {
13869
- "name": "dap-ds-icon-check-line",
13909
+ "name": "dap-ds-icon-checkbox-blank-circle-line",
13870
13910
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
13871
13911
  "doc-url": "",
13872
13912
  "attributes": [
@@ -13919,7 +13959,7 @@
13919
13959
  }
13920
13960
  },
13921
13961
  {
13922
- "name": "dap-ds-icon-check-line2",
13962
+ "name": "dap-ds-icon-checkbox-circle-fill",
13923
13963
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
13924
13964
  "doc-url": "",
13925
13965
  "attributes": [
@@ -13972,7 +14012,7 @@
13972
14012
  }
13973
14013
  },
13974
14014
  {
13975
- "name": "dap-ds-icon-checkbox-blank-circle-fill",
14015
+ "name": "dap-ds-icon-checkbox-circle-line",
13976
14016
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
13977
14017
  "doc-url": "",
13978
14018
  "attributes": [
@@ -14025,7 +14065,7 @@
14025
14065
  }
14026
14066
  },
14027
14067
  {
14028
- "name": "dap-ds-icon-checkbox-blank-circle-fill-check",
14068
+ "name": "dap-ds-icon-close-circle-fill",
14029
14069
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
14030
14070
  "doc-url": "",
14031
14071
  "attributes": [
@@ -14078,7 +14118,7 @@
14078
14118
  }
14079
14119
  },
14080
14120
  {
14081
- "name": "dap-ds-icon-checkbox-blank-circle-line",
14121
+ "name": "dap-ds-icon-close-circle-line",
14082
14122
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
14083
14123
  "doc-url": "",
14084
14124
  "attributes": [
@@ -14131,7 +14171,7 @@
14131
14171
  }
14132
14172
  },
14133
14173
  {
14134
- "name": "dap-ds-icon-checkbox-circle-fill",
14174
+ "name": "dap-ds-icon-close-fill",
14135
14175
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
14136
14176
  "doc-url": "",
14137
14177
  "attributes": [
@@ -14184,7 +14224,7 @@
14184
14224
  }
14185
14225
  },
14186
14226
  {
14187
- "name": "dap-ds-icon-checkbox-circle-line",
14227
+ "name": "dap-ds-icon-close-line",
14188
14228
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
14189
14229
  "doc-url": "",
14190
14230
  "attributes": [
@@ -14237,7 +14277,7 @@
14237
14277
  }
14238
14278
  },
14239
14279
  {
14240
- "name": "dap-ds-icon-close-circle-fill",
14280
+ "name": "dap-ds-icon-delete-bin-fill",
14241
14281
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
14242
14282
  "doc-url": "",
14243
14283
  "attributes": [
@@ -14290,7 +14330,7 @@
14290
14330
  }
14291
14331
  },
14292
14332
  {
14293
- "name": "dap-ds-icon-close-circle-line",
14333
+ "name": "dap-ds-icon-delete-bin-line",
14294
14334
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
14295
14335
  "doc-url": "",
14296
14336
  "attributes": [
@@ -14343,7 +14383,7 @@
14343
14383
  }
14344
14384
  },
14345
14385
  {
14346
- "name": "dap-ds-icon-close-fill",
14386
+ "name": "dap-ds-icon-download-line",
14347
14387
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
14348
14388
  "doc-url": "",
14349
14389
  "attributes": [
@@ -14396,7 +14436,7 @@
14396
14436
  }
14397
14437
  },
14398
14438
  {
14399
- "name": "dap-ds-icon-close-line",
14439
+ "name": "dap-ds-icon-error-warning-fill",
14400
14440
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
14401
14441
  "doc-url": "",
14402
14442
  "attributes": [
@@ -14449,7 +14489,7 @@
14449
14489
  }
14450
14490
  },
14451
14491
  {
14452
- "name": "dap-ds-icon-delete-bin-fill",
14492
+ "name": "dap-ds-icon-error-warning-line",
14453
14493
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
14454
14494
  "doc-url": "",
14455
14495
  "attributes": [
@@ -14502,7 +14542,7 @@
14502
14542
  }
14503
14543
  },
14504
14544
  {
14505
- "name": "dap-ds-icon-delete-bin-line",
14545
+ "name": "dap-ds-icon-external-link-line",
14506
14546
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
14507
14547
  "doc-url": "",
14508
14548
  "attributes": [
@@ -14555,7 +14595,7 @@
14555
14595
  }
14556
14596
  },
14557
14597
  {
14558
- "name": "dap-ds-icon-download-line",
14598
+ "name": "dap-ds-icon-eye-line",
14559
14599
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
14560
14600
  "doc-url": "",
14561
14601
  "attributes": [
@@ -14608,7 +14648,7 @@
14608
14648
  }
14609
14649
  },
14610
14650
  {
14611
- "name": "dap-ds-icon-error-warning-fill",
14651
+ "name": "dap-ds-icon-eye-off-line",
14612
14652
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
14613
14653
  "doc-url": "",
14614
14654
  "attributes": [
@@ -14661,7 +14701,7 @@
14661
14701
  }
14662
14702
  },
14663
14703
  {
14664
- "name": "dap-ds-icon-error-warning-line",
14704
+ "name": "dap-ds-icon-forbid-fill",
14665
14705
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
14666
14706
  "doc-url": "",
14667
14707
  "attributes": [
@@ -14714,7 +14754,7 @@
14714
14754
  }
14715
14755
  },
14716
14756
  {
14717
- "name": "dap-ds-icon-external-link-line",
14757
+ "name": "dap-ds-icon-information-2-fill",
14718
14758
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
14719
14759
  "doc-url": "",
14720
14760
  "attributes": [
@@ -14767,7 +14807,7 @@
14767
14807
  }
14768
14808
  },
14769
14809
  {
14770
- "name": "dap-ds-icon-eye-line",
14810
+ "name": "dap-ds-icon-information-fill",
14771
14811
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
14772
14812
  "doc-url": "",
14773
14813
  "attributes": [
@@ -14820,7 +14860,7 @@
14820
14860
  }
14821
14861
  },
14822
14862
  {
14823
- "name": "dap-ds-icon-eye-off-line",
14863
+ "name": "dap-ds-icon-information-line",
14824
14864
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
14825
14865
  "doc-url": "",
14826
14866
  "attributes": [
@@ -14873,7 +14913,7 @@
14873
14913
  }
14874
14914
  },
14875
14915
  {
14876
- "name": "dap-ds-icon-forbid-fill",
14916
+ "name": "dap-ds-icon-lightbulb-fill",
14877
14917
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
14878
14918
  "doc-url": "",
14879
14919
  "attributes": [
@@ -14926,7 +14966,7 @@
14926
14966
  }
14927
14967
  },
14928
14968
  {
14929
- "name": "dap-ds-icon-information-2-fill",
14969
+ "name": "dap-ds-icon-loading-spinner",
14930
14970
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
14931
14971
  "doc-url": "",
14932
14972
  "attributes": [
@@ -14979,7 +15019,7 @@
14979
15019
  }
14980
15020
  },
14981
15021
  {
14982
- "name": "dap-ds-icon-information-fill",
15022
+ "name": "dap-ds-icon-lock-fill",
14983
15023
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
14984
15024
  "doc-url": "",
14985
15025
  "attributes": [
@@ -15032,7 +15072,7 @@
15032
15072
  }
15033
15073
  },
15034
15074
  {
15035
- "name": "dap-ds-icon-information-line",
15075
+ "name": "dap-ds-icon-lock-line",
15036
15076
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15037
15077
  "doc-url": "",
15038
15078
  "attributes": [
@@ -15085,7 +15125,7 @@
15085
15125
  }
15086
15126
  },
15087
15127
  {
15088
- "name": "dap-ds-icon-lightbulb-fill",
15128
+ "name": "dap-ds-icon-menu-line",
15089
15129
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15090
15130
  "doc-url": "",
15091
15131
  "attributes": [
@@ -15138,7 +15178,7 @@
15138
15178
  }
15139
15179
  },
15140
15180
  {
15141
- "name": "dap-ds-icon-loading-spinner",
15181
+ "name": "dap-ds-icon-menu-line-s",
15142
15182
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15143
15183
  "doc-url": "",
15144
15184
  "attributes": [
@@ -15191,7 +15231,7 @@
15191
15231
  }
15192
15232
  },
15193
15233
  {
15194
- "name": "dap-ds-icon-lock-fill",
15234
+ "name": "dap-ds-icon-more-2-line",
15195
15235
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15196
15236
  "doc-url": "",
15197
15237
  "attributes": [
@@ -15244,7 +15284,7 @@
15244
15284
  }
15245
15285
  },
15246
15286
  {
15247
- "name": "dap-ds-icon-lock-line",
15287
+ "name": "dap-ds-icon-more-line",
15248
15288
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15249
15289
  "doc-url": "",
15250
15290
  "attributes": [
@@ -15297,7 +15337,7 @@
15297
15337
  }
15298
15338
  },
15299
15339
  {
15300
- "name": "dap-ds-icon-menu-line",
15340
+ "name": "dap-ds-icon-search-line",
15301
15341
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15302
15342
  "doc-url": "",
15303
15343
  "attributes": [
@@ -15350,7 +15390,7 @@
15350
15390
  }
15351
15391
  },
15352
15392
  {
15353
- "name": "dap-ds-icon-menu-line-s",
15393
+ "name": "dap-ds-icon-share-line",
15354
15394
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15355
15395
  "doc-url": "",
15356
15396
  "attributes": [
@@ -15403,7 +15443,7 @@
15403
15443
  }
15404
15444
  },
15405
15445
  {
15406
- "name": "dap-ds-icon-more-2-line",
15446
+ "name": "dap-ds-icon-shield-check-fill",
15407
15447
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15408
15448
  "doc-url": "",
15409
15449
  "attributes": [
@@ -15456,7 +15496,7 @@
15456
15496
  }
15457
15497
  },
15458
15498
  {
15459
- "name": "dap-ds-icon-more-line",
15499
+ "name": "dap-ds-icon-shield-check-line",
15460
15500
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15461
15501
  "doc-url": "",
15462
15502
  "attributes": [
@@ -15509,7 +15549,7 @@
15509
15549
  }
15510
15550
  },
15511
15551
  {
15512
- "name": "dap-ds-icon-search-line",
15552
+ "name": "dap-ds-icon-star-fill",
15513
15553
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15514
15554
  "doc-url": "",
15515
15555
  "attributes": [
@@ -15562,7 +15602,7 @@
15562
15602
  }
15563
15603
  },
15564
15604
  {
15565
- "name": "dap-ds-icon-share-line",
15605
+ "name": "dap-ds-icon-subtract-line",
15566
15606
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15567
15607
  "doc-url": "",
15568
15608
  "attributes": [
@@ -15615,7 +15655,7 @@
15615
15655
  }
15616
15656
  },
15617
15657
  {
15618
- "name": "dap-ds-icon-shield-check-fill",
15658
+ "name": "dap-ds-icon-subtract-line2",
15619
15659
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15620
15660
  "doc-url": "",
15621
15661
  "attributes": [
@@ -15668,7 +15708,7 @@
15668
15708
  }
15669
15709
  },
15670
15710
  {
15671
- "name": "dap-ds-icon-shield-check-line",
15711
+ "name": "dap-ds-icon-time-fill",
15672
15712
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15673
15713
  "doc-url": "",
15674
15714
  "attributes": [
@@ -15721,7 +15761,7 @@
15721
15761
  }
15722
15762
  },
15723
15763
  {
15724
- "name": "dap-ds-icon-star-fill",
15764
+ "name": "dap-ds-icon-time-line",
15725
15765
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15726
15766
  "doc-url": "",
15727
15767
  "attributes": [
@@ -15774,7 +15814,7 @@
15774
15814
  }
15775
15815
  },
15776
15816
  {
15777
- "name": "dap-ds-icon-subtract-line",
15817
+ "name": "dap-ds-icon-upload-2-fill",
15778
15818
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15779
15819
  "doc-url": "",
15780
15820
  "attributes": [
@@ -15827,7 +15867,7 @@
15827
15867
  }
15828
15868
  },
15829
15869
  {
15830
- "name": "dap-ds-icon-subtract-line2",
15870
+ "name": "dap-ds-icon-upload-2-line",
15831
15871
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15832
15872
  "doc-url": "",
15833
15873
  "attributes": [
@@ -15880,7 +15920,7 @@
15880
15920
  }
15881
15921
  },
15882
15922
  {
15883
- "name": "dap-ds-icon-time-fill",
15923
+ "name": "dap-ds-icon-upload-line",
15884
15924
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15885
15925
  "doc-url": "",
15886
15926
  "attributes": [
@@ -15933,7 +15973,7 @@
15933
15973
  }
15934
15974
  },
15935
15975
  {
15936
- "name": "dap-ds-icon-time-line",
15976
+ "name": "dap-ds-icon-zoom-in-line",
15937
15977
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15938
15978
  "doc-url": "",
15939
15979
  "attributes": [
@@ -15986,7 +16026,7 @@
15986
16026
  }
15987
16027
  },
15988
16028
  {
15989
- "name": "dap-ds-icon-upload-2-fill",
16029
+ "name": "dap-ds-icon-zoom-out-line",
15990
16030
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15991
16031
  "doc-url": "",
15992
16032
  "attributes": [
@@ -16039,7 +16079,7 @@
16039
16079
  }
16040
16080
  },
16041
16081
  {
16042
- "name": "dap-ds-icon-upload-2-line",
16082
+ "name": "dap-ds-icon-account-circle-fill",
16043
16083
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
16044
16084
  "doc-url": "",
16045
16085
  "attributes": [
@@ -16092,7 +16132,7 @@
16092
16132
  }
16093
16133
  },
16094
16134
  {
16095
- "name": "dap-ds-icon-upload-line",
16135
+ "name": "dap-ds-icon-account-circle-line",
16096
16136
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
16097
16137
  "doc-url": "",
16098
16138
  "attributes": [
@@ -16145,7 +16185,7 @@
16145
16185
  }
16146
16186
  },
16147
16187
  {
16148
- "name": "dap-ds-icon-zoom-in-line",
16188
+ "name": "dap-ds-icon-user-fill",
16149
16189
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
16150
16190
  "doc-url": "",
16151
16191
  "attributes": [
@@ -16198,7 +16238,7 @@
16198
16238
  }
16199
16239
  },
16200
16240
  {
16201
- "name": "dap-ds-icon-zoom-out-line",
16241
+ "name": "dap-ds-icon-user-line",
16202
16242
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
16203
16243
  "doc-url": "",
16204
16244
  "attributes": [