dap-design-system 0.60.2 → 0.60.3

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.
@@ -270,72 +270,6 @@
270
270
  ]
271
271
  }
272
272
  },
273
- {
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.",
276
- "doc-url": "",
277
- "attributes": [
278
- {
279
- "name": "autoClose",
280
- "description": "Whether to close other accordions when one is opened.",
281
- "value": { "type": "string", "default": "'true'" }
282
- },
283
- {
284
- "name": "variant",
285
- "description": "The variant of the accordion",
286
- "value": {
287
- "type": "'default' | 'collapsed' | 'clean' | 'clean-collapsed'",
288
- "default": "'default'"
289
- }
290
- }
291
- ],
292
- "slots": [
293
- { "name": "", "description": "The content of the accordion group." }
294
- ],
295
- "events": [],
296
- "js": {
297
- "properties": [
298
- {
299
- "name": "autoClose",
300
- "description": "Whether to close other accordions when one is opened.",
301
- "type": "string"
302
- },
303
- {
304
- "name": "variant",
305
- "description": "The variant of the accordion",
306
- "type": "'default' | 'collapsed' | 'clean' | 'clean-collapsed'"
307
- }
308
- ],
309
- "events": []
310
- }
311
- },
312
- {
313
- "name": "dap-ds-anchor-heading",
314
- "description": "Anchor heading is a heading with an anchor link.\n---\n\n\n### **CSS Properties:**\n - **--dds-anchor-link-color** - The color of the anchor link (default: var(--dds-color-primary)) _(default: undefined)_\n- **--dds-anchor-link-opacity** - The opacity of the anchor link when not hovered (default: 0) _(default: undefined)_\n- **--dds-anchor-link-hover-opacity** - The opacity of the anchor link when hovered (default: 1) _(default: undefined)_\n- **--dds-anchor-link-transition** - The transition property for the anchor link opacity (default: opacity 0.2s ease-in-out) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main anchor heading container.\n- **link** - The link of the anchor heading. dap-ds-link element.\n- **link-base** - The base of the link part.\n- **text** - The text of the anchor heading.",
315
- "doc-url": "",
316
- "attributes": [
317
- {
318
- "name": "variant",
319
- "description": "The variant of the heading. Default is `h2`. Can be `h1`, `h2`, `h3`, `h4`, `h5`, or `h6`.",
320
- "value": { "type": "HeadingVariant" }
321
- },
322
- {
323
- "name": "label",
324
- "description": "The label of the heading.",
325
- "value": { "type": "string" }
326
- }
327
- ],
328
- "events": [],
329
- "js": {
330
- "properties": [
331
- { "name": "variant", "type": "HeadingVariant" },
332
- { "name": "label", "type": "string" },
333
- { "name": "elementId" },
334
- { "name": "anchorTitle" }
335
- ],
336
- "events": []
337
- }
338
- },
339
273
  {
340
274
  "name": "dap-ds-avatar-group",
341
275
  "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.",
@@ -633,6 +567,72 @@
633
567
  "events": []
634
568
  }
635
569
  },
570
+ {
571
+ "name": "dap-ds-anchor-heading",
572
+ "description": "Anchor heading is a heading with an anchor link.\n---\n\n\n### **CSS Properties:**\n - **--dds-anchor-link-color** - The color of the anchor link (default: var(--dds-color-primary)) _(default: undefined)_\n- **--dds-anchor-link-opacity** - The opacity of the anchor link when not hovered (default: 0) _(default: undefined)_\n- **--dds-anchor-link-hover-opacity** - The opacity of the anchor link when hovered (default: 1) _(default: undefined)_\n- **--dds-anchor-link-transition** - The transition property for the anchor link opacity (default: opacity 0.2s ease-in-out) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main anchor heading container.\n- **link** - The link of the anchor heading. dap-ds-link element.\n- **link-base** - The base of the link part.\n- **text** - The text of the anchor heading.",
573
+ "doc-url": "",
574
+ "attributes": [
575
+ {
576
+ "name": "variant",
577
+ "description": "The variant of the heading. Default is `h2`. Can be `h1`, `h2`, `h3`, `h4`, `h5`, or `h6`.",
578
+ "value": { "type": "HeadingVariant" }
579
+ },
580
+ {
581
+ "name": "label",
582
+ "description": "The label of the heading.",
583
+ "value": { "type": "string" }
584
+ }
585
+ ],
586
+ "events": [],
587
+ "js": {
588
+ "properties": [
589
+ { "name": "variant", "type": "HeadingVariant" },
590
+ { "name": "label", "type": "string" },
591
+ { "name": "elementId" },
592
+ { "name": "anchorTitle" }
593
+ ],
594
+ "events": []
595
+ }
596
+ },
597
+ {
598
+ "name": "dap-ds-accordion-group",
599
+ "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.",
600
+ "doc-url": "",
601
+ "attributes": [
602
+ {
603
+ "name": "autoClose",
604
+ "description": "Whether to close other accordions when one is opened.",
605
+ "value": { "type": "string", "default": "'true'" }
606
+ },
607
+ {
608
+ "name": "variant",
609
+ "description": "The variant of the accordion",
610
+ "value": {
611
+ "type": "'default' | 'collapsed' | 'clean' | 'clean-collapsed'",
612
+ "default": "'default'"
613
+ }
614
+ }
615
+ ],
616
+ "slots": [
617
+ { "name": "", "description": "The content of the accordion group." }
618
+ ],
619
+ "events": [],
620
+ "js": {
621
+ "properties": [
622
+ {
623
+ "name": "autoClose",
624
+ "description": "Whether to close other accordions when one is opened.",
625
+ "type": "string"
626
+ },
627
+ {
628
+ "name": "variant",
629
+ "description": "The variant of the accordion",
630
+ "type": "'default' | 'collapsed' | 'clean' | 'clean-collapsed'"
631
+ }
632
+ ],
633
+ "events": []
634
+ }
635
+ },
636
636
  {
637
637
  "name": "dap-ds-breadcrumb-item",
638
638
  "description": "A breadcrumb item is a secondary navigation scheme that reveals the user's location in a website or Web application.\n---\n\n\n### **Slots:**\n - _default_ - The content of the breadcrumb item.\n- **separator** - The separator between breadcrumb items. Default is an arrow-right-s-line icon.\n\n### **CSS Properties:**\n - **--dds-breadcrumb-item-display** - The display property of the breadcrumb item (default: inline-flex) _(default: undefined)_\n- **--dds-breadcrumb-item-flex-wrap** - The flex-wrap property of the breadcrumb item (default: nowrap) _(default: undefined)_\n- **--dds-breadcrumb-item-align-items** - The align-items property of the breadcrumb item (default: center) _(default: undefined)_\n- **--dds-breadcrumb-item-color** - The text color of the breadcrumb item (default: var(--dds-text-neutral-base)) _(default: undefined)_\n- **--dds-breadcrumb-item-transition** - The transition property for the breadcrumb item (default: all 0.2s ease-in-out) _(default: undefined)_\n- **--dds-breadcrumb-item-gap** - The gap between the breadcrumb item and the separator (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-breadcrumb-item-padding** - The padding of the breadcrumb item (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-breadcrumb-item-font-size** - The font size of the breadcrumb item (default: var(--dds-font-sm)) _(default: undefined)_\n- **--dds-breadcrumb-item-font-weight** - The font weight of the breadcrumb item (default: var(--dds-font-weight-medium)) _(default: undefined)_\n- **--dds-breadcrumb-item-font-weight-bold** - The bold font weight of the breadcrumb item (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-breadcrumb-item-separator-color** - The color of the separator (default: var(--dds-text-neutral-disabled)) _(default: undefined)_\n- **--dds-breadcrumb-item-link-color** - The color of the link (default: var(--dds-link-neutral-enabled)) _(default: undefined)_\n- **--dds-breadcrumb-item-inverted-color** - The text color when inverted (default: var(--dds-text-neutral-inverted)) _(default: undefined)_\n- **--dds-breadcrumb-item-inverted-link-color** - The link color when inverted (default: var(--dds-text-neutral-inverted)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main breadcrumb item container. The li element.\n- **link** - The link of the breadcrumb item. The dds-link component.\n- **link-base** - The base part of the link part. The dds-link components base part.\n- **item-nolink** - The item of the breadcrumb item without a link. The span element.\n- **separator** - The separator of the breadcrumb item.",
@@ -889,113 +889,358 @@
889
889
  }
890
890
  },
