@nova-design-system/nova-webcomponents 3.5.0 → 3.7.0

package/dist/types/components.d.ts

@@ -18,6 +18,84 @@ export { IconName } from "./components/nv-icon/nv-icons";
 export { Placement } from "@floating-ui/dom";
 export { ColumnConfig } from "./interfaces/ColumnConfig";
 export namespace Components {
+    interface NvAccordion {
+        /**
+          * Closes an item by its index (Public API)
+          * @param index Index of the item to close
+         */
+        "close": (index: number) => Promise<void>;
+        /**
+          * Data to display as a list of items (title, subtitle, content).
+         */
+        "data": {
+    /** Unique identifier of the item */
+    id: string;
+    /** Item title */
+    title: string;
+    /** Optional subtitle */
+    subtitle?: string;
+    /** Main content */
+    content: string;
+    /** Optional footer */
+    footer?: string;
+    /** Disabled state */
+    disabled?: boolean;
+  }[];
+        /**
+          * Expansion mode: 'accordion' (single open) or 'multi' (multiple open)
+         */
+        "mode": 'accordion' | 'multi';
+        /**
+          * Opens an item by its index (Public API)
+          * @param index Index of the item to open
+         */
+        "open": (index: number) => Promise<void>;
+        /**
+          * Index of open items (external control possible)
+         */
+        "openIndexes"?: number[];
+    }
+    /**
+     * Accordion item element for nv-accordion.
+     */
+    interface NvAccordionItem {
+        /**
+          * Disables the item
+         */
+        "disabled": boolean;
+        /**
+          * Item title (displayed if header slot is absent)
+         */
+        "itemTitle"?: string;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "item-title"?: string;
+        /**
+          * Maximum content height (in px, optional). If not defined, auto height.
+         */
+        "maxContentHeight"?: number;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "max-content-height"?: number;
+        /**
+          * Parent expansion mode (accordion or multi)
+         */
+        "mode"?: 'accordion' | 'multi';
+        /**
+          * Open or closed
+         */
+        "open": boolean;
+        /**
+          * Item subtitle (displayed if header slot is absent)
+         */
+        "subtitle"?: string;
+        /**
+          * Toggle open/close (Public API)
+         */
+        "toggle": () => Promise<void>;
+    }
     interface NvAlert {
         /**
           * Defines color of the alert.
@@ -238,6 +316,10 @@ export namespace Components {
         "type": `${ButtonType}`;
     }
     interface NvCalendar {
+        /**
+          * Clears the current selection and resets the calendar to its initial state. This method can be called programmatically to reset the calendar.
+         */
+        "clear": () => Promise<void>;
         /**
           * Date format (ex: 'YYYY-MM-DD', 'DD-MM-YYYY', etc.)
           * @default 'YYYY-MM-DD'
@@ -526,6 +608,10 @@ export namespace Components {
         "repeat-template"?: boolean;
     }
     interface NvDialog {
+        /**
+          * Controls whether the dialog should automatically focus the first focusable element when opened. When disabled, prevents unwanted tooltip triggers on dialog open.
+         */
+        "autofocus": boolean;
         /**
           * If true, the dialog will be closed when the backdrop is clicked.
          */
@@ -729,11 +815,18 @@ export namespace Components {
          */
         "value"?: string;
     }
+    /**
+     * A field date component that combines an input with a calendar popover.
+     */
     interface NvFielddate {
         /**
           * Autofocus the input when the component is mounted.
          */
         "autofocus": boolean;
+        /**
+          * Clears the current selection and resets the field to its initial state. This method can be called programmatically to reset the field.
+         */
+        "clear": () => Promise<void>;
         /**
           * Date format ex: YYYY-MM-DD, DD-MM-YYYY, etc.
           * @default 'YYYY-MM-DD'
@@ -878,6 +971,10 @@ export namespace Components {
           * Autofocus the start input when the component is mounted.
          */
         "autofocus": boolean;
+        /**
+          * Clears the current selection and resets the date range field to its initial state. This method can be called programmatically to reset the field.
+         */
+        "clear": () => Promise<void>;
         /**
           * Date format ex: YYYY-MM-DD, DD-MM-YYYY, etc.
           * @default 'YYYY-MM-DD'
@@ -1265,6 +1362,14 @@ export namespace Components {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "error-description"?: string;
+        /**
+          * The text entered by the user for filtering multiselect items.
+         */
+        "filterText": string;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "filter-text"?: string;
         /**
           * Enables or disables the filtering feature for the multiselect items.
          */
@@ -1346,9 +1451,9 @@ export namespace Components {
          */
         "resetFilter": () => Promise<void>;
         /**
-          * Specifies the value of the input field.
+          * Specifies the selected values of the multiselect field. This is the canonical value for the component and is used for form submission.
          */
-        "value": string;
+        "value": string[];
     }
     interface NvFieldnumber {
         /**
@@ -2574,6 +2679,14 @@ export namespace Components {
         "triggerElement": Element;
     }
 }
+export interface NvAccordionCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLNvAccordionElement;
+}
+export interface NvAccordionItemCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLNvAccordionItemElement;
+}
 export interface NvAlertCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLNvAlertElement;
@@ -2678,7 +2791,51 @@ export interface NvToggleCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLNvToggleElement;
 }
+export interface NvTooltipCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLNvTooltipElement;
+}
 declare global {
+    interface HTMLNvAccordionElementEventMap {
+        "openChanged": {
+    /** Index of open items */
+    openIndexes: number[];
+  };
+    }
+    interface HTMLNvAccordionElement extends Components.NvAccordion, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLNvAccordionElementEventMap>(type: K, listener: (this: HTMLNvAccordionElement, ev: NvAccordionCustomEvent<HTMLNvAccordionElementEventMap[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 HTMLNvAccordionElementEventMap>(type: K, listener: (this: HTMLNvAccordionElement, ev: NvAccordionCustomEvent<HTMLNvAccordionElementEventMap[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 HTMLNvAccordionElement: {
+        prototype: HTMLNvAccordionElement;
+        new (): HTMLNvAccordionElement;
+    };
+    interface HTMLNvAccordionItemElementEventMap {
+        "itemToggle": boolean;
+    }
+    /**
+     * Accordion item element for nv-accordion.
+     */
+    interface HTMLNvAccordionItemElement extends Components.NvAccordionItem, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLNvAccordionItemElementEventMap>(type: K, listener: (this: HTMLNvAccordionItemElement, ev: NvAccordionItemCustomEvent<HTMLNvAccordionItemElementEventMap[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 HTMLNvAccordionItemElementEventMap>(type: K, listener: (this: HTMLNvAccordionItemElement, ev: NvAccordionItemCustomEvent<HTMLNvAccordionItemElementEventMap[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 HTMLNvAccordionItemElement: {
+        prototype: HTMLNvAccordionItemElement;
+        new (): HTMLNvAccordionItemElement;
+    };
     interface HTMLNvAlertElementEventMap {
         "hiddenChanged": boolean;
         "hiddenChangedComplete": boolean;
@@ -2896,6 +3053,9 @@ declare global {
     interface HTMLNvFielddateElementEventMap {
         "valueChanged": string;
     }
+    /**
+     * A field date component that combines an input with a calendar popover.
+     */
     interface HTMLNvFielddateElement extends Components.NvFielddate, HTMLStencilElement {
         addEventListener<K extends keyof HTMLNvFielddateElementEventMap>(type: K, listener: (this: HTMLNvFielddateElement, ev: NvFielddateCustomEvent<HTMLNvFielddateElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
         addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
@@ -2999,8 +3159,8 @@ declare global {
         new (): HTMLNvFielddropdownitemcheckElement;
     };
     interface HTMLNvFieldmultiselectElementEventMap {
-        "valueChanged": string;
-        "multiselectChange": string[];
+        "valueChanged": string[];
+        "filterTextChanged": string;
     }
     interface HTMLNvFieldmultiselectElement extends Components.NvFieldmultiselect, HTMLStencilElement {
         addEventListener<K extends keyof HTMLNvFieldmultiselectElementEventMap>(type: K, listener: (this: HTMLNvFieldmultiselectElement, ev: NvFieldmultiselectCustomEvent<HTMLNvFieldmultiselectElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -3303,13 +3463,26 @@ declare global {
         prototype: HTMLNvToggleElement;
         new (): HTMLNvToggleElement;
     };
+    interface HTMLNvTooltipElementEventMap {
+        "openChanged": boolean;
+    }
     interface HTMLNvTooltipElement extends Components.NvTooltip, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLNvTooltipElementEventMap>(type: K, listener: (this: HTMLNvTooltipElement, ev: NvTooltipCustomEvent<HTMLNvTooltipElementEventMap[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 HTMLNvTooltipElementEventMap>(type: K, listener: (this: HTMLNvTooltipElement, ev: NvTooltipCustomEvent<HTMLNvTooltipElementEventMap[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 HTMLNvTooltipElement: {
         prototype: HTMLNvTooltipElement;
         new (): HTMLNvTooltipElement;
     };
     interface HTMLElementTagNameMap {
+        "nv-accordion": HTMLNvAccordionElement;
+        "nv-accordion-item": HTMLNvAccordionItemElement;
         "nv-alert": HTMLNvAlertElement;
         "nv-avatar": HTMLNvAvatarElement;
         "nv-badge": HTMLNvBadgeElement;
@@ -3353,6 +3526,81 @@ declare global {
     }
 }
 declare namespace LocalJSX {
+    interface NvAccordion {
+        /**
+          * Data to display as a list of items (title, subtitle, content).
+         */
+        "data"?: {
+    /** Unique identifier of the item */
+    id: string;
+    /** Item title */
+    title: string;
+    /** Optional subtitle */
+    subtitle?: string;
+    /** Main content */
+    content: string;
+    /** Optional footer */
+    footer?: string;
+    /** Disabled state */
+    disabled?: boolean;
+  }[];
+        /**
+          * Expansion mode: 'accordion' (single open) or 'multi' (multiple open)
+         */
+        "mode"?: 'accordion' | 'multi';
+        /**
+          * Event emitted when an item's open state changes
+         */
+        "onOpenChanged"?: (event: NvAccordionCustomEvent<{
+    /** Index of open items */
+    openIndexes: number[];
+  }>) => void;
+        /**
+          * Index of open items (external control possible)
+         */
+        "openIndexes"?: number[];
+    }
+    /**
+     * Accordion item element for nv-accordion.
+     */
+    interface NvAccordionItem {
+        /**
+          * Disables the item
+         */
+        "disabled"?: boolean;
+        /**
+          * Item title (displayed if header slot is absent)
+         */
+        "itemTitle"?: string;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "item-title"?: string;
+        /**
+          * Maximum content height (in px, optional). If not defined, auto height.
+         */
+        "maxContentHeight"?: number;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "max-content-height"?: number;
+        /**
+          * Parent expansion mode (accordion or multi)
+         */
+        "mode"?: 'accordion' | 'multi';
+        /**
+          * Event emitted on toggle (header click)
+         */
+        "onItemToggle"?: (event: NvAccordionItemCustomEvent<boolean>) => void;
+        /**
+          * Open or closed
+         */
+        "open"?: boolean;
+        /**
+          * Item subtitle (displayed if header slot is absent)
+         */
+        "subtitle"?: string;
+    }
     interface NvAlert {
         /**
           * Defines color of the alert.
@@ -3953,6 +4201,10 @@ declare namespace LocalJSX {
         "repeat-template"?: boolean;
     }
     interface NvDialog {
+        /**
+          * Controls whether the dialog should automatically focus the first focusable element when opened. When disabled, prevents unwanted tooltip triggers on dialog open.
+         */
+        "autofocus"?: boolean;
         /**
           * If true, the dialog will be closed when the backdrop is clicked.
          */
@@ -4163,6 +4415,9 @@ declare namespace LocalJSX {
          */
         "value"?: string;
     }
+    /**
+     * A field date component that combines an input with a calendar popover.
+     */
     interface NvFielddate {
         /**
           * Autofocus the input when the component is mounted.
@@ -4743,6 +4998,14 @@ declare namespace LocalJSX {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "error-description"?: string;
+        /**
+          * The text entered by the user for filtering multiselect items.
+         */
+        "filterText"?: string;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "filter-text"?: string;
         /**
           * Enables or disables the filtering feature for the multiselect items.
          */
@@ -4776,14 +5039,14 @@ declare namespace LocalJSX {
          */
         "name"?: string;
         /**
-          * Event emitted when the selection changes in the multiselect. Emits the current list of selected values.
+          * Emitted when the filter text changes.
          */
-        "onMultiselectChange"?: (event: NvFieldmultiselectCustomEvent<string[]>) => void;
+        "onFilterTextChanged"?: (event: NvFieldmultiselectCustomEvent<string>) => void;
         /**
-          * Emitted when the input value changes.
+          * Emitted when the selected values change.
           * @bind value
          */
-        "onValueChanged"?: (event: NvFieldmultiselectCustomEvent<string>) => void;
+        "onValueChanged"?: (event: NvFieldmultiselectCustomEvent<string[]>) => void;
         /**
           * State of the multiselect popover.
          */
@@ -4819,9 +5082,9 @@ declare namespace LocalJSX {
          */
         "required"?: boolean;
         /**
-          * Specifies the value of the input field.
+          * Specifies the selected values of the multiselect field. This is the canonical value for the component and is used for form submission.
          */
-        "value"?: string;
+        "value"?: string[];
     }
     interface NvFieldnumber {
         /**
@@ -6103,12 +6366,18 @@ declare namespace LocalJSX {
           * A string representing the text to be displayed inside the tooltip. This content is shown when the tooltip is activated by the user, such as on hover or focus events.
          */
         "message"?: string;
+        /**
+          * Emitted when the tooltip is opened or closed. Bubbles up from the popover element.
+         */
+        "onOpenChanged"?: (event: NvTooltipCustomEvent<boolean>) => void;
         /**
           * Decides where the tooltip shows up next to the element it’s linked to (above, below, to the sides). If there isn’t enough room, it will adjust it's position on the axis to fit on the screen, so users can always see it.
          */
         "placement"?: Placement;
     }
     interface IntrinsicElements {
+        "nv-accordion": NvAccordion;
+        "nv-accordion-item": NvAccordionItem;
         "nv-alert": NvAlert;
         "nv-avatar": NvAvatar;
         "nv-badge": NvBadge;
@@ -6155,6 +6424,11 @@ export { LocalJSX as JSX };
 declare module "@stencil/core" {
     export namespace JSX {
         interface IntrinsicElements {
+            "nv-accordion": LocalJSX.NvAccordion & JSXBase.HTMLAttributes<HTMLNvAccordionElement>;
+            /**
+             * Accordion item element for nv-accordion.
+             */
+            "nv-accordion-item": LocalJSX.NvAccordionItem & JSXBase.HTMLAttributes<HTMLNvAccordionItemElement>;
             "nv-alert": LocalJSX.NvAlert & JSXBase.HTMLAttributes<HTMLNvAlertElement>;
             "nv-avatar": LocalJSX.NvAvatar & JSXBase.HTMLAttributes<HTMLNvAvatarElement>;
             "nv-badge": LocalJSX.NvBadge & JSXBase.HTMLAttributes<HTMLNvBadgeElement>;
@@ -6172,6 +6446,9 @@ declare module "@stencil/core" {
             "nv-dialogfooter": LocalJSX.NvDialogfooter & JSXBase.HTMLAttributes<HTMLNvDialogfooterElement>;
             "nv-dialogheader": LocalJSX.NvDialogheader & JSXBase.HTMLAttributes<HTMLNvDialogheaderElement>;
             "nv-fieldcheckbox": LocalJSX.NvFieldcheckbox & JSXBase.HTMLAttributes<HTMLNvFieldcheckboxElement>;
+            /**
+             * A field date component that combines an input with a calendar popover.
+             */
             "nv-fielddate": LocalJSX.NvFielddate & JSXBase.HTMLAttributes<HTMLNvFielddateElement>;
             "nv-fielddaterange": LocalJSX.NvFielddaterange & JSXBase.HTMLAttributes<HTMLNvFielddaterangeElement>;
             "nv-fielddropdown": LocalJSX.NvFielddropdown & JSXBase.HTMLAttributes<HTMLNvFielddropdownElement>;

package/dist/vscode-data.json

@@ -1,6 +1,68 @@
 {
   "version": 1.1,
   "tags": [
+    {
+      "name": "nv-accordion",
+      "description": {
+        "kind": "markdown",
+        "value": "The nv-accordion is a compact, interactive UI component that groups content into collapsible panels. Clicking a header smoothly toggles its panel open or closed, revealing or hiding the associated details. This clear, animated behavior helps users navigate large sections—like FAQs or settings—without overwhelming the page. By default, only headers display, letting users expand only the sections they need."
+      },
+      "attributes": [
+        {
+          "name": "mode",
+          "description": "Expansion mode: 'accordion' (single open) or 'multi' (multiple open)",
+          "values": [
+            {
+              "name": "accordion"
+            },
+            {
+              "name": "multi"
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "name": "nv-accordion-item",
+      "description": {
+        "kind": "markdown",
+        "value": "Accordion item element for nv-accordion."
+      },
+      "attributes": [
+        {
+          "name": "disabled",
+          "description": "Disables the item"
+        },
+        {
+          "name": "item-title",
+          "description": "Item title (displayed if header slot is absent)"
+        },
+        {
+          "name": "max-content-height",
+          "description": "Maximum content height (in px, optional). If not defined, auto height."
+        },
+        {
+          "name": "mode",
+          "description": "Parent expansion mode (accordion or multi)",
+          "values": [
+            {
+              "name": "accordion"
+            },
+            {
+              "name": "multi"
+            }
+          ]
+        },
+        {
+          "name": "open",
+          "description": "Open or closed"
+        },
+        {
+          "name": "subtitle",
+          "description": "Item subtitle (displayed if header slot is absent)"
+        }
+      ]
+    },
     {
       "name": "nv-alert",
       "description": {
@@ -513,6 +575,10 @@
         "value": "The `nv-dialog` component is a modal dialog that can be used to display content in a full-screen overlay."
       },
       "attributes": [
+        {
+          "name": "autofocus",
+          "description": "Controls whether the dialog should automatically focus the first focusable element when opened.\nWhen disabled, prevents unwanted tooltip triggers on dialog open."
+        },
         {
           "name": "click-outside",
           "description": "If true, the dialog will be closed when the backdrop is clicked."
@@ -701,7 +767,7 @@
       "name": "nv-fielddate",
       "description": {
         "kind": "markdown",
-        "value": "The nv-fielddate component provides a single-date picker interface. It includes an input with a date mask, a popover-driven calendar, and built-in accessibility features. Users can type a date directly in the input or select it from the calendar, and the component automatically keeps the two in sync. This makes nv-fielddate a flexible, user-friendly solution for date inputs in web forms, with support for custom labels, descriptions, and error messaging."
+        "value": "A field date component that combines an input with a calendar popover."
       },
       "attributes": [
         {
@@ -1507,6 +1573,10 @@
           "name": "error-description",
           "description": "A description that appears when there is an error related to the multiselect\nfield."
         },
+        {
+          "name": "filter-text",
+          "description": "The text entered by the user for filtering multiselect items."
+        },
         {
           "name": "filterable",
           "description": "Enables or disables the filtering feature for the multiselect items."
@@ -1546,10 +1616,6 @@
         {
           "name": "required",
           "description": "Marks the input field as required."
-        },
-        {
-          "name": "value",
-          "description": "Specifies the value of the input field."
         }
       ]
     },