dap-design-system 0.60.1 → 0.60.2

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 (18) hide show
  1. package/dist/components/combobox/comboboxBase.d.ts +8 -0
  2. package/dist/components/icon-button/icon-button.component.d.ts +1 -0
  3. package/dist/components/search/search.component.d.ts +2 -0
  4. package/dist/{components-BgYJ2t-9.js → components-CYRx8ecv.js} +366 -356
  5. package/dist/components-CYRx8ecv.js.map +1 -0
  6. package/dist/components.js +1 -1
  7. package/dist/dds.js +1 -1
  8. package/dist/manifest/types/vue/index.d.ts +279 -276
  9. package/dist/manifest/vscode.html-custom-data.json +299 -299
  10. package/dist/manifest/web-types.json +664 -659
  11. package/dist/react/dap-ds-icon-button/index.d.ts +1 -0
  12. package/dist/react/dap-ds-search/index.d.ts +2 -0
  13. package/dist/react/index.d.ts +7 -7
  14. package/dist/react-types.ts +7 -7
  15. package/dist/react.js +88 -88
  16. package/dist/react.js.map +1 -1
  17. package/package.json +1 -1
  18. package/dist/components-BgYJ2t-9.js.map +0 -1
package/dist/manifest/web-types.json CHANGED
@@ -113,105 +113,6 @@
113
113
  ]
114
114
  }
115
115
  },
116
- {
117
- "name": "dap-ds-avatar-group",
118
- "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.",
119
- "doc-url": "",
120
- "attributes": [
121
- {
122
- "name": "layout",
123
- "description": "Layout type for the avatar group",
124
- "value": { "type": "'stack' | 'grid'", "default": "'stack'" }
125
- },
126
- {
127
- "name": "max",
128
- "description": "Maximum number of avatars to show before showing overflow",
129
- "value": { "type": "number", "default": "3" }
130
- },
131
- {
132
- "name": "show-total",
133
- "description": "Whether to show the total count in overflow indicator",
134
- "value": { "type": "boolean", "default": "false" }
135
- },
136
- {
137
- "name": "interactive-overflow",
138
- "description": "Interactive overflow indicator",
139
- "value": { "type": "boolean", "default": "false" }
140
- },
141
- {
142
- "name": "label",
143
- "description": "Accessible label for the avatar group",
144
- "value": { "type": "string" }
145
- },
146
- {
147
- "name": "overflow-label",
148
- "description": "Accessible label for the overflow indicator",
149
- "value": { "type": "string" }
150
- }
151
- ],
152
- "slots": [
153
- {
154
- "name": "",
155
- "description": "The avatars to display in the group."
156
- }
157
- ],
158
- "events": [
159
- {
160
- "name": "dds-overflow-click",
161
- "description": "Fired when the overflow indicator is clicked."
162
- }
163
- ],
164
- "js": {
165
- "properties": [
166
- {
167
- "name": "layout",
168
- "description": "Layout type for the avatar group",
169
- "type": "'stack' | 'grid'"
170
- },
171
- {
172
- "name": "max",
173
- "description": "Maximum number of avatars to show before showing overflow",
174
- "type": "number"
175
- },
176
- {
177
- "name": "showTotal",
178
- "description": "Whether to show the total count in overflow indicator",
179
- "type": "boolean"
180
- },
181
- {
182
- "name": "interactiveOverflow",
183
- "description": "Interactive overflow indicator",
184
- "type": "boolean"
185
- },
186
- {
187
- "name": "label",
188
- "description": "Accessible label for the avatar group",
189
- "type": "string"
190
- },
191
- {
192
- "name": "overflowLabel",
193
- "description": "Accessible label for the overflow indicator",
194
- "type": "string"
195
- },
196
- {
197
- "name": "size",
198
- "description": "The size of avatars in the group. Default is `md`. See SizedMixin.",
199
- "type": "'xxs' | 'xs' | 'sm' | 'md' | 'lg'"
200
- },
201
- {
202
- "name": "sizeMap",
203
- "description": "Responsive size map (e.g. \"md:lg\"); see SizedMixin.",
204
- "type": "string"
205
- }
206
- ],
207
- "events": [
208
- {
209
- "name": "dds-overflow-click",
210
- "description": "Fired when the overflow indicator is clicked."
211
- }
212
- ]
213
- }
214
- },
215
116
  {
216
117
  "name": "dap-ds-avatar",
217
118
  "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.",
@@ -370,60 +271,39 @@
370
271
  }
371
272
  },
372
273
  {
373
- "name": "dap-ds-badge",
374
- "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.",
274
+ "name": "dap-ds-accordion-group",
275
+ "description": "An accordion group is a collection of accordion components.\n---\n\n\n### **Slots:**\n - _default_ - The content of the accordion group.\n\n### **CSS Properties:**\n - **--dds-accordion-group-spacing** - Controls the gap between accordion items (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-accordion-group-border-color** - Controls the border color (default: var(--dds-border-neutral-subtle)) _(default: undefined)_\n- **--dds-accordion-group-border-width** - Controls the border width (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-accordion-group-border-radius** - Controls the border radius (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-accordion-group-background** - Controls the background color (default: transparent) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main accordion group container.",
375
276
  "doc-url": "",
376
277
  "attributes": [
377
278
  {
378
- "name": "type",
379
- "description": "The type of the badge",
380
- "value": {
381
- "type": "'neutral' | 'brand' | 'info' | 'positive' | 'warning' | 'negative'",
382
- "default": "'neutral'"
383
- }
384
- },
385
- {
386
- "name": "icon",
387
- "description": "The icon of the badge, this is a name of a built in icon",
388
- "value": { "type": "string | undefined" }
279
+ "name": "autoClose",
280
+ "description": "Whether to close other accordions when one is opened.",
281
+ "value": { "type": "string", "default": "'true'" }
389
282
  },
390
283
  {
391
- "name": "live",
392
- "description": "Whether the badge represents dynamic content that should announce changes",
393
- "value": { "type": "boolean", "default": "false" }
284
+ "name": "variant",
285
+ "description": "The variant of the accordion",
286
+ "value": {
287
+ "type": "'default' | 'collapsed' | 'clean' | 'clean-collapsed'",
288
+ "default": "'default'"
289
+ }
394
290
  }
395
291
  ],
396
292
  "slots": [
397
- { "name": "", "description": "The content of the badge." },
398
- { "name": "icon", "description": "The icon of the badge." }
293
+ { "name": "", "description": "The content of the accordion group." }
399
294
  ],
400
295
  "events": [],
401
296
  "js": {
402
297
  "properties": [
403
298
  {
404
- "name": "type",
405
- "description": "The type of the badge",
406
- "type": "'neutral' | 'brand' | 'info' | 'positive' | 'warning' | 'negative'"
407
- },
408
- {
409
- "name": "icon",
410
- "description": "The icon of the badge, this is a name of a built in icon",
411
- "type": "string | undefined"
412
- },
413
- {
414
- "name": "live",
415
- "description": "Whether the badge represents dynamic content that should announce changes",
416
- "type": "boolean"
417
- },
418
- {
419
- "name": "size",
420
- "description": "The size of the badge. Default is `sm`.",
421
- "type": "'sm' | 'lg'"
299
+ "name": "autoClose",
300
+ "description": "Whether to close other accordions when one is opened.",
301
+ "type": "string"
422
302
  },
423
303
  {
424
- "name": "sizeMap",
425
- "description": "Responsive size map (e.g. \"md:lg\").",
426
- "type": "string"
304
+ "name": "variant",
305
+ "description": "The variant of the accordion",
306
+ "type": "'default' | 'collapsed' | 'clean' | 'clean-collapsed'"
427
307
  }
428
308
  ],
429
309
  "events": []
@@ -457,39 +337,159 @@
457
337
  }
458
338
  },