891
891
  {
892
- "name": "dap-ds-callout",
893
- "description": "`dap-ds-callout` is a custom callout component.\n---\n\n\n### **Events:**\n - **dds-close** - Fired when the close button is clicked.\n\n### **Slots:**\n - _default_ - The content of the callout.\n- **title** - The title of the callout.\n- **icon** - The icon of the callout.\n- **actions** - The actions of the callout.\n- **close** - The close button of the callout.\n\n### **CSS Properties:**\n - **--dds-callout-padding** - Padding of the callout content. (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-callout-gap** - Gap between elements in horizontal layout. (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-callout-icon-size** - Size of the icon. (default: var(--dds-spacing-600)) _(default: undefined)_\n- **--dds-callout-title-color** - Color of the title text. (default: var(--dds-text-neutral-strong)) _(default: undefined)_\n- **--dds-callout-description-color** - Color of the description text. (default: var(--dds-text-neutral-base)) _(default: undefined)_\n- **--dds-callout-title-font-size** - Font size of the title. (default: var(--dds-font-base)) _(default: undefined)_\n- **--dds-callout-description-font-size** - Font size of the description. (default: var(--dds-font-base)) _(default: undefined)_\n- **--dds-callout-title-font-weight** - Font weight of the title. (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-callout-description-font-weight** - Font weight of the description. (default: var(--dds-font-weight-medium)) _(default: undefined)_\n- **--dds-callout-actions-font-weight** - Font weight of the actions. (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-callout-actions-gap** - Gap between action items. (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-callout-content-gap** - Gap between content elements. (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-callout-border-radius** - Border radius of the callout. (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-callout-brand-background** - Brand variant background color. (default: var(--dds-background-brand-base)) _(default: undefined)_\n- **--dds-callout-brand-background-subtle** - Brand variant subtle background color. (default: var(--dds-background-brand-subtle)) _(default: undefined)_\n- **--dds-callout-brand-background-medium** - Brand variant medium background color. (default: var(--dds-background-brand-medium)) _(default: undefined)_\n- **--dds-callout-brand-background-strong** - Brand variant strong background color. (default: var(--dds-background-brand-strong)) _(default: undefined)_\n- **--dds-callout-brand-icon** - Brand variant icon color. (default: var(--dds-icon-brand-subtle)) _(default: undefined)_\n- **--dds-callout-brand-border** - Brand variant border color. (default: var(--dds-border-brand-subtle)) _(default: undefined)_\n- **--dds-callout-info-background** - Info variant background color. (default: var(--dds-background-informative-base)) _(default: undefined)_\n- **--dds-callout-info-background-subtle** - Info variant subtle background color. (default: var(--dds-background-informative-subtle)) _(default: undefined)_\n- **--dds-callout-info-background-medium** - Info variant medium background color. (default: var(--dds-background-informative-medium)) _(default: undefined)_\n- **--dds-callout-info-background-strong** - Info variant strong background color. (default: var(--dds-background-informative-strong)) _(default: undefined)_\n- **--dds-callout-info-icon** - Info variant icon color. (default: var(--dds-icon-informative-subtle)) _(default: undefined)_\n- **--dds-callout-info-border** - Info variant border color. (default: var(--dds-border-informative-subtle)) _(default: undefined)_\n- **--dds-callout-positive-background** - Positive variant background color. (default: var(--dds-background-positive-base)) _(default: undefined)_\n- **--dds-callout-positive-background-subtle** - Positive variant subtle background color. (default: var(--dds-background-positive-subtle)) _(default: undefined)_\n- **--dds-callout-positive-background-medium** - Positive variant medium background color. (default: var(--dds-background-positive-medium)) _(default: undefined)_\n- **--dds-callout-positive-background-strong** - Positive variant strong background color. (default: var(--dds-background-positive-strong)) _(default: undefined)_\n- **--dds-callout-positive-icon** - Positive variant icon color. (default: var(--dds-icon-positive-subtle)) _(default: undefined)_\n- **--dds-callout-positive-border** - Positive variant border color. (default: var(--dds-border-positive-subtle)) _(default: undefined)_\n- **--dds-callout-warning-background** - Warning variant background color. (default: var(--dds-background-warning-base)) _(default: undefined)_\n- **--dds-callout-warning-background-subtle** - Warning variant subtle background color. (default: var(--dds-background-warning-subtle)) _(default: undefined)_\n- **--dds-callout-warning-background-medium** - Warning variant medium background color. (default: var(--dds-background-warning-medium)) _(default: undefined)_\n- **--dds-callout-warning-background-strong** - Warning variant strong background color. (default: var(--dds-background-warning-strong)) _(default: undefined)_\n- **--dds-callout-warning-icon** - Warning variant icon color. (default: var(--dds-icon-neutral-strong)) _(default: undefined)_\n- **--dds-callout-warning-border** - Warning variant border color. (default: var(--dds-border-warning-subtle)) _(default: undefined)_\n- **--dds-callout-negative-background** - Negative variant background color. (default: var(--dds-background-negative-base)) _(default: undefined)_\n- **--dds-callout-negative-background-subtle** - Negative variant subtle background color. (default: var(--dds-background-negative-subtle)) _(default: undefined)_\n- **--dds-callout-negative-background-medium** - Negative variant medium background color. (default: var(--dds-background-negative-medium)) _(default: undefined)_\n- **--dds-callout-negative-background-strong** - Negative variant strong background color. (default: var(--dds-background-negative-strong)) _(default: undefined)_\n- **--dds-callout-negative-icon** - Negative variant icon color. (default: var(--dds-icon-negative-subtle)) _(default: undefined)_\n- **--dds-callout-negative-border** - Negative variant border color. (default: var(--dds-border-negative-subtle)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main callout container.\n- **content** - The content of the callout.\n- **card-content** - The content of the card.\n- **icon** - The icon of the callout.\n- **title** - The title of the callout.\n- **description** - The description of the callout.\n- **actions** - The actions of the callout.\n- **close** - The close button of the callout.",
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
894
  "doc-url": "",
895
895
  "attributes": [
896
896
  {
897
- "name": "variant",
898
- "description": "The variant of the callout",
899
- "value": {
900
- "type": "'brand' | 'positive' | 'info' | 'warning' | 'negative'",
901
- "default": "'brand'"
902
- }
897
+ "name": "selected",
898
+ "description": "Whether the calendar cell is selected.",
899
+ "value": { "type": "boolean", "default": "false" }
903
900
  },
904
901
  {
905
- "name": "alignment",
906
- "description": "The alignment of the callout. Can be `vertical` or `horizontal`.",
907
- "value": {
908
- "type": "'vertical' | 'horizontal'",
909
- "default": "'horizontal'"
910
- }
902
+ "name": "disabledDay",
903
+ "description": "Whether the calendar cell is disabled.",
904
+ "value": { "type": "boolean", "default": "false" }
911
905
  },
912
906
  {
913
- "name": "shade",
914
- "description": "The strongness of the callout colors. Can be `subtle`, `base`, `medium`, or `strong`.",
915
- "value": {
916
- "type": "'subtle' | 'base' | 'medium' | 'strong'",
917
- "default": "'base'"
918
- }
907
+ "name": "today",
908
+ "description": "Whether the calendar cell is today.",
909
+ "value": { "type": "boolean", "default": "false" }
919
910
  },
920
911
  {
921
- "name": "noBorder",
922
- "description": "If the callout has a border",
923
- "value": { "type": "string", "default": "'true'" }
912
+ "name": "outOfRange",
913
+ "description": "Whether the calendar cell is out of range.",
914
+ "value": { "type": "boolean", "default": "false" }
924
915
  },
925
916
  {
926
- "name": "closeable",
927
- "description": "If the callout has a close button",
917
+ "name": "header",
918
+ "description": "Whether the calendar cell is a date header.",
928
919
  "value": { "type": "boolean", "default": "false" }
929
920
  },
930
921
  {
931
- "name": "title",
932
- "description": "The header of the callout",
933
- "value": { "type": "string" }
922
+ "name": "focused",
923
+ "description": "Whether the calendar cell is focused.",
924
+ "value": { "type": "boolean", "default": "false" }
934
925
  },
935
926
  {
936
- "name": "closeButtonLabel",
937
- "description": "The label of the close button",
938
- "value": { "type": "string" }
927
+ "name": "rangestart",
928
+ "description": "Whether the calendar cell is the start of a range.",
929
+ "value": { "type": "boolean", "default": "false" }
939
930
  },
940
931
  {
941
- "name": "closeButtonTestId",
942
- "description": "`data-testid` for the default close button.",
943
- "value": { "type": "string", "default": "'callout-close-button'" }
932
+ "name": "rangeend",
933
+ "description": "Whether the calendar cell is the end of a range.",
934
+ "value": { "type": "boolean", "default": "false" }
944
935
  },
945
936
  {
946
- "name": "opened",
947
- "description": "If the callout is opened",
948
- "value": { "type": "string", "default": "'true'" }
949
- }
950
- ],
951
- "slots": [
952
- { "name": "", "description": "The content of the callout." },
953
- { "name": "title", "description": "The title of the callout." },
954
- { "name": "icon", "description": "The icon of the callout." },
955
- { "name": "actions", "description": "The actions of the callout." },
937
+ "name": "inrange",
938
+ "description": "Whether the calendar cell is in the middle of a range.",
939
+ "value": { "type": "boolean", "default": "false" }
940
+ },
956
941
  {
957
- "name": "close",
958
- "description": "The close button of the callout."
942
+ "name": "locale",
943
+ "description": "The locale of the calendar cell.",
944
+ "value": {
945
+ "type": "'hu' | 'en' | 'de'",
946
+ "default": "dayjs.locale()"
947
+ }
959
948
  }
960
949
  ],
