dap-design-system 0.57.4 → 0.57.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (26) hide show
  1. package/dist/common/types.d.ts +4 -1
  2. package/dist/components/accordion/accordion-base-element.d.ts +12 -0
  3. package/dist/components/banner/banner.component.d.ts +1 -1
  4. package/dist/components/button/button.component.d.ts +9 -4
  5. package/dist/components/button/button.variants.d.ts +2 -2
  6. package/dist/components/callout/callout.component.d.ts +1 -1
  7. package/dist/components/code-puncher/code-puncher-slot.component.d.ts +1 -1
  8. package/dist/components/combobox/comboboxBase.d.ts +2 -2
  9. package/dist/components/image-zoom/image-zoom.component.d.ts +1 -1
  10. package/dist/components/link/link.variants.d.ts +1 -1
  11. package/dist/components/modal/modal-base-element.d.ts +15 -1
  12. package/dist/components/sidenav/sidenav-item.component.d.ts +13 -2
  13. package/dist/{components-BU8-Zde_.js → components-C0QWDkMH.js} +614 -542
  14. package/dist/components-C0QWDkMH.js.map +1 -0
  15. package/dist/components.js +1 -1
  16. package/dist/components.native.css +1 -1
  17. package/dist/dds.js +1 -1
  18. package/dist/manifest/types/vue/index.d.ts +183 -176
  19. package/dist/manifest/vscode.html-custom-data.json +214 -202
  20. package/dist/manifest/web-types.json +262 -249
  21. package/dist/react/index.d.ts +7 -7
  22. package/dist/react-types.ts +8 -8
  23. package/dist/react.js +192 -192
  24. package/dist/react.js.map +1 -1
  25. package/package.json +1 -1
  26. package/dist/components-BU8-Zde_.js.map +0 -1
package/dist/common/types.d.ts CHANGED
@@ -1,4 +1,3 @@
1
- import { ButtonVariant } from '../components/button/button.component';
2
1
  import { default as DapDSFileInputListItem, FileListElement } from '../components/file-input/file-input-list-item.component';
3
2
  export type Common<T> = Pick<T, keyof T>;
4
3
  export type Size = 'lg' | 'md' | 'sm' | 'xs' | 'xxs' | 'xl' | 'xxl';
@@ -30,6 +29,8 @@ export type FloatingStrategy = 'absolute' | 'fixed';
30
29
  export type SnackbarPosition = 'bottom-center' | 'bottom-left' | 'bottom-right' | 'top-center' | 'top-right';
31
30
  export type AlertType = 'default' | 'error' | 'information' | 'successful';
32
31
  export type FeedbackType = 'negative' | 'positive' | 'warning';