459
339
  {
460
- "name": "dap-ds-accordion-group",
461
- "description": "An accordion group is a collection of accordion components.\n---\n\n\n### **Slots:**\n - _default_ - The content of the accordion group.\n\n### **CSS Properties:**\n - **--dds-accordion-group-spacing** - Controls the gap between accordion items (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-accordion-group-border-color** - Controls the border color (default: var(--dds-border-neutral-subtle)) _(default: undefined)_\n- **--dds-accordion-group-border-width** - Controls the border width (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-accordion-group-border-radius** - Controls the border radius (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-accordion-group-background** - Controls the background color (default: transparent) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main accordion group container.",
340
+ "name": "dap-ds-avatar-group",
341
+ "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.",
462
342
  "doc-url": "",
463
343
  "attributes": [
464
344
  {
465
- "name": "autoClose",
466
- "description": "Whether to close other accordions when one is opened.",
467
- "value": { "type": "string", "default": "'true'" }
345
+ "name": "layout",
346
+ "description": "Layout type for the avatar group",
347
+ "value": { "type": "'stack' | 'grid'", "default": "'stack'" }
468
348
  },
469
349
  {
470
- "name": "variant",
471
- "description": "The variant of the accordion",
350
+ "name": "max",
351
+ "description": "Maximum number of avatars to show before showing overflow",
352
+ "value": { "type": "number", "default": "3" }
353
+ },
354
+ {
355
+ "name": "show-total",
356
+ "description": "Whether to show the total count in overflow indicator",
357
+ "value": { "type": "boolean", "default": "false" }
358
+ },
359
+ {
360
+ "name": "interactive-overflow",
361
+ "description": "Interactive overflow indicator",
362
+ "value": { "type": "boolean", "default": "false" }
363
+ },
364
+ {
365
+ "name": "label",
366
+ "description": "Accessible label for the avatar group",
367
+ "value": { "type": "string" }
368
+ },
369
+ {
370
+ "name": "overflow-label",
371
+ "description": "Accessible label for the overflow indicator",
372
+ "value": { "type": "string" }
373
+ }
374
+ ],
375
+ "slots": [
376
+ {
377
+ "name": "",
378
+ "description": "The avatars to display in the group."
379
+ }
380
+ ],
381
+ "events": [
382
+ {
383
+ "name": "dds-overflow-click",
384
+ "description": "Fired when the overflow indicator is clicked."
385
+ }
386
+ ],
387
+ "js": {
388
+ "properties": [
389
+ {
390
+ "name": "layout",
391
+ "description": "Layout type for the avatar group",
392
+ "type": "'stack' | 'grid'"
393
+ },
394
+ {
395
+ "name": "max",
396
+ "description": "Maximum number of avatars to show before showing overflow",
397
+ "type": "number"
398
+ },
399
+ {
400
+ "name": "showTotal",
401
+ "description": "Whether to show the total count in overflow indicator",
402
+ "type": "boolean"
403
+ },
404
+ {
405
+ "name": "interactiveOverflow",
406
+ "description": "Interactive overflow indicator",
407
+ "type": "boolean"
408
+ },
409
+ {
410
+ "name": "label",
411
+ "description": "Accessible label for the avatar group",
412
+ "type": "string"
413
+ },
414
+ {
415
+ "name": "overflowLabel",
416
+ "description": "Accessible label for the overflow indicator",
417
+ "type": "string"
418
+ },
419
+ {
420
+ "name": "size",
421
+ "description": "The size of avatars in the group. Default is `md`. See SizedMixin.",
422
+ "type": "'xxs' | 'xs' | 'sm' | 'md' | 'lg'"
423
+ },
424
+ {
425
+ "name": "sizeMap",
426
+ "description": "Responsive size map (e.g. \"md:lg\"); see SizedMixin.",
427
+ "type": "string"
428
+ }
429
+ ],
430
+ "events": [
431
+ {
432
+ "name": "dds-overflow-click",
433
+ "description": "Fired when the overflow indicator is clicked."
434
+ }
435
+ ]
436
+ }
437
+ },
438
+ {
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.",
441
+ "doc-url": "",
442
+ "attributes": [
443
+ {
444
+ "name": "type",
445
+ "description": "The type of the badge",
472
446
  "value": {
473
- "type": "'default' | 'collapsed' | 'clean' | 'clean-collapsed'",
474
- "default": "'default'"
447
+ "type": "'neutral' | 'brand' | 'info' | 'positive' | 'warning' | 'negative'",
448
+ "default": "'neutral'"
475
449
  }
450
+ },
451
+ {
452
+ "name": "icon",
453
+ "description": "The icon of the badge, this is a name of a built in icon",
454
+ "value": { "type": "string | undefined" }
455
+ },
456
+ {
457
+ "name": "live",
458
+ "description": "Whether the badge represents dynamic content that should announce changes",
459
+ "value": { "type": "boolean", "default": "false" }
476
460
  }
477
461
  ],
478
462
  "slots": [
479
- { "name": "", "description": "The content of the accordion group." }
463
+ { "name": "", "description": "The content of the badge." },
464
+ { "name": "icon", "description": "The icon of the badge." }
480
465
  ],
481
466
  "events": [],
482
467
  "js": {
483
468
  "properties": [
484
469
  {
485
- "name": "autoClose",
486
- "description": "Whether to close other accordions when one is opened.",
487
- "type": "string"
470
+ "name": "type",
471
+ "description": "The type of the badge",
472
+ "type": "'neutral' | 'brand' | 'info' | 'positive' | 'warning' | 'negative'"
473
+ },
474
+ {
475
+ "name": "icon",
476
+ "description": "The icon of the badge, this is a name of a built in icon",
477
+ "type": "string | undefined"
478
+ },
479
+ {
480
+ "name": "live",
481
+ "description": "Whether the badge represents dynamic content that should announce changes",
482
+ "type": "boolean"
483
+ },
484
+ {
485
+ "name": "size",
486
+ "description": "The size of the badge. Default is `sm`.",
487
+ "type": "'sm' | 'lg'"
488
488
  },
489
489
  {
490
- "name": "variant",
491
- "description": "The variant of the accordion",
492
- "type": "'default' | 'collapsed' | 'clean' | 'clean-collapsed'"
490
+ "name": "sizeMap",
491
+ "description": "Responsive size map (e.g. \"md:lg\").",
492
+ "type": "string"
493
493
  }
494
494
  ],
495
495
  "events": []
@@ -878,257 +878,12 @@
878
878
  "name": "sizeMap",
879
879
  "description": "The size map of the button.",
880
880
  "type": "string"
881
- }
882
- ],
883
- "events": [
884
- {
885
- "name": "dds-loading-timeout",
886
- "description": "Emitted when the loading timeout is reached"
887
- }
888
- ]
889
- }
890
- },
891
- {
892
- "name": "dap-ds-calendar-cell",
893
- "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.",
894
- "doc-url": "",
895
- "attributes": [
896
- {
897
- "name": "selected",
898
- "description": "Whether the calendar cell is selected.",
899
- "value": { "type": "boolean", "default": "false" }
900
- },
901
- {
902
- "name": "disabledDay",
903
- "description": "Whether the calendar cell is disabled.",
904
- "value": { "type": "boolean", "default": "false" }
905
- },
906
- {
907
- "name": "today",
908
- "description": "Whether the calendar cell is today.",
909
- "value": { "type": "boolean", "default": "false" }
910
- },
911
- {
912
- "name": "outOfRange",
913
- "description": "Whether the calendar cell is out of range.",
914
- "value": { "type": "boolean", "default": "false" }
915
- },
916
- {
917
- "name": "header",
918
- "description": "Whether the calendar cell is a date header.",
919
- "value": { "type": "boolean", "default": "false" }
920
- },
921
- {
922
- "name": "focused",
923
- "description": "Whether the calendar cell is focused.",
924
- "value": { "type": "boolean", "default": "false" }
925
- },
926
- {
927
- "name": "rangestart",
928
- "description": "Whether the calendar cell is the start of a range.",
929
- "value": { "type": "boolean", "default": "false" }
930
- },
931
- {
932
- "name": "rangeend",
933
- "description": "Whether the calendar cell is the end of a range.",
934
- "value": { "type": "boolean", "default": "false" }
935
- },
936
- {
937
- "name": "inrange",
938
- "description": "Whether the calendar cell is in the middle of a range.",
939
- "value": { "type": "boolean", "default": "false" }
940
- },
941
- {
942
- "name": "locale",
943
- "description": "The locale of the calendar cell.",
944
- "value": {
945
- "type": "'hu' | 'en' | 'de'",
946
- "default": "dayjs.locale()"
947
- }
948
- }
949
- ],
950
- "slots": [
951
- { "name": "", "description": "The content of the calendar cell." }
952
- ],
953
- "events": [],
954
- "js": {
955
- "properties": [
956
- {
957
- "name": "value",
958
- "description": "The value of the calendar cell.",
959
- "type": "Dayjs"
960
- },
961
- {
962
- "name": "selected",
963
- "description": "Whether the calendar cell is selected.",
964
- "type": "boolean"
965
- },
966
- {
967
- "name": "disabledDay",
968
- "description": "Whether the calendar cell is disabled.",
969
- "type": "boolean"
970
- },
971
- {
972
- "name": "today",
973
- "description": "Whether the calendar cell is today.",
974
- "type": "boolean"
975
- },
976
- {
977
- "name": "outOfRange",
978
- "description": "Whether the calendar cell is out of range.",
979
- "type": "boolean"
980
- },
981
- {
982
- "name": "header",
983
- "description": "Whether the calendar cell is a date header.",
984
- "type": "boolean"
985
- },
986
- {
987
- "name": "focused",
988
- "description": "Whether the calendar cell is focused.",
989
- "type": "boolean"
990
- },
991
- {
992
- "name": "rangestart",
993
- "description": "Whether the calendar cell is the start of a range.",
994
- "type": "boolean"
995
- },
996
- {
997
- "name": "rangeend",
998
- "description": "Whether the calendar cell is the end of a range.",
999
- "type": "boolean"
1000
- },
1001
- {
1002
- "name": "inrange",
1003
- "description": "Whether the calendar cell is in the middle of a range.",
1004
- "type": "boolean"
1005
- },
1006
- {
1007
- "name": "locale",
1008
- "description": "The locale of the calendar cell.",
1009
- "type": "'hu' | 'en' | 'de'"
1010
- },
1011
- { "name": "label", "type": "string" },
1012
- { "name": "focusElement", "type": "HTMLElement" }
1013
- ],
1014
- "events": []
1015
- }
1016
- },
1017
- {
1018
- "name": "dap-ds-calendar",
1019
- "description": "A calendar is a visual representation of dates. It allows users to select a date.\n---\n\n\n### **Events:**\n - **dds-change** - Fired when the calendar value changes.\n\n### **Slots:**\n - _default_ - The content of the calendar.\n\n### **CSS Properties:**\n - **--dds-calendar-display** - The display property of the calendar container (default: flex) _(default: undefined)_\n- **--dds-calendar-isolation** - The isolation property of the calendar (default: isolate) _(default: undefined)_\n- **--dds-calendar-block-display** - The display property of the calendar block (default: block) _(default: undefined)_\n- **--dds-calendar-transition** - The transition property for the calendar (default: all 0.2s ease-in-out) _(default: undefined)_\n- **--dds-calendar-header-display** - The display property of the calendar header (default: grid) _(default: undefined)_\n- **--dds-calendar-header-grid-flow** - The grid-auto-flow property of the calendar header (default: column) _(default: undefined)_\n- **--dds-calendar-header-width** - The width of the calendar header (default: 100%) _(default: undefined)_\n- **--dds-calendar-header-gap** - The gap between header items (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-calendar-select-min-height** - The minimum height of the select trigger (default: auto) _(default: undefined)_\n- **--dds-calendar-select-max-height** - The maximum height of the select trigger (default: 32px) _(default: undefined)_\n- **--dds-calendar-select-padding** - The padding of the select trigger (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-calendar-select-border-radius** - The border radius of the select trigger (default: var(--dds-radius-rounded)) _(default: undefined)_\n- **--dds-calendar-select-border-color** - The border color of the select trigger (default: var(--dds-border-neutral-transparent-interactive)) _(default: undefined)_\n- **--dds-calendar-select-background** - The background color of the select trigger (default: var(--dds-button-subtle-background-enabled)) _(default: undefined)_\n- **--dds-calendar-select-color** - The text color of the select trigger (default: var(--dds-button-subtle-text-enabled)) _(default: undefined)_\n- **--dds-calendar-select-font-size** - The font size of the select trigger (default: var(--dds-font-sm)) _(default: undefined)_\n- **--dds-calendar-select-font-style** - The font style of the select trigger (default: normal) _(default: undefined)_\n- **--dds-calendar-select-font-weight** - The font weight of the select trigger (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-calendar-nav-button-margin** - The margin of the navigation buttons (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-calendar-nav-button-color** - The color of the navigation button icons (default: var(--dds-button-subtle-icon-enabled)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main calendar container.\n- **calendar-header** - The header of the calendar.\n- **body** - The body of the calendar.\n- **calendar-grid-header** - The header of the calendar grid.\n- **calendar-grid-header-cell** - The header cell of the calendar grid.\n- **calendar-grid-cell** - The cell of the calendar grid.\n- **calendar-header-button-prev** - The previous month button of the calendar header.\n- **calendar-header-button-next** - The next month button of the calendar header.\n- **calendar-header-year-select** - The year select of the calendar header.\n- **calendar-header-month-select** - The month select of the calendar header.",
1020
- "doc-url": "",
1021
- "attributes": [
1022
- {
1023
- "name": "mode",
1024
- "description": "The mode of the calendar - single date or range selection.",
1025
- "value": { "type": "'single' | 'range'", "default": "'single'" }
1026
- },
1027
- {
1028
- "name": "hideAdjacentMonths",
1029
- "description": "Whether to hide dates from adjacent months (previous/next) in the calendar grid. When not explicitly set, defaults to false for single mode and true for range mode.",
1030
- "value": { "type": "boolean", "default": "false" }
1031
- },
1032
- {
1033
- "name": "locale",
1034
- "description": "The locale of the calendar.",
1035
- "value": {
1036
- "type": "'hu' | 'en' | 'de'",
1037
- "default": "dayjs.locale()"
1038
- }
1039
- },
1040
- {
1041
- "name": "prevButtonTestId",
1042
- "description": "`data-testid` for the previous-month button.",
1043
- "value": { "type": "string", "default": "'calendar-prev-button'" }
1044
- },
1045
- {
1046
- "name": "nextButtonTestId",
1047
- "description": "`data-testid` for the next-month button.",
1048
- "value": { "type": "string", "default": "'calendar-next-button'" }
1049
- }
1050
- ],
1051
- "slots": [
1052
- { "name": "", "description": "The content of the calendar." }
1053
- ],
1054
- "events": [
1055
- {
1056
- "name": "dds-change",
1057
- "type": "{ value: Dayjs }",
1058
- "description": "Fired when the calendar value changes."
1059
- }
1060
- ],
1061
- "js": {
1062
- "properties": [
1063
- {
1064
- "name": "mode",
1065
- "description": "The mode of the calendar - single date or range selection.",
1066
- "type": "'single' | 'range'"
1067
- },
1068
- {
1069
- "name": "hideAdjacentMonths",
1070
- "description": "Whether to hide dates from adjacent months (previous/next) in the calendar grid. When not explicitly set, defaults to false for single mode and true for range mode.",
1071
- "type": "boolean"
1072
- },
1073
- {
1074
- "name": "value",
1075
- "description": "The value of the calendar.",
1076
- "type": "Dayjs"
1077
- },
1078
- {
1079
- "name": "rangeStart",
1080
- "description": "The start date of the range selection (only used in range mode).",
1081
- "type": "Dayjs"
1082
- },
1083
- {
1084
- "name": "rangeEnd",
1085
- "description": "The end date of the range selection (only used in range mode).",
1086
- "type": "Dayjs"
1087
- },
1088
- {
1089
- "name": "currentDate",
1090
- "description": "The current visible date of the calendar. Only the month and year are considered.",
1091
- "type": "Dayjs"
1092
- },
1093
- {
1094
- "name": "minDate",
1095
- "description": "The minimum date of the calendar. Only the month and year are considered.",
1096
- "type": "Dayjs"
1097
- },
1098
- {
1099
- "name": "maxDate",
1100
- "description": "The maximum date of the calendar. Only the month and year are considered.",
1101
- "type": "Dayjs"
1102
- },
1103
- {
1104
- "name": "disabledDate",
1105
- "description": "The function to determine if the date is disabled.",
1106
- "type": "Function"
1107
- },
1108
- {
1109
- "name": "locale",
1110
- "description": "The locale of the calendar.",
1111
- "type": "'hu' | 'en' | 'de'"
1112
- },
1113
- {
1114
- "name": "prevButtonTestId",
1115
- "description": "`data-testid` for the previous-month button.",
1116
- "type": "string"
1117
- },
1118
- {
1119
- "name": "nextButtonTestId",
1120
- "description": "`data-testid` for the next-month button.",
1121
- "type": "string"
1122
- },
1123
- { "name": "startDate" },
1124
- { "name": "endDate" },
1125
- { "name": "shouldHideAdjacentMonths" }
881
+ }
1126
882
  ],
1127
883
  "events": [
1128
884
  {
1129
- "name": "dds-change",
1130
- "type": "{ value: Dayjs }",
1131
- "description": "Fired when the calendar value changes."
885
+ "name": "dds-loading-timeout",
886
+ "description": "Emitted when the loading timeout is reached"
1132
887
  }
1133
888
  ]
1134
889
  }