961
- "events": [
962
- {
963
- "name": "dds-close",
964
- "type": "{ void }",
965
- "description": "Fired when the close button is clicked."
966
- }
950
+ "slots": [
951
+ { "name": "", "description": "The content of the calendar cell." }
967
952
  ],
953
+ "events": [],
968
954
  "js": {
969
955
  "properties": [
970
956
  {
971
- "name": "variant",
972
- "description": "The variant of the callout",
973
- "type": "'brand' | 'positive' | 'info' | 'warning' | 'negative'"
957
+ "name": "value",
958
+ "description": "The value of the calendar cell.",
959
+ "type": "Dayjs"
974
960
  },
975
961
  {
976
- "name": "alignment",
977
- "description": "The alignment of the callout. Can be `vertical` or `horizontal`.",
978
- "type": "'vertical' | 'horizontal'"
962
+ "name": "selected",
963
+ "description": "Whether the calendar cell is selected.",
964
+ "type": "boolean"
979
965
  },
980
966
  {
981
- "name": "shade",
982
- "description": "The strongness of the callout colors. Can be `subtle`, `base`, `medium`, or `strong`.",
983
- "type": "'subtle' | 'base' | 'medium' | 'strong'"
967
+ "name": "disabledDay",
968
+ "description": "Whether the calendar cell is disabled.",
969
+ "type": "boolean"
984
970
  },
985
971
  {
986
- "name": "noBorder",
987
- "description": "If the callout has a border",
988
- "type": "string"
972
+ "name": "today",
973
+ "description": "Whether the calendar cell is today.",
974
+ "type": "boolean"
989
975
  },
990
976
  {
991
- "name": "closeable",
992
- "description": "If the callout has a close button",
977
+ "name": "outOfRange",
978
+ "description": "Whether the calendar cell is out of range.",
993
979
  "type": "boolean"
994
980
  },
995
981
  {
996
- "name": "title",
997
- "description": "The header of the callout",
998
- "type": "string"
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" }
1126
+ ],
1127
+ "events": [
1128
+ {
1129
+ "name": "dds-change",
1130
+ "type": "{ value: Dayjs }",
1131
+ "description": "Fired when the calendar value changes."
1132
+ }
1133
+ ]
1134
+ }
1135
+ },
1136
+ {
1137
+ "name": "dap-ds-callout",
1138
+ "description": "`dap-ds-callout` is a custom callout component.\n---\n\n\n### **Events:**\n - **dds-close** - Fired when the close button is clicked.\n\n### **Slots:**\n - _default_ - The content of the callout.\n- **title** - The title of the callout.\n- **icon** - The icon of the callout.\n- **actions** - The actions of the callout.\n- **close** - The close button of the callout.\n\n### **CSS Properties:**\n - **--dds-callout-padding** - Padding of the callout content. (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-callout-gap** - Gap between elements in horizontal layout. (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-callout-icon-size** - Size of the icon. (default: var(--dds-spacing-600)) _(default: undefined)_\n- **--dds-callout-title-color** - Color of the title text. (default: var(--dds-text-neutral-strong)) _(default: undefined)_\n- **--dds-callout-description-color** - Color of the description text. (default: var(--dds-text-neutral-base)) _(default: undefined)_\n- **--dds-callout-title-font-size** - Font size of the title. (default: var(--dds-font-base)) _(default: undefined)_\n- **--dds-callout-description-font-size** - Font size of the description. (default: var(--dds-font-base)) _(default: undefined)_\n- **--dds-callout-title-font-weight** - Font weight of the title. (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-callout-description-font-weight** - Font weight of the description. (default: var(--dds-font-weight-medium)) _(default: undefined)_\n- **--dds-callout-actions-font-weight** - Font weight of the actions. (default: var(--dds-font-weight-bold)) _(default: undefined)_\n- **--dds-callout-actions-gap** - Gap between action items. (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-callout-content-gap** - Gap between content elements. (default: var(--dds-spacing-100)) _(default: undefined)_\n- **--dds-callout-border-radius** - Border radius of the callout. (default: var(--dds-radius-base)) _(default: undefined)_\n- **--dds-callout-brand-background** - Brand variant background color. (default: var(--dds-background-brand-base)) _(default: undefined)_\n- **--dds-callout-brand-background-subtle** - Brand variant subtle background color. (default: var(--dds-background-brand-subtle)) _(default: undefined)_\n- **--dds-callout-brand-background-medium** - Brand variant medium background color. (default: var(--dds-background-brand-medium)) _(default: undefined)_\n- **--dds-callout-brand-background-strong** - Brand variant strong background color. (default: var(--dds-background-brand-strong)) _(default: undefined)_\n- **--dds-callout-brand-icon** - Brand variant icon color. (default: var(--dds-icon-brand-subtle)) _(default: undefined)_\n- **--dds-callout-brand-border** - Brand variant border color. (default: var(--dds-border-brand-subtle)) _(default: undefined)_\n- **--dds-callout-info-background** - Info variant background color. (default: var(--dds-background-informative-base)) _(default: undefined)_\n- **--dds-callout-info-background-subtle** - Info variant subtle background color. (default: var(--dds-background-informative-subtle)) _(default: undefined)_\n- **--dds-callout-info-background-medium** - Info variant medium background color. (default: var(--dds-background-informative-medium)) _(default: undefined)_\n- **--dds-callout-info-background-strong** - Info variant strong background color. (default: var(--dds-background-informative-strong)) _(default: undefined)_\n- **--dds-callout-info-icon** - Info variant icon color. (default: var(--dds-icon-informative-subtle)) _(default: undefined)_\n- **--dds-callout-info-border** - Info variant border color. (default: var(--dds-border-informative-subtle)) _(default: undefined)_\n- **--dds-callout-positive-background** - Positive variant background color. (default: var(--dds-background-positive-base)) _(default: undefined)_\n- **--dds-callout-positive-background-subtle** - Positive variant subtle background color. (default: var(--dds-background-positive-subtle)) _(default: undefined)_\n- **--dds-callout-positive-background-medium** - Positive variant medium background color. (default: var(--dds-background-positive-medium)) _(default: undefined)_\n- **--dds-callout-positive-background-strong** - Positive variant strong background color. (default: var(--dds-background-positive-strong)) _(default: undefined)_\n- **--dds-callout-positive-icon** - Positive variant icon color. (default: var(--dds-icon-positive-subtle)) _(default: undefined)_\n- **--dds-callout-positive-border** - Positive variant border color. (default: var(--dds-border-positive-subtle)) _(default: undefined)_\n- **--dds-callout-warning-background** - Warning variant background color. (default: var(--dds-background-warning-base)) _(default: undefined)_\n- **--dds-callout-warning-background-subtle** - Warning variant subtle background color. (default: var(--dds-background-warning-subtle)) _(default: undefined)_\n- **--dds-callout-warning-background-medium** - Warning variant medium background color. (default: var(--dds-background-warning-medium)) _(default: undefined)_\n- **--dds-callout-warning-background-strong** - Warning variant strong background color. (default: var(--dds-background-warning-strong)) _(default: undefined)_\n- **--dds-callout-warning-icon** - Warning variant icon color. (default: var(--dds-icon-neutral-strong)) _(default: undefined)_\n- **--dds-callout-warning-border** - Warning variant border color. (default: var(--dds-border-warning-subtle)) _(default: undefined)_\n- **--dds-callout-negative-background** - Negative variant background color. (default: var(--dds-background-negative-base)) _(default: undefined)_\n- **--dds-callout-negative-background-subtle** - Negative variant subtle background color. (default: var(--dds-background-negative-subtle)) _(default: undefined)_\n- **--dds-callout-negative-background-medium** - Negative variant medium background color. (default: var(--dds-background-negative-medium)) _(default: undefined)_\n- **--dds-callout-negative-background-strong** - Negative variant strong background color. (default: var(--dds-background-negative-strong)) _(default: undefined)_\n- **--dds-callout-negative-icon** - Negative variant icon color. (default: var(--dds-icon-negative-subtle)) _(default: undefined)_\n- **--dds-callout-negative-border** - Negative variant border color. (default: var(--dds-border-negative-subtle)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main callout container.\n- **content** - The content of the callout.\n- **card-content** - The content of the card.\n- **icon** - The icon of the callout.\n- **title** - The title of the callout.\n- **description** - The description of the callout.\n- **actions** - The actions of the callout.\n- **close** - The close button of the callout.",
1139
+ "doc-url": "",
1140
+ "attributes": [
1141
+ {
1142
+ "name": "variant",
1143
+ "description": "The variant of the callout",
1144
+ "value": {
1145
+ "type": "'brand' | 'positive' | 'info' | 'warning' | 'negative'",
1146
+ "default": "'brand'"
1147
+ }
1148
+ },
1149
+ {
1150
+ "name": "alignment",
1151
+ "description": "The alignment of the callout. Can be `vertical` or `horizontal`.",
1152
+ "value": {
1153
+ "type": "'vertical' | 'horizontal'",
1154
+ "default": "'horizontal'"
1155
+ }
1156
+ },
1157
+ {
1158
+ "name": "shade",
1159
+ "description": "The strongness of the callout colors. Can be `subtle`, `base`, `medium`, or `strong`.",
1160
+ "value": {
1161
+ "type": "'subtle' | 'base' | 'medium' | 'strong'",
1162
+ "default": "'base'"
1163
+ }
1164
+ },
1165
+ {
1166
+ "name": "noBorder",
1167
+ "description": "If the callout has a border",
1168
+ "value": { "type": "string", "default": "'true'" }
1169
+ },
1170
+ {
1171
+ "name": "closeable",
1172
+ "description": "If the callout has a close button",
1173
+ "value": { "type": "boolean", "default": "false" }
1174
+ },
1175
+ {
1176
+ "name": "title",
1177
+ "description": "The header of the callout",
1178
+ "value": { "type": "string" }
1179
+ },
1180
+ {
1181
+ "name": "closeButtonLabel",
1182
+ "description": "The label of the close button",
1183
+ "value": { "type": "string" }
1184
+ },
1185
+ {
1186
+ "name": "closeButtonTestId",
1187
+ "description": "`data-testid` for the default close button.",
1188
+ "value": { "type": "string", "default": "'callout-close-button'" }
1189
+ },
1190
+ {
1191
+ "name": "opened",
1192
+ "description": "If the callout is opened",
1193
+ "value": { "type": "string", "default": "'true'" }
1194
+ }
1195
+ ],
1196
+ "slots": [
1197
+ { "name": "", "description": "The content of the callout." },
1198
+ { "name": "title", "description": "The title of the callout." },
1199
+ { "name": "icon", "description": "The icon of the callout." },
1200
+ { "name": "actions", "description": "The actions of the callout." },
1201
+ {
1202
+ "name": "close",
1203
+ "description": "The close button of the callout."
1204
+ }
1205
+ ],
1206
+ "events": [
1207
+ {
1208
+ "name": "dds-close",
1209
+ "type": "{ void }",
1210
+ "description": "Fired when the close button is clicked."
1211
+ }
1212
+ ],
1213
+ "js": {
1214
+ "properties": [
1215
+ {
1216
+ "name": "variant",
1217
+ "description": "The variant of the callout",
1218
+ "type": "'brand' | 'positive' | 'info' | 'warning' | 'negative'"
1219
+ },
1220
+ {
1221
+ "name": "alignment",
1222
+ "description": "The alignment of the callout. Can be `vertical` or `horizontal`.",
1223
+ "type": "'vertical' | 'horizontal'"
1224
+ },
1225
+ {
1226
+ "name": "shade",
1227
+ "description": "The strongness of the callout colors. Can be `subtle`, `base`, `medium`, or `strong`.",
1228
+ "type": "'subtle' | 'base' | 'medium' | 'strong'"
1229
+ },
1230
+ {
1231
+ "name": "noBorder",
1232
+ "description": "If the callout has a border",
1233
+ "type": "string"
1234
+ },
1235
+ {
1236
+ "name": "closeable",
1237
+ "description": "If the callout has a close button",
1238
+ "type": "boolean"
1239
+ },
1240
+ {
1241
+ "name": "title",
1242
+ "description": "The header of the callout",
1243
+ "type": "string"
999
1244
  },
1000
1245
  {
1001
1246
  "name": "closeButtonLabel",
@@ -1218,389 +1463,144 @@
1218
1463
  "properties": [
1219
1464
  {
1220
1465
  "name": "renderAs",
1221
- "description": "The base rendered root tag of the card title.",
1222
- "type": "string"
1223
- },
1224
- {
1225
- "name": "noPadding",
1226
- "description": "Whether the card title should have no padding.",
1227
- "type": "boolean"
1228
- },
1229
- {
1230
- "name": "spacing",
1231
- "description": "The spacing of the card title. This adds a margin to the card title. Default is `top`.",
1232
- "type": "'top' | 'bottom' | 'both' | 'none'"
1233
- },
1234
- { "name": "parentSized", "type": "string" },
1235
- {
1236
- "name": "size",
1237
- "description": "The size of the card title. Default is `sm`.",
1238
- "type": "'sm' |'md' | 'lg'"
1239
- }
1240
- ],
1241
- "events": []
1242
- }
1243
- },
1244
- {
1245
- "name": "dap-ds-card",
1246
- "description": "A card is a container for content, actions, and images in a consistent format.\n---\n\n\n### **Slots:**\n - _default_ - The content of the card.\n\n### **CSS Properties:**\n - **--dds-card-padding** - The padding of the card. (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-card-border-radius** - The border radius of the card. (default: var(--dds-radius-large)) _(default: undefined)_\n- **--dds-card-border-width** - The border width of the card. (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-card-border-color** - The border color of the card. (default: var(--dds-border-neutral-divider)) _(default: undefined)_\n- **--dds-card-background** - The background color of the card. (default: var(--dds-background-neutral-base)) _(default: undefined)_\n- **--dds-card-hover-border-color** - The border color when hovering over the card. (default: var(--dds-border-brand-base)) _(default: undefined)_\n- **--dds-card-active-border-color** - The border color when the card is active. (default: var(--dds-border-brand-medium)) _(default: undefined)_\n- **--dds-card-shadow** - The box shadow of the card. (default: none) _(default: undefined)_\n- **--dds-card-hover-shadow** - The box shadow when hovering over the card. (default: none) _(default: undefined)_\n- **--dds-card-transition-duration** - The duration of the card's transitions. (default: var(--dds-transition-medium)) _(default: undefined)_\n- **--dds-card-transition-timing** - The timing function of the card's transitions. (default: var(--dds-easing-ease-in-out)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main card container.",
1247
- "doc-url": "",
1248
- "attributes": [
1249
- {
1250
- "name": "interactive",
1251
- "description": "Whether the card is interactive. Default is false. If true, the card will be rendered as an anchor element.",
1252
- "value": { "type": "boolean", "default": "false" }
1253
- },
1254
- {
1255
- "name": "renderAs",
1256
- "description": "The render as type of the card, only applicable when interactive.",
1257
- "value": { "type": "'a' | 'button'", "default": "'a'" }
1258
- },
1259
- {
1260
- "name": "disabled",
1261
- "description": "Whether the card is disabled.",
1262
- "value": { "type": "boolean", "default": "false" }
1263
- },
1264
- {
1265
- "name": "noBorder",
1266
- "description": "Removes the border around the card",
1267
- "value": { "type": "boolean", "default": "false" }
1268
- },
1269
- {
1270
- "name": "noPadding",
1271
- "description": "Removes the padding around the card",
1272
- "value": { "type": "boolean", "default": "false" }
1273
- },
1274
- {
1275
- "name": "targetBlankText",
1276
- "description": "The text for the target blank link, applicable when target is _blank. PRO TIP: Use parenthesis to wrap the text",
1277
- "value": { "type": "string" }
1278
- },
1279
- {
1280
- "name": "target",
1281
- "description": "The link target of the card",
1282
- "value": {
1283
- "type": "'_blank' | '_self' | '_parent' | '_top'",
1284
- "default": "'_self'"
1285
- }
1286
- },
1287
- {
1288
- "name": "href",
1289
- "description": "The URL of the card.",
1290
- "value": { "type": "string" }
1291
- },
1292
- {
1293
- "name": "rel",
1294
- "description": "The rel of the card link.",
1295
- "value": { "type": "string", "default": "'noreferrer noopener'" }
1296
- }
1297
- ],
1298
- "slots": [{ "name": "", "description": "The content of the card." }],
1299
- "events": [],
1300
- "js": {
1301
- "properties": [
1302
- {
1303
- "name": "interactive",
1304
- "description": "Whether the card is interactive. Default is false. If true, the card will be rendered as an anchor element.",
1305
- "type": "boolean"
1306
- },
1307
- {
1308
- "name": "renderAs",
1309
- "description": "The render as type of the card, only applicable when interactive.",
1310
- "type": "'a' | 'button'"
1311
- },
1312
- {
1313
- "name": "disabled",
1314
- "description": "Whether the card is disabled.",
1315
- "type": "boolean"
1316
- },
1317
- {
1318
- "name": "noBorder",
1319
- "description": "Removes the border around the card",
1320
- "type": "boolean"
1321
- },
1322
- {
1323
- "name": "noPadding",
1324
- "description": "Removes the padding around the card",
1325
- "type": "boolean"
1326
- },
1327
- {
1328
- "name": "targetBlankText",
1329
- "description": "The text for the target blank link, applicable when target is _blank. PRO TIP: Use parenthesis to wrap the text",
1330
- "type": "string"
1331
- },
1332
- {
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"
1466
+ "description": "The base rendered root tag of the card title.",
1467
+ "type": "string"
1470
1468
  },
1471
1469
  {
1472
- "name": "inrange",
1473
- "description": "Whether the calendar cell is in the middle of a range.",
1470
+ "name": "noPadding",
1471
+ "description": "Whether the card title should have no padding.",
1474
1472
  "type": "boolean"
1475
1473
  },
1476
1474
  {
1477
- "name": "locale",
1478
- "description": "The locale of the calendar cell.",
1479
- "type": "'hu' | 'en' | 'de'"
1475
+ "name": "spacing",
1476
+ "description": "The spacing of the card title. This adds a margin to the card title. Default is `top`.",
1477
+ "type": "'top' | 'bottom' | 'both' | 'none'"
1480
1478
  },
1481
- { "name": "label", "type": "string" },
1482
- { "name": "focusElement", "type": "HTMLElement" }
1479
+ { "name": "parentSized", "type": "string" },
1480
+ {
1481
+ "name": "size",
1482
+ "description": "The size of the card title. Default is `sm`.",
1483
+ "type": "'sm' |'md' | 'lg'"
1484
+ }
1483
1485
  ],
1484
1486
  "events": []
1485
1487
  }
1486
1488
  },
1487
1489
  {
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
+ "name": "dap-ds-card",
1491
+ "description": "A card is a container for content, actions, and images in a consistent format.\n---\n\n\n### **Slots:**\n - _default_ - The content of the card.\n\n### **CSS Properties:**\n - **--dds-card-padding** - The padding of the card. (default: var(--dds-spacing-400)) _(default: undefined)_\n- **--dds-card-border-radius** - The border radius of the card. (default: var(--dds-radius-large)) _(default: undefined)_\n- **--dds-card-border-width** - The border width of the card. (default: var(--dds-border-width-base)) _(default: undefined)_\n- **--dds-card-border-color** - The border color of the card. (default: var(--dds-border-neutral-divider)) _(default: undefined)_\n- **--dds-card-background** - The background color of the card. (default: var(--dds-background-neutral-base)) _(default: undefined)_\n- **--dds-card-hover-border-color** - The border color when hovering over the card. (default: var(--dds-border-brand-base)) _(default: undefined)_\n- **--dds-card-active-border-color** - The border color when the card is active. (default: var(--dds-border-brand-medium)) _(default: undefined)_\n- **--dds-card-shadow** - The box shadow of the card. (default: none) _(default: undefined)_\n- **--dds-card-hover-shadow** - The box shadow when hovering over the card. (default: none) _(default: undefined)_\n- **--dds-card-transition-duration** - The duration of the card's transitions. (default: var(--dds-transition-medium)) _(default: undefined)_\n- **--dds-card-transition-timing** - The timing function of the card's transitions. (default: var(--dds-easing-ease-in-out)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main card container.",
1490
1492
  "doc-url": "",
1491
1493
  "attributes": [
1492
1494
  {
1493
- "name": "mode",
1494
- "description": "The mode of the calendar - single date or range selection.",
1495
- "value": { "type": "'single' | 'range'", "default": "'single'" }
1495
+ "name": "interactive",
1496
+ "description": "Whether the card is interactive. Default is false. If true, the card will be rendered as an anchor element.",
1497
+ "value": { "type": "boolean", "default": "false" }
1496
1498
  },
1497
1499
  {
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
+ "name": "renderAs",
1501
+ "description": "The render as type of the card, only applicable when interactive.",
1502
+ "value": { "type": "'a' | 'button'", "default": "'a'" }
1503
+ },
1504
+ {
1505
+ "name": "disabled",
1506
+ "description": "Whether the card is disabled.",
1500
1507
  "value": { "type": "boolean", "default": "false" }
1501
1508
  },
1502
1509
  {
1503
- "name": "locale",
1504
- "description": "The locale of the calendar.",
1510
+ "name": "noBorder",
1511
+ "description": "Removes the border around the card",
1512
+ "value": { "type": "boolean", "default": "false" }
1513
+ },
1514
+ {
1515
+ "name": "noPadding",
1516
+ "description": "Removes the padding around the card",
1517
+ "value": { "type": "boolean", "default": "false" }
1518
+ },
1519
+ {
1520
+ "name": "targetBlankText",
1521
+ "description": "The text for the target blank link, applicable when target is _blank. PRO TIP: Use parenthesis to wrap the text",
1522
+ "value": { "type": "string" }
1523
+ },
1524
+ {
1525
+ "name": "target",
1526
+ "description": "The link target of the card",
1505
1527
  "value": {
1506
- "type": "'hu' | 'en' | 'de'",
1507
- "default": "dayjs.locale()"
1528
+ "type": "'_blank' | '_self' | '_parent' | '_top'",
1529
+ "default": "'_self'"
1508
1530
  }
1509
1531
  },
1510
1532
  {
1511
- "name": "prevButtonTestId",
1512
- "description": "`data-testid` for the previous-month button.",
1513
- "value": { "type": "string", "default": "'calendar-prev-button'" }
1533
+ "name": "href",
1534
+ "description": "The URL of the card.",
1535
+ "value": { "type": "string" }
1514
1536
  },
1515
1537
  {
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."
1538
+ "name": "rel",
1539
+ "description": "The rel of the card link.",
1540
+ "value": { "type": "string", "default": "'noreferrer noopener'" }
1529
1541
  }
1530
1542
  ],
1543
+ "slots": [{ "name": "", "description": "The content of the card." }],
1544
+ "events": [],
1531
1545
  "js": {
1532
1546
  "properties": [
1533
1547
  {
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.",
1548
+ "name": "interactive",
1549
+ "description": "Whether the card is interactive. Default is false. If true, the card will be rendered as an anchor element.",
1541
1550
  "type": "boolean"
1542
1551
  },
1543
1552
  {
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"
1553
+ "name": "renderAs",
1554
+ "description": "The render as type of the card, only applicable when interactive.",
1555
+ "type": "'a' | 'button'"
1552
1556
  },
1553
1557
  {
1554
- "name": "rangeEnd",
1555
- "description": "The end date of the range selection (only used in range mode).",
1556
- "type": "Dayjs"
1558
+ "name": "disabled",
1559
+ "description": "Whether the card is disabled.",
1560
+ "type": "boolean"
1557
1561
  },
1558
1562
  {
1559
- "name": "currentDate",
1560
- "description": "The current visible date of the calendar. Only the month and year are considered.",
1561
- "type": "Dayjs"
1563
+ "name": "noBorder",
1564
+ "description": "Removes the border around the card",
1565
+ "type": "boolean"
1562
1566
  },
1563
1567
  {
1564
- "name": "minDate",
1565
- "description": "The minimum date of the calendar. Only the month and year are considered.",
1566
- "type": "Dayjs"
1568
+ "name": "noPadding",
1569
+ "description": "Removes the padding around the card",
1570
+ "type": "boolean"
1567
1571
  },
1568
1572
  {
1569
- "name": "maxDate",
1570
- "description": "The maximum date of the calendar. Only the month and year are considered.",
1571
- "type": "Dayjs"
1573
+ "name": "targetBlankText",
1574
+ "description": "The text for the target blank link, applicable when target is _blank. PRO TIP: Use parenthesis to wrap the text",
1575
+ "type": "string"
1572
1576
  },
1573
1577
  {
1574
- "name": "disabledDate",
1575
- "description": "The function to determine if the date is disabled.",
1576
- "type": "Function"
1578
+ "name": "target",
1579
+ "description": "The link target of the card",
1580
+ "type": "'_blank' | '_self' | '_parent' | '_top'"
1577
1581
  },
1578
1582
  {
1579
- "name": "locale",
1580
- "description": "The locale of the calendar.",
1581
- "type": "'hu' | 'en' | 'de'"
1583
+ "name": "href",
1584
+ "description": "The URL of the card.",
1585
+ "type": "string"
1582
1586
  },
1583
1587
  {
1584
- "name": "prevButtonTestId",
1585
- "description": "`data-testid` for the previous-month button.",
1588
+ "name": "rel",
1589
+ "description": "The rel of the card link.",
1586
1590
  "type": "string"
1587
1591
  },
1588
1592
  {
1589
- "name": "nextButtonTestId",
1590
- "description": "`data-testid` for the next-month button.",
1591
- "type": "string"
1593
+ "name": "size",
1594
+ "description": "The size of the card. Default is `sm`.",
1595
+ "type": "'sm' | 'md' | 'lg'"
1592
1596
  },
1593
- { "name": "startDate" },
1594
- { "name": "endDate" },
1595
- { "name": "shouldHideAdjacentMonths" }
1596
- ],
1597
- "events": [
1598
1597
  {
1599
- "name": "dds-change",
1600
- "type": "{ value: Dayjs }",
1601
- "description": "Fired when the calendar value changes."
1598
+ "name": "sizeMap",
1599
+ "description": "Responsive size map (e.g. \"md:lg\").",
1600
+ "type": "string"
1602
1601
  }
1603
- ]
1602
+ ],
1603
+ "events": []
1604
1604
  }
1605
1605
  },
1606
1606
  {
@@ -6484,79 +6484,194 @@
6484
6484
  "doc-url": "",
6485
6485
  "attributes": [
6486
6486
  {
6487
- "name": "activeHref",
6488
- "description": "The currently active href for highlighting active navigation items with aria-current=\"page\". Defaults to window.location.pathname if not provided.",
6489
- "value": { "type": "string" }
6487
+ "name": "activeHref",
6488
+ "description": "The currently active href for highlighting active navigation items with aria-current=\"page\". Defaults to window.location.pathname if not provided.",
6489
+ "value": { "type": "string" }
6490
+ },
6491
+ {
6492
+ "name": "orientation",
6493
+ "description": "The orientation of the navigation menu. Default is 'horizontal'.",
6494
+ "value": {
6495
+ "type": "'horizontal' | 'vertical'",
6496
+ "default": "'horizontal'"
6497
+ }
6498
+ },
6499
+ {
6500
+ "name": "fullWidth",
6501
+ "description": "Whether the navigation menu should take full width of the screen. Default is false.",
6502
+ "value": { "type": "boolean", "default": "false" }
6503
+ },
6504
+ {
6505
+ "name": "allowMultipleOpen",
6506
+ "description": "Whether multiple dropdown branches can stay open simultaneously (accordion mode). Default is true.",
6507
+ "value": { "type": "boolean", "default": "true" }
6508
+ },
6509
+ {
6510
+ "name": "tabMode",
6511
+ "description": "Controls how Tab key navigates through top-level items. Default is 'group'. Group mode will have the first item in the tab order, and items mode will have all items in the tab order.",
6512
+ "value": { "type": "'group' | 'items'", "default": "'group'" }
6513
+ }
6514
+ ],
6515
+ "slots": [
6516
+ { "name": "", "description": "The navigation menu list and items." }
6517
+ ],
6518
+ "events": [
6519
+ {
6520
+ "name": "dds-navigation-item-click",
6521
+ "type": "{ href: string, event: Event }",
6522
+ "description": "Fired when a navigation item is clicked."
6523
+ }
6524
+ ],
6525
+ "js": {
6526
+ "properties": [
6527
+ {
6528
+ "name": "activeHref",
6529
+ "description": "The currently active href for highlighting active navigation items with aria-current=\"page\". Defaults to window.location.pathname if not provided.",
6530
+ "type": "string"
6531
+ },
6532
+ {
6533
+ "name": "orientation",
6534
+ "description": "The orientation of the navigation menu. Default is 'horizontal'.",
6535
+ "type": "'horizontal' | 'vertical'"
6536
+ },
6537
+ {
6538
+ "name": "fullWidth",
6539
+ "description": "Whether the navigation menu should take full width of the screen. Default is false.",
6540
+ "type": "boolean"
6541
+ },
6542
+ {
6543
+ "name": "allowMultipleOpen",
6544
+ "description": "Whether multiple dropdown branches can stay open simultaneously (accordion mode). Default is true.",
6545
+ "type": "boolean"
6546
+ },
6547
+ {
6548
+ "name": "tabMode",
6549
+ "description": "Controls how Tab key navigates through top-level items. Default is 'group'. Group mode will have the first item in the tab order, and items mode will have all items in the tab order.",
6550
+ "type": "'group' | 'items'"
6551
+ }
6552
+ ],
6553
+ "events": [
6554
+ {
6555
+ "name": "dds-navigation-item-click",
6556
+ "type": "{ href: string, event: Event }",
6557
+ "description": "Fired when a navigation item is clicked."
6558
+ }
6559
+ ]
6560
+ }
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" }
6490
6581
  },
6491
6582
  {
6492
- "name": "orientation",
6493
- "description": "The orientation of the navigation menu. Default is 'horizontal'.",
6583
+ "name": "type",
6584
+ "description": "The color scheme of the badge",
6494
6585
  "value": {
6495
- "type": "'horizontal' | 'vertical'",
6496
- "default": "'horizontal'"
6586
+ "type": "'neutral' | 'brand' | 'info' | 'positive' | 'warning' | 'negative'",
6587
+ "default": "'negative'"
6497
6588
  }
6498
6589
  },
6499
6590
  {
6500
- "name": "fullWidth",
6501
- "description": "Whether the navigation menu should take full width of the screen. Default is false.",
6502
- "value": { "type": "boolean", "default": "false" }
6591
+ "name": "variant",
6592
+ "description": "The variant of the badge.",
6593
+ "value": { "type": "'round' | 'dot'", "default": "'round'" }
6503
6594
  },
6504
6595
  {
6505
- "name": "allowMultipleOpen",
6506
- "description": "Whether multiple dropdown branches can stay open simultaneously (accordion mode). Default is true.",
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",
6507
6611
  "value": { "type": "boolean", "default": "true" }
6508
6612
  },
6509
6613
  {
6510
- "name": "tabMode",
6511
- "description": "Controls how Tab key navigates through top-level items. Default is 'group'. Group mode will have the first item in the tab order, and items mode will have all items in the tab order.",
6512
- "value": { "type": "'group' | 'items'", "default": "'group'" }
6614
+ "name": "force-circular",
6615
+ "description": "Override circular positioning detection - forces circular positioning calculation",
6616
+ "value": { "type": "boolean", "default": "false" }
6513
6617
  }
6514
6618
  ],
6515
6619
  "slots": [
6516
- { "name": "", "description": "The navigation menu list and items." }
6517
- ],
6518
- "events": [
6519
6620
  {
6520
- "name": "dds-navigation-item-click",
6521
- "type": "{ href: string, event: Event }",
6522
- "description": "Fired when a navigation item is clicked."
6621
+ "name": "",
6622
+ "description": "The content of the notification badge."
6523
6623
  }
6524
6624
  ],
6625
+ "events": [],
6525
6626
  "js": {
6526
6627
  "properties": [
6527
6628
  {
6528
- "name": "activeHref",
6529
- "description": "The currently active href for highlighting active navigation items with aria-current=\"page\". Defaults to window.location.pathname if not provided.",
6530
- "type": "string"
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"
6531
6632
  },
6532
6633
  {
6533
- "name": "orientation",
6534
- "description": "The orientation of the navigation menu. Default is 'horizontal'.",
6535
- "type": "'horizontal' | 'vertical'"
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"
6536
6637
  },
6537
6638
  {
6538
- "name": "fullWidth",
6539
- "description": "Whether the navigation menu should take full width of the screen. Default is false.",
6639
+ "name": "showZero",
6640
+ "description": "This switch decides whether to show a zero value or not.",
6540
6641
  "type": "boolean"
6541
6642
  },
6542
6643
  {
6543
- "name": "allowMultipleOpen",
6544
- "description": "Whether multiple dropdown branches can stay open simultaneously (accordion mode). Default is true.",
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",
6545
6666
  "type": "boolean"
6546
6667
  },
6547
6668
  {
6548
- "name": "tabMode",
6549
- "description": "Controls how Tab key navigates through top-level items. Default is 'group'. Group mode will have the first item in the tab order, and items mode will have all items in the tab order.",
6550
- "type": "'group' | 'items'"
6669
+ "name": "forceCircular",
6670
+ "description": "Override circular positioning detection - forces circular positioning calculation",
6671
+ "type": "boolean"
6551
6672
  }
6552
6673
  ],
6553
- "events": [
6554
- {
6555
- "name": "dds-navigation-item-click",
6556
- "type": "{ href: string, event: Event }",
6557
- "description": "Fired when a navigation item is clicked."
6558
- }
6559
- ]
6674
+ "events": []
6560
6675
  }
6561
6676
  },
