dap-design-system 0.61.2 → 0.61.4

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.
@@ -239,16 +239,16 @@ export interface DapDSButtonEvents {
239
239
  onDdsLoadingTimeout?: (event: CustomEvent) => void
240
240
  }
241
241
 
242
- export interface DapDSCalendarEvents {
243
- /** Fired when the calendar value changes. */
244
- onDdsChange?: (event: CustomEvent<{ value: Dayjs }>) => void
245
- }
246
-
247
242
  export interface DapDSCalloutEvents {
248
243
  /** Fired when the close button is clicked. */
249
244
  onDdsClose?: (event: CustomEvent) => void
250
245
  }
251
246
 
247
+ export interface DapDSCalendarEvents {
248
+ /** Fired when the calendar value changes. */
249
+ onDdsChange?: (event: CustomEvent<{ value: Dayjs }>) => void
250
+ }
251
+
252
252
  export interface DapDSCheckboxEvents {
253
253
  /** Fired when the checkbox is checked or unchecked. */
254
254
  onDdsChange?: (event: CustomEvent<{ checked: boolean, indeterminate: boolean, value: string, disabled: boolean, readonly: boolean, type: 'checkbox' }>) => void
@@ -666,6 +666,11 @@ export interface DapDSAccordionSlots {
666
666
  'icon-closed'?: () => any
667
667
  }
668
668
 
669
+ export interface DapDSAccordionGroupSlots {
670
+ /** The content of the accordion group. */
671
+ default?: () => any
672
+ }
673
+
669
674
  export interface DapDSAvatarSlots {
670
675
  /** The icon to display when variant is 'icon'. */
671
676
  'icon'?: () => any
@@ -673,11 +678,6 @@ export interface DapDSAvatarSlots {
673
678
  'fallback'?: () => any
674
679
  }
675
680
 
676
- export interface DapDSAccordionGroupSlots {
677
- /** The content of the accordion group. */
678
- default?: () => any
679
- }
680
-
681
681
  export interface DapDSAvatarGroupSlots {
682
682
  /** The avatars to display in the group. */
683
683
  default?: () => any
@@ -718,16 +718,6 @@ export interface DapDSButtonSlots {
718
718
  default?: () => any
719
719
  }
720
720
 
721
- export interface DapDSCalendarCellSlots {
722
- /** The content of the calendar cell. */
723
- default?: () => any
724
- }
725
-
726
- export interface DapDSCalendarSlots {
727
- /** The content of the calendar. */
728
- default?: () => any
729
- }
730
-
731
721
  export interface DapDSCalloutSlots {
732
722
  /** The content of the callout. */
733
723
  default?: () => any
@@ -741,6 +731,16 @@ export interface DapDSCalloutSlots {
741
731
  'close'?: () => any
742
732
  }
743
733
 
734
+ export interface DapDSCalendarCellSlots {
735
+ /** The content of the calendar cell. */
736
+ default?: () => any
737
+ }
738
+
739
+ export interface DapDSCalendarSlots {
740
+ /** The content of the calendar. */
741
+ default?: () => any
742
+ }
743
+
744
744
  export interface DapDSCardActionsSlots {
745
745
  /** The content of the card actions. */
746
746
  default?: () => any
@@ -1150,6 +1150,30 @@ export type DapDSAccordionProps = {
1150
1150
  loading?: DapDSAccordion["loading"]
1151
1151
  }
1152
1152
 
1153
+ export type DapDSAccordionGroupProps = {
1154
+ /** Whether to close other accordions when one is opened. */
1155
+ autoClose?: DapDSAccordionGroup["autoClose"]
1156
+ /** The variant of the accordion */
1157
+ variant?: DapDSAccordionGroup["variant"]
1158
+ /** */
1159
+ tagName?: DapDSAccordionGroup["tagName"]
1160
+ }
1161
+
1162
+ export type DapDSAnchorHeadingProps = {
1163
+ /** The variant of the heading. Default is `h2`. Can be `h1`, `h2`, `h3`, `h4`, `h5`, or `h6`. */
1164
+ variant?: DapDSAnchorHeading["variant"]
1165
+ /** The label of the heading. */
1166
+ label?: DapDSAnchorHeading["label"]
1167
+ /** */
1168
+ tagName?: DapDSAnchorHeading["tagName"]
1169
+ /** */
1170
+ dependencies?: DapDSAnchorHeading["dependencies"]
1171
+ /** */
1172
+ elementId?: DapDSAnchorHeading["elementId"]
1173
+ /** */
1174
+ anchorTitle?: DapDSAnchorHeading["anchorTitle"]
1175
+ }
1176
+
1153
1177
  export type DapDSAvatarProps = {
1154
1178
  /** The shape of the avatar */
1155
1179
  shape?: DapDSAvatar["shape"]
@@ -1181,30 +1205,6 @@ export type DapDSAvatarProps = {
1181
1205
  sizeMap?: DapDSAvatar["sizeMap"]
1182
1206
  }
1183
1207
 
1184
- export type DapDSAccordionGroupProps = {
1185
- /** Whether to close other accordions when one is opened. */
1186
- autoClose?: DapDSAccordionGroup["autoClose"]
1187
- /** The variant of the accordion */
1188
- variant?: DapDSAccordionGroup["variant"]
1189
- /** */
1190
- tagName?: DapDSAccordionGroup["tagName"]
1191
- }
1192
-
1193
- export type DapDSAnchorHeadingProps = {
1194
- /** The variant of the heading. Default is `h2`. Can be `h1`, `h2`, `h3`, `h4`, `h5`, or `h6`. */
1195
- variant?: DapDSAnchorHeading["variant"]
1196
- /** The label of the heading. */
1197
- label?: DapDSAnchorHeading["label"]
1198
- /** */
1199
- tagName?: DapDSAnchorHeading["tagName"]
1200
- /** */
1201
- dependencies?: DapDSAnchorHeading["dependencies"]
1202
- /** */
1203
- elementId?: DapDSAnchorHeading["elementId"]
1204
- /** */
1205
- anchorTitle?: DapDSAnchorHeading["anchorTitle"]
1206
- }
1207
-
1208
1208
  export type DapDSAvatarGroupProps = {
1209
1209
  /** Layout type for the avatar group */
1210
1210
  layout?: DapDSAvatarGroup["layout"]
@@ -1325,6 +1325,31 @@ export type DapDSButtonProps = {
1325
1325
  sizeMap?: DapDSButton["sizeMap"]
1326
1326
  }
1327
1327
 
1328
+ export type DapDSCalloutProps = {
1329
+ /** The variant of the callout */
1330
+ variant?: DapDSCallout["variant"]
1331
+ /** The alignment of the callout. Can be `vertical` or `horizontal`. */
1332
+ alignment?: DapDSCallout["alignment"]
1333
+ /** The strongness of the callout colors. Can be `subtle`, `base`, `medium`, or `strong`. */
1334
+ shade?: DapDSCallout["shade"]
1335
+ /** If the callout has a border */
1336
+ noBorder?: DapDSCallout["noBorder"]
1337
+ /** If the callout has a close button */
1338
+ closeable?: DapDSCallout["closeable"]
1339
+ /** The header of the callout */
1340
+ title?: DapDSCallout["title"]
1341
+ /** The label of the close button */
1342
+ closeButtonLabel?: DapDSCallout["closeButtonLabel"]
1343
+ /** `data-testid` for the default close button. */
1344
+ closeButtonTestId?: DapDSCallout["closeButtonTestId"]
1345
+ /** If the callout is opened */
1346
+ opened?: DapDSCallout["opened"]
1347
+ /** */
1348
+ tagName?: DapDSCallout["tagName"]
1349
+ /** */
1350
+ dependencies?: DapDSCallout["dependencies"]
1351
+ }
1352
+
1328
1353
  export type DapDSCalendarCellProps = {
1329
1354
  /** Whether the calendar cell is selected. */
1330
1355
  selected?: DapDSCalendarCell["selected"]
@@ -1393,31 +1418,6 @@ export type DapDSCalendarProps = {
1393
1418
  shouldHideAdjacentMonths?: DapDSCalendar["shouldHideAdjacentMonths"]
1394
1419
  }
1395
1420
 
1396
- export type DapDSCalloutProps = {
1397
- /** The variant of the callout */
1398
- variant?: DapDSCallout["variant"]
1399
- /** The alignment of the callout. Can be `vertical` or `horizontal`. */
1400
- alignment?: DapDSCallout["alignment"]
1401
- /** The strongness of the callout colors. Can be `subtle`, `base`, `medium`, or `strong`. */
1402
- shade?: DapDSCallout["shade"]
1403
- /** If the callout has a border */
1404
- noBorder?: DapDSCallout["noBorder"]
1405
- /** If the callout has a close button */
1406
- closeable?: DapDSCallout["closeable"]
1407
- /** The header of the callout */
1408
- title?: DapDSCallout["title"]
1409
- /** The label of the close button */
1410
- closeButtonLabel?: DapDSCallout["closeButtonLabel"]
1411
- /** `data-testid` for the default close button. */
1412
- closeButtonTestId?: DapDSCallout["closeButtonTestId"]
1413
- /** If the callout is opened */
1414
- opened?: DapDSCallout["opened"]
1415
- /** */
1416
- tagName?: DapDSCallout["tagName"]
1417
- /** */
1418
- dependencies?: DapDSCallout["dependencies"]
1419
- }
1420
-
1421
1421
  export type DapDSCardActionsProps = {
1422
1422
  /** */
1423
1423
  tagName?: DapDSCardActions["tagName"]
@@ -2643,6 +2643,10 @@ export type DapDSNavigationMenuItemProps = {
2643
2643
  hasContent?: DapDSNavigationMenuItem["hasContent"]
2644
2644
  /** Computed property to detect if this item contains nested navigation menu items. */
2645
2645
  hasNestedItems?: DapDSNavigationMenuItem["hasNestedItems"]
2646
+ /** The element keyboard activation should act on: the element slotted into
2647
+ `trigger` when one is provided, otherwise the default trigger button
2648
+ rendered in the shadow root. */
2649
+ activationTrigger?: DapDSNavigationMenuItem["activationTrigger"]
2646
2650
  /** The size of the popup. Default is 'sm'. */
2647
2651
  size?: DapDSNavigationMenuItem["size"]
2648
2652
  }
@@ -3290,6 +3294,12 @@ which item is current. Use `current="step"` inside a stepper. */
3290
3294
  spacing?: DapDSSideNavItem["spacing"]
3291
3295
  /** The size of the side navigation item */
3292
3296
  size?: DapDSSideNavItem["size"]
3297
+ /** The target of the link. */
3298
+ target?: DapDSSideNavItem["target"]
3299
+ /** The rel of the link */
3300
+ rel?: DapDSSideNavItem["rel"]
3301
+ /** The text for the target blank link, applicable when target is _blank. PRO TIP: Use parenthesis to wrap the text */
3302
+ targetBlankText?: DapDSSideNavItem["targetBlankText"]
3293
3303
  /** */
3294
3304
  tagName?: DapDSSideNavItem["tagName"]
3295
3305
  }
@@ -3964,19 +3974,6 @@ export type DapDSRadioGroupProps = {
3964
3974
  size?: DapDSRadioGroup["size"]
3965
3975
  }
3966
3976
 
3967
- export type BuildingsHome6LineProps = {
3968
- /** (optional) The width and height in pixels */
3969
- size?: BuildingsHome6Line["size"]
3970
- /** (optional) Sets the icon color via the `fill` attribute */
3971
- selected?: BuildingsHome6Line["selected"]
3972
- /** (optional) When using the icon standalone, make it meaningful for accessibility */
3973
- accessibilityTitle?: BuildingsHome6Line["accessibilityTitle"]
3974
- /** (optional) If `true` the icon can receive focus */
3975
- focusable?: BuildingsHome6Line["focusable"]
3976
- /** */
3977
- tagName?: BuildingsHome6Line["tagName"]
3978
- }
3979
-
3980
3977
  export type ArrowsArrowDownLineProps = {
3981
3978
  /** (optional) The width and height in pixels */
3982
3979
  size?: ArrowsArrowDownLine["size"]
@@ -4224,6 +4221,19 @@ export type ArrowsExpandUpDownFillProps = {
4224
4221
  tagName?: ArrowsExpandUpDownFill["tagName"]
4225
4222
  }
4226
4223
 
4224
+ export type BuildingsHome6LineProps = {
4225
+ /** (optional) The width and height in pixels */
4226
+ size?: BuildingsHome6Line["size"]
4227
+ /** (optional) Sets the icon color via the `fill` attribute */
4228
+ selected?: BuildingsHome6Line["selected"]
4229
+ /** (optional) When using the icon standalone, make it meaningful for accessibility */
4230
+ accessibilityTitle?: BuildingsHome6Line["accessibilityTitle"]
4231
+ /** (optional) If `true` the icon can receive focus */
4232
+ focusable?: BuildingsHome6Line["focusable"]
4233
+ /** */
4234
+ tagName?: BuildingsHome6Line["tagName"]
4235
+ }
4236
+
4227
4237
  export type BusinessCalendarLineProps = {
4228
4238
  /** (optional) The width and height in pixels */
4229
4239
  size?: BusinessCalendarLine["size"]
@@ -5137,26 +5147,6 @@ declare module 'vue' {
5137
5147
  * - **close-icon-base** - The base of the icon when the accordion is closed.
5138
5148
  */
5139
5149
  'dap-ds-accordion': DefineCustomElement<DapDSAccordion, DapDSAccordionProps, DapDSAccordionEvents>
5140
- /**
5141
- * Avatar component can be used to display user profile images, initials, or icons.
5142
- *
5143
- * ### Events:
5144
- * - **dds-load** - Fired when the image loads successfully.
5145
- * - **dds-error** - Fired when the image fails to load.
5146
- *
5147
- * ### Slots:
5148
- * - **icon** - The icon to display when variant is 'icon'.
5149
- * - **fallback** - Custom fallback content when image fails to load.
5150
- *
5151
- * ### CSS Parts:
5152
- * - **base** - The main avatar container.
5153
- * - **img** - The avatar image.
5154
- * - **initials** - The initials container.
5155
- * - **icon** - The icon container.
5156
- * - **fallback** - The fallback content container.
5157
- * - **loading** - The loading indicator.
5158
- */
5159
- 'dap-ds-avatar': DefineCustomElement<DapDSAvatar, DapDSAvatarProps, DapDSAvatarEvents>
5160
5150
  /**
5161
5151
  * An accordion group is a collection of accordion components.
5162
5152
  *
@@ -5177,6 +5167,26 @@ declare module 'vue' {
5177
5167
  * - **text** - The text of the anchor heading.
5178
5168
  */
5179
5169
  'dap-ds-anchor-heading': DefineCustomElement<DapDSAnchorHeading, DapDSAnchorHeadingProps, {}>
5170
+ /**
5171
+ * Avatar component can be used to display user profile images, initials, or icons.
5172
+ *
5173
+ * ### Events:
5174
+ * - **dds-load** - Fired when the image loads successfully.
5175
+ * - **dds-error** - Fired when the image fails to load.
5176
+ *
5177
+ * ### Slots:
5178
+ * - **icon** - The icon to display when variant is 'icon'.
5179
+ * - **fallback** - Custom fallback content when image fails to load.
5180
+ *
5181
+ * ### CSS Parts:
5182
+ * - **base** - The main avatar container.
5183
+ * - **img** - The avatar image.
5184
+ * - **initials** - The initials container.
5185
+ * - **icon** - The icon container.
5186
+ * - **fallback** - The fallback content container.
5187
+ * - **loading** - The loading indicator.
5188
+ */
5189
+ 'dap-ds-avatar': DefineCustomElement<DapDSAvatar, DapDSAvatarProps, DapDSAvatarEvents>
5180
5190
  /**
5181
5191
  * Avatar group component displays multiple avatars in an organized layout with overflow management.
5182
5192
  *
@@ -5272,6 +5282,30 @@ declare module 'vue' {
5272
5282
  * - **content** - The content wrapper inside the button.
5273
5283
  */
5274
5284
  'dap-ds-button': DefineCustomElement<DapDSButton, DapDSButtonProps, DapDSButtonEvents>
5285
+ /**
5286
+ *
5287
+ *
5288
+ * ### Events:
5289
+ * - **dds-close** - Fired when the close button is clicked.
5290
+ *
5291
+ * ### Slots:
5292
+ * - **default** - The content of the callout.
5293
+ * - **title** - The title of the callout.
5294
+ * - **icon** - The icon of the callout.
5295
+ * - **actions** - The actions of the callout.
5296
+ * - **close** - The close button of the callout.
5297
+ *
5298
+ * ### CSS Parts:
5299
+ * - **base** - The main callout container.
5300
+ * - **content** - The content of the callout.
5301
+ * - **card-content** - The content of the card.
5302
+ * - **icon** - The icon of the callout.
5303
+ * - **title** - The title of the callout.
5304
+ * - **description** - The description of the callout.
5305
+ * - **actions** - The actions of the callout.
5306
+ * - **close** - The close button of the callout.
5307
+ */
5308
+ 'dap-ds-callout': DefineCustomElement<DapDSCallout, DapDSCalloutProps, DapDSCalloutEvents>
5275
5309
  /**
5276
5310
  * Calendar cell represents a single cell in the calendar.
5277
5311
  *
@@ -5305,30 +5339,6 @@ declare module 'vue' {
5305
5339
  * - **calendar-header-month-select** - The month select of the calendar header.
5306
5340
  */
5307
5341
  'dap-ds-calendar': DefineCustomElement<DapDSCalendar, DapDSCalendarProps, DapDSCalendarEvents>
5308
- /**
5309
- *
5310
- *
5311
- * ### Events:
5312
- * - **dds-close** - Fired when the close button is clicked.
5313
- *
5314
- * ### Slots:
5315
- * - **default** - The content of the callout.
5316
- * - **title** - The title of the callout.
5317
- * - **icon** - The icon of the callout.
5318
- * - **actions** - The actions of the callout.
5319
- * - **close** - The close button of the callout.
5320
- *
5321
- * ### CSS Parts:
5322
- * - **base** - The main callout container.
5323
- * - **content** - The content of the callout.
5324
- * - **card-content** - The content of the card.
5325
- * - **icon** - The icon of the callout.
5326
- * - **title** - The title of the callout.
5327
- * - **description** - The description of the callout.
5328
- * - **actions** - The actions of the callout.
5329
- * - **close** - The close button of the callout.
5330
- */
5331
- 'dap-ds-callout': DefineCustomElement<DapDSCallout, DapDSCalloutProps, DapDSCalloutEvents>
5332
5342
  /**
5333
5343
  * A card actions is a container for actions in a card.
5334
5344
  *
@@ -6668,13 +6678,6 @@ Used with dap-ds-select to create grouped options that render as native optgroup
6668
6678
  * - **container** - The container of the radio group items.
6669
6679
  */
6670
6680
  'dap-ds-radio-group': DefineCustomElement<DapDSRadioGroup, DapDSRadioGroupProps, DapDSRadioGroupEvents>
6671
- /**
6672
- * An icon
6673
- *
6674
- * ### CSS Parts:
6675
- * - **base** - The main icon container.
6676
- */
6677
- 'dap-ds-icon-home-6-line': DefineCustomElement<BuildingsHome6Line, BuildingsHome6LineProps, {}>
6678
6681
  /**
6679
6682
  * An icon
6680
6683
  *
@@ -6808,6 +6811,13 @@ Used with dap-ds-select to create grouped options that render as native optgroup
6808
6811
  * - **base** - The main icon container.
6809
6812
  */
6810
6813
  'dap-ds-icon-expand-up-down-fill': DefineCustomElement<ArrowsExpandUpDownFill, ArrowsExpandUpDownFillProps, {}>
6814
+ /**
6815
+ * An icon
6816
+ *
6817
+ * ### CSS Parts:
6818
+ * - **base** - The main icon container.
6819
+ */
6820
+ 'dap-ds-icon-home-6-line': DefineCustomElement<BuildingsHome6Line, BuildingsHome6LineProps, {}>
6811
6821
  /**
6812
6822
  * An icon
6813
6823
  *
@@ -7292,18 +7302,18 @@ declare global {
7292
7302
  namespace JSX {
7293
7303
  interface IntrinsicElements {
7294
7304
  'dap-ds-accordion': DapDSAccordionProps & DapDSAccordionEvents & DapDSAccordionSlots
7295
- 'dap-ds-avatar': DapDSAvatarProps & DapDSAvatarEvents & DapDSAvatarSlots
7296
7305
  'dap-ds-accordion-group': DapDSAccordionGroupProps & DapDSAccordionGroupSlots
7297
7306
  'dap-ds-anchor-heading': DapDSAnchorHeadingProps
7307
+ 'dap-ds-avatar': DapDSAvatarProps & DapDSAvatarEvents & DapDSAvatarSlots
7298
7308
  'dap-ds-avatar-group': DapDSAvatarGroupProps & DapDSAvatarGroupEvents & DapDSAvatarGroupSlots
7299
7309
  'dap-ds-badge': DapDSBadgeProps & DapDSBadgeSlots
7300
7310
  'dap-ds-banner': DapDSBannerProps & DapDSBannerEvents & DapDSBannerSlots
7301
7311
  'dap-ds-breadcrumb': DapDSBreadcrumbProps & DapDSBreadcrumbSlots
7302
7312
  'dap-ds-breadcrumb-item': DapDSBreadcrumbItemProps & DapDSBreadcrumbItemSlots
7303
7313
  'dap-ds-button': DapDSButtonProps & DapDSButtonEvents & DapDSButtonSlots
7314
+ 'dap-ds-callout': DapDSCalloutProps & DapDSCalloutEvents & DapDSCalloutSlots
7304
7315
  'dap-ds-calendar-cell': DapDSCalendarCellProps & DapDSCalendarCellSlots
7305
7316
  'dap-ds-calendar': DapDSCalendarProps & DapDSCalendarEvents & DapDSCalendarSlots
7306
- 'dap-ds-callout': DapDSCalloutProps & DapDSCalloutEvents & DapDSCalloutSlots
7307
7317
  'dap-ds-card-actions': DapDSCardActionsProps & DapDSCardActionsSlots
7308
7318
  'dap-ds-card-content': DapDSCardContentProps & DapDSCardContentSlots
7309
7319
  'dap-ds-card-image': DapDSCardImageProps & DapDSCardImageSlots
@@ -7385,7 +7395,6 @@ declare global {
7385
7395
  'dap-ds-form-label': DapDSFormLabelProps
7386
7396
  'dap-ds-input-group': DapDSInputGroupProps & DapDSInputGroupSlots
7387
7397
  'dap-ds-radio-group': DapDSRadioGroupProps & DapDSRadioGroupEvents & DapDSRadioGroupSlots
7388
- 'dap-ds-icon-home-6-line': BuildingsHome6LineProps
7389
7398
  'dap-ds-icon-arrow-down-line': ArrowsArrowDownLineProps
7390
7399
  'dap-ds-icon-arrow-down-s-fill': ArrowsArrowDownSFillProps
7391
7400
  'dap-ds-icon-arrow-down-s-line': ArrowsArrowDownSLineProps
@@ -7405,6 +7414,7 @@ declare global {
7405
7414
  'dap-ds-icon-arrow-up-s-fill': ArrowsArrowUpSFillProps
7406
7415
  'dap-ds-icon-arrow-up-s-line': ArrowsArrowUpSLineProps
7407
7416
  'dap-ds-icon-expand-up-down-fill': ArrowsExpandUpDownFillProps
7417
+ 'dap-ds-icon-home-6-line': BuildingsHome6LineProps
7408
7418
  'dap-ds-icon-calendar-line': BusinessCalendarLineProps
7409
7419
  'dap-ds-icon-edit-line': DesignEditLineProps
7410
7420
  'dap-ds-icon-tools-line': DesignToolsLineProps