@@ -1575,32 +1330,277 @@
1575
1330
  "type": "string"
1576
1331
  },
1577
1332
  {
1578
- "name": "target",
1579
- "description": "The link target of the card",
1580
- "type": "'_blank' | '_self' | '_parent' | '_top'"
1333
+ "name": "target",
1334
+ "description": "The link target of the card",
1335
+ "type": "'_blank' | '_self' | '_parent' | '_top'"
1336
+ },
1337
+ {
1338
+ "name": "href",
1339
+ "description": "The URL of the card.",
1340
+ "type": "string"
1341
+ },
1342
+ {
1343
+ "name": "rel",
1344
+ "description": "The rel of the card link.",
1345
+ "type": "string"
1346
+ },
1347
+ {
1348
+ "name": "size",
1349
+ "description": "The size of the card. Default is `sm`.",
1350
+ "type": "'sm' | 'md' | 'lg'"
1351
+ },
1352
+ {
1353
+ "name": "sizeMap",
1354
+ "description": "Responsive size map (e.g. \"md:lg\").",
1355
+ "type": "string"
1356
+ }
1357
+ ],
1358
+ "events": []
1359
+ }
1360
+ },
1361
+ {
1362
+ "name": "dap-ds-calendar-cell",
1363
+ "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.",
1364
+ "doc-url": "",
1365
+ "attributes": [
1366
+ {
1367
+ "name": "selected",
1368
+ "description": "Whether the calendar cell is selected.",
1369
+ "value": { "type": "boolean", "default": "false" }
1370
+ },
1371
+ {
1372
+ "name": "disabledDay",
1373
+ "description": "Whether the calendar cell is disabled.",
1374
+ "value": { "type": "boolean", "default": "false" }
1375
+ },
1376
+ {
1377
+ "name": "today",
1378
+ "description": "Whether the calendar cell is today.",
1379
+ "value": { "type": "boolean", "default": "false" }
1380
+ },
1381
+ {
1382
+ "name": "outOfRange",
1383
+ "description": "Whether the calendar cell is out of range.",
1384
+ "value": { "type": "boolean", "default": "false" }
1385
+ },
1386
+ {
1387
+ "name": "header",
1388
+ "description": "Whether the calendar cell is a date header.",
1389
+ "value": { "type": "boolean", "default": "false" }
1390
+ },
1391
+ {
1392
+ "name": "focused",
1393
+ "description": "Whether the calendar cell is focused.",
1394
+ "value": { "type": "boolean", "default": "false" }
1395
+ },
1396
+ {
1397
+ "name": "rangestart",
1398
+ "description": "Whether the calendar cell is the start of a range.",
1399
+ "value": { "type": "boolean", "default": "false" }
1400
+ },
1401
+ {
1402
+ "name": "rangeend",
1403
+ "description": "Whether the calendar cell is the end of a range.",
1404
+ "value": { "type": "boolean", "default": "false" }
1405
+ },
1406
+ {
1407
+ "name": "inrange",
1408
+ "description": "Whether the calendar cell is in the middle of a range.",
1409
+ "value": { "type": "boolean", "default": "false" }
1410
+ },
1411
+ {
1412
+ "name": "locale",
1413
+ "description": "The locale of the calendar cell.",
1414
+ "value": {
1415
+ "type": "'hu' | 'en' | 'de'",
1416
+ "default": "dayjs.locale()"
1417
+ }
1418
+ }
1419
+ ],
1420
+ "slots": [
1421
+ { "name": "", "description": "The content of the calendar cell." }
1422
+ ],
1423
+ "events": [],
1424
+ "js": {
1425
+ "properties": [
1426
+ {
1427
+ "name": "value",
1428
+ "description": "The value of the calendar cell.",
1429
+ "type": "Dayjs"
1430
+ },
1431
+ {
1432
+ "name": "selected",
1433
+ "description": "Whether the calendar cell is selected.",
1434
+ "type": "boolean"
1435
+ },
1436
+ {
1437
+ "name": "disabledDay",
1438
+ "description": "Whether the calendar cell is disabled.",
1439
+ "type": "boolean"
1440
+ },
1441
+ {
1442
+ "name": "today",
1443
+ "description": "Whether the calendar cell is today.",
1444
+ "type": "boolean"
1445
+ },
1446
+ {
1447
+ "name": "outOfRange",
1448
+ "description": "Whether the calendar cell is out of range.",
1449
+ "type": "boolean"
1450
+ },
1451
+ {
1452
+ "name": "header",
1453
+ "description": "Whether the calendar cell is a date header.",
1454
+ "type": "boolean"
1455
+ },
1456
+ {
1457
+ "name": "focused",
1458
+ "description": "Whether the calendar cell is focused.",
1459
+ "type": "boolean"
1460
+ },
1461
+ {
1462
+ "name": "rangestart",
1463
+ "description": "Whether the calendar cell is the start of a range.",
1464
+ "type": "boolean"
1465
+ },
1466
+ {
1467
+ "name": "rangeend",
1468
+ "description": "Whether the calendar cell is the end of a range.",
1469
+ "type": "boolean"
1470
+ },
1471
+ {
1472
+ "name": "inrange",
1473
+ "description": "Whether the calendar cell is in the middle of a range.",
1474
+ "type": "boolean"
1475
+ },
1476
+ {
1477
+ "name": "locale",
1478
+ "description": "The locale of the calendar cell.",
1479
+ "type": "'hu' | 'en' | 'de'"
1480
+ },
1481
+ { "name": "label", "type": "string" },
1482
+ { "name": "focusElement", "type": "HTMLElement" }
1483
+ ],
1484
+ "events": []
1485
+ }
1486
+ },
1487
+ {
1488
+ "name": "dap-ds-calendar",
1489
+ "description": "A calendar is a visual representation of dates. It allows users to select a date.\n---\n\n\n### **Events:**\n - **dds-change** - Fired when the calendar value changes.\n\n### **Slots:**\n - _default_ - The content of the calendar.\n\n### **CSS Properties:**\n - **--dds-calendar-display** - The display property of the calendar container (default: flex) _(default: undefined)_\n- **--dds-calendar-isolation** - The isolation property of the calendar (default: isolate) _(default: undefined)_\n- **--dds-calendar-block-display** - The display property of the calendar block (default: block) _(default: undefined)_\n- **--dds-calendar-transition** - The transition property for the calendar (default: all 0.2s ease-in-out) _(default: undefined)_\n- **--dds-calendar-header-display** - The display property of the calendar header (default: grid) _(default: undefined)_\n- **--dds-calendar-header-grid-flow** - The grid-auto-flow property of the calendar header (default: column) _(default: undefined)_\n- **--dds-calendar-header-width** - The width of the calendar header (default: 100%) _(default: undefined)_\n- **--dds-calendar-header-gap** - The gap between header items (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-calendar-select-min-height** - The minimum height of the select trigger (default: auto) _(default: undefined)_\n- **--dds-calendar-select-max-height** - The maximum height of the select trigger (default: 32px) _(default: undefined)_\n- **--dds-calendar-select-padding** - The padding of the select trigger (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-calendar-select-border-radius** - The border radius of the select trigger (default: var(--dds-radius-rounded)) _(default: undefined)_\n- **--dds-calendar-select-border-color** - The border color of the select trigger (default: var(--dds-border-neutral-transparent-interactive)) _(default: undefined)_\n- **--dds-calendar-select-background** - The background color of the select trigger (default: var(--dds-button-subtle-background-enabled)) _(default: undefined)_\n- **--dds-calendar-select-color** - The text color of the select trigger (default: var(--dds-button-subtle-text-enabled)) _(default: undefined)_\n- **--dds-calendar-select-font-size** - The font size of the select trigger (default: var(--dds-font-sm)) _(default: undefined)_\n- **--dds-calendar-select-font-style** - The font style of the select trigger (default: normal) _(default: undefined)_\n- **--dds-calendar-select-font-weight** - The font weight of the select trigger (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-calendar-nav-button-margin** - The margin of the navigation buttons (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-calendar-nav-button-color** - The color of the navigation button icons (default: var(--dds-button-subtle-icon-enabled)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main calendar container.\n- **calendar-header** - The header of the calendar.\n- **body** - The body of the calendar.\n- **calendar-grid-header** - The header of the calendar grid.\n- **calendar-grid-header-cell** - The header cell of the calendar grid.\n- **calendar-grid-cell** - The cell of the calendar grid.\n- **calendar-header-button-prev** - The previous month button of the calendar header.\n- **calendar-header-button-next** - The next month button of the calendar header.\n- **calendar-header-year-select** - The year select of the calendar header.\n- **calendar-header-month-select** - The month select of the calendar header.",
1490
+ "doc-url": "",
1491
+ "attributes": [
1492
+ {
1493
+ "name": "mode",
1494
+ "description": "The mode of the calendar - single date or range selection.",
1495
+ "value": { "type": "'single' | 'range'", "default": "'single'" }
1496
+ },
1497
+ {
1498
+ "name": "hideAdjacentMonths",
1499
+ "description": "Whether to hide dates from adjacent months (previous/next) in the calendar grid. When not explicitly set, defaults to false for single mode and true for range mode.",
1500
+ "value": { "type": "boolean", "default": "false" }
1501
+ },
1502
+ {
1503
+ "name": "locale",
1504
+ "description": "The locale of the calendar.",
1505
+ "value": {
1506
+ "type": "'hu' | 'en' | 'de'",
1507
+ "default": "dayjs.locale()"
1508
+ }
1509
+ },
1510
+ {
1511
+ "name": "prevButtonTestId",
1512
+ "description": "`data-testid` for the previous-month button.",
1513
+ "value": { "type": "string", "default": "'calendar-prev-button'" }
1514
+ },
1515
+ {
1516
+ "name": "nextButtonTestId",
1517
+ "description": "`data-testid` for the next-month button.",
1518
+ "value": { "type": "string", "default": "'calendar-next-button'" }
1519
+ }
1520
+ ],
1521
+ "slots": [
1522
+ { "name": "", "description": "The content of the calendar." }
1523
+ ],
1524
+ "events": [
1525
+ {
1526
+ "name": "dds-change",
1527
+ "type": "{ value: Dayjs }",
1528
+ "description": "Fired when the calendar value changes."
1529
+ }
1530
+ ],
1531
+ "js": {
1532
+ "properties": [
1533
+ {
1534
+ "name": "mode",
1535
+ "description": "The mode of the calendar - single date or range selection.",
1536
+ "type": "'single' | 'range'"
1537
+ },
1538
+ {
1539
+ "name": "hideAdjacentMonths",
1540
+ "description": "Whether to hide dates from adjacent months (previous/next) in the calendar grid. When not explicitly set, defaults to false for single mode and true for range mode.",
1541
+ "type": "boolean"
1542
+ },
1543
+ {
1544
+ "name": "value",
1545
+ "description": "The value of the calendar.",
1546
+ "type": "Dayjs"
1547
+ },
1548
+ {
1549
+ "name": "rangeStart",
1550
+ "description": "The start date of the range selection (only used in range mode).",
1551
+ "type": "Dayjs"
1552
+ },
1553
+ {
1554
+ "name": "rangeEnd",
1555
+ "description": "The end date of the range selection (only used in range mode).",
1556
+ "type": "Dayjs"
1557
+ },
1558
+ {
1559
+ "name": "currentDate",
1560
+ "description": "The current visible date of the calendar. Only the month and year are considered.",
1561
+ "type": "Dayjs"
1562
+ },
1563
+ {
1564
+ "name": "minDate",
1565
+ "description": "The minimum date of the calendar. Only the month and year are considered.",
1566
+ "type": "Dayjs"
1567
+ },
1568
+ {
1569
+ "name": "maxDate",
1570
+ "description": "The maximum date of the calendar. Only the month and year are considered.",
1571
+ "type": "Dayjs"
1572
+ },
1573
+ {
1574
+ "name": "disabledDate",
1575
+ "description": "The function to determine if the date is disabled.",
1576
+ "type": "Function"
1577
+ },
1578
+ {
1579
+ "name": "locale",
1580
+ "description": "The locale of the calendar.",
1581
+ "type": "'hu' | 'en' | 'de'"
1581
1582
  },
1582
1583
  {
1583
- "name": "href",
1584
- "description": "The URL of the card.",
1584
+ "name": "prevButtonTestId",
1585
+ "description": "`data-testid` for the previous-month button.",
1585
1586
  "type": "string"
1586
1587
  },
1587
1588
  {
1588
- "name": "rel",
1589
- "description": "The rel of the card link.",
1589
+ "name": "nextButtonTestId",
1590
+ "description": "`data-testid` for the next-month button.",
1590
1591
  "type": "string"
1591
1592
  },
1593
+ { "name": "startDate" },
1594
+ { "name": "endDate" },
1595
+ { "name": "shouldHideAdjacentMonths" }
1596
+ ],
1597
+ "events": [
1592
1598
  {
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"
1599
+ "name": "dds-change",
1600
+ "type": "{ value: Dayjs }",
1601
+ "description": "Fired when the calendar value changes."
1601
1602
  }
1602
- ],
1603
- "events": []
1603
+ ]
1604
1604
  }