6562
6677
  {
@@ -6898,194 +7013,79 @@
6898
7013
  },
6899
7014
  {
6900
7015
  "name": "heading",
6901
- "description": "The heading text of the accordion, this will be used as the aria label of the heading also if ariaLabel is not provided",
6902
- "type": "string"
6903
- },
6904
- {
6905
- "name": "headingLevel",
6906
- "description": "The heading level of the accordion. Default is `4`.",
6907
- "type": "1 | 2 | 3 | 4 | 5 | 6"
6908
- },
6909
- {
6910
- "name": "opened",
6911
- "description": "Whether the accordion is opened. Default is `false`.",
6912
- "type": "boolean"
6913
- },
6914
- {
6915
- "name": "iconLocation",
6916
- "description": "The location of the icon. Default is `right`.",
6917
- "type": "'left' | 'right'"
6918
- },
6919
- {
6920
- "name": "variant",
6921
- "description": "The variant of the accordion.",
6922
- "type": "'default' | 'collapsed' | 'clean' | 'clean-collapsed'"
6923
- },
6924
- {
6925
- "name": "lastItem",
6926
- "description": "Whether the accordion is the last item.",
6927
- "type": "boolean"
6928
- }
6929
- ],
6930
- "events": [
6931
- {
6932
- "name": "dds-opened",
6933
- "type": "{ void }",
6934
- "description": "Event fired when the accordion is opened."
6935
- },
6936
- {
6937
- "name": "dds-closed",
6938
- "type": "{ void }",
6939
- "description": "Event fired when the accordion is closed."
6940
- }
6941
- ]
6942
- }
6943
- },
6944
- {
6945
- "name": "dap-ds-option-group",
6946
- "description": "An option group is a container for grouping related option items.\nUsed with dap-ds-select to create grouped options that render as native optgroup elements.\n---\n\n\n### **Slots:**\n - _default_ - The option items in this group.\n\n### **CSS Parts:**\n - **base** - The main option group container.\n- **label** - The label of the option group.",
6947
- "doc-url": "",
6948
- "attributes": [
6949
- {
6950
- "name": "label",
6951
- "description": "The label of the option group (displayed in native optgroup).",
6952
- "value": { "type": "string" }
6953
- },
6954
- {
6955
- "name": "disabled",
6956
- "description": "Whether all options in the group are disabled.",
6957
- "value": { "type": "boolean" }
6958
- }
6959
- ],
6960
- "slots": [
6961
- { "name": "", "description": "The option items in this group." }
6962
- ],
6963
- "events": [],
6964
- "js": {
6965
- "properties": [
6966
- {
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"
7016
+ "description": "The heading text of the accordion, this will be used as the aria label of the heading also if ariaLabel is not provided",
7017
+ "type": "string"
7050
7018
  },
7051
7019
  {
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"
7020
+ "name": "headingLevel",
7021
+ "description": "The heading level of the accordion. Default is `4`.",
7022
+ "type": "1 | 2 | 3 | 4 | 5 | 6"
7055
7023
  },
7056
7024
  {
7057
- "name": "showZero",
7058
- "description": "This switch decides whether to show a zero value or not.",
7025
+ "name": "opened",
7026
+ "description": "Whether the accordion is opened. Default is `false`.",
7059
7027
  "type": "boolean"
7060
7028
  },
7061
7029
  {
7062
- "name": "type",
7063
- "description": "The color scheme of the badge",
7064
- "type": "'neutral' | 'brand' | 'info' | 'positive' | 'warning' | 'negative'"
7030
+ "name": "iconLocation",
7031
+ "description": "The location of the icon. Default is `right`.",
7032
+ "type": "'left' | 'right'"
7065
7033
  },
7066
7034
  {
7067
7035
  "name": "variant",
7068
- "description": "The variant of the badge.",
7069
- "type": "'round' | 'dot'"
7036
+ "description": "The variant of the accordion.",
7037
+ "type": "'default' | 'collapsed' | 'clean' | 'clean-collapsed'"
7070
7038
  },
7071
7039
  {
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
- },
7040
+ "name": "lastItem",
7041
+ "description": "Whether the accordion is the last item.",
7042
+ "type": "boolean"
7043
+ }
7044
+ ],
7045
+ "events": [
7076
7046
  {
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'"
7047
+ "name": "dds-opened",
7048
+ "type": "{ void }",
7049
+ "description": "Event fired when the accordion is opened."
7080
7050
  },
7081
7051
  {
7082
- "name": "circularAuto",
7083
- "description": "Whether to automatically detect circular elements and adjust positioning accordingly",
7084
- "type": "boolean"
7052
+ "name": "dds-closed",
7053
+ "type": "{ void }",
7054
+ "description": "Event fired when the accordion is closed."
7055
+ }
7056
+ ]
7057
+ }
7058
+ },
7059
+ {
7060
+ "name": "dap-ds-option-group",
7061
+ "description": "An option group is a container for grouping related option items.\nUsed with dap-ds-select to create grouped options that render as native optgroup elements.\n---\n\n\n### **Slots:**\n - _default_ - The option items in this group.\n\n### **CSS Parts:**\n - **base** - The main option group container.\n- **label** - The label of the option group.",
7062
+ "doc-url": "",
7063
+ "attributes": [
7064
+ {
7065
+ "name": "label",
7066
+ "description": "The label of the option group (displayed in native optgroup).",
7067
+ "value": { "type": "string" }
7068
+ },
7069
+ {
7070
+ "name": "disabled",
7071
+ "description": "Whether all options in the group are disabled.",
7072
+ "value": { "type": "boolean" }
7073
+ }
7074
+ ],
7075
+ "slots": [
7076
+ { "name": "", "description": "The option items in this group." }
7077
+ ],
7078
+ "events": [],
7079
+ "js": {
7080
+ "properties": [
7081
+ {
7082
+ "name": "label",
7083
+ "description": "The label of the option group (displayed in native optgroup).",
7084
+ "type": "string"
7085
7085
  },
7086
7086
  {
7087
- "name": "forceCircular",
7088
- "description": "Override circular positioning detection - forces circular positioning calculation",
7087
+ "name": "disabled",
7088
+ "description": "Whether all options in the group are disabled.",
7089
7089
  "type": "boolean"
7090
7090
  }
7091
7091
  ],
@@ -10121,236 +10121,118 @@
10121
10121
  "type": "string"
10122
10122
  },
10123
10123
  {
10124
- "name": "hideLabel",
10125
- "description": "Visually hides the label while keeping it available to assistive technology. (default: false)",
10126
- "type": "boolean"
10127
- },
10128
- {
10129
- "name": "description",
10130
- "description": "The description of the textarea.",
10131
- "type": "string"
10132
- },
10133
- {
10134
- "name": "feedback",
10135
- "description": "The feedback of the textarea.",
10136
- "type": "string"
10137
- },
10138
- {
10139
- "name": "feedbackType",
10140
- "description": "The feedback type of the textarea. Can be `negative`, `positive`, or `warning`.",
10141
- "type": "'negative' | 'positive' | 'warning'"
10142
- },
10143
- {
10144
- "name": "optional",
10145
- "description": "The optional state of the textarea.",
10146
- "type": "boolean"
10147
- },
10148
- {
10149
- "name": "optionalLabel",
10150
- "description": "The optional label of the textarea.",
10151
- "type": "string"
10152
- },
10153
- {
10154
- "name": "requiredLabel",
10155
- "description": "The required indicator of the textarea. (default: '*')",
10156
- "type": "string"
10157
- },
10158
- {
10159
- "name": "subtle",
10160
- "description": "The weight of the label. Default is `false`",
10161
- "type": "boolean"
10162
- },
10163
- {
10164
- "name": "autofocus",
10165
- "description": "The autofocus state of the textarea.",
10166
- "type": "boolean"
10167
- }
10168
- ],
10169
- "events": [
10170
- {
10171
- "name": "dds-count-change",
10172
- "type": "{ value: number }",
10173
- "description": "Fires when the count of the textarea changes."
10174
- },
10175
- {
10176
- "name": "dds-change",
10177
- "type": "{ value: string }",
10178
- "description": "Fired when the textarea value changes."
10179
- },
10180
- {
10181
- "name": "dds-input",
10182
- "type": "{ value: string }",
10183
- "description": "Fired when the textarea value changes."
10184
- },
10185
- {
10186
- "name": "dds-keydown",
10187
- "type": "{ value: string, originalEvent: Event }",
10188
- "description": "Fired when a key is pressed down."
10189
- },
10190
- {
10191
- "name": "dds-blur",
10192
- "type": "{ void }",
10193
- "description": "Fired when the textarea loses focus."
10194
- },
10195
- {
10196
- "name": "dds-focus",
10197
- "type": "{ void }",
10198
- "description": "Emitted when the textarea gains focus."
10199
- },
10200
- {
10201
- "name": "dds-select",
10202
- "type": "{ value: string }",
10203
- "description": "Emitted when select text in textarea."
10204
- }
10205
- ]
10206
- }
10207
- },
10208
- {
10209
- "name": "dap-ds-timeline-item",
10210
- "description": "A timeline is a graphical representation of a series of events.\n---\n\n\n### **Slots:**\n - _default_ - The default slot for the item content.\n\n### **CSS Properties:**\n - **--dds-timeline-position** - Position of the timeline dot (default: 28px) _(default: undefined)_\n- **--dds-timeline-connector-width** - Width of the timeline connector line (default: 1px) _(default: undefined)_\n- **--dds-timeline-connector-left-position** - Left position of the timeline connector (default: 5.5px) _(default: undefined)_\n- **--dds-timeline-dot-size** - Size of the timeline dot (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-timeline-item-margin-bottom** - Bottom margin of timeline items (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-timeline-item-padding-left** - Left padding of timeline items (default: var(--dds-spacing-400)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main timeline item container.\n- **connector** - The connector element between two timeline items.\n- **content** - The content of the timeline item.",
10211
- "doc-url": "",
10212
- "attributes": [],
10213
- "slots": [
10214
- {
10215
- "name": "",
10216
- "description": "The default slot for the item content."
10217
- }
10218
- ],
10219
- "events": [],
10220
- "js": { "properties": [], "events": [] }
10221
- },
10222
- {
10223
- "name": "dap-ds-timeline",
10224
- "description": "A timeline is a graphical representation of a series of events.\n---\n\n\n### **Slots:**\n - _default_ - The default slot for the timeline items.\n\n### **CSS Parts:**\n - **base** - The main timeline container.",
10225
- "doc-url": "",
10226
- "attributes": [],
10227
- "slots": [
10228
- {
10229
- "name": "",
10230
- "description": "The default slot for the timeline items."
10231
- }
10232
- ],
10233
- "events": [],
10234
- "js": { "properties": [], "events": [] }
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"
10124
+ "name": "hideLabel",
10125
+ "description": "Visually hides the label while keeping it available to assistive technology. (default: false)",
10126
+ "type": "boolean"
10305
10127
  },
