@nova-design-system/nova-webcomponents 3.18.0 → 3.20.0

package/dist/types/components.d.ts

@@ -1183,6 +1183,18 @@ export namespace Components {
           * Applies focus to the input field as soon as the component is mounted. This is equivalent to setting the native autofocus attribute on an <input> element.
          */
         "autofocus": boolean;
+        /**
+          * Clears the filter text
+         */
+        "clearFilter": () => Promise<void>;
+        /**
+          * Determines if the component’s filtering behavior is managed externally. When set to true and filterable is enabled, the component won’t automatically filter items. Instead, you must implement your own filtering logic (e.g., server-side search or custom matching) using the filterTextChanged event.
+         */
+        "controlledFilter": boolean;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "controlled-filter"?: boolean;
         /**
           * Delay in milliseconds before the search is triggered when typing in the filter input.
           * @default 300
@@ -1230,11 +1242,6 @@ export namespace Components {
           * Allows the field to stretch and fill the entire width of its container.
          */
         "fluid": boolean;
-        /**
-          * Retrieves the current filter text entered by the user.
-          * @returns The filter text.
-         */
-        "getFilterText": () => Promise<string>;
         /**
           * Sets the ID for the input element and the for attribute of the associated label. If no ID is provided, a random one will be automatically generated to ensure unique identification, facilitating proper label association and accessibility.
          */
@@ -1260,9 +1267,13 @@ export namespace Components {
          */
         "name": string;
         /**
-          * State of the dropdown popover.
+          * When an item is selected by the user, the dropdown will continue to stay open.
          */
-        "open": boolean;
+        "openOnSelect": boolean;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "open-on-select"?: boolean;
         /**
           * List of options used to automatically generate dropdown items. This provides an alternative to using the slot manually.
           * @example options=[{  "label": "Option 1",  "value": "option1",  "selected": true, }, {  "label": "Option 2",  "value": "option2", }]
@@ -1274,8 +1285,6 @@ export namespace Components {
     value: string;
     /** Whether this option is disabled */
     disabled?: boolean;
-    /** Whether this option is pre-selected */
-    selected?: boolean;
   }[];
         /**
           * Display temporary text inside the input field to give users a hint about what to type. It's a great way to provide examples or suggestions directly in the field before they start typing. The placeholder is displayed only when the filterable option is enabled.
@@ -1289,12 +1298,21 @@ export namespace Components {
           * Marks the input field as required, ensuring that the user must fill it out before submitting the form.
          */
         "required": boolean;
+        /**
+          * Toggles the dropdown popover open state
+          * @param open - The open state to set, if null, toggles the state
+         */
+        "toggleDropdown": (open?: boolean) => Promise<void>;
         /**
           * Specifies the value of the input field, which determines the text displayed within the field. This prop is typically used in controlled components where the input's value is managed by the component's state.
          */
         "value": string;
     }
     interface NvFielddropdownitem {
+        /**
+          * If detached, the item will not be filtered out or change the dropdown's selected item. Useful for actionable items, such as Add New item, etc.
+         */
+        "detached": boolean;
         /**
           * Disables the item, preventing any user interaction.
          */
@@ -1614,7 +1632,7 @@ export namespace Components {
         /**
           * The value of the input field. It’s the text that users type in or the value that you set programmatically. This is the main way to interact with the input field, and it’s essential for creating forms that users can fill out.
          */
-        "value": number;
+        "value": number | null;
     }
     interface NvFieldpassword {
         /**
@@ -3297,6 +3315,8 @@ declare global {
     };
     interface HTMLNvFielddropdownElementEventMap {
         "valueChanged": string;
+        "filterTextChanged": string;
+        "openChanged": HTMLNvPopoverElementEventMap['openChanged'];
         "dropdownItemSelected": HTMLNvFielddropdownitemElementEventMap['dropdownItemSelected'];
     }
     interface HTMLNvFielddropdownElement extends Components.NvFielddropdown, HTMLStencilElement {
@@ -3319,6 +3339,8 @@ declare global {
     label?: string;
     /** The value associated with the item. */
     value: string;
+    /** Is the item detached? */
+    detached?: boolean;
   };
     }
     interface HTMLNvFielddropdownitemElement extends Components.NvFielddropdownitem, HTMLStencilElement {
@@ -3384,7 +3406,7 @@ declare global {
         new (): HTMLNvFieldmultiselectElement;
     };
     interface HTMLNvFieldnumberElementEventMap {
-        "valueChanged": number;
+        "valueChanged": number | null;
     }
     interface HTMLNvFieldnumberElement extends Components.NvFieldnumber, HTMLStencilElement {
         addEventListener<K extends keyof HTMLNvFieldnumberElementEventMap>(type: K, listener: (this: HTMLNvFieldnumberElement, ev: NvFieldnumberCustomEvent<HTMLNvFieldnumberElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -5060,6 +5082,14 @@ declare namespace LocalJSX {
           * Applies focus to the input field as soon as the component is mounted. This is equivalent to setting the native autofocus attribute on an <input> element.
          */
         "autofocus"?: boolean;
+        /**
+          * Determines if the component’s filtering behavior is managed externally. When set to true and filterable is enabled, the component won’t automatically filter items. Instead, you must implement your own filtering logic (e.g., server-side search or custom matching) using the filterTextChanged event.
+         */
+        "controlledFilter"?: boolean;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "controlled-filter"?: boolean;
         /**
           * Delay in milliseconds before the search is triggered when typing in the filter input.
           * @default 300
@@ -5135,15 +5165,27 @@ declare namespace LocalJSX {
           * Event emitted when an item is clicked.
          */
         "onDropdownItemSelected"?: (event: NvFielddropdownCustomEvent<HTMLNvFielddropdownitemElementEventMap['dropdownItemSelected']>) => void;
+        /**
+          * Event emitted when the filter input value changes.
+         */
+        "onFilterTextChanged"?: (event: NvFielddropdownCustomEvent<string>) => void;
+        /**
+          * Event emitted when the dropdown opened or closed.
+         */
+        "onOpenChanged"?: (event: NvFielddropdownCustomEvent<HTMLNvPopoverElementEventMap['openChanged']>) => void;
         /**
           * Emitted when the input value changes.
           * @bind value
          */
         "onValueChanged"?: (event: NvFielddropdownCustomEvent<string>) => void;
         /**
-          * State of the dropdown popover.
+          * When an item is selected by the user, the dropdown will continue to stay open.
          */
-        "open"?: boolean;
+        "openOnSelect"?: boolean;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "open-on-select"?: boolean;
         /**
           * List of options used to automatically generate dropdown items. This provides an alternative to using the slot manually.
           * @example options=[{  "label": "Option 1",  "value": "option1",  "selected": true, }, {  "label": "Option 2",  "value": "option2", }]
@@ -5155,8 +5197,6 @@ declare namespace LocalJSX {
     value: string;
     /** Whether this option is disabled */
     disabled?: boolean;
-    /** Whether this option is pre-selected */
-    selected?: boolean;
   }[];
         /**
           * Display temporary text inside the input field to give users a hint about what to type. It's a great way to provide examples or suggestions directly in the field before they start typing. The placeholder is displayed only when the filterable option is enabled.
@@ -5176,6 +5216,10 @@ declare namespace LocalJSX {
         "value"?: string;
     }
     interface NvFielddropdownitem {
+        /**
+          * If detached, the item will not be filtered out or change the dropdown's selected item. Useful for actionable items, such as Add New item, etc.
+         */
+        "detached"?: boolean;
         /**
           * Disables the item, preventing any user interaction.
          */
@@ -5192,6 +5236,8 @@ declare namespace LocalJSX {
     label?: string;
     /** The value associated with the item. */
     value: string;
+    /** Is the item detached? */
+    detached?: boolean;
   }>) => void;
         /**
           * Indicates if the item is selected.
@@ -5477,7 +5523,7 @@ declare namespace LocalJSX {
           * Emitted when the input value changes.
           * @bind value
          */
-        "onValueChanged"?: (event: NvFieldnumberCustomEvent<number>) => void;
+        "onValueChanged"?: (event: NvFieldnumberCustomEvent<number | null>) => void;
         /**
           * Display temporary text inside the input field to give users a hint about what to type. It’s a great way to provide examples or suggestions directly in the field before they start typing.
          */
@@ -5506,7 +5552,7 @@ declare namespace LocalJSX {
         /**
           * The value of the input field. It’s the text that users type in or the value that you set programmatically. This is the main way to interact with the input field, and it’s essential for creating forms that users can fill out.
          */
-        "value"?: number;
+        "value"?: number | null;
     }
     interface NvFieldpassword {
         /**

package/dist/vscode-data.json

@@ -1277,9 +1277,13 @@
           "name": "autofocus",
           "description": "Applies focus to the input field as soon as the component is mounted. This\nis equivalent to setting the native autofocus attribute on an <input>\nelement."
         },
+        {
+          "name": "controlled-filter",
+          "description": "Determines if the component’s filtering behavior is managed externally.\nWhen set to true and filterable is enabled, the component won’t\nautomatically filter items. Instead, you must implement your own filtering\nlogic (e.g., server-side search or custom matching) using the\nfilterTextChanged event."
+        },
         {
           "name": "debounce-delay",
-          "description": "Delay in milliseconds before the search is triggered when typing in the filter input."
+          "description": "Delay in milliseconds before the search is triggered when typing in the\nfilter input."
         },
         {
           "name": "description",
@@ -1326,8 +1330,8 @@
           "description": "Defines the name attribute of the input field, which is crucial for form\nsubmission. This value is used as the key in the key-value pair sent to\nthe server, representing the input's data in form submissions. It should be\nunique within the form to avoid conflicts."
         },
         {
-          "name": "open",
-          "description": "State of the dropdown popover."
+          "name": "open-on-select",
+          "description": "When an item is selected by the user, the dropdown will continue to stay\nopen."
         },
         {
           "name": "placeholder",
@@ -1354,6 +1358,10 @@
         "value": "The 'nv-fielddropdownitem' is a component designed to be used within the 'nv-fielddropdown' component. Each 'nv-fielddropdownitem' represents a single selectable option in the dropdown list. It allows customization through properties such as 'value', 'label', and 'selected' state, which defines its appearance and behavior.\n\nThe 'nv-fielddropdownitem' can display custom content, making it flexible for use cases where options may require more detailed representation beyond plain text. It is ideal for creating interactive dropdown menus, enabling users to make selections easily and clearly. This component is essential for building intuitive and user-friendly dropdown experiences."
       },
       "attributes": [
+        {
+          "name": "detached",
+          "description": "If detached, the item will not be filtered out or change the dropdown's\nselected item. Useful for actionable items, such as Add New item, etc."
+        },
         {
           "name": "disabled",
           "description": "Disables the item, preventing any user interaction."
@@ -3174,6 +3182,9 @@
             {
               "name": "alert-circle"
             },
+            {
+              "name": "alert-square-rounded"
+            },
             {
               "name": "alert-triangle"
             },
@@ -3288,6 +3299,9 @@
             {
               "name": "battery"
             },
+            {
+              "name": "bell-bolt"
+            },
             {
               "name": "bell-off"
             },
@@ -3558,6 +3572,12 @@
             {
               "name": "cloud"
             },
+            {
+              "name": "collapse-close"
+            },
+            {
+              "name": "collapse-open"
+            },
             {
               "name": "color-picker"
             },
@@ -3885,12 +3905,36 @@
             {
               "name": "gift"
             },
+            {
+              "name": "git-branch-delete"
+            },
             {
               "name": "git-branch"
             },
+            {
+              "name": "git-cherry-pick"
+            },
+            {
+              "name": "git-commit"
+            },
             {
               "name": "git-compare"
             },
+            {
+              "name": "git-fork"
+            },
+            {
+              "name": "git-merge"
+            },
+            {
+              "name": "git-pull-request-closed"
+            },
+            {
+              "name": "git-pull-request-draft"
+            },
+            {
+              "name": "git-pull-request"
+            },
             {
               "name": "gps"
             },
@@ -4599,6 +4643,9 @@
             {
               "name": "volume"
             },
+            {
+              "name": "wallet"
+            },
             {
               "name": "wand"
             },