1605
1605
  },
1606
1606
  {
@@ -5039,7 +5039,7 @@
5039
5039
  },
5040
5040
  {
5041
5041
  "name": "dap-ds-icon-button",
5042
- "description": "An icon button is a button with an icon.\n---\n\n\n### **Slots:**\n - _default_ - The icon of the button.\n\n### **CSS Properties:**\n - **--dds-icon-button-border-width** - Border width of the icon button (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-icon-button-border-color** - Border color of the icon button (default: var(--dds-border-neutral-transparent-interactive, #fff500)) _(default: undefined)_\n- **--dds-icon-button-border-radius** - Border radius of the icon button (default: var(--dds-radius-rounded)) _(default: undefined)_\n- **--dds-icon-button-hover-border-width** - Border width on hover (default: var(--dds-border-width-large)) _(default: undefined)_\n- **--dds-icon-button-active-border-width** - Border width when active (default: var(--dds-border-width-xlarge)) _(default: undefined)_\n- **--dds-icon-button-transition** - Transition property for the icon button (default: var(--dds-transition-all)) _(default: undefined)_\n- **--dds-icon-button-cursor** - Cursor style for the button (default: pointer) _(default: undefined)_\n- **--dds-icon-button-disabled-cursor** - Cursor style for the disabled button (default: not-allowed) _(default: undefined)_\n- **--dds-icon-button-column-gap** - Column gap between elements (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-icon-button-padding-lg** - Padding for large size (default: var(--dds-spacing-0)) _(default: undefined)_\n- **--dds-icon-button-padding-md** - Padding for medium size (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-icon-button-padding-sm** - Padding for small size (default: var(--dds-spacing-50)) _(default: undefined)_\n- **--dds-icon-button-padding-xs** - Padding for extra small size (default: var(--dds-spacing-25)) _(default: undefined)_\n- **--dds-icon-button-size-lg** - Size for large icon button (default: var(--dds-spacing-800)) _(default: undefined)_\n- **--dds-icon-button-size-md** - Size for medium icon button (default: var(--dds-spacing-600)) _(default: undefined)_\n- **--dds-icon-button-size-sm** - Size for small icon button (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-icon-button-size-xs** - Size for extra small icon button (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-icon-button-neutral-bg** - Background color for neutral variant (default: var(--dds-transparent-black-subtle)) _(default: undefined)_\n- **--dds-icon-button-neutral-color** - Text color for neutral variant (default: var(--dds-icon-neutral-base)) _(default: undefined)_\n- **--dds-icon-button-neutral-hover-bg** - Hover background color for neutral variant (default: var(--dds-transparent-black-base)) _(default: undefined)_\n- **--dds-icon-button-neutral-active-bg** - Active background color for neutral variant (default: var(--dds-transparent-black-medium)) _(default: undefined)_\n- **--dds-icon-button-brand-bg** - Background color for brand variant (default: var(--dds-button-subtle-background-enabled)) _(default: undefined)_\n- **--dds-icon-button-brand-color** - Text color for brand variant (default: var(--dds-button-subtle-icon-enabled)) _(default: undefined)_\n- **--dds-icon-button-brand-hover-bg** - Hover background color for brand variant (default: var(--dds-button-subtle-background-hover)) _(default: undefined)_\n- **--dds-icon-button-brand-active-bg** - Active background color for brand variant (default: var(--dds-button-subtle-background-pressed)) _(default: undefined)_\n- **--dds-icon-button-inverted-bg** - Background color for inverted variant (default: var(--dds-transparent-white-subtle)) _(default: undefined)_\n- **--dds-icon-button-inverted-color** - Text color for inverted variant (default: var(--dds-button-primary-icon-enabled)) _(default: undefined)_\n- **--dds-icon-button-inverted-hover-bg** - Hover background color for inverted variant (default: var(--dds-transparent-white-base)) _(default: undefined)_\n- **--dds-icon-button-inverted-active-bg** - Active background color for inverted variant (default: var(--dds-transparent-white-medium)) _(default: undefined)_\n- **--dds-icon-button-inverted-brand-bg** - Background color for inverted brand variant (default: var(--dds-button-primary-background-enabled)) _(default: undefined)_\n- **--dds-icon-button-inverted-brand-color** - Text color for inverted brand variant (default: var(--dds-button-primary-icon-enabled)) _(default: undefined)_\n- **--dds-icon-button-inverted-brand-hover-bg** - Hover background color for inverted brand variant (default: var(--dds-button-primary-background-enabled)) _(default: undefined)_\n- **--dds-icon-button-inverted-brand-active-bg** - Active background color for inverted brand variant (default: var(--dds-button-primary-background-enabled)) _(default: undefined)_\n- **--dds-icon-button-disabled-color** - Color for disabled state (default: var(--dds-icon-neutral-disabled)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main button container.\n- **content** - The icon of the button.\n- **icon** - The icon of the icon.\n- **icon-base** - The base of the icon.",
5042
+ "description": "An icon button is a button with an icon.\n---\n\n\n### **Slots:**\n - _default_ - The icon of the button.\n\n### **CSS Properties:**\n - **--dds-icon-button-border-width** - Border width of the icon button (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-icon-button-border-color** - Border color of the icon button (default: var(--dds-border-neutral-transparent-interactive, #fff500)) _(default: undefined)_\n- **--dds-icon-button-border-radius** - Border radius of the icon button (default: var(--dds-radius-rounded)) _(default: undefined)_\n- **--dds-icon-button-hover-border-width** - Border width on hover (default: var(--dds-border-width-large)) _(default: undefined)_\n- **--dds-icon-button-active-border-width** - Border width when active (default: var(--dds-border-width-xlarge)) _(default: undefined)_\n- **--dds-icon-button-transition** - Transition property for the icon button (default: var(--dds-transition-all)) _(default: undefined)_\n- **--dds-icon-button-cursor** - Cursor style for the button (default: pointer) _(default: undefined)_\n- **--dds-icon-button-disabled-cursor** - Cursor style for the disabled button (default: not-allowed) _(default: undefined)_\n- **--dds-icon-button-column-gap** - Column gap between elements (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-icon-button-padding-lg** - Padding for large size (default: var(--dds-spacing-0)) _(default: undefined)_\n- **--dds-icon-button-padding-md** - Padding for medium size (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-icon-button-padding-sm** - Padding for small size (default: var(--dds-spacing-50)) _(default: undefined)_\n- **--dds-icon-button-padding-xs** - Padding for extra small size (default: var(--dds-spacing-25)) _(default: undefined)_\n- **--dds-icon-button-size-lg** - Size for large icon button (default: var(--dds-spacing-800)) _(default: undefined)_\n- **--dds-icon-button-size-md** - Size for medium icon button (default: var(--dds-spacing-600)) _(default: undefined)_\n- **--dds-icon-button-size-sm** - Size for small icon button (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-icon-button-size-xs** - Size for extra small icon button (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-icon-button-neutral-bg** - Background color for neutral variant (default: var(--dds-transparent-black-subtle)) _(default: undefined)_\n- **--dds-icon-button-neutral-color** - Text color for neutral variant (default: var(--dds-icon-neutral-base)) _(default: undefined)_\n- **--dds-icon-button-neutral-hover-bg** - Hover background color for neutral variant (default: var(--dds-transparent-black-base)) _(default: undefined)_\n- **--dds-icon-button-neutral-active-bg** - Active background color for neutral variant (default: var(--dds-transparent-black-medium)) _(default: undefined)_\n- **--dds-icon-button-brand-bg** - Background color for brand variant (default: var(--dds-button-subtle-background-enabled)) _(default: undefined)_\n- **--dds-icon-button-brand-color** - Text color for brand variant (default: var(--dds-button-subtle-icon-enabled)) _(default: undefined)_\n- **--dds-icon-button-brand-hover-bg** - Hover background color for brand variant (default: var(--dds-button-subtle-background-hover)) _(default: undefined)_\n- **--dds-icon-button-brand-active-bg** - Active background color for brand variant (default: var(--dds-button-subtle-background-pressed)) _(default: undefined)_\n- **--dds-icon-button-inverted-bg** - Background color for inverted variant (default: var(--dds-transparent-white-subtle)) _(default: undefined)_\n- **--dds-icon-button-inverted-color** - Text color for inverted variant (default: var(--dds-button-primary-icon-enabled)) _(default: undefined)_\n- **--dds-icon-button-inverted-hover-bg** - Hover background color for inverted variant (default: var(--dds-transparent-white-base)) _(default: undefined)_\n- **--dds-icon-button-inverted-active-bg** - Active background color for inverted variant (default: var(--dds-transparent-white-medium)) _(default: undefined)_\n- **--dds-icon-button-inverted-brand-bg** - Background color for inverted brand variant (default: var(--dds-button-primary-background-enabled)) _(default: undefined)_\n- **--dds-icon-button-inverted-brand-color** - Text color for inverted brand variant (default: var(--dds-button-primary-icon-enabled)) _(default: undefined)_\n- **--dds-icon-button-inverted-brand-hover-bg** - Hover background color for inverted brand variant (default: var(--dds-button-primary-background-enabled)) _(default: undefined)_\n- **--dds-icon-button-inverted-brand-active-bg** - Active background color for inverted brand variant (default: var(--dds-button-primary-background-enabled)) _(default: undefined)_\n- **--dds-icon-button-disabled-color** - Color for disabled state (default: var(--dds-icon-neutral-disabled)) _(default: undefined)_\n- **--dds-icon-button-disabled-bg** - Background color for disabled state (default: transparent) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main button container.\n- **content** - The icon of the button.\n- **icon** - The icon of the icon.\n- **icon-base** - The base of the icon.",
5043
5043
  "doc-url": "",
5044
5044
  "attributes": [
5045
5045
  {
@@ -6559,121 +6559,6 @@
6559
6559
  ]
6560
6560
  }
6561
6561
  },