10306
10128
  {
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[]"
10129
+ "name": "description",
10130
+ "description": "The description of the textarea.",
10131
+ "type": "string"
10310
10132
  },
10311
10133
  {
10312
- "name": "minHeadingLevel",
10313
- "description": "The minimum heading level to include in the TOC. The default value is `2`.",
10314
- "type": "number"
10134
+ "name": "feedback",
10135
+ "description": "The feedback of the textarea.",
10136
+ "type": "string"
10315
10137
  },
10316
10138
  {
10317
- "name": "maxHeadingLevel",
10318
- "description": "The maximum heading level to include in the TOC. The default value is `3`.",
10319
- "type": "number"
10139
+ "name": "feedbackType",
10140
+ "description": "The feedback type of the textarea. Can be `negative`, `positive`, or `warning`.",
10141
+ "type": "'negative' | 'positive' | 'warning'"
10320
10142
  },
10321
10143
  {
10322
- "name": "noIndent",
10323
- "description": "Whether to indent the TOC items.",
10144
+ "name": "optional",
10145
+ "description": "The optional state of the textarea.",
10324
10146
  "type": "boolean"
10325
10147
  },
10326
10148
  {
10327
- "name": "header",
10328
- "description": "The header of the TOC.",
10149
+ "name": "optionalLabel",
10150
+ "description": "The optional label of the textarea.",
10329
10151
  "type": "string"
10330
10152
  },
