@ds-mo/ui 0.3.0 → 0.4.0

package/dist/types/components.d.ts

@@ -0,0 +1,2024 @@
+/* eslint-disable */
+/* tslint:disable */
+/**
+ * This is an autogenerated file created by the Stencil compiler.
+ * It contains typing information for all components that exist in this project.
+ */
+import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
+import { AccordionItemData } from "./components/Accordion/Accordion";
+import { BannerContrast, BannerIntent } from "./components/Banner/Banner";
+import { BreadcrumbItem } from "./components/Breadcrumb/Breadcrumb";
+import { ButtonBackground, ButtonContrast, ButtonElevation, ButtonIntent, ButtonSize, ButtonVariant } from "./components/Button/Button";
+import { CardElevation, CardRadius } from "./components/Card/Card";
+import { DividerOrientation } from "./components/Divider/Divider";
+import { EmptyStateType } from "./components/EmptyState/EmptyState";
+import { FadeSide } from "./components/Fade/Fade";
+import { HeaderBackground } from "./components/Header/Header";
+import { InputType } from "./components/Input/Input";
+import { MenuAlign, MenuItemData, MenuSection, MenuSide } from "./components/Menu/Menu";
+import { ModalWidth } from "./components/Modal/Modal";
+import { RadioOption } from "./components/RadioGroup/RadioGroup";
+import { ScrollbarVariant } from "./components/Scrollbar/Scrollbar";
+import { SidebarWidth } from "./components/Sidebar/Sidebar";
+import { SkeletonVariant } from "./components/Skeleton/Skeleton";
+import { SurfaceBackground, SurfaceContrast, SurfaceElement, SurfaceElevation, SurfaceIntent, SurfaceRadius } from "./components/Surface/Surface";
+import { TabBackground, TabItem } from "./components/TabGroup/TabGroup";
+import { SortState, TableColumn } from "./components/Table/Table";
+import { TagBackground, TagContrast, TagElevation, TagIntent, TagSize } from "./components/Tag/Tag";
+import { LineTruncation, TextAlign, TextColor, TextDecoration, TextElement, TextVariant, TextWrap } from "./components/Text/Text";
+import { ToastPosition } from "./components/Toast/Toast";
+import { TooltipAlign, TooltipSide } from "./components/Tooltip/Tooltip";
+export { AccordionItemData } from "./components/Accordion/Accordion";
+export { BannerContrast, BannerIntent } from "./components/Banner/Banner";
+export { BreadcrumbItem } from "./components/Breadcrumb/Breadcrumb";
+export { ButtonBackground, ButtonContrast, ButtonElevation, ButtonIntent, ButtonSize, ButtonVariant } from "./components/Button/Button";
+export { CardElevation, CardRadius } from "./components/Card/Card";
+export { DividerOrientation } from "./components/Divider/Divider";
+export { EmptyStateType } from "./components/EmptyState/EmptyState";
+export { FadeSide } from "./components/Fade/Fade";
+export { HeaderBackground } from "./components/Header/Header";
+export { InputType } from "./components/Input/Input";
+export { MenuAlign, MenuItemData, MenuSection, MenuSide } from "./components/Menu/Menu";
+export { ModalWidth } from "./components/Modal/Modal";
+export { RadioOption } from "./components/RadioGroup/RadioGroup";
+export { ScrollbarVariant } from "./components/Scrollbar/Scrollbar";
+export { SidebarWidth } from "./components/Sidebar/Sidebar";
+export { SkeletonVariant } from "./components/Skeleton/Skeleton";
+export { SurfaceBackground, SurfaceContrast, SurfaceElement, SurfaceElevation, SurfaceIntent, SurfaceRadius } from "./components/Surface/Surface";
+export { TabBackground, TabItem } from "./components/TabGroup/TabGroup";
+export { SortState, TableColumn } from "./components/Table/Table";
+export { TagBackground, TagContrast, TagElevation, TagIntent, TagSize } from "./components/Tag/Tag";
+export { LineTruncation, TextAlign, TextColor, TextDecoration, TextElement, TextVariant, TextWrap } from "./components/Text/Text";
+export { ToastPosition } from "./components/Toast/Toast";
+export { TooltipAlign, TooltipSide } from "./components/Tooltip/Tooltip";
+export namespace Components {
+    interface DsAccordion {
+        /**
+          * Comma-separated list of expanded item IDs for controlled mode.
+          * @default ''
+         */
+        "expandedIds": string;
+        /**
+          * @default []
+         */
+        "items": AccordionItemData[];
+        /**
+          * @default false
+         */
+        "multiple": boolean;
+    }
+    interface DsBadge {
+        /**
+          * @default 0
+         */
+        "count": number;
+        /**
+          * @default false
+         */
+        "isSelected": boolean;
+        /**
+          * Accessible label. Defaults to the count as a string.
+         */
+        "label": string | undefined;
+    }
+    interface DsBanner {
+        /**
+          * @default 'medium'
+         */
+        "contrast": BannerContrast;
+        /**
+          * @default 'Dismiss'
+         */
+        "dismissLabel": string;
+        /**
+          * Renders at a fixed position (centered top) and auto-dismisses after 4 s.
+          * @default false
+         */
+        "floating": boolean;
+        /**
+          * Renders the diagonal-stripe accent bar above the body.
+          * @default false
+         */
+        "header": boolean;
+        /**
+          * @default 'neutral'
+         */
+        "intent": BannerIntent;
+        /**
+          * @default ''
+         */
+        "message": string;
+        /**
+          * @default false
+         */
+        "showDismiss": boolean;
+    }
+    interface DsBreadcrumb {
+        /**
+          * @default []
+         */
+        "items": BreadcrumbItem[];
+        /**
+          * @default '/'
+         */
+        "separator": string;
+    }
+    interface DsButton {
+        "ariaLabel": string | undefined;
+        "ariaLabelledby": string | undefined;
+        "background": ButtonBackground | undefined;
+        "badgeCount": number | undefined;
+        /**
+          * @default 'bold'
+         */
+        "contrast": ButtonContrast;
+        /**
+          * @default false
+         */
+        "dropdown": boolean;
+        "elevation": ButtonElevation | undefined;
+        /**
+          * @default false
+         */
+        "fullWidth": boolean;
+        "href": string | undefined;
+        /**
+          * @default false
+         */
+        "inactive": boolean;
+        /**
+          * @default 'brand'
+         */
+        "intent": ButtonIntent;
+        "label": string | undefined;
+        /**
+          * @default false
+         */
+        "loading": boolean;
+        /**
+          * @default false
+         */
+        "rounded": boolean;
+        /**
+          * @default 'md'
+         */
+        "size": ButtonSize;
+        "target": string | undefined;
+        /**
+          * @default 'button'
+         */
+        "type": 'button' | 'submit' | 'reset';
+        /**
+          * @default 'primary'
+         */
+        "variant": ButtonVariant;
+        "width": string | undefined;
+    }
+    interface DsCard {
+        /**
+          * @default 'elevated'
+         */
+        "elevation": CardElevation;
+        /**
+          * @default 'lg'
+         */
+        "radius": CardRadius;
+    }
+    interface DsCheckbox {
+        /**
+          * @default false
+         */
+        "checked": boolean;
+        /**
+          * @default false
+         */
+        "inactive": boolean;
+        /**
+          * @default false
+         */
+        "indeterminate": boolean;
+        "label": string;
+    }
+    interface DsDivider {
+        /**
+          * Direction of the divider line. Defaults to 'horizontal'.
+          * @default 'horizontal'
+         */
+        "orientation": DividerOrientation;
+    }
+    interface DsEmptyState {
+        "message": string | undefined;
+        /**
+          * @default 'no-content'
+         */
+        "type": EmptyStateType;
+    }
+    interface DsFade {
+        /**
+          * Background color to fade from. Defaults to var(--color-background-secondary).
+          * @default 'var(--color-background-secondary)'
+         */
+        "background": string;
+        /**
+          * Height (or width for left/right) of the fade overlay — any CSS value.
+         */
+        "height": string | undefined;
+        "side": FadeSide;
+    }
+    interface DsField {
+        /**
+          * ID forwarded to the slotted control via the label's `for` attribute. Auto-generated if omitted.
+         */
+        "fieldId": string | undefined;
+        "label": string;
+    }
+    interface DsHeader {
+        /**
+          * @default 'secondary'
+         */
+        "background": HeaderBackground;
+        "heading": string | undefined;
+    }
+    interface DsInput {
+        "ariaDescribedby": string | undefined;
+        "ariaLabel": string | undefined;
+        "ariaLabelledby": string | undefined;
+        /**
+          * @default false
+         */
+        "autoFocus": boolean;
+        /**
+          * @default false
+         */
+        "error": boolean;
+        "errorMessage": string | undefined;
+        /**
+          * @default false
+         */
+        "inactive": boolean;
+        /**
+          * Associates the internal input with an external <label>.
+         */
+        "inputId": string | undefined;
+        "placeholder": string | undefined;
+        "setFocus": () => Promise<void>;
+        /**
+          * @default 'text'
+         */
+        "type": InputType;
+        /**
+          * @default ''
+         */
+        "value": string;
+    }
+    interface DsLoader {
+        /**
+          * Accessible label for standalone usage. Wraps the spinner in a live region and renders the label visually-hidden. Omit when the host element already conveys busy state via aria-busy.
+         */
+        "label": string | undefined;
+        /**
+          * Render size in px. Designed on a 16×16 viewBox; stroke scales proportionally.
+          * @default 20
+         */
+        "size": number;
+    }
+    interface DsMenu {
+        /**
+          * @default 'start'
+         */
+        "align": MenuAlign;
+        /**
+          * @default 0
+         */
+        "alignOffset": number;
+        /**
+          * External trigger element to position against. Set via JS: menuEl.anchor = buttonEl
+         */
+        "anchor": HTMLElement | undefined;
+        /**
+          * ID of the external trigger element for positioning
+         */
+        "anchorId": string | undefined;
+        /**
+          * @default []
+         */
+        "items": MenuItemData[];
+        "menuWidth": string | undefined;
+        "minWidth": string | undefined;
+        /**
+          * @default false
+         */
+        "open": boolean;
+        /**
+          * @default []
+         */
+        "sections": MenuSection[];
+        /**
+          * @default 'bottom'
+         */
+        "side": MenuSide;
+        /**
+          * @default 4
+         */
+        "sideOffset": number;
+    }
+    interface DsModal {
+        "heading": string;
+        /**
+          * @default 'md'
+         */
+        "modalWidth": ModalWidth | string;
+        /**
+          * @default false
+         */
+        "open": boolean;
+        "subtitle": string | undefined;
+    }
+    interface DsPagination {
+        /**
+          * @default false
+         */
+        "inactive": boolean;
+        /**
+          * @default 1
+         */
+        "page": number;
+        /**
+          * @default 1
+         */
+        "siblingCount": number;
+        /**
+          * @default 1
+         */
+        "totalPages": number;
+    }
+    interface DsRadioGroup {
+        "ariaLabel": string | undefined;
+        "ariaLabelledby": string | undefined;
+        /**
+          * @default 'vertical'
+         */
+        "direction": 'vertical' | 'horizontal';
+        /**
+          * @default false
+         */
+        "inactive": boolean;
+        /**
+          * @default []
+         */
+        "options": RadioOption[];
+        /**
+          * @default ''
+         */
+        "value": string;
+    }
+    interface DsScrollbar {
+        /**
+          * @default true
+         */
+        "showTrackOnHover": boolean;
+        /**
+          * @default 'default'
+         */
+        "variant": ScrollbarVariant;
+    }
+    interface DsSidebar {
+        /**
+          * @default false
+         */
+        "collapsed": boolean;
+        /**
+          * @default false
+         */
+        "mobile": boolean;
+        /**
+          * @default true
+         */
+        "resizable": boolean;
+        /**
+          * @default 'default'
+         */
+        "width": SidebarWidth;
+    }
+    interface DsSkeleton {
+        /**
+          * Height as a CSS value string or number (px).
+         */
+        "height": string | number | undefined;
+        /**
+          * Number of text lines. Only used when variant is 'text'.
+          * @default 1
+         */
+        "lines": number;
+        /**
+          * Whether to show the shimmer animation.
+          * @default true
+         */
+        "shimmer": boolean;
+        /**
+          * @default 'text'
+         */
+        "variant": SkeletonVariant;
+        /**
+          * Width as a CSS value string (e.g. '200px', '100%') or number (px).
+         */
+        "width": string | number | undefined;
+    }
+    interface DsSlider {
+        /**
+          * @default false
+         */
+        "inactive": boolean;
+        /**
+          * Associates with an external <label>. Defaults to an auto-generated ID.
+         */
+        "inputId": string | undefined;
+        "label": string;
+        /**
+          * @default 100
+         */
+        "max": number;
+        /**
+          * @default 0
+         */
+        "min": number;
+        /**
+          * @default 1
+         */
+        "step": number;
+        /**
+          * @default 0
+         */
+        "value": number;
+        "valueText": string | undefined;
+    }
+    interface DsSurface {
+        /**
+          * @default 'div'
+         */
+        "as": SurfaceElement;
+        /**
+          * @default 'transparent'
+         */
+        "background": SurfaceBackground;
+        /**
+          * @default 'faint'
+         */
+        "contrast": SurfaceContrast;
+        /**
+          * Space-separated list of edges: "top bottom" etc. Only applies when elevation='none'.
+         */
+        "edge": string | undefined;
+        /**
+          * @default 'none'
+         */
+        "elevation": SurfaceElevation;
+        /**
+          * @default false
+         */
+        "inactive": boolean;
+        "intent": SurfaceIntent | undefined;
+        /**
+          * @default false
+         */
+        "interactive": boolean;
+        "radius": SurfaceRadius | undefined;
+        /**
+          * @default false
+         */
+        "selected": boolean;
+    }
+    interface DsTabGroup {
+        "ariaLabel": string | undefined;
+        "ariaLabelledby": string | undefined;
+        "background": TabBackground | undefined;
+        /**
+          * @default []
+         */
+        "tabs": TabItem[];
+        /**
+          * @default ''
+         */
+        "value": string;
+    }
+    interface DsTable {
+        /**
+          * @default []
+         */
+        "columns": TableColumn[];
+        /**
+          * @default []
+         */
+        "data": unknown[];
+        /**
+          * @default 'No results found.'
+         */
+        "emptyMessage": string;
+        /**
+          * @default false
+         */
+        "loading": boolean;
+        /**
+          * Page index (0-based). Enables built-in pagination when set alongside pageSize.
+         */
+        "pageIndex": number | undefined;
+        /**
+          * @default 20
+         */
+        "pageSize": number;
+        /**
+          * Comma-separated zero-based row indices that are selected.
+          * @default ''
+         */
+        "selectedRows": string;
+        "sortState": SortState | undefined;
+    }
+    interface DsTag {
+        "background": TagBackground | undefined;
+        /**
+          * @default 'faint'
+         */
+        "contrast": TagContrast;
+        /**
+          * @default 'none'
+         */
+        "elevation": TagElevation;
+        /**
+          * @default false
+         */
+        "inactive": boolean;
+        /**
+          * @default 'neutral'
+         */
+        "intent": TagIntent;
+        /**
+          * Whether the tag has a click/toggle behavior.
+          * @default false
+         */
+        "interactive": boolean;
+        "label": string;
+        "maxWidth": string | number | undefined;
+        /**
+          * @default false
+         */
+        "pressed": boolean;
+        /**
+          * @default false
+         */
+        "removable": boolean;
+        /**
+          * @default false
+         */
+        "rounded": boolean;
+        /**
+          * @default 'md'
+         */
+        "size": TagSize;
+    }
+    interface DsText {
+        "align": TextAlign | undefined;
+        /**
+          * @default 'p'
+         */
+        "as": TextElement;
+        "color": TextColor | undefined;
+        "decoration": TextDecoration | undefined;
+        /**
+          * Maps to `for` attribute on <label> elements.
+         */
+        "for": string | undefined;
+        /**
+          * @default false
+         */
+        "italic": boolean;
+        /**
+          * @default 'none'
+         */
+        "lineTruncation": LineTruncation;
+        /**
+          * @default 'text-body-medium'
+         */
+        "variant": TextVariant;
+        "wrap": TextWrap | undefined;
+    }
+    interface DsToastProvider {
+        /**
+          * @default 'top-center'
+         */
+        "position": ToastPosition;
+    }
+    interface DsToggle {
+        /**
+          * @default false
+         */
+        "checked": boolean;
+        /**
+          * @default false
+         */
+        "inactive": boolean;
+    }
+    interface DsTooltip {
+        /**
+          * @default 'center'
+         */
+        "align": TooltipAlign;
+        /**
+          * @default 0
+         */
+        "alignOffset": number;
+        /**
+          * @default HOVER_DELAY_MS
+         */
+        "delay": number;
+        "label": string;
+        "shortcutKey": string | undefined;
+        /**
+          * @default 'end'
+         */
+        "shortcutKeyPosition": 'start' | 'end';
+        /**
+          * @default 'top'
+         */
+        "side": TooltipSide;
+        /**
+          * @default 4
+         */
+        "sideOffset": number;
+    }
+}
+export interface DsAccordionCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDsAccordionElement;
+}
+export interface DsBannerCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDsBannerElement;
+}
+export interface DsBreadcrumbCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDsBreadcrumbElement;
+}
+export interface DsButtonCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDsButtonElement;
+}
+export interface DsCheckboxCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDsCheckboxElement;
+}
+export interface DsInputCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDsInputElement;
+}
+export interface DsMenuCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDsMenuElement;
+}
+export interface DsModalCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDsModalElement;
+}
+export interface DsPaginationCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDsPaginationElement;
+}
+export interface DsRadioGroupCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDsRadioGroupElement;
+}
+export interface DsSidebarCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDsSidebarElement;
+}
+export interface DsSliderCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDsSliderElement;
+}
+export interface DsTabGroupCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDsTabGroupElement;
+}
+export interface DsTableCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDsTableElement;
+}
+export interface DsTagCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDsTagElement;
+}
+export interface DsToggleCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLDsToggleElement;
+}
+declare global {
+    interface HTMLDsAccordionElementEventMap {
+        "dsExpandedChange": string[];
+    }
+    interface HTMLDsAccordionElement extends Components.DsAccordion, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDsAccordionElementEventMap>(type: K, listener: (this: HTMLDsAccordionElement, ev: DsAccordionCustomEvent<HTMLDsAccordionElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDsAccordionElementEventMap>(type: K, listener: (this: HTMLDsAccordionElement, ev: DsAccordionCustomEvent<HTMLDsAccordionElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDsAccordionElement: {
+        prototype: HTMLDsAccordionElement;
+        new (): HTMLDsAccordionElement;
+    };
+    interface HTMLDsBadgeElement extends Components.DsBadge, HTMLStencilElement {
+    }
+    var HTMLDsBadgeElement: {
+        prototype: HTMLDsBadgeElement;
+        new (): HTMLDsBadgeElement;
+    };
+    interface HTMLDsBannerElementEventMap {
+        "dsDismiss": void;
+    }
+    interface HTMLDsBannerElement extends Components.DsBanner, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDsBannerElementEventMap>(type: K, listener: (this: HTMLDsBannerElement, ev: DsBannerCustomEvent<HTMLDsBannerElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDsBannerElementEventMap>(type: K, listener: (this: HTMLDsBannerElement, ev: DsBannerCustomEvent<HTMLDsBannerElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDsBannerElement: {
+        prototype: HTMLDsBannerElement;
+        new (): HTMLDsBannerElement;
+    };
+    interface HTMLDsBreadcrumbElementEventMap {
+        "dsNavigate": { item: BreadcrumbItem; index: number };
+    }
+    interface HTMLDsBreadcrumbElement extends Components.DsBreadcrumb, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDsBreadcrumbElementEventMap>(type: K, listener: (this: HTMLDsBreadcrumbElement, ev: DsBreadcrumbCustomEvent<HTMLDsBreadcrumbElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDsBreadcrumbElementEventMap>(type: K, listener: (this: HTMLDsBreadcrumbElement, ev: DsBreadcrumbCustomEvent<HTMLDsBreadcrumbElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDsBreadcrumbElement: {
+        prototype: HTMLDsBreadcrumbElement;
+        new (): HTMLDsBreadcrumbElement;
+    };
+    interface HTMLDsButtonElementEventMap {
+        "dsClick": MouseEvent;
+        "dsMouseEnter": MouseEvent;
+        "dsMouseLeave": MouseEvent;
+    }
+    interface HTMLDsButtonElement extends Components.DsButton, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDsButtonElementEventMap>(type: K, listener: (this: HTMLDsButtonElement, ev: DsButtonCustomEvent<HTMLDsButtonElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDsButtonElementEventMap>(type: K, listener: (this: HTMLDsButtonElement, ev: DsButtonCustomEvent<HTMLDsButtonElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDsButtonElement: {
+        prototype: HTMLDsButtonElement;
+        new (): HTMLDsButtonElement;
+    };
+    interface HTMLDsCardElement extends Components.DsCard, HTMLStencilElement {
+    }
+    var HTMLDsCardElement: {
+        prototype: HTMLDsCardElement;
+        new (): HTMLDsCardElement;
+    };
+    interface HTMLDsCheckboxElementEventMap {
+        "dsChange": boolean;
+    }
+    interface HTMLDsCheckboxElement extends Components.DsCheckbox, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDsCheckboxElementEventMap>(type: K, listener: (this: HTMLDsCheckboxElement, ev: DsCheckboxCustomEvent<HTMLDsCheckboxElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDsCheckboxElementEventMap>(type: K, listener: (this: HTMLDsCheckboxElement, ev: DsCheckboxCustomEvent<HTMLDsCheckboxElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDsCheckboxElement: {
+        prototype: HTMLDsCheckboxElement;
+        new (): HTMLDsCheckboxElement;
+    };
+    interface HTMLDsDividerElement extends Components.DsDivider, HTMLStencilElement {
+    }
+    var HTMLDsDividerElement: {
+        prototype: HTMLDsDividerElement;
+        new (): HTMLDsDividerElement;
+    };
+    interface HTMLDsEmptyStateElement extends Components.DsEmptyState, HTMLStencilElement {
+    }
+    var HTMLDsEmptyStateElement: {
+        prototype: HTMLDsEmptyStateElement;
+        new (): HTMLDsEmptyStateElement;
+    };
+    interface HTMLDsFadeElement extends Components.DsFade, HTMLStencilElement {
+    }
+    var HTMLDsFadeElement: {
+        prototype: HTMLDsFadeElement;
+        new (): HTMLDsFadeElement;
+    };
+    interface HTMLDsFieldElement extends Components.DsField, HTMLStencilElement {
+    }
+    var HTMLDsFieldElement: {
+        prototype: HTMLDsFieldElement;
+        new (): HTMLDsFieldElement;
+    };
+    interface HTMLDsHeaderElement extends Components.DsHeader, HTMLStencilElement {
+    }
+    var HTMLDsHeaderElement: {
+        prototype: HTMLDsHeaderElement;
+        new (): HTMLDsHeaderElement;
+    };
+    interface HTMLDsInputElementEventMap {
+        "dsChange": string;
+        "dsClear": void;
+    }
+    interface HTMLDsInputElement extends Components.DsInput, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDsInputElementEventMap>(type: K, listener: (this: HTMLDsInputElement, ev: DsInputCustomEvent<HTMLDsInputElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDsInputElementEventMap>(type: K, listener: (this: HTMLDsInputElement, ev: DsInputCustomEvent<HTMLDsInputElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDsInputElement: {
+        prototype: HTMLDsInputElement;
+        new (): HTMLDsInputElement;
+    };
+    interface HTMLDsLoaderElement extends Components.DsLoader, HTMLStencilElement {
+    }
+    var HTMLDsLoaderElement: {
+        prototype: HTMLDsLoaderElement;
+        new (): HTMLDsLoaderElement;
+    };
+    interface HTMLDsMenuElementEventMap {
+        "dsClose": void;
+        "dsSelect": MenuItemData;
+    }
+    interface HTMLDsMenuElement extends Components.DsMenu, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDsMenuElementEventMap>(type: K, listener: (this: HTMLDsMenuElement, ev: DsMenuCustomEvent<HTMLDsMenuElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDsMenuElementEventMap>(type: K, listener: (this: HTMLDsMenuElement, ev: DsMenuCustomEvent<HTMLDsMenuElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDsMenuElement: {
+        prototype: HTMLDsMenuElement;
+        new (): HTMLDsMenuElement;
+    };
+    interface HTMLDsModalElementEventMap {
+        "dsClose": void;
+    }
+    interface HTMLDsModalElement extends Components.DsModal, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDsModalElementEventMap>(type: K, listener: (this: HTMLDsModalElement, ev: DsModalCustomEvent<HTMLDsModalElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDsModalElementEventMap>(type: K, listener: (this: HTMLDsModalElement, ev: DsModalCustomEvent<HTMLDsModalElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDsModalElement: {
+        prototype: HTMLDsModalElement;
+        new (): HTMLDsModalElement;
+    };
+    interface HTMLDsPaginationElementEventMap {
+        "dsPageChange": number;
+    }
+    interface HTMLDsPaginationElement extends Components.DsPagination, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDsPaginationElementEventMap>(type: K, listener: (this: HTMLDsPaginationElement, ev: DsPaginationCustomEvent<HTMLDsPaginationElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDsPaginationElementEventMap>(type: K, listener: (this: HTMLDsPaginationElement, ev: DsPaginationCustomEvent<HTMLDsPaginationElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDsPaginationElement: {
+        prototype: HTMLDsPaginationElement;
+        new (): HTMLDsPaginationElement;
+    };
+    interface HTMLDsRadioGroupElementEventMap {
+        "dsChange": string;
+    }
+    interface HTMLDsRadioGroupElement extends Components.DsRadioGroup, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDsRadioGroupElementEventMap>(type: K, listener: (this: HTMLDsRadioGroupElement, ev: DsRadioGroupCustomEvent<HTMLDsRadioGroupElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDsRadioGroupElementEventMap>(type: K, listener: (this: HTMLDsRadioGroupElement, ev: DsRadioGroupCustomEvent<HTMLDsRadioGroupElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDsRadioGroupElement: {
+        prototype: HTMLDsRadioGroupElement;
+        new (): HTMLDsRadioGroupElement;
+    };
+    interface HTMLDsScrollbarElement extends Components.DsScrollbar, HTMLStencilElement {
+    }
+    var HTMLDsScrollbarElement: {
+        prototype: HTMLDsScrollbarElement;
+        new (): HTMLDsScrollbarElement;
+    };
+    interface HTMLDsSidebarElementEventMap {
+        "dsToggle": void;
+        "dsWidthChange": SidebarWidth;
+    }
+    interface HTMLDsSidebarElement extends Components.DsSidebar, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDsSidebarElementEventMap>(type: K, listener: (this: HTMLDsSidebarElement, ev: DsSidebarCustomEvent<HTMLDsSidebarElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDsSidebarElementEventMap>(type: K, listener: (this: HTMLDsSidebarElement, ev: DsSidebarCustomEvent<HTMLDsSidebarElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDsSidebarElement: {
+        prototype: HTMLDsSidebarElement;
+        new (): HTMLDsSidebarElement;
+    };
+    interface HTMLDsSkeletonElement extends Components.DsSkeleton, HTMLStencilElement {
+    }
+    var HTMLDsSkeletonElement: {
+        prototype: HTMLDsSkeletonElement;
+        new (): HTMLDsSkeletonElement;
+    };
+    interface HTMLDsSliderElementEventMap {
+        "dsChange": number;
+    }
+    interface HTMLDsSliderElement extends Components.DsSlider, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDsSliderElementEventMap>(type: K, listener: (this: HTMLDsSliderElement, ev: DsSliderCustomEvent<HTMLDsSliderElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDsSliderElementEventMap>(type: K, listener: (this: HTMLDsSliderElement, ev: DsSliderCustomEvent<HTMLDsSliderElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDsSliderElement: {
+        prototype: HTMLDsSliderElement;
+        new (): HTMLDsSliderElement;
+    };
+    interface HTMLDsSurfaceElement extends Components.DsSurface, HTMLStencilElement {
+    }
+    var HTMLDsSurfaceElement: {
+        prototype: HTMLDsSurfaceElement;
+        new (): HTMLDsSurfaceElement;
+    };
+    interface HTMLDsTabGroupElementEventMap {
+        "dsChange": string;
+    }
+    interface HTMLDsTabGroupElement extends Components.DsTabGroup, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDsTabGroupElementEventMap>(type: K, listener: (this: HTMLDsTabGroupElement, ev: DsTabGroupCustomEvent<HTMLDsTabGroupElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDsTabGroupElementEventMap>(type: K, listener: (this: HTMLDsTabGroupElement, ev: DsTabGroupCustomEvent<HTMLDsTabGroupElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDsTabGroupElement: {
+        prototype: HTMLDsTabGroupElement;
+        new (): HTMLDsTabGroupElement;
+    };
+    interface HTMLDsTableElementEventMap {
+        "dsSort": { columnId: string };
+        "dsRowClick": { row: unknown; rowIndex: number };
+        "dsPageChange": { pageIndex: number };
+    }
+    interface HTMLDsTableElement extends Components.DsTable, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDsTableElementEventMap>(type: K, listener: (this: HTMLDsTableElement, ev: DsTableCustomEvent<HTMLDsTableElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDsTableElementEventMap>(type: K, listener: (this: HTMLDsTableElement, ev: DsTableCustomEvent<HTMLDsTableElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDsTableElement: {
+        prototype: HTMLDsTableElement;
+        new (): HTMLDsTableElement;
+    };
+    interface HTMLDsTagElementEventMap {
+        "dsRemove": void;
+        "dsClick": void;
+        "dsPressedChange": boolean;
+    }
+    interface HTMLDsTagElement extends Components.DsTag, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDsTagElementEventMap>(type: K, listener: (this: HTMLDsTagElement, ev: DsTagCustomEvent<HTMLDsTagElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDsTagElementEventMap>(type: K, listener: (this: HTMLDsTagElement, ev: DsTagCustomEvent<HTMLDsTagElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDsTagElement: {
+        prototype: HTMLDsTagElement;
+        new (): HTMLDsTagElement;
+    };
+    interface HTMLDsTextElement extends Components.DsText, HTMLStencilElement {
+    }
+    var HTMLDsTextElement: {
+        prototype: HTMLDsTextElement;
+        new (): HTMLDsTextElement;
+    };
+    interface HTMLDsToastProviderElement extends Components.DsToastProvider, HTMLStencilElement {
+    }
+    var HTMLDsToastProviderElement: {
+        prototype: HTMLDsToastProviderElement;
+        new (): HTMLDsToastProviderElement;
+    };
+    interface HTMLDsToggleElementEventMap {
+        "dsChange": boolean;
+    }
+    interface HTMLDsToggleElement extends Components.DsToggle, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLDsToggleElementEventMap>(type: K, listener: (this: HTMLDsToggleElement, ev: DsToggleCustomEvent<HTMLDsToggleElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLDsToggleElementEventMap>(type: K, listener: (this: HTMLDsToggleElement, ev: DsToggleCustomEvent<HTMLDsToggleElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLDsToggleElement: {
+        prototype: HTMLDsToggleElement;
+        new (): HTMLDsToggleElement;
+    };
+    interface HTMLDsTooltipElement extends Components.DsTooltip, HTMLStencilElement {
+    }
+    var HTMLDsTooltipElement: {
+        prototype: HTMLDsTooltipElement;
+        new (): HTMLDsTooltipElement;
+    };
+    interface HTMLElementTagNameMap {
+        "ds-accordion": HTMLDsAccordionElement;
+        "ds-badge": HTMLDsBadgeElement;
+        "ds-banner": HTMLDsBannerElement;
+        "ds-breadcrumb": HTMLDsBreadcrumbElement;
+        "ds-button": HTMLDsButtonElement;
+        "ds-card": HTMLDsCardElement;
+        "ds-checkbox": HTMLDsCheckboxElement;
+        "ds-divider": HTMLDsDividerElement;
+        "ds-empty-state": HTMLDsEmptyStateElement;
+        "ds-fade": HTMLDsFadeElement;
+        "ds-field": HTMLDsFieldElement;
+        "ds-header": HTMLDsHeaderElement;
+        "ds-input": HTMLDsInputElement;
+        "ds-loader": HTMLDsLoaderElement;
+        "ds-menu": HTMLDsMenuElement;
+        "ds-modal": HTMLDsModalElement;
+        "ds-pagination": HTMLDsPaginationElement;
+        "ds-radio-group": HTMLDsRadioGroupElement;
+        "ds-scrollbar": HTMLDsScrollbarElement;
+        "ds-sidebar": HTMLDsSidebarElement;
+        "ds-skeleton": HTMLDsSkeletonElement;
+        "ds-slider": HTMLDsSliderElement;
+        "ds-surface": HTMLDsSurfaceElement;
+        "ds-tab-group": HTMLDsTabGroupElement;
+        "ds-table": HTMLDsTableElement;
+        "ds-tag": HTMLDsTagElement;
+        "ds-text": HTMLDsTextElement;
+        "ds-toast-provider": HTMLDsToastProviderElement;
+        "ds-toggle": HTMLDsToggleElement;
+        "ds-tooltip": HTMLDsTooltipElement;
+    }
+}
+declare namespace LocalJSX {
+    type OneOf<K extends string, PropT, AttrT = PropT> = { [P in K]: PropT } & { [P in `attr:${K}` | `prop:${K}`]?: never } | { [P in `attr:${K}`]: AttrT } & { [P in K | `prop:${K}`]?: never } | { [P in `prop:${K}`]: PropT } & { [P in K | `attr:${K}`]?: never };
+
+    interface DsAccordion {
+        /**
+          * Comma-separated list of expanded item IDs for controlled mode.
+          * @default ''
+         */
+        "expandedIds"?: string;
+        /**
+          * @default []
+         */
+        "items"?: AccordionItemData[];
+        /**
+          * @default false
+         */
+        "multiple"?: boolean;
+        "onDsExpandedChange"?: (event: DsAccordionCustomEvent<string[]>) => void;
+    }
+    interface DsBadge {
+        /**
+          * @default 0
+         */
+        "count"?: number;
+        /**
+          * @default false
+         */
+        "isSelected"?: boolean;
+        /**
+          * Accessible label. Defaults to the count as a string.
+         */
+        "label"?: string | undefined;
+    }
+    interface DsBanner {
+        /**
+          * @default 'medium'
+         */
+        "contrast"?: BannerContrast;
+        /**
+          * @default 'Dismiss'
+         */
+        "dismissLabel"?: string;
+        /**
+          * Renders at a fixed position (centered top) and auto-dismisses after 4 s.
+          * @default false
+         */
+        "floating"?: boolean;
+        /**
+          * Renders the diagonal-stripe accent bar above the body.
+          * @default false
+         */
+        "header"?: boolean;
+        /**
+          * @default 'neutral'
+         */
+        "intent"?: BannerIntent;
+        /**
+          * @default ''
+         */
+        "message"?: string;
+        "onDsDismiss"?: (event: DsBannerCustomEvent<void>) => void;
+        /**
+          * @default false
+         */
+        "showDismiss"?: boolean;
+    }
+    interface DsBreadcrumb {
+        /**
+          * @default []
+         */
+        "items"?: BreadcrumbItem[];
+        "onDsNavigate"?: (event: DsBreadcrumbCustomEvent<{ item: BreadcrumbItem; index: number }>) => void;
+        /**
+          * @default '/'
+         */
+        "separator"?: string;
+    }
+    interface DsButton {
+        "ariaLabel"?: string | undefined;
+        "ariaLabelledby"?: string | undefined;
+        "background"?: ButtonBackground | undefined;
+        "badgeCount"?: number | undefined;
+        /**
+          * @default 'bold'
+         */
+        "contrast"?: ButtonContrast;
+        /**
+          * @default false
+         */
+        "dropdown"?: boolean;
+        "elevation"?: ButtonElevation | undefined;
+        /**
+          * @default false
+         */
+        "fullWidth"?: boolean;
+        "href"?: string | undefined;
+        /**
+          * @default false
+         */
+        "inactive"?: boolean;
+        /**
+          * @default 'brand'
+         */
+        "intent"?: ButtonIntent;
+        "label"?: string | undefined;
+        /**
+          * @default false
+         */
+        "loading"?: boolean;
+        "onDsClick"?: (event: DsButtonCustomEvent<MouseEvent>) => void;
+        "onDsMouseEnter"?: (event: DsButtonCustomEvent<MouseEvent>) => void;
+        "onDsMouseLeave"?: (event: DsButtonCustomEvent<MouseEvent>) => void;
+        /**
+          * @default false
+         */
+        "rounded"?: boolean;
+        /**
+          * @default 'md'
+         */
+        "size"?: ButtonSize;
+        "target"?: string | undefined;
+        /**
+          * @default 'button'
+         */
+        "type"?: 'button' | 'submit' | 'reset';
+        /**
+          * @default 'primary'
+         */
+        "variant"?: ButtonVariant;
+        "width"?: string | undefined;
+    }
+    interface DsCard {
+        /**
+          * @default 'elevated'
+         */
+        "elevation"?: CardElevation;
+        /**
+          * @default 'lg'
+         */
+        "radius"?: CardRadius;
+    }
+    interface DsCheckbox {
+        /**
+          * @default false
+         */
+        "checked"?: boolean;
+        /**
+          * @default false
+         */
+        "inactive"?: boolean;
+        /**
+          * @default false
+         */
+        "indeterminate"?: boolean;
+        "label": string;
+        "onDsChange"?: (event: DsCheckboxCustomEvent<boolean>) => void;
+    }
+    interface DsDivider {
+        /**
+          * Direction of the divider line. Defaults to 'horizontal'.
+          * @default 'horizontal'
+         */
+        "orientation"?: DividerOrientation;
+    }
+    interface DsEmptyState {
+        "message"?: string | undefined;
+        /**
+          * @default 'no-content'
+         */
+        "type"?: EmptyStateType;
+    }
+    interface DsFade {
+        /**
+          * Background color to fade from. Defaults to var(--color-background-secondary).
+          * @default 'var(--color-background-secondary)'
+         */
+        "background"?: string;
+        /**
+          * Height (or width for left/right) of the fade overlay — any CSS value.
+         */
+        "height"?: string | undefined;
+        "side": FadeSide;
+    }
+    interface DsField {
+        /**
+          * ID forwarded to the slotted control via the label's `for` attribute. Auto-generated if omitted.
+         */
+        "fieldId"?: string | undefined;
+        "label": string;
+    }
+    interface DsHeader {
+        /**
+          * @default 'secondary'
+         */
+        "background"?: HeaderBackground;
+        "heading"?: string | undefined;
+    }
+    interface DsInput {
+        "ariaDescribedby"?: string | undefined;
+        "ariaLabel"?: string | undefined;
+        "ariaLabelledby"?: string | undefined;
+        /**
+          * @default false
+         */
+        "autoFocus"?: boolean;
+        /**
+          * @default false
+         */
+        "error"?: boolean;
+        "errorMessage"?: string | undefined;
+        /**
+          * @default false
+         */
+        "inactive"?: boolean;
+        /**
+          * Associates the internal input with an external <label>.
+         */
+        "inputId"?: string | undefined;
+        "onDsChange"?: (event: DsInputCustomEvent<string>) => void;
+        "onDsClear"?: (event: DsInputCustomEvent<void>) => void;
+        "placeholder"?: string | undefined;
+        /**
+          * @default 'text'
+         */
+        "type"?: InputType;
+        /**
+          * @default ''
+         */
+        "value"?: string;
+    }
+    interface DsLoader {
+        /**
+          * Accessible label for standalone usage. Wraps the spinner in a live region and renders the label visually-hidden. Omit when the host element already conveys busy state via aria-busy.
+         */
+        "label"?: string | undefined;
+        /**
+          * Render size in px. Designed on a 16×16 viewBox; stroke scales proportionally.
+          * @default 20
+         */
+        "size"?: number;
+    }
+    interface DsMenu {
+        /**
+          * @default 'start'
+         */
+        "align"?: MenuAlign;
+        /**
+          * @default 0
+         */
+        "alignOffset"?: number;
+        /**
+          * External trigger element to position against. Set via JS: menuEl.anchor = buttonEl
+         */
+        "anchor"?: HTMLElement | undefined;
+        /**
+          * ID of the external trigger element for positioning
+         */
+        "anchorId"?: string | undefined;
+        /**
+          * @default []
+         */
+        "items"?: MenuItemData[];
+        "menuWidth"?: string | undefined;
+        "minWidth"?: string | undefined;
+        "onDsClose"?: (event: DsMenuCustomEvent<void>) => void;
+        "onDsSelect"?: (event: DsMenuCustomEvent<MenuItemData>) => void;
+        /**
+          * @default false
+         */
+        "open"?: boolean;
+        /**
+          * @default []
+         */
+        "sections"?: MenuSection[];
+        /**
+          * @default 'bottom'
+         */
+        "side"?: MenuSide;
+        /**
+          * @default 4
+         */
+        "sideOffset"?: number;
+    }
+    interface DsModal {
+        "heading": string;
+        /**
+          * @default 'md'
+         */
+        "modalWidth"?: ModalWidth | string;
+        "onDsClose"?: (event: DsModalCustomEvent<void>) => void;
+        /**
+          * @default false
+         */
+        "open"?: boolean;
+        "subtitle"?: string | undefined;
+    }
+    interface DsPagination {
+        /**
+          * @default false
+         */
+        "inactive"?: boolean;
+        "onDsPageChange"?: (event: DsPaginationCustomEvent<number>) => void;
+        /**
+          * @default 1
+         */
+        "page"?: number;
+        /**
+          * @default 1
+         */
+        "siblingCount"?: number;
+        /**
+          * @default 1
+         */
+        "totalPages"?: number;
+    }
+    interface DsRadioGroup {
+        "ariaLabel"?: string | undefined;
+        "ariaLabelledby"?: string | undefined;
+        /**
+          * @default 'vertical'
+         */
+        "direction"?: 'vertical' | 'horizontal';
+        /**
+          * @default false
+         */
+        "inactive"?: boolean;
+        "onDsChange"?: (event: DsRadioGroupCustomEvent<string>) => void;
+        /**
+          * @default []
+         */
+        "options"?: RadioOption[];
+        /**
+          * @default ''
+         */
+        "value"?: string;
+    }
+    interface DsScrollbar {
+        /**
+          * @default true
+         */
+        "showTrackOnHover"?: boolean;
+        /**
+          * @default 'default'
+         */
+        "variant"?: ScrollbarVariant;
+    }
+    interface DsSidebar {
+        /**
+          * @default false
+         */
+        "collapsed"?: boolean;
+        /**
+          * @default false
+         */
+        "mobile"?: boolean;
+        "onDsToggle"?: (event: DsSidebarCustomEvent<void>) => void;
+        "onDsWidthChange"?: (event: DsSidebarCustomEvent<SidebarWidth>) => void;
+        /**
+          * @default true
+         */
+        "resizable"?: boolean;
+        /**
+          * @default 'default'
+         */
+        "width"?: SidebarWidth;
+    }
+    interface DsSkeleton {
+        /**
+          * Height as a CSS value string or number (px).
+         */
+        "height"?: string | number | undefined;
+        /**
+          * Number of text lines. Only used when variant is 'text'.
+          * @default 1
+         */
+        "lines"?: number;
+        /**
+          * Whether to show the shimmer animation.
+          * @default true
+         */
+        "shimmer"?: boolean;
+        /**
+          * @default 'text'
+         */
+        "variant"?: SkeletonVariant;
+        /**
+          * Width as a CSS value string (e.g. '200px', '100%') or number (px).
+         */
+        "width"?: string | number | undefined;
+    }
+    interface DsSlider {
+        /**
+          * @default false
+         */
+        "inactive"?: boolean;
+        /**
+          * Associates with an external <label>. Defaults to an auto-generated ID.
+         */
+        "inputId"?: string | undefined;
+        "label": string;
+        /**
+          * @default 100
+         */
+        "max"?: number;
+        /**
+          * @default 0
+         */
+        "min"?: number;
+        "onDsChange"?: (event: DsSliderCustomEvent<number>) => void;
+        /**
+          * @default 1
+         */
+        "step"?: number;
+        /**
+          * @default 0
+         */
+        "value"?: number;
+        "valueText"?: string | undefined;
+    }
+    interface DsSurface {
+        /**
+          * @default 'div'
+         */
+        "as"?: SurfaceElement;
+        /**
+          * @default 'transparent'
+         */
+        "background"?: SurfaceBackground;
+        /**
+          * @default 'faint'
+         */
+        "contrast"?: SurfaceContrast;
+        /**
+          * Space-separated list of edges: "top bottom" etc. Only applies when elevation='none'.
+         */
+        "edge"?: string | undefined;
+        /**
+          * @default 'none'
+         */
+        "elevation"?: SurfaceElevation;
+        /**
+          * @default false
+         */
+        "inactive"?: boolean;
+        "intent"?: SurfaceIntent | undefined;
+        /**
+          * @default false
+         */
+        "interactive"?: boolean;
+        "radius"?: SurfaceRadius | undefined;
+        /**
+          * @default false
+         */
+        "selected"?: boolean;
+    }
+    interface DsTabGroup {
+        "ariaLabel"?: string | undefined;
+        "ariaLabelledby"?: string | undefined;
+        "background"?: TabBackground | undefined;
+        "onDsChange"?: (event: DsTabGroupCustomEvent<string>) => void;
+        /**
+          * @default []
+         */
+        "tabs"?: TabItem[];
+        /**
+          * @default ''
+         */
+        "value"?: string;
+    }
+    interface DsTable {
+        /**
+          * @default []
+         */
+        "columns"?: TableColumn[];
+        /**
+          * @default []
+         */
+        "data"?: unknown[];
+        /**
+          * @default 'No results found.'
+         */
+        "emptyMessage"?: string;
+        /**
+          * @default false
+         */
+        "loading"?: boolean;
+        "onDsPageChange"?: (event: DsTableCustomEvent<{ pageIndex: number }>) => void;
+        "onDsRowClick"?: (event: DsTableCustomEvent<{ row: unknown; rowIndex: number }>) => void;
+        "onDsSort"?: (event: DsTableCustomEvent<{ columnId: string }>) => void;
+        /**
+          * Page index (0-based). Enables built-in pagination when set alongside pageSize.
+         */
+        "pageIndex"?: number | undefined;
+        /**
+          * @default 20
+         */
+        "pageSize"?: number;
+        /**
+          * Comma-separated zero-based row indices that are selected.
+          * @default ''
+         */
+        "selectedRows"?: string;
+        "sortState"?: SortState | undefined;
+    }
+    interface DsTag {
+        "background"?: TagBackground | undefined;
+        /**
+          * @default 'faint'
+         */
+        "contrast"?: TagContrast;
+        /**
+          * @default 'none'
+         */
+        "elevation"?: TagElevation;
+        /**
+          * @default false
+         */
+        "inactive"?: boolean;
+        /**
+          * @default 'neutral'
+         */
+        "intent"?: TagIntent;
+        /**
+          * Whether the tag has a click/toggle behavior.
+          * @default false
+         */
+        "interactive"?: boolean;
+        "label": string;
+        "maxWidth"?: string | number | undefined;
+        /**
+          * Fired when an interactive tag is clicked.
+         */
+        "onDsClick"?: (event: DsTagCustomEvent<void>) => void;
+        /**
+          * Fired when the pressed state toggles.
+         */
+        "onDsPressedChange"?: (event: DsTagCustomEvent<boolean>) => void;
+        /**
+          * Fired when the remove button is clicked.
+         */
+        "onDsRemove"?: (event: DsTagCustomEvent<void>) => void;
+        /**
+          * @default false
+         */
+        "pressed"?: boolean;
+        /**
+          * @default false
+         */
+        "removable"?: boolean;
+        /**
+          * @default false
+         */
+        "rounded"?: boolean;
+        /**
+          * @default 'md'
+         */
+        "size"?: TagSize;
+    }
+    interface DsText {
+        "align"?: TextAlign | undefined;
+        /**
+          * @default 'p'
+         */
+        "as"?: TextElement;
+        "color"?: TextColor | undefined;
+        "decoration"?: TextDecoration | undefined;
+        /**
+          * Maps to `for` attribute on <label> elements.
+         */
+        "for"?: string | undefined;
+        /**
+          * @default false
+         */
+        "italic"?: boolean;
+        /**
+          * @default 'none'
+         */
+        "lineTruncation"?: LineTruncation;
+        /**
+          * @default 'text-body-medium'
+         */
+        "variant"?: TextVariant;
+        "wrap"?: TextWrap | undefined;
+    }
+    interface DsToastProvider {
+        /**
+          * @default 'top-center'
+         */
+        "position"?: ToastPosition;
+    }
+    interface DsToggle {
+        /**
+          * @default false
+         */
+        "checked"?: boolean;
+        /**
+          * @default false
+         */
+        "inactive"?: boolean;
+        "onDsChange"?: (event: DsToggleCustomEvent<boolean>) => void;
+    }
+    interface DsTooltip {
+        /**
+          * @default 'center'
+         */
+        "align"?: TooltipAlign;
+        /**
+          * @default 0
+         */
+        "alignOffset"?: number;
+        /**
+          * @default HOVER_DELAY_MS
+         */
+        "delay"?: number;
+        "label": string;
+        "shortcutKey"?: string | undefined;
+        /**
+          * @default 'end'
+         */
+        "shortcutKeyPosition"?: 'start' | 'end';
+        /**
+          * @default 'top'
+         */
+        "side"?: TooltipSide;
+        /**
+          * @default 4
+         */
+        "sideOffset"?: number;
+    }
+
+    interface DsAccordionAttributes {
+        "multiple": boolean;
+        "expandedIds": string;
+    }
+    interface DsBadgeAttributes {
+        "count": number;
+        "isSelected": boolean;
+        "label": string | undefined;
+    }
+    interface DsBannerAttributes {
+        "intent": BannerIntent;
+        "contrast": BannerContrast;
+        "message": string;
+        "header": boolean;
+        "floating": boolean;
+        "showDismiss": boolean;
+        "dismissLabel": string;
+    }
+    interface DsBreadcrumbAttributes {
+        "separator": string;
+    }
+    interface DsButtonAttributes {
+        "variant": ButtonVariant;
+        "intent": ButtonIntent;
+        "size": ButtonSize;
+        "label": string | undefined;
+        "rounded": boolean;
+        "fullWidth": boolean;
+        "width": string | undefined;
+        "contrast": ButtonContrast;
+        "background": ButtonBackground | undefined;
+        "dropdown": boolean;
+        "badgeCount": number | undefined;
+        "elevation": ButtonElevation | undefined;
+        "loading": boolean;
+        "inactive": boolean;
+        "href": string | undefined;
+        "target": string | undefined;
+        "type": 'button' | 'submit' | 'reset';
+        "ariaLabel": string | undefined;
+        "ariaLabelledby": string | undefined;
+    }
+    interface DsCardAttributes {
+        "elevation": CardElevation;
+        "radius": CardRadius;
+    }
+    interface DsCheckboxAttributes {
+        "label": string;
+        "checked": boolean;
+        "indeterminate": boolean;
+        "inactive": boolean;
+    }
+    interface DsDividerAttributes {
+        "orientation": DividerOrientation;
+    }
+    interface DsEmptyStateAttributes {
+        "type": EmptyStateType;
+        "message": string | undefined;
+    }
+    interface DsFadeAttributes {
+        "side": FadeSide;
+        "height": string | undefined;
+        "background": string;
+    }
+    interface DsFieldAttributes {
+        "label": string;
+        "fieldId": string | undefined;
+    }
+    interface DsHeaderAttributes {
+        "heading": string | undefined;
+        "background": HeaderBackground;
+    }
+    interface DsInputAttributes {
+        "value": string;
+        "placeholder": string | undefined;
+        "type": InputType;
+        "inactive": boolean;
+        "autoFocus": boolean;
+        "error": boolean;
+        "errorMessage": string | undefined;
+        "inputId": string | undefined;
+        "ariaLabel": string | undefined;
+        "ariaLabelledby": string | undefined;
+        "ariaDescribedby": string | undefined;
+    }
+    interface DsLoaderAttributes {
+        "size": number;
+        "label": string | undefined;
+    }
+    interface DsMenuAttributes {
+        "open": boolean;
+        "side": MenuSide;
+        "align": MenuAlign;
+        "sideOffset": number;
+        "alignOffset": number;
+        "menuWidth": string | undefined;
+        "minWidth": string | undefined;
+        "anchorId": string | undefined;
+    }
+    interface DsModalAttributes {
+        "open": boolean;
+        "heading": string;
+        "subtitle": string | undefined;
+        "modalWidth": ModalWidth | string;
+    }
+    interface DsPaginationAttributes {
+        "page": number;
+        "totalPages": number;
+        "siblingCount": number;
+        "inactive": boolean;
+    }
+    interface DsRadioGroupAttributes {
+        "value": string;
+        "direction": 'vertical' | 'horizontal';
+        "inactive": boolean;
+        "ariaLabel": string | undefined;
+        "ariaLabelledby": string | undefined;
+    }
+    interface DsScrollbarAttributes {
+        "variant": ScrollbarVariant;
+        "showTrackOnHover": boolean;
+    }
+    interface DsSidebarAttributes {
+        "collapsed": boolean;
+        "width": string;
+        "resizable": boolean;
+        "mobile": boolean;
+    }
+    interface DsSkeletonAttributes {
+        "variant": SkeletonVariant;
+        "width": string;
+        "height": string;
+        "lines": number;
+        "shimmer": boolean;
+    }
+    interface DsSliderAttributes {
+        "value": number;
+        "min": number;
+        "max": number;
+        "step": number;
+        "label": string;
+        "inactive": boolean;
+        "valueText": string | undefined;
+        "inputId": string | undefined;
+    }
+    interface DsSurfaceAttributes {
+        "background": SurfaceBackground;
+        "intent": SurfaceIntent | undefined;
+        "contrast": SurfaceContrast;
+        "elevation": SurfaceElevation;
+        "edge": string | undefined;
+        "radius": SurfaceRadius | undefined;
+        "interactive": boolean;
+        "selected": boolean;
+        "inactive": boolean;
+        "as": SurfaceElement;
+    }
+    interface DsTabGroupAttributes {
+        "value": string;
+        "background": TabBackground | undefined;
+        "ariaLabel": string | undefined;
+        "ariaLabelledby": string | undefined;
+    }
+    interface DsTableAttributes {
+        "loading": boolean;
+        "emptyMessage": string;
+        "selectedRows": string;
+        "pageIndex": number | undefined;
+        "pageSize": number;
+    }
+    interface DsTagAttributes {
+        "label": string;
+        "intent": TagIntent;
+        "contrast": TagContrast;
+        "elevation": TagElevation;
+        "size": TagSize;
+        "rounded": boolean;
+        "removable": boolean;
+        "maxWidth": string;
+        "inactive": boolean;
+        "background": TagBackground | undefined;
+        "pressed": boolean;
+        "interactive": boolean;
+    }
+    interface DsTextAttributes {
+        "variant": TextVariant;
+        "color": TextColor | undefined;
+        "decoration": TextDecoration | undefined;
+        "italic": boolean;
+        "align": TextAlign | undefined;
+        "lineTruncation": string;
+        "wrap": TextWrap | undefined;
+        "as": TextElement;
+        "for": string | undefined;
+    }
+    interface DsToastProviderAttributes {
+        "position": ToastPosition;
+    }
+    interface DsToggleAttributes {
+        "checked": boolean;
+        "inactive": boolean;
+    }
+    interface DsTooltipAttributes {
+        "label": string;
+        "side": TooltipSide;
+        "align": TooltipAlign;
+        "sideOffset": number;
+        "alignOffset": number;
+        "delay": number;
+        "shortcutKey": string | undefined;
+        "shortcutKeyPosition": 'start' | 'end';
+    }
+
+    interface IntrinsicElements {
+        "ds-accordion": Omit<DsAccordion, keyof DsAccordionAttributes> & { [K in keyof DsAccordion & keyof DsAccordionAttributes]?: DsAccordion[K] } & { [K in keyof DsAccordion & keyof DsAccordionAttributes as `attr:${K}`]?: DsAccordionAttributes[K] } & { [K in keyof DsAccordion & keyof DsAccordionAttributes as `prop:${K}`]?: DsAccordion[K] };
+        "ds-badge": Omit<DsBadge, keyof DsBadgeAttributes> & { [K in keyof DsBadge & keyof DsBadgeAttributes]?: DsBadge[K] } & { [K in keyof DsBadge & keyof DsBadgeAttributes as `attr:${K}`]?: DsBadgeAttributes[K] } & { [K in keyof DsBadge & keyof DsBadgeAttributes as `prop:${K}`]?: DsBadge[K] };
+        "ds-banner": Omit<DsBanner, keyof DsBannerAttributes> & { [K in keyof DsBanner & keyof DsBannerAttributes]?: DsBanner[K] } & { [K in keyof DsBanner & keyof DsBannerAttributes as `attr:${K}`]?: DsBannerAttributes[K] } & { [K in keyof DsBanner & keyof DsBannerAttributes as `prop:${K}`]?: DsBanner[K] };
+        "ds-breadcrumb": Omit<DsBreadcrumb, keyof DsBreadcrumbAttributes> & { [K in keyof DsBreadcrumb & keyof DsBreadcrumbAttributes]?: DsBreadcrumb[K] } & { [K in keyof DsBreadcrumb & keyof DsBreadcrumbAttributes as `attr:${K}`]?: DsBreadcrumbAttributes[K] } & { [K in keyof DsBreadcrumb & keyof DsBreadcrumbAttributes as `prop:${K}`]?: DsBreadcrumb[K] };
+        "ds-button": Omit<DsButton, keyof DsButtonAttributes> & { [K in keyof DsButton & keyof DsButtonAttributes]?: DsButton[K] } & { [K in keyof DsButton & keyof DsButtonAttributes as `attr:${K}`]?: DsButtonAttributes[K] } & { [K in keyof DsButton & keyof DsButtonAttributes as `prop:${K}`]?: DsButton[K] };
+        "ds-card": Omit<DsCard, keyof DsCardAttributes> & { [K in keyof DsCard & keyof DsCardAttributes]?: DsCard[K] } & { [K in keyof DsCard & keyof DsCardAttributes as `attr:${K}`]?: DsCardAttributes[K] } & { [K in keyof DsCard & keyof DsCardAttributes as `prop:${K}`]?: DsCard[K] };
+        "ds-checkbox": Omit<DsCheckbox, keyof DsCheckboxAttributes> & { [K in keyof DsCheckbox & keyof DsCheckboxAttributes]?: DsCheckbox[K] } & { [K in keyof DsCheckbox & keyof DsCheckboxAttributes as `attr:${K}`]?: DsCheckboxAttributes[K] } & { [K in keyof DsCheckbox & keyof DsCheckboxAttributes as `prop:${K}`]?: DsCheckbox[K] } & OneOf<"label", DsCheckbox["label"], DsCheckboxAttributes["label"]>;
+        "ds-divider": Omit<DsDivider, keyof DsDividerAttributes> & { [K in keyof DsDivider & keyof DsDividerAttributes]?: DsDivider[K] } & { [K in keyof DsDivider & keyof DsDividerAttributes as `attr:${K}`]?: DsDividerAttributes[K] } & { [K in keyof DsDivider & keyof DsDividerAttributes as `prop:${K}`]?: DsDivider[K] };
+        "ds-empty-state": Omit<DsEmptyState, keyof DsEmptyStateAttributes> & { [K in keyof DsEmptyState & keyof DsEmptyStateAttributes]?: DsEmptyState[K] } & { [K in keyof DsEmptyState & keyof DsEmptyStateAttributes as `attr:${K}`]?: DsEmptyStateAttributes[K] } & { [K in keyof DsEmptyState & keyof DsEmptyStateAttributes as `prop:${K}`]?: DsEmptyState[K] };
+        "ds-fade": Omit<DsFade, keyof DsFadeAttributes> & { [K in keyof DsFade & keyof DsFadeAttributes]?: DsFade[K] } & { [K in keyof DsFade & keyof DsFadeAttributes as `attr:${K}`]?: DsFadeAttributes[K] } & { [K in keyof DsFade & keyof DsFadeAttributes as `prop:${K}`]?: DsFade[K] } & OneOf<"side", DsFade["side"], DsFadeAttributes["side"]>;
+        "ds-field": Omit<DsField, keyof DsFieldAttributes> & { [K in keyof DsField & keyof DsFieldAttributes]?: DsField[K] } & { [K in keyof DsField & keyof DsFieldAttributes as `attr:${K}`]?: DsFieldAttributes[K] } & { [K in keyof DsField & keyof DsFieldAttributes as `prop:${K}`]?: DsField[K] } & OneOf<"label", DsField["label"], DsFieldAttributes["label"]>;
+        "ds-header": Omit<DsHeader, keyof DsHeaderAttributes> & { [K in keyof DsHeader & keyof DsHeaderAttributes]?: DsHeader[K] } & { [K in keyof DsHeader & keyof DsHeaderAttributes as `attr:${K}`]?: DsHeaderAttributes[K] } & { [K in keyof DsHeader & keyof DsHeaderAttributes as `prop:${K}`]?: DsHeader[K] };
+        "ds-input": Omit<DsInput, keyof DsInputAttributes> & { [K in keyof DsInput & keyof DsInputAttributes]?: DsInput[K] } & { [K in keyof DsInput & keyof DsInputAttributes as `attr:${K}`]?: DsInputAttributes[K] } & { [K in keyof DsInput & keyof DsInputAttributes as `prop:${K}`]?: DsInput[K] };
+        "ds-loader": Omit<DsLoader, keyof DsLoaderAttributes> & { [K in keyof DsLoader & keyof DsLoaderAttributes]?: DsLoader[K] } & { [K in keyof DsLoader & keyof DsLoaderAttributes as `attr:${K}`]?: DsLoaderAttributes[K] } & { [K in keyof DsLoader & keyof DsLoaderAttributes as `prop:${K}`]?: DsLoader[K] };
+        "ds-menu": Omit<DsMenu, keyof DsMenuAttributes> & { [K in keyof DsMenu & keyof DsMenuAttributes]?: DsMenu[K] } & { [K in keyof DsMenu & keyof DsMenuAttributes as `attr:${K}`]?: DsMenuAttributes[K] } & { [K in keyof DsMenu & keyof DsMenuAttributes as `prop:${K}`]?: DsMenu[K] };
+        "ds-modal": Omit<DsModal, keyof DsModalAttributes> & { [K in keyof DsModal & keyof DsModalAttributes]?: DsModal[K] } & { [K in keyof DsModal & keyof DsModalAttributes as `attr:${K}`]?: DsModalAttributes[K] } & { [K in keyof DsModal & keyof DsModalAttributes as `prop:${K}`]?: DsModal[K] } & OneOf<"heading", DsModal["heading"], DsModalAttributes["heading"]>;
+        "ds-pagination": Omit<DsPagination, keyof DsPaginationAttributes> & { [K in keyof DsPagination & keyof DsPaginationAttributes]?: DsPagination[K] } & { [K in keyof DsPagination & keyof DsPaginationAttributes as `attr:${K}`]?: DsPaginationAttributes[K] } & { [K in keyof DsPagination & keyof DsPaginationAttributes as `prop:${K}`]?: DsPagination[K] };
+        "ds-radio-group": Omit<DsRadioGroup, keyof DsRadioGroupAttributes> & { [K in keyof DsRadioGroup & keyof DsRadioGroupAttributes]?: DsRadioGroup[K] } & { [K in keyof DsRadioGroup & keyof DsRadioGroupAttributes as `attr:${K}`]?: DsRadioGroupAttributes[K] } & { [K in keyof DsRadioGroup & keyof DsRadioGroupAttributes as `prop:${K}`]?: DsRadioGroup[K] };
+        "ds-scrollbar": Omit<DsScrollbar, keyof DsScrollbarAttributes> & { [K in keyof DsScrollbar & keyof DsScrollbarAttributes]?: DsScrollbar[K] } & { [K in keyof DsScrollbar & keyof DsScrollbarAttributes as `attr:${K}`]?: DsScrollbarAttributes[K] } & { [K in keyof DsScrollbar & keyof DsScrollbarAttributes as `prop:${K}`]?: DsScrollbar[K] };
+        "ds-sidebar": Omit<DsSidebar, keyof DsSidebarAttributes> & { [K in keyof DsSidebar & keyof DsSidebarAttributes]?: DsSidebar[K] } & { [K in keyof DsSidebar & keyof DsSidebarAttributes as `attr:${K}`]?: DsSidebarAttributes[K] } & { [K in keyof DsSidebar & keyof DsSidebarAttributes as `prop:${K}`]?: DsSidebar[K] };
+        "ds-skeleton": Omit<DsSkeleton, keyof DsSkeletonAttributes> & { [K in keyof DsSkeleton & keyof DsSkeletonAttributes]?: DsSkeleton[K] } & { [K in keyof DsSkeleton & keyof DsSkeletonAttributes as `attr:${K}`]?: DsSkeletonAttributes[K] } & { [K in keyof DsSkeleton & keyof DsSkeletonAttributes as `prop:${K}`]?: DsSkeleton[K] };
+        "ds-slider": Omit<DsSlider, keyof DsSliderAttributes> & { [K in keyof DsSlider & keyof DsSliderAttributes]?: DsSlider[K] } & { [K in keyof DsSlider & keyof DsSliderAttributes as `attr:${K}`]?: DsSliderAttributes[K] } & { [K in keyof DsSlider & keyof DsSliderAttributes as `prop:${K}`]?: DsSlider[K] } & OneOf<"label", DsSlider["label"], DsSliderAttributes["label"]>;
+        "ds-surface": Omit<DsSurface, keyof DsSurfaceAttributes> & { [K in keyof DsSurface & keyof DsSurfaceAttributes]?: DsSurface[K] } & { [K in keyof DsSurface & keyof DsSurfaceAttributes as `attr:${K}`]?: DsSurfaceAttributes[K] } & { [K in keyof DsSurface & keyof DsSurfaceAttributes as `prop:${K}`]?: DsSurface[K] };
+        "ds-tab-group": Omit<DsTabGroup, keyof DsTabGroupAttributes> & { [K in keyof DsTabGroup & keyof DsTabGroupAttributes]?: DsTabGroup[K] } & { [K in keyof DsTabGroup & keyof DsTabGroupAttributes as `attr:${K}`]?: DsTabGroupAttributes[K] } & { [K in keyof DsTabGroup & keyof DsTabGroupAttributes as `prop:${K}`]?: DsTabGroup[K] };
+        "ds-table": Omit<DsTable, keyof DsTableAttributes> & { [K in keyof DsTable & keyof DsTableAttributes]?: DsTable[K] } & { [K in keyof DsTable & keyof DsTableAttributes as `attr:${K}`]?: DsTableAttributes[K] } & { [K in keyof DsTable & keyof DsTableAttributes as `prop:${K}`]?: DsTable[K] };
+        "ds-tag": Omit<DsTag, keyof DsTagAttributes> & { [K in keyof DsTag & keyof DsTagAttributes]?: DsTag[K] } & { [K in keyof DsTag & keyof DsTagAttributes as `attr:${K}`]?: DsTagAttributes[K] } & { [K in keyof DsTag & keyof DsTagAttributes as `prop:${K}`]?: DsTag[K] } & OneOf<"label", DsTag["label"], DsTagAttributes["label"]>;
+        "ds-text": Omit<DsText, keyof DsTextAttributes> & { [K in keyof DsText & keyof DsTextAttributes]?: DsText[K] } & { [K in keyof DsText & keyof DsTextAttributes as `attr:${K}`]?: DsTextAttributes[K] } & { [K in keyof DsText & keyof DsTextAttributes as `prop:${K}`]?: DsText[K] };
+        "ds-toast-provider": Omit<DsToastProvider, keyof DsToastProviderAttributes> & { [K in keyof DsToastProvider & keyof DsToastProviderAttributes]?: DsToastProvider[K] } & { [K in keyof DsToastProvider & keyof DsToastProviderAttributes as `attr:${K}`]?: DsToastProviderAttributes[K] } & { [K in keyof DsToastProvider & keyof DsToastProviderAttributes as `prop:${K}`]?: DsToastProvider[K] };
+        "ds-toggle": Omit<DsToggle, keyof DsToggleAttributes> & { [K in keyof DsToggle & keyof DsToggleAttributes]?: DsToggle[K] } & { [K in keyof DsToggle & keyof DsToggleAttributes as `attr:${K}`]?: DsToggleAttributes[K] } & { [K in keyof DsToggle & keyof DsToggleAttributes as `prop:${K}`]?: DsToggle[K] };
+        "ds-tooltip": Omit<DsTooltip, keyof DsTooltipAttributes> & { [K in keyof DsTooltip & keyof DsTooltipAttributes]?: DsTooltip[K] } & { [K in keyof DsTooltip & keyof DsTooltipAttributes as `attr:${K}`]?: DsTooltipAttributes[K] } & { [K in keyof DsTooltip & keyof DsTooltipAttributes as `prop:${K}`]?: DsTooltip[K] } & OneOf<"label", DsTooltip["label"], DsTooltipAttributes["label"]>;
+    }
+}
+export { LocalJSX as JSX };
+declare module "@stencil/core" {
+    export namespace JSX {
+        interface IntrinsicElements {
+            "ds-accordion": LocalJSX.IntrinsicElements["ds-accordion"] & JSXBase.HTMLAttributes<HTMLDsAccordionElement>;
+            "ds-badge": LocalJSX.IntrinsicElements["ds-badge"] & JSXBase.HTMLAttributes<HTMLDsBadgeElement>;
+            "ds-banner": LocalJSX.IntrinsicElements["ds-banner"] & JSXBase.HTMLAttributes<HTMLDsBannerElement>;
+            "ds-breadcrumb": LocalJSX.IntrinsicElements["ds-breadcrumb"] & JSXBase.HTMLAttributes<HTMLDsBreadcrumbElement>;
+            "ds-button": LocalJSX.IntrinsicElements["ds-button"] & JSXBase.HTMLAttributes<HTMLDsButtonElement>;
+            "ds-card": LocalJSX.IntrinsicElements["ds-card"] & JSXBase.HTMLAttributes<HTMLDsCardElement>;
+            "ds-checkbox": LocalJSX.IntrinsicElements["ds-checkbox"] & JSXBase.HTMLAttributes<HTMLDsCheckboxElement>;
+            "ds-divider": LocalJSX.IntrinsicElements["ds-divider"] & JSXBase.HTMLAttributes<HTMLDsDividerElement>;
+            "ds-empty-state": LocalJSX.IntrinsicElements["ds-empty-state"] & JSXBase.HTMLAttributes<HTMLDsEmptyStateElement>;
+            "ds-fade": LocalJSX.IntrinsicElements["ds-fade"] & JSXBase.HTMLAttributes<HTMLDsFadeElement>;
+            "ds-field": LocalJSX.IntrinsicElements["ds-field"] & JSXBase.HTMLAttributes<HTMLDsFieldElement>;
+            "ds-header": LocalJSX.IntrinsicElements["ds-header"] & JSXBase.HTMLAttributes<HTMLDsHeaderElement>;
+            "ds-input": LocalJSX.IntrinsicElements["ds-input"] & JSXBase.HTMLAttributes<HTMLDsInputElement>;
+            "ds-loader": LocalJSX.IntrinsicElements["ds-loader"] & JSXBase.HTMLAttributes<HTMLDsLoaderElement>;
+            "ds-menu": LocalJSX.IntrinsicElements["ds-menu"] & JSXBase.HTMLAttributes<HTMLDsMenuElement>;
+            "ds-modal": LocalJSX.IntrinsicElements["ds-modal"] & JSXBase.HTMLAttributes<HTMLDsModalElement>;
+            "ds-pagination": LocalJSX.IntrinsicElements["ds-pagination"] & JSXBase.HTMLAttributes<HTMLDsPaginationElement>;
+            "ds-radio-group": LocalJSX.IntrinsicElements["ds-radio-group"] & JSXBase.HTMLAttributes<HTMLDsRadioGroupElement>;
+            "ds-scrollbar": LocalJSX.IntrinsicElements["ds-scrollbar"] & JSXBase.HTMLAttributes<HTMLDsScrollbarElement>;
+            "ds-sidebar": LocalJSX.IntrinsicElements["ds-sidebar"] & JSXBase.HTMLAttributes<HTMLDsSidebarElement>;
+            "ds-skeleton": LocalJSX.IntrinsicElements["ds-skeleton"] & JSXBase.HTMLAttributes<HTMLDsSkeletonElement>;
+            "ds-slider": LocalJSX.IntrinsicElements["ds-slider"] & JSXBase.HTMLAttributes<HTMLDsSliderElement>;
+            "ds-surface": LocalJSX.IntrinsicElements["ds-surface"] & JSXBase.HTMLAttributes<HTMLDsSurfaceElement>;
+            "ds-tab-group": LocalJSX.IntrinsicElements["ds-tab-group"] & JSXBase.HTMLAttributes<HTMLDsTabGroupElement>;
+            "ds-table": LocalJSX.IntrinsicElements["ds-table"] & JSXBase.HTMLAttributes<HTMLDsTableElement>;
+            "ds-tag": LocalJSX.IntrinsicElements["ds-tag"] & JSXBase.HTMLAttributes<HTMLDsTagElement>;
+            "ds-text": LocalJSX.IntrinsicElements["ds-text"] & JSXBase.HTMLAttributes<HTMLDsTextElement>;
+            "ds-toast-provider": LocalJSX.IntrinsicElements["ds-toast-provider"] & JSXBase.HTMLAttributes<HTMLDsToastProviderElement>;
+            "ds-toggle": LocalJSX.IntrinsicElements["ds-toggle"] & JSXBase.HTMLAttributes<HTMLDsToggleElement>;
+            "ds-tooltip": LocalJSX.IntrinsicElements["ds-tooltip"] & JSXBase.HTMLAttributes<HTMLDsTooltipElement>;
+        }
+    }
+}