6562
- {
6563
- "name": "dap-ds-notification-badge",
6564
- "description": "A notification badge component is a user interface element that visually indicates the presence of new information or updates, often displaying a numeric count of unread notifications, messages, or items requiring attention.\n---\n\n\n### **Slots:**\n - _default_ - The content of the notification badge.\n\n### **CSS Properties:**\n - **--dds-notification-badge-size** - Controls the overall size of the notification badge (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-notification-badge-min-width** - Minimum width of the notification badge (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-notification-badge-height** - Height of the notification badge (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-notification-badge-padding** - Padding inside the notification badge (default: 0 var(--dds-spacing-150)) _(default: undefined)_\n- **--dds-notification-badge-border-radius** - Border radius of the notification badge (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-notification-badge-font-size** - Font size of the notification badge text (default: var(--dds-font-xs)) _(default: undefined)_\n- **--dds-notification-badge-dot-size** - Size of the dot variant (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-notification-badge-color** - Text color of the notification badge (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-notification-badge-neutral-bg** - Background color for neutral type (default: var(--dds-text-neutral-subtle)) _(default: undefined)_\n- **--dds-notification-badge-brand-bg** - Background color for brand type (default: var(--dds-text-brand-subtle)) _(default: undefined)_\n- **--dds-notification-badge-info-bg** - Background color for info type (default: var(--dds-text-informative-subtle)) _(default: undefined)_\n- **--dds-notification-badge-positive-bg** - Background color for positive type (default: var(--dds-text-positive-subtle)) _(default: undefined)_\n- **--dds-notification-badge-warning-bg** - Background color for warning type (default: var(--dds-text-warning-subtle)) _(default: undefined)_\n- **--dds-notification-badge-negative-bg** - Background color for negative type (default: var(--dds-text-negative-subtle)) _(default: undefined)_\n- **--dds-notification-badge-circular-offset-x** - Horizontal offset for circular positioning (default: 20px) _(default: undefined)_\n- **--dds-notification-badge-circular-offset-y** - Vertical offset for circular positioning (default: -20px) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main container of the notification badge.\n- **noty** - The notification badge container.",
6565
- "doc-url": "",
6566
- "attributes": [
6567
- {
6568
- "name": "badgeContent",
6569
- "description": "The content of the badge, it can be a number or a string. Content tried to be parsed as a number, if it's not a number, it will be displayed as a string.",
6570
- "value": { "type": "string | number" }
6571
- },
6572
- {
6573
- "name": "visible",
6574
- "description": "This switch decides the visibility of the badge. This property overrides the badge content visibility. Use it for explicit control.",
6575
- "value": { "type": "boolean", "default": "false" }
6576
- },
6577
- {
6578
- "name": "showZero",
6579
- "description": "This switch decides whether to show a zero value or not.",
6580
- "value": { "type": "boolean", "default": "false" }
6581
- },
6582
- {
6583
- "name": "type",
6584
- "description": "The color scheme of the badge",
6585
- "value": {
6586
- "type": "'neutral' | 'brand' | 'info' | 'positive' | 'warning' | 'negative'",
6587
- "default": "'negative'"
6588
- }
6589
- },
6590
- {
6591
- "name": "variant",
6592
- "description": "The variant of the badge.",
6593
- "value": { "type": "'round' | 'dot'", "default": "'round'" }
6594
- },
6595
- {
6596
- "name": "max",
6597
- "description": "The cap value of badge content, if the badge content is greater than the max value, it will be displayed as `[number]+`. Zero means no cap.",
6598
- "value": { "type": "number", "default": "0" }
6599
- },
6600
- {
6601
- "name": "placement",
6602
- "description": "The position of the badge content around the slot content.",
6603
- "value": {
6604
- "type": "'top-start' | 'top-end' | 'bottom-start' | 'bottom-end'",
6605
- "default": "'top-end'"
6606
- }
6607
- },
6608
- {
6609
- "name": "circular-auto",
6610
- "description": "Whether to automatically detect circular elements and adjust positioning accordingly",
6611
- "value": { "type": "boolean", "default": "true" }
6612
- },
6613
- {
6614
- "name": "force-circular",
6615
- "description": "Override circular positioning detection - forces circular positioning calculation",
6616
- "value": { "type": "boolean", "default": "false" }
6617
- }
6618
- ],
6619
- "slots": [
6620
- {
6621
- "name": "",
6622
- "description": "The content of the notification badge."
6623
- }
6624
- ],
6625
- "events": [],
6626
- "js": {
6627
- "properties": [
6628
- {
6629
- "name": "badgeContent",
6630
- "description": "The content of the badge, it can be a number or a string. Content tried to be parsed as a number, if it's not a number, it will be displayed as a string.",
6631
- "type": "string | number"
6632
- },
6633
- {
6634
- "name": "visible",
6635
- "description": "This switch decides the visibility of the badge. This property overrides the badge content visibility. Use it for explicit control.",
6636
- "type": "boolean"
6637
- },
6638
- {
6639
- "name": "showZero",
6640
- "description": "This switch decides whether to show a zero value or not.",
6641
- "type": "boolean"
6642
- },
6643
- {
6644
- "name": "type",
6645
- "description": "The color scheme of the badge",
6646
- "type": "'neutral' | 'brand' | 'info' | 'positive' | 'warning' | 'negative'"
6647
- },
6648
- {
6649
- "name": "variant",
6650
- "description": "The variant of the badge.",
6651
- "type": "'round' | 'dot'"
6652
- },
6653
- {
6654
- "name": "max",
6655
- "description": "The cap value of badge content, if the badge content is greater than the max value, it will be displayed as `[number]+`. Zero means no cap.",
6656
- "type": "number"
6657
- },
6658
- {
6659
- "name": "placement",
6660
- "description": "The position of the badge content around the slot content.",
6661
- "type": "'top-start' | 'top-end' | 'bottom-start' | 'bottom-end'"
6662
- },
6663
- {
6664
- "name": "circularAuto",
6665
- "description": "Whether to automatically detect circular elements and adjust positioning accordingly",
6666
- "type": "boolean"
6667
- },
6668
- {
6669
- "name": "forceCircular",
6670
- "description": "Override circular positioning detection - forces circular positioning calculation",
6671
- "type": "boolean"
6672
- }
6673
- ],
6674
- "events": []
6675
- }
6676
- },
6677
6562
  {
6678
6563
  "name": "dap-ds-number-input",
6679
6564
  "description": "A number input component.\n---\n\n\n### **Events:**\n - **dds-change** - Fired when the input value changes.\n- **dds-input** - Fired when the input value changes.\n- **dds-keydown** - Fired when a key is pressed down.\n- **dds-blur** - Fired when the input loses focus.\n- **dds-focus** - Emitted when the input gains focus.\n\n### **Slots:**\n - **feedback-icon** - The custom icon of the feedback.\n\n### **CSS Properties:**\n - **--dds-input-height-xs** - The height of the extra small input. (default: var(--dds-spacing-800) ). _(default: undefined)_\n- **--dds-input-height-sm** - The height of the small input. (default: var(--dds-spacing-1000)). _(default: undefined)_\n- **--dds-input-height-lg** - The height of the large input. (default: var(--dds-spacing-1200)). _(default: undefined)_\n- **--dds-input-padding-xs** - The padding of the extra small input. (default: 0 var(--dds-spacing-200)). _(default: undefined)_\n- **--dds-input-padding-sm** - The padding of the small input. (default: 0 var(--dds-spacing-300)). _(default: undefined)_\n- **--dds-input-padding-lg** - The padding of the large input. (default: 0 var(--dds-spacing-400)). _(default: undefined)_\n- **--dds-input-font-size-xs** - The font size of the extra small input. (default: var(--dds-font-sm)). _(default: undefined)_\n- **--dds-input-font-size-sm** - The font size of the small input. (default: var(--dds-font-base)). _(default: undefined)_\n- **--dds-input-font-size-lg** - The font size of the large input. (default: var(--dds-font-lg)). _(default: undefined)_\n- **--dds-input-border** - The border of the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)). _(default: undefined)_\n- **--dds-input-background** - The background color of the input. (default: var(--dds-fields-background-default)). _(default: undefined)_\n- **--dds-input-text-color** - The text color of the input. (default: var(--dds-text-neutral-base)). _(default: undefined)_\n- **--dds-input-border-radius** - The border radius of the input. (default: var(--dds-radius-base)). _(default: undefined)_\n- **--dds-input-disabled-border** - The border of the disabled input. (default: 0 solid var(--dds-border-neutral-disabled)). _(default: undefined)_\n- **--dds-input-disabled-background** - The background color of the disabled input. (default: var(--dds-fields-background-disabled)). _(default: undefined)_\n- **--dds-input-disabled-text** - The text color of the disabled input. (default: var(--dds-text-neutral-disabled)). _(default: undefined)_\n- **--dds-input-readonly-border** - The border of the readonly input. (default: 0 solid var(--dds-border-neutral-subtle)). _(default: undefined)_\n- **--dds-input-readonly-background** - The background color of the readonly input. (default: var(--dds-fields-background-read-only)). _(default: undefined)_\n- **--dds-input-readonly-text** - The text color of the readonly input. (default: var(--dds-text-neutral-subtle)). _(default: undefined)_\n- **--dds-input-success-border** - The border of the success input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)). _(default: undefined)_\n- **--dds-input-error-border** - The border of the error input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)). _(default: undefined)_\n- **--dds-input-addon-background** - The background color of the input addon. (default: var(--dds-fields-background-default)). _(default: undefined)_\n- **--dds-input-addon-success-background** - The background color of the success input addon. (default: var(--dds-fields-background-default)). _(default: undefined)_\n- **--dds-input-addon-error-background** - The background color of the error input addon. (default: var(--dds-fields-background-default)). _(default: undefined)_\n- **--dds-input-addon-border-before** - The border of the addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)). _(default: undefined)_\n- **--dds-input-addon-border-after** - The border of the addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-neutral-base)). _(default: undefined)_\n- **--dds-input-addon-border-width-before** - The border width of the addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)). _(default: undefined)_\n- **--dds-input-addon-border-width-after** - The border width of the addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0). _(default: undefined)_\n- **--dds-input-addon-success-border** - The border of the success addon. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)). _(default: undefined)_\n- **--dds-input-addon-success-border-before** - The border of the success addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)). _(default: undefined)_\n- **--dds-input-addon-success-border-after** - The border of the success addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-positive-base)). _(default: undefined)_\n- **--dds-input-addon-success-border-width-before** - The border width of the success addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)). _(default: undefined)_\n- **--dds-input-addon-success-border-width-after** - The border width of the success addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0). _(default: undefined)_\n- **--dds-input-addon-error-border-before** - The border of the error addon before the input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)). _(default: undefined)_\n- **--dds-input-addon-error-border-after** - The border of the error addon after the input. (default: var(--dds-border-width-base) solid var(--dds-border-negative-base)). _(default: undefined)_\n- **--dds-input-addon-error-border-width-before** - The border width of the error addon before the input. (default: var(--dds-border-width-base) 0 var(--dds-border-width-base) var(--dds-border-width-base)). _(default: undefined)_\n- **--dds-input-addon-error-border-width-after** - The border width of the error addon after the input. (default: var(--dds-border-width-base) var(--dds-border-width-base) var(--dds-border-width-base) 0). _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main number input container.\n- **input** - The input element.\n- **label** - The label of the input.\n- **description** - The description of the input.\n- **feedback** - The feedback of the input.\n- **tooltip** - The tooltip of the input.\n- **addon-before** - The addon before the input.\n- **addon-after** - The addon after the input.\n- **prefix** - The prefix of the input.\n- **postfix** - The postfix of the input.\n- **decrement-button** - The decrement button of the input.\n- **increment-button** - The increment button of the input.\n- **decrement-button-base** - The base of the decrement button.\n- **increment-button-base** - The base of the increment button.\n- **decrement-button-content** - The content of the decrement button.\n- **increment-button-content** - The content of the increment button.",
@@ -7079,13 +6964,128 @@
7079
6964
  "js": {
7080
6965
  "properties": [
7081
6966
  {
7082
- "name": "label",
7083
- "description": "The label of the option group (displayed in native optgroup).",
7084
- "type": "string"
6967
+ "name": "label",
6968
+ "description": "The label of the option group (displayed in native optgroup).",
6969
+ "type": "string"
6970
+ },
6971
+ {
6972
+ "name": "disabled",
6973
+ "description": "Whether all options in the group are disabled.",
6974
+ "type": "boolean"
6975
+ }
6976
+ ],
6977
+ "events": []
6978
+ }
6979
+ },
6980
+ {
6981
+ "name": "dap-ds-notification-badge",
6982
+ "description": "A notification badge component is a user interface element that visually indicates the presence of new information or updates, often displaying a numeric count of unread notifications, messages, or items requiring attention.\n---\n\n\n### **Slots:**\n - _default_ - The content of the notification badge.\n\n### **CSS Properties:**\n - **--dds-notification-badge-size** - Controls the overall size of the notification badge (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-notification-badge-min-width** - Minimum width of the notification badge (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-notification-badge-height** - Height of the notification badge (default: var(--dds-spacing-500)) _(default: undefined)_\n- **--dds-notification-badge-padding** - Padding inside the notification badge (default: 0 var(--dds-spacing-150)) _(default: undefined)_\n- **--dds-notification-badge-border-radius** - Border radius of the notification badge (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-notification-badge-font-size** - Font size of the notification badge text (default: var(--dds-font-xs)) _(default: undefined)_\n- **--dds-notification-badge-dot-size** - Size of the dot variant (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-notification-badge-color** - Text color of the notification badge (default: var(--dds-background-neutral-medium)) _(default: undefined)_\n- **--dds-notification-badge-neutral-bg** - Background color for neutral type (default: var(--dds-text-neutral-subtle)) _(default: undefined)_\n- **--dds-notification-badge-brand-bg** - Background color for brand type (default: var(--dds-text-brand-subtle)) _(default: undefined)_\n- **--dds-notification-badge-info-bg** - Background color for info type (default: var(--dds-text-informative-subtle)) _(default: undefined)_\n- **--dds-notification-badge-positive-bg** - Background color for positive type (default: var(--dds-text-positive-subtle)) _(default: undefined)_\n- **--dds-notification-badge-warning-bg** - Background color for warning type (default: var(--dds-text-warning-subtle)) _(default: undefined)_\n- **--dds-notification-badge-negative-bg** - Background color for negative type (default: var(--dds-text-negative-subtle)) _(default: undefined)_\n- **--dds-notification-badge-circular-offset-x** - Horizontal offset for circular positioning (default: 20px) _(default: undefined)_\n- **--dds-notification-badge-circular-offset-y** - Vertical offset for circular positioning (default: -20px) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main container of the notification badge.\n- **noty** - The notification badge container.",
6983
+ "doc-url": "",
6984
+ "attributes": [
6985
+ {
6986
+ "name": "badgeContent",
6987
+ "description": "The content of the badge, it can be a number or a string. Content tried to be parsed as a number, if it's not a number, it will be displayed as a string.",
6988
+ "value": { "type": "string | number" }
6989
+ },
6990
+ {
6991
+ "name": "visible",
6992
+ "description": "This switch decides the visibility of the badge. This property overrides the badge content visibility. Use it for explicit control.",
6993
+ "value": { "type": "boolean", "default": "false" }
6994
+ },
6995
+ {
6996
+ "name": "showZero",
6997
+ "description": "This switch decides whether to show a zero value or not.",
6998
+ "value": { "type": "boolean", "default": "false" }
6999
+ },
7000
+ {
7001
+ "name": "type",
7002
+ "description": "The color scheme of the badge",
7003
+ "value": {
7004
+ "type": "'neutral' | 'brand' | 'info' | 'positive' | 'warning' | 'negative'",
7005
+ "default": "'negative'"
7006
+ }
7007
+ },
7008
+ {
7009
+ "name": "variant",
7010
+ "description": "The variant of the badge.",
7011
+ "value": { "type": "'round' | 'dot'", "default": "'round'" }
7012
+ },
7013
+ {
7014
+ "name": "max",
7015
+ "description": "The cap value of badge content, if the badge content is greater than the max value, it will be displayed as `[number]+`. Zero means no cap.",
7016
+ "value": { "type": "number", "default": "0" }
7017
+ },
7018
+ {
7019
+ "name": "placement",
7020
+ "description": "The position of the badge content around the slot content.",
7021
+ "value": {
7022
+ "type": "'top-start' | 'top-end' | 'bottom-start' | 'bottom-end'",
7023
+ "default": "'top-end'"
7024
+ }
7025
+ },
7026
+ {
7027
+ "name": "circular-auto",
7028
+ "description": "Whether to automatically detect circular elements and adjust positioning accordingly",
7029
+ "value": { "type": "boolean", "default": "true" }
7030
+ },
7031
+ {
7032
+ "name": "force-circular",
7033
+ "description": "Override circular positioning detection - forces circular positioning calculation",
7034
+ "value": { "type": "boolean", "default": "false" }
7035
+ }
7036
+ ],
7037
+ "slots": [
7038
+ {
7039
+ "name": "",
7040
+ "description": "The content of the notification badge."
7041
+ }
7042
+ ],
7043
+ "events": [],
7044
+ "js": {
7045
+ "properties": [
7046
+ {
7047
+ "name": "badgeContent",
7048
+ "description": "The content of the badge, it can be a number or a string. Content tried to be parsed as a number, if it's not a number, it will be displayed as a string.",
7049
+ "type": "string | number"
7050
+ },
7051
+ {
7052
+ "name": "visible",
7053
+ "description": "This switch decides the visibility of the badge. This property overrides the badge content visibility. Use it for explicit control.",
7054
+ "type": "boolean"
7055
+ },
7056
+ {
7057
+ "name": "showZero",
7058
+ "description": "This switch decides whether to show a zero value or not.",
7059
+ "type": "boolean"
7060
+ },
7061
+ {
7062
+ "name": "type",
7063
+ "description": "The color scheme of the badge",
7064
+ "type": "'neutral' | 'brand' | 'info' | 'positive' | 'warning' | 'negative'"
7065
+ },
7066
+ {
7067
+ "name": "variant",
7068
+ "description": "The variant of the badge.",
7069
+ "type": "'round' | 'dot'"
7070
+ },
7071
+ {
7072
+ "name": "max",
7073
+ "description": "The cap value of badge content, if the badge content is greater than the max value, it will be displayed as `[number]+`. Zero means no cap.",
7074
+ "type": "number"
7075
+ },
7076
+ {
7077
+ "name": "placement",
7078
+ "description": "The position of the badge content around the slot content.",
7079
+ "type": "'top-start' | 'top-end' | 'bottom-start' | 'bottom-end'"
7085
7080
  },
7086
7081
  {
7087
- "name": "disabled",
7088
- "description": "Whether all options in the group are disabled.",
7082
+ "name": "circularAuto",
7083
+ "description": "Whether to automatically detect circular elements and adjust positioning accordingly",
7084
+ "type": "boolean"
7085
+ },
7086
+ {
7087
+ "name": "forceCircular",
7088
+ "description": "Override circular positioning detection - forces circular positioning calculation",
7089
7089
  "type": "boolean"
7090
7090
  }
7091
7091
  ],
@@ -8375,7 +8375,7 @@
8375
8375
  },
8376
8376
  {
8377
8377
  "name": "dap-ds-search",
8378
- "description": "A select is a form element that allows the user to select one option from a set.\n---\n\n\n### **Events:**\n - **dds-change** - Fired when the search value changes.\n- **dds-blur** - Emitted when the search loses focus.\n- **dds-focus** - Emitted when the search gains focus.\n- **dds-clear** - Emitted when the search is cleared.\n- **dds-search** - Emitted when the search input value changes.\n- **dds-input** - Emitted when typing happens in the search input.\n\n### **Slots:**\n - _default_ - The default slot for the options.\n\n### **CSS Properties:**\n - **--dds-combobox-background** - The background color of the combobox. (default: var(--dds-fields-background-default)) _(default: undefined)_\n- **--dds-combobox-border-color** - The border color of the combobox. (default: var(--dds-border-neutral-base)) _(default: undefined)_\n- **--dds-combobox-border-width** - The border width of the combobox. (default: var(--dds-border-width-base, 1px)) _(default: undefined)_\n- **--dds-combobox-border-radius** - The border radius of the combobox. (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-combobox-text-color** - The text color of the combobox. (default: var(--dds-text-neutral-base)) _(default: undefined)_\n- **--dds-combobox-placeholder-color** - The placeholder text color. (default: var(--dds-text-neutral-subtle)) _(default: undefined)_\n- **--dds-combobox-disabled-background** - The background color when disabled. (default: var(--dds-background-neutral-stronger)) _(default: undefined)_\n- **--dds-combobox-disabled-text** - The text color when disabled. (default: var(--dds-text-neutral-disabled)) _(default: undefined)_\n- **--dds-combobox-error-border** - The border color for error state. (default: var(--dds-border-negative-base)) _(default: undefined)_\n- **--dds-combobox-success-border** - The border color for success state. (default: var(--dds-border-positive-base)) _(default: undefined)_\n- **--dds-combobox-icon-color** - The color of the icons. (default: var(--dds-text-icon-neutral-subtle)) _(default: undefined)_\n- **--dds-combobox-loading-spinner-color** - The color of the loading spinner. (default: var(--dds-icon-neutral-base)) _(default: undefined)_\n- **--dds-combobox-clear-icon-color** - The color of the clear icon. (default: var(--dds-button-subtle-icon-neutral-enabled)) _(default: undefined)_\n- **--dds-combobox-popup-background** - The background color of the popup. (default: var(--dds-background-neutral-subtle)) _(default: undefined)_\n- **--dds-combobox-popup-shadow** - The box shadow of the popup. (default: 0 4px 6px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.06)) _(default: undefined)_\n- **--dds-combobox-icon-opened-transform** - The transform of the icon when the combobox is opened (default: rotate(90deg)). _(default: undefined)_\n- **--dds-combobox-padding-xs** - The padding for extra small size. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-combobox-padding-sm** - The padding for small size. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-combobox-padding-lg** - The padding for large size. (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-combobox-padding-horizontal** - The horizontal padding. (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-combobox-padding-vertical** - The vertical padding. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-combobox-gap** - The gap between elements. (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-combobox-icon-gap** - The gap between icons. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-combobox-action-gap** - The gap between action elements. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-combobox-action-padding** - The padding for action elements. (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-combobox-clear-icon-width** - The width of the clear icon. (default: var(--dds-spacing-800)) _(default: undefined)_\n- **--dds-combobox-dropdown-icon-right** - The right position of the dropdown icon. (default: var(--dds-spacing-600)) _(default: undefined)_\n- **--dds-combobox-min-width** - The minimum width of the combobox. (default: 7.5rem) _(default: undefined)_\n- **--dds-combobox-chips-gap** - The gap between chips. (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-combobox-chips-padding** - The padding for chips. (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-combobox-chips-max-height** - The maximum height of the chips. (default: 120px) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main search container.\n- **trigger** - The trigger button of the search.\n- **label** - The label of the search.\n- **description** - The description of the search.\n- **feedback** - The feedback of the search.\n- **tooltip** - The tooltip of the search.\n- **option-list** - The option list of the search.\n- **input** - The input of the search.",
8378
+ "description": "A select is a form element that allows the user to select one option from a set.\n---\n\n\n### **Events:**\n - **dds-change** - Fired when the search value changes.\n- **dds-blur** - Emitted when the search loses focus.\n- **dds-focus** - Emitted when the search gains focus.\n- **dds-clear** - Emitted when the search is cleared.\n- **dds-search** - Emitted when the search input value changes.\n- **dds-input** - Emitted when typing happens in the search input.\n\n### **Slots:**\n - _default_ - The default slot for the options.\n\n### **CSS Properties:**\n - **--dds-combobox-background** - The background color of the combobox. (default: var(--dds-fields-background-default)) _(default: undefined)_\n- **--dds-combobox-border-color** - The border color of the combobox. (default: var(--dds-border-neutral-base)) _(default: undefined)_\n- **--dds-combobox-border-width** - The border width of the combobox. (default: var(--dds-border-width-base, 1px)) _(default: undefined)_\n- **--dds-combobox-border-radius** - The border radius of the combobox. (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-combobox-text-color** - The text color of the combobox. (default: var(--dds-text-neutral-base)) _(default: undefined)_\n- **--dds-combobox-placeholder-color** - The placeholder text color. (default: var(--dds-text-neutral-subtle)) _(default: undefined)_\n- **--dds-combobox-disabled-background** - The background color when disabled. (default: var(--dds-background-neutral-stronger)) _(default: undefined)_\n- **--dds-combobox-disabled-text** - The text color when disabled. (default: var(--dds-text-neutral-disabled)) _(default: undefined)_\n- **--dds-combobox-error-border** - The border color for error state. (default: var(--dds-border-negative-base)) _(default: undefined)_\n- **--dds-combobox-success-border** - The border color for success state. (default: var(--dds-border-positive-base)) _(default: undefined)_\n- **--dds-combobox-icon-color** - The color of the icons. (default: var(--dds-text-icon-neutral-subtle)) _(default: undefined)_\n- **--dds-combobox-loading-spinner-color** - The color of the loading spinner. (default: var(--dds-icon-neutral-base)) _(default: undefined)_\n- **--dds-combobox-clear-icon-color** - The color of the clear icon. (default: var(--dds-button-subtle-icon-neutral-enabled)) _(default: undefined)_\n- **--dds-combobox-popup-background** - The background color of the popup. (default: var(--dds-background-neutral-subtle)) _(default: undefined)_\n- **--dds-combobox-popup-shadow** - The box shadow of the popup. (default: 0 4px 6px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.06)) _(default: undefined)_\n- **--dds-combobox-icon-opened-transform** - The transform of the icon when the combobox is opened (default: rotate(90deg)). _(default: undefined)_\n- **--dds-combobox-padding-xs** - The padding for extra small size. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-combobox-padding-sm** - The padding for small size. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-combobox-padding-lg** - The padding for large size. (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-combobox-padding-horizontal** - The horizontal padding. (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-combobox-padding-vertical** - The vertical padding. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-combobox-gap** - The gap between elements. (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-combobox-icon-gap** - The gap between icons. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-combobox-action-gap** - The gap between action elements. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-combobox-action-padding** - The padding for action elements. (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-combobox-clear-icon-width** - The width of the clear icon. (default: var(--dds-spacing-800)) _(default: undefined)_\n- **--dds-combobox-dropdown-icon-right** - The right position of the dropdown icon. (default: var(--dds-spacing-600)) _(default: undefined)_\n- **--dds-combobox-min-width** - The minimum width of the combobox. (default: 7.5rem) _(default: undefined)_\n- **--dds-combobox-chips-gap** - The gap between chips. (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-combobox-chips-padding** - The padding for chips. (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-combobox-chips-max-height** - The maximum height of the chips. (default: 120px) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main search container.\n- **trigger** - The trigger button of the search.\n- **search-button** - The trailing search icon button.\n- **label** - The label of the search.\n- **description** - The description of the search.\n- **feedback** - The feedback of the search.\n- **tooltip** - The tooltip of the search.\n- **option-list** - The option list of the search.\n- **input** - The input of the search.",
8379
8379
  "doc-url": "",
8380
8380
  "attributes": [],
8381
8381
  "slots": [
@@ -8526,6 +8526,11 @@
8526
8526
  "description": "The aria label of the search button.",
8527
8527
  "type": "string"
8528
8528
  },
8529
+ {
8530
+ "name": "disableSearchWhenEmpty",
8531
+ "description": "When true, the search button is automatically disabled while the input is empty and re-enabled once the user types. Default is false.",
8532
+ "type": "boolean"
8533
+ },
8529
8534
  {
8530
8535
  "name": "openOnEmpty",
8531
8536
  "description": "Whether the search should open on empty results.",
@@ -10228,6 +10233,124 @@
10228
10233
  "events": [],
10229
10234
  "js": { "properties": [], "events": [] }
10230
10235
  },
10236
+ {
10237
+ "name": "dap-ds-toc",
10238
+ "description": "A table of contents (TOC) is a list of links that allows users to quickly navigate to sections within a document.\n---\n\n\n### **Events:**\n - **dds-anchor-change** - Event that is triggered when the anchor changes.\n\n### **CSS Properties:**\n - **--dds-toc-border-width** - Width of the TOC border. (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-toc-border-color** - Color of the TOC border. (default: var(--dds-border-neutral-divider)) _(default: undefined)_\n- **--dds-toc-title-color** - Color of the TOC title. (default: var(--dds-text-neutral-strong)) _(default: undefined)_\n- **--dds-toc-title-font-size** - Font size of the TOC title. (default: var(--dds-font-base)) _(default: undefined)_\n- **--dds-toc-title-font-weight** - Font weight of the TOC title. (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-toc-title-line-height** - Line height of the TOC title. (default: 1.25) _(default: undefined)_\n- **--dds-toc-link-color** - Color of the TOC links. (default: var(--dds-button-subtle-text-neutral-enabled)) _(default: undefined)_\n- **--dds-toc-link-active-color** - Color of the active TOC link. (default: var(--dds-button-subtle-text-enabled)) _(default: undefined)_\n- **--dds-toc-link-border-color** - Border color of the active TOC link. (default: var(--dds-border-brand-base)) _(default: undefined)_\n- **--dds-toc-link-line-height** - Line height of the TOC links. (default: 1.2) _(default: undefined)_\n- **--dds-toc-link-padding** - Padding of the TOC links. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-toc-indent-level-0** - Indent level of the TOC items. (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-toc-indent-level-1** - Indent level of the TOC items. (default: var(--dds-spacing-800)) _(default: undefined)_\n- **--dds-toc-indent-level-2** - Indent level of the TOC items. (default: var(--dds-spacing-1200)) _(default: undefined)_\n- **--dds-toc-indent-level-3** - Indent level of the TOC items. (default: var(--dds-spacing-1600)) _(default: undefined)_\n- **--dds-toc-indent-level-4** - Indent level of the TOC items. (default: var(--dds-spacing-2000)) _(default: undefined)_\n- **--dds-toc-indent-level-5** - Indent level of the TOC items. (default: var(--dds-spacing-2400)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main container of the toc.",
10239
+ "doc-url": "",
10240
+ "attributes": [
10241
+ {
10242
+ "name": "root",
10243
+ "description": "The root element to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#root)",
10244
+ "value": { "type": "string", "default": "''" }
10245
+ },
10246
+ {
10247
+ "name": "rootMargin",
10248
+ "description": "The margin around the root element to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#rootmargin)",
10249
+ "value": { "type": "string", "default": "'0px 0px -80% 0px'" }
10250
+ },
10251
+ {
10252
+ "name": "lastAnchorRootMargin",
10253
+ "description": "The margin around the last anchor to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#rootmargin)",
10254
+ "value": { "type": "string", "default": "'0px 0px -50% 0px'" }
10255
+ },
10256
+ {
10257
+ "name": "threshold",
10258
+ "description": "The threshold to trigger [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#threshold)",
10259
+ "value": { "type": "number[]", "default": "[0.1]" }
10260
+ },
10261
+ {
10262
+ "name": "minHeadingLevel",
10263
+ "description": "The minimum heading level to include in the TOC. The default value is `2`.",
10264
+ "value": { "type": "number", "default": "2" }
10265
+ },
10266
+ {
10267
+ "name": "maxHeadingLevel",
10268
+ "description": "The maximum heading level to include in the TOC. The default value is `3`.",
10269
+ "value": { "type": "number", "default": "3" }
10270
+ },
10271
+ {
10272
+ "name": "noIndent",
10273
+ "description": "Whether to indent the TOC items.",
10274
+ "value": { "type": "boolean", "default": "false" }
10275
+ },
10276
+ {
10277
+ "name": "header",
10278
+ "description": "The header of the TOC.",
10279
+ "value": { "type": "string" }
10280
+ }
10281
+ ],
10282
+ "events": [
10283
+ {
10284
+ "name": "dds-anchor-change",
10285
+ "type": "{ selectedItem: HTMLAnchorElement, anchorElement: IntersectionObserverEntry | HTMLElement }",
10286
+ "description": "Event that is triggered when the anchor changes."
10287
+ }
10288
+ ],
10289
+ "js": {
10290
+ "properties": [
10291
+ {
10292
+ "name": "root",
10293
+ "description": "The root element to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#root)",
10294
+ "type": "string"
10295
+ },
10296
+ {
10297
+ "name": "rootMargin",
10298
+ "description": "The margin around the root element to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#rootmargin)",
10299
+ "type": "string"
10300
+ },
10301
+ {
10302
+ "name": "lastAnchorRootMargin",
10303
+ "description": "The margin around the last anchor to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#rootmargin)",
10304
+ "type": "string"
10305
+ },
10306
+ {
10307
+ "name": "threshold",
10308
+ "description": "The threshold to trigger [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#threshold)",
10309
+ "type": "number[]"
10310
+ },
10311
+ {
10312
+ "name": "minHeadingLevel",
10313
+ "description": "The minimum heading level to include in the TOC. The default value is `2`.",
10314
+ "type": "number"
10315
+ },
10316
+ {
10317
+ "name": "maxHeadingLevel",
10318
+ "description": "The maximum heading level to include in the TOC. The default value is `3`.",
10319
+ "type": "number"
10320
+ },
10321
+ {
10322
+ "name": "noIndent",
10323
+ "description": "Whether to indent the TOC items.",
10324
+ "type": "boolean"
10325
+ },
10326
+ {
10327
+ "name": "header",
10328
+ "description": "The header of the TOC.",
10329
+ "type": "string"
10330
+ },
10331
+ { "name": "activeAnchor" },
10332
+ { "name": "anchors" },
10333
+ { "name": "items" },
10334
+ {
10335
+ "name": "size",
10336
+ "description": "The size of the TOC. Default is `lg.",
10337
+ "type": "'xs' | 'sm' | 'md' | 'lg'"
10338
+ },
10339
+ {
10340
+ "name": "sizeMap",
10341
+ "description": "Responsive size map (e.g. \"md:lg\").",
10342
+ "type": "string"
10343
+ }
10344
+ ],
10345
+ "events": [
10346
+ {
10347
+ "name": "dds-anchor-change",
10348
+ "type": "{ selectedItem: HTMLAnchorElement, anchorElement: IntersectionObserverEntry | HTMLElement }",
10349
+ "description": "Event that is triggered when the anchor changes."
10350
+ }
10351
+ ]
10352
+ }
10353
+ },
10231
10354
  {
10232
10355
  "name": "dap-ds-time-grid",
10233
10356
  "description": "A time grid component that allows users to select hours and minutes in two side-by-side scrollable columns.\n---\n\n\n### **Events:**\n - **dds-change** - Fired when time selection changes.\n- **dds-close** - Fired when the time grid should close.\n\n### **CSS Properties:**\n - **--dds-time-grid-gap** - The gap between time sections (default: var(--dds-spacing-400)). _(default: undefined)_\n- **--dds-time-grid-padding** - The padding around the time grid (default: var(--dds-spacing-0)). _(default: undefined)_\n- **--dds-time-grid-column-gap** - The gap between time buttons in columns (default: var(--dds-spacing-200)). _(default: undefined)_\n- **--dds-time-grid-border-radius** - The border radius of the time grid (default: var(--dds-radius-base)). _(default: undefined)_\n- **--dds-time-grid-background** - The background color of the time grid (default: var(--dds-background-neutral-subtle)). _(default: undefined)_\n- **--dds-time-grid-transition** - The transition timing for the time grid (default: all 0.2s ease-in-out). _(default: undefined)_\n- **--dds-time-grid-max-width** - The maximum width of the time grid (default: 400px). _(default: undefined)_\n- **--dds-time-grid-column-max-height** - The maximum height of time columns (default: 240px). _(default: undefined)_\n\n### **CSS Parts:**\n - **time-grid** - The main time grid container.\n- **hour-section** - The hour selection section.\n- **minute-section** - The minute selection section.\n- **time-button** - Individual time selection buttons.\n- **time-button-base** - The base part of the time button.\n- **time-button-content** - The content part of the time button.\n- **time-button-high-contrast** - The high contrast part of the time button.\n- **section-header-title** - The title of the section header.\n- **section-header-divider** - The divider between the section header and the time buttons.\n- **time-column** - The time column container.",
@@ -10813,124 +10936,6 @@
10813
10936
  ]
10814
10937
  }
10815
10938
  },