10331
- { "name": "activeAnchor" },
10332
- { "name": "anchors" },
10333
- { "name": "items" },
10334
10153
  {
10335
- "name": "size",
10336
- "description": "The size of the TOC. Default is `lg.",
10337
- "type": "'xs' | 'sm' | 'md' | 'lg'"
10154
+ "name": "requiredLabel",
10155
+ "description": "The required indicator of the textarea. (default: '*')",
10156
+ "type": "string"
10338
10157
  },
10339
10158
  {
10340
- "name": "sizeMap",
10341
- "description": "Responsive size map (e.g. \"md:lg\").",
10342
- "type": "string"
10159
+ "name": "subtle",
10160
+ "description": "The weight of the label. Default is `false`",
10161
+ "type": "boolean"
10162
+ },
10163
+ {
10164
+ "name": "autofocus",
10165
+ "description": "The autofocus state of the textarea.",
10166
+ "type": "boolean"
10343
10167
  }
10344
10168
  ],
10345
10169
  "events": [
10346
10170
  {
10347
- "name": "dds-anchor-change",
10348
- "type": "{ selectedItem: HTMLAnchorElement, anchorElement: IntersectionObserverEntry | HTMLElement }",
10349
- "description": "Event that is triggered when the anchor changes."
10171
+ "name": "dds-count-change",
10172
+ "type": "{ value: number }",
10173
+ "description": "Fires when the count of the textarea changes."
10174
+ },
10175
+ {
10176
+ "name": "dds-change",
10177
+ "type": "{ value: string }",
10178
+ "description": "Fired when the textarea value changes."
10179
+ },
10180
+ {
10181
+ "name": "dds-input",
10182
+ "type": "{ value: string }",
10183
+ "description": "Fired when the textarea value changes."
10184
+ },
10185
+ {
10186
+ "name": "dds-keydown",
10187
+ "type": "{ value: string, originalEvent: Event }",
10188
+ "description": "Fired when a key is pressed down."
10189
+ },
10190
+ {
10191
+ "name": "dds-blur",
10192
+ "type": "{ void }",
10193
+ "description": "Fired when the textarea loses focus."
10194
+ },
10195
+ {
10196
+ "name": "dds-focus",
10197
+ "type": "{ void }",
10198
+ "description": "Emitted when the textarea gains focus."
10199
+ },
10200
+ {
10201
+ "name": "dds-select",
10202
+ "type": "{ value: string }",
10203
+ "description": "Emitted when select text in textarea."
10350
10204
  }
10351
10205
  ]