32
+ export type ButtonVariant = 'primary' | 'outline' | 'subtle' | 'clean' | 'primary-inverted' | 'outline-inverted' | 'subtle-inverted' | 'clean-inverted' | 'subtle-neutral' | 'subtle-quiet' | 'subtle-quiet-inverted' | 'subtle-menu' | 'subtle-menu-item';
33
+ export type HtmlButtonType = 'button' | 'submit' | 'reset';
33
34
  export type ActionType = {
34
35
  href?: string;
35
36
  target?: LinkTarget;
@@ -93,3 +94,5 @@ export type CloseSource = 'cancel-button' | 'close-button' | 'esc' | 'ok-button'
93
94
  export type AccordionVariant = 'default' | 'collapsed' | 'clean' | 'clean-collapsed';
94
95
  export type TabNavigationMode = 'group' | 'items';
95
96
  export type DialogState = 'closed' | 'opening' | 'open' | 'closing';
97
+ export type AriaCurrent = 'page' | 'step' | 'location' | 'date' | 'time' | 'true';
98
+ export type SidenavSpacing = 'top' | 'bottom' | 'both' | 'none';
package/dist/components/accordion/accordion-base-element.d.ts CHANGED
@@ -22,6 +22,18 @@ export declare class AccordionBaseElement extends AccordionBaseWithSized {
22
22
  private _variant;
23
23
  /** Query for the accordion button element */
24
24
  protected button?: HTMLButtonElement;
25
+ /**
26
+ * The element that actually takes focus -- the toggle button inside the shadow root.
27
+ *
28
+ * Without this, `accordionElement.focus()` silently does nothing: the host has no
29
+ * tabindex and does not delegate focus, so a caller trying to move focus to an
30
+ * accordion header (after committing an inline edit, say) drops focus to <body>.
31
+ * Mirrors the `focusElement` contract that FocusableMixin defines and that
32
+ * dap-ds-modal's focus trap already looks for.
33
+ */
34
+ get focusElement(): HTMLElement;
35
+ focus(options?: FocusOptions): void;
36
+ blur(): void;
25
37
  /** Query for the accordion content element */
26
38
  protected content?: HTMLDivElement;
27
39
  /** Display size for accordion styling (sm or lg); other effective sizes map to sm. */
package/dist/components/banner/banner.component.d.ts CHANGED
@@ -74,5 +74,5 @@ export default class DapDSBanner extends DdsElement {
74
74
  static readonly styles: import('lit').CSSResult;
75
75
  protected firstUpdated(_changedProperties: PropertyValueMap<DapDSBanner> | Map<PropertyKey, unknown>): void;
76
76
  private onCloseClick;
77
- render(): typeof nothing | import('lit-html').TemplateResult;
77
+ render(): import('lit-html').TemplateResult | typeof nothing;
78
78
  }
package/dist/components/button/button.component.d.ts CHANGED
@@ -1,9 +1,7 @@
1
1
  import { PropertyValueMap } from 'lit';
2
2
  import { GenericFormElement } from '../../internal/mixin/genericFormElement';
3
- import { ButtonShape, LinkTarget } from '../../common/types';
3
+ import { ButtonShape, ButtonVariant, HtmlButtonType, LinkTarget } from '../../common/types';
4
4
  import { ButtonSize } from '../icon-button/icon-button.component';
5
- export type ButtonVariant = 'primary' | 'outline' | 'subtle' | 'clean' | 'primary-inverted' | 'outline-inverted' | 'subtle-inverted' | 'clean-inverted' | 'subtle-neutral' | 'subtle-quiet' | 'subtle-quiet-inverted' | 'subtle-menu' | 'subtle-menu-item';
6
- export type HtmlButtonType = 'button' | 'submit' | 'reset';
7
5
  /**
8
6
  * `dap-ds-button` is a versatile button component for triggering actions and navigation.
9
7
  * @element dap-ds-button
@@ -295,11 +293,18 @@ export default class DapDSButton extends GenericFormElement {
295
293
  private toggleHighContrast;
296
294
  private startLoadingTimeout;
297
295
  private clearLoadingTimeout;
296
+ /**
297
+ * `this.button` is a `@query`, so it is null until Lit has rendered the shadow root.
298
+ * A caller focusing a button the same tick it mounts -- a "Save" button that appears
299
+ * only after the form it belongs to opens, say -- would otherwise get a TypeError,
300
+ * not a no-op. Throwing out of a focus() call breaks whatever effect made it.
301
+ */
298
302
  focus(options?: FocusOptions): void;
303
+ blur(): void;
299
304
  /**
300
305
  * @ignore
301
306
  */
302
- get focusElement(): HTMLLinkElement | HTMLButtonElement;
307
+ get focusElement(): HTMLButtonElement | HTMLLinkElement;
303
308
  /** Aria-label for the inner button; survives host attribute removal so Lit does not clear it */
304
309
  private get effectiveAriaLabel();
305
310
  protected updated(changedProperties: Map<string | number | symbol, unknown>): void;
package/dist/components/button/button.variants.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  export declare const buttonVariants: (props?: ({
2
- intent?: "subtle" | "clean" | "primary" | "outline" | "primary-inverted" | "outline-inverted" | "subtle-inverted" | "clean-inverted" | "subtle-neutral" | "subtle-quiet" | "subtle-quiet-inverted" | "subtle-menu" | "subtle-menu-item" | null | undefined;
3
- size?: "lg" | "md" | "sm" | "xs" | null | undefined;
2
+ intent?: "subtle" | "primary" | "outline" | "clean" | "primary-inverted" | "outline-inverted" | "subtle-inverted" | "clean-inverted" | "subtle-neutral" | "subtle-quiet" | "subtle-quiet-inverted" | "subtle-menu" | "subtle-menu-item" | null | undefined;
3
+ size?: "sm" | "xs" | "md" | "lg" | null | undefined;
4
4
  shape?: "button" | "circle" | null | undefined;
5
5
  } & import('class-variance-authority/types').ClassProp) | undefined) => string;
package/dist/components/callout/callout.component.d.ts CHANGED
@@ -104,5 +104,5 @@ export default class DapDSCallout extends DdsElement {
104
104
  handleClose(): void;
105
105
  private handleKeyDown;
106
106
  protected updated(changedProperties: Map<PropertyKey, unknown>): void;
107
- render(): typeof nothing | import('lit-html').TemplateResult;
107
+ render(): import('lit-html').TemplateResult | typeof nothing;
108
108
  }
package/dist/components/code-puncher/code-puncher-slot.component.d.ts CHANGED
@@ -29,5 +29,5 @@ export default class DapDSCodePuncherSlot extends DdsElement {
29
29
  private _handlePaste;
30
30
  private _onFocus;
31
31
  private _onBlur;
32
- render(): typeof nothing | import('lit-html').TemplateResult<1>;
32
+ render(): import('lit-html').TemplateResult<1> | typeof nothing;
33
33
  }
package/dist/components/combobox/comboboxBase.d.ts CHANGED
@@ -117,8 +117,8 @@ export default class ComboboxBaseElement extends GenericFormElement {
117
117
  setValidity(): void;
118
118
  handleInvalid(event: Event): void;
119
119
  getActiveDescendant(): HTMLInputElement | import('../option-item/option-item.component').default | null | undefined;
120
- getSearchIconSize(size: string): "lg" | "md" | "sm";
121
- getInnerIconSize(size: string): 10 | 16;
120
+ getSearchIconSize(size: string): "sm" | "md" | "lg";
121
+ getInnerIconSize(size: string): 16 | 10;
122
122
  private handleChipRemove;
123
123
  private renderChip;
124
124
  private renderChips;
package/dist/components/image-zoom/image-zoom.component.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { PropertyValueMap } from 'lit';
2
+ import { ButtonVariant } from '../../common/types';
2
3
  import { DdsElement } from '../../internal/dds-hu-element';
3
- import { ButtonVariant } from '../button/button.component';
4
4
  /**
5
5
  * `dap-ds-image-zoom`
6
6
  * @summary An image zoom component that provides a Medium.com-style zoom experience. Click an image to expand it to fill the viewport with a smooth animation.
package/dist/components/link/link.variants.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  export declare const linkVariants: (props?: ({
2
2
  color?: "disabled" | "enabled" | null | undefined;
3
- size?: "lg" | "md" | "sm" | "xs" | null | undefined;
3
+ size?: "sm" | "xs" | "md" | "lg" | null | undefined;
4
4
  weight?: "bold" | "normal" | null | undefined;
5
5
  decoration?: "none" | "underline" | null | undefined;
6
6
  } & import('class-variance-authority/types').ClassProp) | undefined) => string;
package/dist/components/modal/modal-base-element.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { PropertyValueMap } from 'lit';
2
+ import { ButtonVariant } from '../../common/types';
2
3
  import { DdsElement } from '../../internal/dds-hu-element';
3
- import { ButtonVariant } from '../button/button.component';
4
4
  declare const ModalBaseWithSized: typeof DdsElement & {
5
5
  new (...args: any[]): import('../../internal/mixin/sizedMixin').SizedElementInterface;
6
6
  prototype: import('../../internal/mixin/sizedMixin').SizedElementInterface;
@@ -56,6 +56,20 @@ export default class ModalBaseElement extends ModalBaseWithSized {
56
56
  protected updated(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void;
57
57
  private handleOpen;
58
58
  private handleCloseAction;
59
+ /**
60
+ * Run `callback` once the dialog's transition settles -- or on a timer if no
61
+ * transition runs at all.
62
+ *
63
+ * Focus management and the `dds-opened` / `dds-closed` events used to hang directly
64
+ * off a `transitionend` listener registered `{ once: true }`. That event never fires
65
+ * when the transition is skipped (`prefers-reduced-motion: reduce`, a consumer
66
+ * zeroing `--dds-modal-transition-speed`, a backgrounded tab) or when it is
67
+ * interrupted, so focus would never enter the dialog and would never be restored on
68
+ * close. Accessibility behaviour must not depend on an animation completing.
69
+ */
70
+ private afterTransition;
71
+ /** Longest transition duration + delay declared on the dialog, in milliseconds. */
72
+ private transitionDurationMs;
59
73
  scrollLock: (open: boolean) => void;
60
74
  protected firstUpdated(_changedProperties: PropertyValueMap<any> | Map<PropertyKey, unknown>): void;
61
75
  show(): void;
package/dist/components/sidenav/sidenav-item.component.d.ts CHANGED
@@ -1,5 +1,5 @@
1
+ import { AriaCurrent, SidenavSpacing } from '../../common/types';
1
2
  import { DdsElement } from '../../internal/dds-hu-element';
2
- export type Spacing = 'top' | 'bottom' | 'both' | 'none';
3
3
  /**
4
4
  * `dap-ds-sidenav-item`
5
5
  * @summary Side navigation item
@@ -35,10 +35,21 @@ export default class DapDSSideNavItem extends DdsElement {
35
35
  href: string;
36
36
  /** Whether the side navigation item is active */
37
37
  active: boolean;
38
+ /**
39
+ * Which `aria-current` token to expose on the link when `active` is set.
40
+ *
41
+ * `aria-current` has to sit on the anchor that assistive technology actually
42
+ * exposes. Setting it on this host does nothing: the host is a role-less custom
43
+ * element, so the attribute is stranded there and screen-reader users cannot tell
44
+ * which item is current. Use `current="step"` inside a stepper.
45
+ *
46
+ * @type {'page' | 'step' | 'location' | 'date' | 'time' | 'true'}
47
+ */
48
+ current: AriaCurrent;
38
49
  /** The spacing of the side navigation item
39
50
  * @type {'top' | 'bottom' | 'both' | 'none'}
40
51
  */
41
- spacing: Spacing;
52
+ spacing: SidenavSpacing;
42
53
  /** The size of the side navigation item */
43
54
  size: 'xs' | 'sm' | 'lg';
44
55
  static readonly styles: import('lit').CSSResult;