10816
- {
10817
- "name": "dap-ds-toc",
10818
- "description": "A table of contents (TOC) is a list of links that allows users to quickly navigate to sections within a document.\n---\n\n\n### **Events:**\n - **dds-anchor-change** - Event that is triggered when the anchor changes.\n\n### **CSS Properties:**\n - **--dds-toc-border-width** - Width of the TOC border. (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-toc-border-color** - Color of the TOC border. (default: var(--dds-border-neutral-divider)) _(default: undefined)_\n- **--dds-toc-title-color** - Color of the TOC title. (default: var(--dds-text-neutral-strong)) _(default: undefined)_\n- **--dds-toc-title-font-size** - Font size of the TOC title. (default: var(--dds-font-base)) _(default: undefined)_\n- **--dds-toc-title-font-weight** - Font weight of the TOC title. (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-toc-title-line-height** - Line height of the TOC title. (default: 1.25) _(default: undefined)_\n- **--dds-toc-link-color** - Color of the TOC links. (default: var(--dds-button-subtle-text-neutral-enabled)) _(default: undefined)_\n- **--dds-toc-link-active-color** - Color of the active TOC link. (default: var(--dds-button-subtle-text-enabled)) _(default: undefined)_\n- **--dds-toc-link-border-color** - Border color of the active TOC link. (default: var(--dds-border-brand-base)) _(default: undefined)_\n- **--dds-toc-link-line-height** - Line height of the TOC links. (default: 1.2) _(default: undefined)_\n- **--dds-toc-link-padding** - Padding of the TOC links. (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-toc-indent-level-0** - Indent level of the TOC items. (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-toc-indent-level-1** - Indent level of the TOC items. (default: var(--dds-spacing-800)) _(default: undefined)_\n- **--dds-toc-indent-level-2** - Indent level of the TOC items. (default: var(--dds-spacing-1200)) _(default: undefined)_\n- **--dds-toc-indent-level-3** - Indent level of the TOC items. (default: var(--dds-spacing-1600)) _(default: undefined)_\n- **--dds-toc-indent-level-4** - Indent level of the TOC items. (default: var(--dds-spacing-2000)) _(default: undefined)_\n- **--dds-toc-indent-level-5** - Indent level of the TOC items. (default: var(--dds-spacing-2400)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main container of the toc.",
10819
- "doc-url": "",
10820
- "attributes": [
10821
- {
10822
- "name": "root",
10823
- "description": "The root element to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#root)",
10824
- "value": { "type": "string", "default": "''" }
10825
- },
10826
- {
10827
- "name": "rootMargin",
10828
- "description": "The margin around the root element to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#rootmargin)",
10829
- "value": { "type": "string", "default": "'0px 0px -80% 0px'" }
10830
- },
10831
- {
10832
- "name": "lastAnchorRootMargin",
10833
- "description": "The margin around the last anchor to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#rootmargin)",
10834
- "value": { "type": "string", "default": "'0px 0px -50% 0px'" }
10835
- },
10836
- {
10837
- "name": "threshold",
10838
- "description": "The threshold to trigger [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#threshold)",
10839
- "value": { "type": "number[]", "default": "[0.1]" }
10840
- },
10841
- {
10842
- "name": "minHeadingLevel",
10843
- "description": "The minimum heading level to include in the TOC. The default value is `2`.",
10844
- "value": { "type": "number", "default": "2" }
10845
- },
10846
- {
10847
- "name": "maxHeadingLevel",
10848
- "description": "The maximum heading level to include in the TOC. The default value is `3`.",
10849
- "value": { "type": "number", "default": "3" }
10850
- },
10851
- {
10852
- "name": "noIndent",
10853
- "description": "Whether to indent the TOC items.",
10854
- "value": { "type": "boolean", "default": "false" }
10855
- },
10856
- {
10857
- "name": "header",
10858
- "description": "The header of the TOC.",
10859
- "value": { "type": "string" }
10860
- }
10861
- ],
10862
- "events": [
10863
- {
10864
- "name": "dds-anchor-change",
10865
- "type": "{ selectedItem: HTMLAnchorElement, anchorElement: IntersectionObserverEntry | HTMLElement }",
10866
- "description": "Event that is triggered when the anchor changes."
10867
- }
10868
- ],
10869
- "js": {
10870
- "properties": [
10871
- {
10872
- "name": "root",
10873
- "description": "The root element to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#root)",
10874
- "type": "string"
10875
- },
10876
- {
10877
- "name": "rootMargin",
10878
- "description": "The margin around the root element to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#rootmargin)",
10879
- "type": "string"
10880
- },
10881
- {
10882
- "name": "lastAnchorRootMargin",
10883
- "description": "The margin around the last anchor to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#rootmargin)",
10884
- "type": "string"
10885
- },
10886
- {
10887
- "name": "threshold",
10888
- "description": "The threshold to trigger [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#threshold)",
10889
- "type": "number[]"
10890
- },
10891
- {
10892
- "name": "minHeadingLevel",
10893
- "description": "The minimum heading level to include in the TOC. The default value is `2`.",
10894
- "type": "number"
10895
- },
10896
- {
10897
- "name": "maxHeadingLevel",
10898
- "description": "The maximum heading level to include in the TOC. The default value is `3`.",
10899
- "type": "number"
10900
- },
10901
- {
10902
- "name": "noIndent",
10903
- "description": "Whether to indent the TOC items.",
10904
- "type": "boolean"
10905
- },
10906
- {
10907
- "name": "header",
10908
- "description": "The header of the TOC.",
10909
- "type": "string"
10910
- },
10911
- { "name": "activeAnchor" },
10912
- { "name": "anchors" },
10913
- { "name": "items" },
10914
- {
10915
- "name": "size",
10916
- "description": "The size of the TOC. Default is `lg.",
10917
- "type": "'xs' | 'sm' | 'md' | 'lg'"
10918
- },
10919
- {
10920
- "name": "sizeMap",
10921
- "description": "Responsive size map (e.g. \"md:lg\").",
10922
- "type": "string"
10923
- }
10924
- ],
10925
- "events": [
10926
- {
10927
- "name": "dds-anchor-change",
10928
- "type": "{ selectedItem: HTMLAnchorElement, anchorElement: IntersectionObserverEntry | HTMLElement }",
10929
- "description": "Event that is triggered when the anchor changes."
10930
- }
10931
- ]
10932
- }
10933
- },
10934
10939
  {
10935
10940
  "name": "dap-ds-toggle-button",
10936
10941
  "description": "A toggle button is a button that can be toggled on (active) or off (inactive).\n---\n\n\n### **Slots:**\n - _default_ - The content of the toggle button.\n\n### **CSS Properties:**\n - **--dds-toggle-button-min-width-lg** - Minimum width of the large toggle button (default: var(--dds-spacing-2400)) _(default: undefined)_\n- **--dds-toggle-button-min-width-md** - Minimum width of the medium toggle button (default: var(--dds-spacing-2000)) _(default: undefined)_\n- **--dds-toggle-button-min-width-sm** - Minimum width of the small toggle button (default: var(--dds-spacing-1200)) _(default: undefined)_\n- **--dds-toggle-button-min-width-xs** - Minimum width of the extra small toggle button (default: var(--dds-spacing-1200)) _(default: undefined)_\n- **--dds-toggle-button-height-lg** - Height of the large toggle button (default: var(--dds-spacing-1200)) _(default: undefined)_\n- **--dds-toggle-button-height-md** - Height of the medium toggle button (default: var(--dds-spacing-1000)) _(default: undefined)_\n- **--dds-toggle-button-height-sm** - Height of the small toggle button (default: var(--dds-spacing-800)) _(default: undefined)_\n- **--dds-toggle-button-height-xs** - Height of the extra small toggle button (default: var(--dds-spacing-600)) _(default: undefined)_\n- **--dds-toggle-button-padding-lg** - Padding of the large toggle button (default: var(--dds-spacing-300) var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-toggle-button-padding-md** - Padding of the medium toggle button (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-toggle-button-padding-sm** - Padding of the small toggle button (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-toggle-button-padding-xs** - Padding of the extra small toggle button (default: var(--dds-spacing-150) var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-toggle-button-font-size-lg** - Font size of the large toggle button (default: 1.125rem) _(default: undefined)_\n- **--dds-toggle-button-font-size-md** - Font size of the medium toggle button (default: 1rem) _(default: undefined)_\n- **--dds-toggle-button-font-size-sm** - Font size of the small toggle button (default: 0.875rem) _(default: undefined)_\n- **--dds-toggle-button-font-size-xs** - Font size of the extra small toggle button (default: var(--dds-font-xs)) _(default: undefined)_\n- **--dds-toggle-button-border-enabled** - Border color in enabled state (default: var(--dds-button-toggle-border-enabled)) _(default: undefined)_\n- **--dds-toggle-button-background-enabled** - Background color in enabled state (default: var(--dds-button-toggle-background-enabled)) _(default: undefined)_\n- **--dds-toggle-button-content-enabled** - Content/text color in enabled state (default: var(--dds-button-toggle-content-enabled)) _(default: undefined)_\n- **--dds-toggle-button-border-hover** - Border color in hover state (default: var(--dds-button-toggle-border-hover)) _(default: undefined)_\n- **--dds-toggle-button-background-hover** - Background color in hover state (default: var(--dds-button-toggle-background-hover)) _(default: undefined)_\n- **--dds-toggle-button-border-pressed** - Border color in pressed state (default: var(--dds-button-toggle-border-pressed)) _(default: undefined)_\n- **--dds-toggle-button-background-pressed** - Background color in pressed state (default: var(--dds-button-toggle-background-pressed)) _(default: undefined)_\n- **--dds-toggle-button-background-selected-enabled** - Background color in selected enabled state (default: var(--dds-button-toggle-background-selected-enabled)) _(default: undefined)_\n- **--dds-toggle-button-content-selected-enabled** - Content/text color in selected enabled state (default: var(--dds-button-toggle-content-selected-enabled)) _(default: undefined)_\n- **--dds-toggle-button-background-selected-hover** - Background color in selected hover state (default: var(--dds-button-toggle-background-selected-hover)) _(default: undefined)_\n- **--dds-toggle-button-background-selected-pressed** - Background color in selected pressed state (default: var(--dds-button-toggle-background-selected-pressed)) _(default: undefined)_\n- **--dds-toggle-button-border-disabled** - Border color in disabled state (default: var(--dds-button-toggle-border-disabled)) _(default: undefined)_\n- **--dds-toggle-button-background-disabled** - Background color in disabled state (default: var(--dds-button-toggle-background-disabled)) _(default: undefined)_\n- **--dds-toggle-button-content-disabled** - Content/text color in disabled state (default: var(--dds-button-toggle-content-disabled)) _(default: undefined)_\n- **--dds-toggle-button-highcontrast-border** - High contrast border color (default: var(--dds-button-toggle-highcontrast-border)) _(default: undefined)_\n- **--dds-toggle-button-highcontrast-border-hover** - High contrast border color on hover (default: var(--dds-button-toggle-highcontrast-border-hover)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main button container.\n- **high-contrast** - The high contrast part of the button.",