10352
10206
  }
10353
10207
  },
10208
+ {
10209
+ "name": "dap-ds-timeline-item",
10210
+ "description": "A timeline is a graphical representation of a series of events.\n---\n\n\n### **Slots:**\n - _default_ - The default slot for the item content.\n\n### **CSS Properties:**\n - **--dds-timeline-position** - Position of the timeline dot (default: 28px) _(default: undefined)_\n- **--dds-timeline-connector-width** - Width of the timeline connector line (default: 1px) _(default: undefined)_\n- **--dds-timeline-connector-left-position** - Left position of the timeline connector (default: 5.5px) _(default: undefined)_\n- **--dds-timeline-dot-size** - Size of the timeline dot (default: var(--dds-spacing-300)) _(default: undefined)_\n- **--dds-timeline-item-margin-bottom** - Bottom margin of timeline items (default: var(--dds-spacing-200)) _(default: undefined)_\n- **--dds-timeline-item-padding-left** - Left padding of timeline items (default: var(--dds-spacing-400)) _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The main timeline item container.\n- **connector** - The connector element between two timeline items.\n- **content** - The content of the timeline item.",
10211
+ "doc-url": "",
10212
+ "attributes": [],
10213
+ "slots": [
10214
+ {
10215
+ "name": "",
10216
+ "description": "The default slot for the item content."
10217
+ }
10218
+ ],
10219
+ "events": [],
10220
+ "js": { "properties": [], "events": [] }
10221
+ },
10222
+ {
10223
+ "name": "dap-ds-timeline",
10224
+ "description": "A timeline is a graphical representation of a series of events.\n---\n\n\n### **Slots:**\n - _default_ - The default slot for the timeline items.\n\n### **CSS Parts:**\n - **base** - The main timeline container.",
10225
+ "doc-url": "",
10226
+ "attributes": [],
10227
+ "slots": [
10228
+ {
10229
+ "name": "",
10230
+ "description": "The default slot for the timeline items."
10231
+ }
10232
+ ],
10233
+ "events": [],
10234
+ "js": { "properties": [], "events": [] }
10235
+ },
10354
10236
  {
10355
10237
  "name": "dap-ds-time-grid",
10356
10238
  "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.",
@@ -10936,6 +10818,124 @@
10936
10818
  ]
10937
10819
  }
10938
10820
  },
10821
+ {
10822
+ "name": "dap-ds-toc",
10823
+ "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.",
10824
+ "doc-url": "",
10825
+ "attributes": [
10826
+ {
10827
+ "name": "root",
10828
+ "description": "The root element to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#root)",
10829
+ "value": { "type": "string", "default": "''" }
10830
+ },
10831
+ {
10832
+ "name": "rootMargin",
10833
+ "description": "The margin around the root element to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#rootmargin)",
10834
+ "value": { "type": "string", "default": "'0px 0px -80% 0px'" }
10835
+ },
10836
+ {
10837
+ "name": "lastAnchorRootMargin",
10838
+ "description": "The margin around the last anchor to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#rootmargin)",
10839
+ "value": { "type": "string", "default": "'0px 0px -50% 0px'" }
10840
+ },
10841
+ {
10842
+ "name": "threshold",
10843
+ "description": "The threshold to trigger [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#threshold)",
10844
+ "value": { "type": "number[]", "default": "[0.1]" }
10845
+ },
10846
+ {
10847
+ "name": "minHeadingLevel",
10848
+ "description": "The minimum heading level to include in the TOC. The default value is `2`.",
10849
+ "value": { "type": "number", "default": "2" }
10850
+ },
10851
+ {
10852
+ "name": "maxHeadingLevel",
10853
+ "description": "The maximum heading level to include in the TOC. The default value is `3`.",
10854
+ "value": { "type": "number", "default": "3" }
10855
+ },
10856
+ {
10857
+ "name": "noIndent",
10858
+ "description": "Whether to indent the TOC items.",
10859
+ "value": { "type": "boolean", "default": "false" }
10860
+ },
10861
+ {
10862
+ "name": "header",
10863
+ "description": "The header of the TOC.",
10864
+ "value": { "type": "string" }
10865
+ }
10866
+ ],
10867
+ "events": [
10868
+ {
10869
+ "name": "dds-anchor-change",
10870
+ "type": "{ selectedItem: HTMLAnchorElement, anchorElement: IntersectionObserverEntry | HTMLElement }",
10871
+ "description": "Event that is triggered when the anchor changes."
10872
+ }
10873
+ ],
10874
+ "js": {
10875
+ "properties": [
10876
+ {
10877
+ "name": "root",
10878
+ "description": "The root element to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#root)",
10879
+ "type": "string"
10880
+ },
10881
+ {
10882
+ "name": "rootMargin",
10883
+ "description": "The margin around the root element to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#rootmargin)",
10884
+ "type": "string"
10885
+ },
10886
+ {
10887
+ "name": "lastAnchorRootMargin",
10888
+ "description": "The margin around the last anchor to observe [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#rootmargin)",
10889
+ "type": "string"
10890
+ },
10891
+ {
10892
+ "name": "threshold",
10893
+ "description": "The threshold to trigger [`IntersectionObserver`](https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#threshold)",
10894
+ "type": "number[]"
10895
+ },
10896
+ {
10897
+ "name": "minHeadingLevel",
10898
+ "description": "The minimum heading level to include in the TOC. The default value is `2`.",
10899
+ "type": "number"
10900
+ },
10901
+ {
10902
+ "name": "maxHeadingLevel",
10903
+ "description": "The maximum heading level to include in the TOC. The default value is `3`.",
10904
+ "type": "number"
10905
+ },
10906
+ {
10907
+ "name": "noIndent",
10908
+ "description": "Whether to indent the TOC items.",
10909
+ "type": "boolean"
10910
+ },
10911
+ {
10912
+ "name": "header",
10913
+ "description": "The header of the TOC.",
10914
+ "type": "string"
10915
+ },
10916
+ { "name": "activeAnchor" },
10917
+ { "name": "anchors" },
10918
+ { "name": "items" },
10919
+ {
10920
+ "name": "size",
10921
+ "description": "The size of the TOC. Default is `lg.",
10922
+ "type": "'xs' | 'sm' | 'md' | 'lg'"
10923
+ },
10924
+ {
10925
+ "name": "sizeMap",
10926
+ "description": "Responsive size map (e.g. \"md:lg\").",
10927
+ "type": "string"
10928
+ }
10929
+ ],
10930
+ "events": [
10931
+ {
10932
+ "name": "dds-anchor-change",
10933
+ "type": "{ selectedItem: HTMLAnchorElement, anchorElement: IntersectionObserverEntry | HTMLElement }",
10934
+ "description": "Event that is triggered when the anchor changes."
10935
+ }
10936
+ ]
10937
+ }
10938
+ },
10939
10939
  {
10940
10940
  "name": "dap-ds-toggle-button",
10941
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.",
@@ -12914,7 +12914,7 @@
12914
12914
  }
12915
12915
  },
12916
12916
  {
12917
- "name": "dap-ds-icon-clipboard-line",
12917
+ "name": "dap-ds-icon-separator",
12918
12918
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
12919
12919
  "doc-url": "",
12920
12920
  "attributes": [
@@ -12967,7 +12967,7 @@
12967
12967
  }
12968
12968
  },
12969
12969
  {
12970
- "name": "dap-ds-icon-file-copy-line",
12970
+ "name": "dap-ds-icon-clipboard-line",
12971
12971
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
12972
12972
  "doc-url": "",
12973
12973
  "attributes": [
@@ -13020,7 +13020,7 @@
13020
13020
  }
13021
13021
  },
13022
13022
  {
13023
- "name": "dap-ds-icon-file-image-line",
13023
+ "name": "dap-ds-icon-file-copy-line",
13024
13024
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
13025
13025
  "doc-url": "",
13026
13026
  "attributes": [
@@ -13073,7 +13073,7 @@
13073
13073
  }
13074
13074
  },
13075
13075
  {
13076
- "name": "dap-ds-icon-file-music-line",
13076
+ "name": "dap-ds-icon-file-image-line",
13077
13077
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
13078
13078
  "doc-url": "",
13079
13079
  "attributes": [
@@ -13126,7 +13126,7 @@
13126
13126
  }
13127
13127
  },
13128
13128
  {
13129
- "name": "dap-ds-icon-file-text-line",
13129
+ "name": "dap-ds-icon-file-music-line",
13130
13130
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
13131
13131
  "doc-url": "",
13132
13132
  "attributes": [
@@ -13179,7 +13179,7 @@
13179
13179
  }
13180
13180
  },
13181
13181
  {
13182
- "name": "dap-ds-icon-file-video-line",
13182
+ "name": "dap-ds-icon-file-text-line",
13183
13183
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
13184
13184
  "doc-url": "",
13185
13185
  "attributes": [
@@ -13232,7 +13232,7 @@
13232
13232
  }
13233
13233
  },
13234
13234
  {
13235
- "name": "dap-ds-icon-folder-line",
13235
+ "name": "dap-ds-icon-file-video-line",
13236
13236
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
13237
13237
  "doc-url": "",
13238
13238
  "attributes": [
@@ -13285,7 +13285,7 @@
13285
13285
  }
13286
13286
  },
13287
13287
  {
13288
- "name": "dap-ds-icon-folder-open-line",
13288
+ "name": "dap-ds-icon-folder-line",
13289
13289
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
13290
13290
  "doc-url": "",
13291
13291
  "attributes": [
@@ -13338,7 +13338,7 @@
13338
13338
  }
13339
13339
  },
13340
13340
  {
13341
- "name": "dap-ds-icon-separator",
13341
+ "name": "dap-ds-icon-folder-open-line",
13342
13342
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
13343
13343
  "doc-url": "",
13344
13344
  "attributes": [
@@ -15193,7 +15193,7 @@
15193
15193
  }
15194
15194
  },
15195
15195
  {
15196
- "name": "dap-ds-icon-loading-spinner",
15196
+ "name": "dap-ds-icon-lock-fill",
15197
15197
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15198
15198
  "doc-url": "",
15199
15199
  "attributes": [
@@ -15246,7 +15246,7 @@
15246
15246
  }
15247
15247
  },
15248
15248
  {
15249
- "name": "dap-ds-icon-lock-fill",
15249
+ "name": "dap-ds-icon-loading-spinner",
15250
15250
  "description": "An icon\n---\n\n\n### **CSS Parts:**\n - **base** - The main icon container.",
15251
15251
  "doc-url": "",
15252
15252
  "attributes": [