@nova-design-system/nova-webcomponents 3.0.0 → 3.2.0

package/dist/types/components.d.ts

@@ -5,18 +5,14 @@
  * It contains typing information for all components that exist in this project.
  */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
-import { ButtonEmphasis, ButtonSize, ButtonType, DeprecatedSemanticColors, FeedbackColors, IconButtonShape, LabelPlacement, LoaderColors, SemanticSizes, TextInputAutocomplete } from "./utils/constants";
-import { DateRange } from "./interfaces/dateRange";
+import { ButtonEmphasis, ButtonSize, ButtonType, DeprecatedSemanticColors, FeedbackColors, GlobalFilterPosition, IconButtonShape, LabelPlacement, LoaderColors, SemanticSizes, TextInputAutocomplete } from "./utils/constants";
 import { Column } from "./interfaces/Column";
-import { ActionEvent } from "./interfaces/actionEvent";
 import { Element } from "./stencil-public-runtime";
 import { IconName } from "./components/nv-icon/nv-icons";
 import { Placement } from "@floating-ui/dom";
 import { ColumnConfig } from "./interfaces/ColumnConfig";
-export { ButtonEmphasis, ButtonSize, ButtonType, DeprecatedSemanticColors, FeedbackColors, IconButtonShape, LabelPlacement, LoaderColors, SemanticSizes, TextInputAutocomplete } from "./utils/constants";
-export { DateRange } from "./interfaces/dateRange";
+export { ButtonEmphasis, ButtonSize, ButtonType, DeprecatedSemanticColors, FeedbackColors, GlobalFilterPosition, IconButtonShape, LabelPlacement, LoaderColors, SemanticSizes, TextInputAutocomplete } from "./utils/constants";
 export { Column } from "./interfaces/Column";
-export { ActionEvent } from "./interfaces/actionEvent";
 export { Element } from "./stencil-public-runtime";
 export { IconName } from "./components/nv-icon/nv-icons";
 export { Placement } from "@floating-ui/dom";
@@ -128,7 +124,7 @@ export namespace Components {
     }
     interface NvBadge {
         /**
-          * The color of the badge. Use a string between 1 to 10
+          * The color of the badge. deprecated Use status values or named colors instead. Use a string between 1 to 10 or one of the status values: error, information, neutral, success, warning or one of the color names: amber, orange, turquoise, crimson, lime
          */
         "color"?: string;
         /**
@@ -158,6 +154,14 @@ export namespace Components {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "icon-location"?: 'left' | 'right';
+        /**
+          * When true, the badge will only display an icon without label. The label will be visually hidden but still accessible for screen readers.
+         */
+        "isIconOnly"?: boolean;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "is-icon-only"?: boolean;
         /**
           * Main content of the badge.
          */
@@ -247,13 +251,8 @@ export namespace Components {
         "date-format"?: string;
         /**
           * Disabled dates (ISO string array)
-          * @default '[]'
-         */
-        "disabledDates": string;
-        /**
-         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
-        "disabled-dates"?: string;
+        "disabledDates": Array<string>;
         /**
           * First day of the week (0 = Sunday, 1 = Monday, etc.)
           * @default 0
@@ -288,11 +287,12 @@ export namespace Components {
         /**
           * Selected date range format: { start: ISO string, end: ISO string } ex: { start: "2025-03-15", end: "2025-03-20" }
          */
-        "rangeValue": string;
-        /**
-         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
-         */
-        "range-value"?: string;
+        "rangeValue": {
+    /** ISO string for start date */
+    start: string;
+    /** ISO string for end date */
+    end: string;
+  };
         /**
           * Selection type (single date or date range)
           * @default 'single'
@@ -303,10 +303,16 @@ export namespace Components {
          */
         "selection-type"?: 'single' | 'range';
         /**
-          * Custom actions to display in the footer JSON array of objects with the following properties: - label: string - onClick: function
-          * @default '[]'
+          * Custom actions to display in the footer
          */
-        "shortcuts": string;
+        "shortcuts": {
+    /** Label of the shortcut */
+    label: string;
+    /** Selected date value for single selection mode */
+    singleValue?: string;
+    /** Date range values for range selection mode */
+    rangeValue?: HTMLNvCalendarElement['rangeValue'];
+  }[];
         /**
           * Footer placement
           * @default 'bottom'
@@ -318,7 +324,6 @@ export namespace Components {
         "shortcuts-placement"?: 'bottom' | 'left' | 'right';
         /**
           * Show action buttons
-          * @default false
          */
         "showActions": boolean;
         /**
@@ -327,7 +332,6 @@ export namespace Components {
         "show-actions"?: boolean;
         /**
           * Show week numbers
-          * @default true
          */
         "showWeekNumbers": boolean;
         /**
@@ -351,8 +355,6 @@ export namespace Components {
     }
     /**
      * A flexible data grid component powered by `@tanstack/table-core`.
-     * @deprecated [EXPERIMENTAL]
-     * @experimental - This component is still under development and is not ready for use.
      */
     interface NvDatagrid {
         /**
@@ -370,30 +372,12 @@ export namespace Components {
           * @default []
          */
         "columns": Column[];
-        /**
-          * The columns to display in the data grid. It can be passed directly as an array of objects or as a JSON string. If both `columns` and `columnsJson` are provided, `columns` takes precedence.
-          * @example `[{"header":"Name","accessor":"name"},{"header":"Age","accessor":"age"},{"header":"Email","accessor":"email"}]`
-         */
-        "columnsJson"?: string;
-        /**
-         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
-         */
-        "columns-json"?: string;
         /**
           * The data to display in the data grid.
           * @example [{ "name": "Alice", "age": 25 }, { "name": "Bob", "age": 30 }]
           * @default []
          */
         "data": any[];
-        /**
-          * The data to display in the data grid. It can be passed directly as an array of objects or as a JSON string. If both `data` and `dataJson` are provided, `data` takes precedence.
-          * @example `[{ "name": "Alice", "age": 25 }, { "name": "Bob", "age": 30 }]`
-         */
-        "dataJson"?: string;
-        /**
-         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
-         */
-        "data-json"?: string;
         /**
           * Whether to enable global filtering for the data grid. This allows users to search across all columns for a specific value. The search is case-insensitive and supports partial matches. It use string.includes() to match the search term.
           * @default false
@@ -412,6 +396,23 @@ export namespace Components {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "enable-pagination"?: boolean;
+        /**
+          * Whether to enable row selection for the data grid.
+         */
+        "enableRowSelection": boolean;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "enable-row-selection"?: boolean;
+        /**
+          * Whether to enable sorting for the data grid.
+          * @default false
+         */
+        "enableSorting": boolean;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "enable-sorting"?: boolean;
         /**
           * Fallback value to be displayed when data is not available
           * @default 'N/A'
@@ -421,6 +422,14 @@ export namespace Components {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "fallback-value"?: string;
+        /**
+          * Position the global filter input field
+         */
+        "globalFilterPosition": `${GlobalFilterPosition}`;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "global-filter-position"?: `${GlobalFilterPosition}`;
         /**
           * The message to display when there are no columns or data available.
           * @default 'No data or columns available to display.'
@@ -440,7 +449,7 @@ export namespace Components {
          */
         "no-data-message"?: string;
         /**
-          * The number of rows to display per page.
+          * The number of rows to display per page. If the number is not present in the property pageSizes it takes the first of the list.
           * @default 10
          */
         "pageSize": number;
@@ -459,6 +468,10 @@ export namespace Components {
           * Defines the accessor of the column.
          */
         "accessor": string;
+        /**
+          * Defines the group header of the column.
+         */
+        "group"?: string;
         /**
           * Defines the header of the column.
          */
@@ -702,13 +715,8 @@ export namespace Components {
         "disabled": boolean;
         /**
           * Disabled dates ISO string array
-          * @default '[]'
          */
-        "disabledDates": string;
-        /**
-         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
-         */
-        "disabled-dates"?: string;
+        "disabledDates": Array<string>;
         /**
           * Indicates an error state.
          */
@@ -730,6 +738,10 @@ export namespace Components {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "first-day-of-week"?: number;
+        /**
+          * Allows the field to stretch and fill the entire width of its container.
+         */
+        "fluid": boolean;
         /**
           * 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.
          */
@@ -781,10 +793,9 @@ export namespace Components {
          */
         "required": boolean;
         /**
-          * Custom actions to display in the footer JSON array of objects with the following properties: - label: string - onClick: function
-          * @default '[]'
+          * Custom actions to display in the footer
          */
-        "shortcuts": string;
+        "shortcuts": HTMLNvCalendarElement['shortcuts'];
         /**
           * Footer placement
           * @default 'bottom'
@@ -822,6 +833,10 @@ export namespace Components {
         "value": string;
     }
     interface NvFielddaterange {
+        /**
+          * Autofocus the start input when the component is mounted.
+         */
+        "autofocus": boolean;
         /**
           * Date format ex: YYYY-MM-DD, DD-MM-YYYY, etc.
           * @default 'YYYY-MM-DD'
@@ -841,13 +856,8 @@ export namespace Components {
         "disabled": boolean;
         /**
           * Disabled dates ISO string array
-          * @default '[]'
          */
-        "disabledDates": string;
-        /**
-         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
-         */
-        "disabled-dates"?: string;
+        "disabledDates": Array<string>;
         /**
           * Sets the ID for the end input element and the for attribute of the associated label. If no ID is provided, a random one will be automatically generated.
          */
@@ -893,6 +903,10 @@ export namespace Components {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "first-day-of-week"?: number;
+        /**
+          * Allows the field to stretch and fill the entire width of its container.
+         */
+        "fluid": boolean;
         /**
           * Text displayed as label. A slot label can override this prop.
          */
@@ -928,10 +942,9 @@ export namespace Components {
          */
         "required": boolean;
         /**
-          * Custom actions to display in the footer JSON array of objects with the following properties: - label: string - onClick: function
-          * @default '[]'
+          * Custom actions to display in the footer
          */
-        "shortcuts": string;
+        "shortcuts": HTMLNvCalendarElement['shortcuts'];
         /**
           * Footer placement
           * @default 'bottom'
@@ -941,14 +954,6 @@ export namespace Components {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "shortcuts-placement"?: 'bottom' | 'left' | 'right';
-        /**
-          * Autofocus the start input when the component is mounted.
-         */
-        "shouldAutoFocus": boolean;
-        /**
-         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
-         */
-        "should-auto-focus"?: boolean;
         /**
           * Show action buttons
           * @default false
@@ -960,7 +965,6 @@ export namespace Components {
         "show-actions"?: boolean;
         /**
           * Show week numbers
-          * @default true
          */
         "showWeekNumbers": boolean;
         /**
@@ -1009,6 +1013,15 @@ 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;
+        /**
+          * Delay in milliseconds before the search is triggered when typing in the filter input.
+          * @default 300
+         */
+        "debounceDelay": number;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "debounce-delay"?: number;
         /**
           * Add helpful hints or extra information under the text input field. This is where you can clarify what users should enter or provide additional instructions, making the form easier to fill out correctly.
          */
@@ -1043,6 +1056,10 @@ export namespace Components {
           * Enables or disables the filtering feature for the dropdown items.
          */
         "filterable": boolean;
+        /**
+          * 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.
@@ -1060,6 +1077,14 @@ export namespace Components {
           * Lets you define the text that explains what users should enter in the text input field. It's a crucial element for making forms clear and user-friendly.
          */
         "label": string;
+        /**
+          * Defines the maximum height of the multiselect list when open.
+         */
+        "maxHeight": string;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "max-height"?: string;
         /**
           * Defines the name attribute of the input field, which is crucial for form submission. This value is used as the key in the key-value pair sent to the server, representing the input's data in form submissions. It should be unique within the form to avoid conflicts.
          */
@@ -1145,7 +1170,7 @@ export namespace Components {
     }
     interface NvFieldmultiselect {
         /**
-          * The autocomplete prop for faster input filling.
+          * The autocomplete prop helps users fill out the input field faster by suggesting entries they've used before, like their email or address. You can turn it on to make forms more convenient or off to ensure users always type in fresh data.
          */
         "autocomplete": `${TextInputAutocomplete}`;
         /**
@@ -1203,6 +1228,10 @@ export namespace Components {
           * Enables or disables the filtering feature for the multiselect items.
          */
         "filterable": boolean;
+        /**
+          * 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.
@@ -1307,6 +1336,10 @@ export namespace Components {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "error-description"?: string;
+        /**
+          * Allows the field to stretch and fill the entire width of its container.
+         */
+        "fluid": boolean;
         /**
           * 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.
          */
@@ -1397,6 +1430,10 @@ export namespace Components {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "error-description"?: string;
+        /**
+          * Allows the field to stretch and fill the entire width of its container.
+         */
+        "fluid": boolean;
         /**
           * Hide the button to show/hide the password.
          */
@@ -1576,6 +1613,10 @@ export namespace Components {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "error-description"?: string;
+        /**
+          * Allows the field to stretch and fill the entire width of its container.
+         */
+        "fluid": boolean;
         /**
           * Sets the ID for the select 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.
          */
@@ -1627,6 +1668,159 @@ export namespace Components {
          */
         "value": string;
     }
+    /**
+     * @deprecated [EXPERIMENTAL]
+     * @experimental This component is still in development and subject to change in future releases.
+     */
+    interface NvFieldslider {
+        /**
+          * Add helpful hints or extra information under the slider. This is where you can clarify what users should enter or provide additional instructions, making the form easier to fill out correctly.
+         */
+        "description": string;
+        /**
+          * Disables user interaction with the slider and its associated input fields.
+         */
+        "disabled": boolean;
+        /**
+          * Sets the ID for the end input element and the for attribute of the associated label. If no ID is provided, a random one will be automatically generated.
+         */
+        "endInputId": string;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "end-input-id"?: string;
+        /**
+          * Name attribute for the end value input when using range mode. If not provided, the name attribute will be used with '-end' appended.
+         */
+        "endName": string;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "end-name"?: string;
+        /**
+          * Alters the slider's appearance to indicate an error, helping users identify fields that need correction.
+          * @validator error
+         */
+        "error": boolean;
+        /**
+          * A description that appears when there is an error related to the slider.
+          * @validator message
+         */
+        "errorDescription": string;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "error-description"?: string;
+        /**
+          * Allows the field to stretch and fill the entire width of its container.
+         */
+        "fluid": boolean;
+        /**
+          * Enables an optional numeric input field alongside the slider, allowing users to type a value directly instead of—or in addition to—using the slider handle.
+         */
+        "hasField": boolean;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "has-field"?: boolean;
+        /**
+          * Keeps the interface clean by removing visible labels, but still announces the label to screen readers so users relying on assistive tech aren't left guessing.
+         */
+        "hideLabel": boolean;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "hide-label"?: boolean;
+        /**
+          * Provides a textual description of the slider's function, helping users understand what the control adjusts. It also supports accessibility by serving as the accessible name for the component.
+         */
+        "label": string;
+        /**
+          * Use this to automatically show a label, like “$” or “kg,” after the value on the slider’s tooltip or input, helping users better understand the number.
+         */
+        "labelAfterValue": string;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "label-after-value"?: string;
+        /**
+          * Use this to automatically show a label, like “~” for approximate values, before the slider’s value in the tooltip or input, giving users quick context about the number.
+         */
+        "labelBeforeValue": string;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "label-before-value"?: string;
+        /**
+          * Defines the maximum allowed value for the slider. The thumb cannot move above this value, and manual input is also constrained accordingly.
+         */
+        "max": number;
+        /**
+          * Defines the minimum allowed value for the slider. The thumb cannot move below this value, and manual input is also constrained accordingly.
+         */
+        "min": number;
+        /**
+          * Name attribute for the form input element. Required for form submission. For range sliders, this will be used for the start value input and add -end to the end input name.
+         */
+        "name": string;
+        /**
+          * Allows the slider to display two thumbs, enabling users to select a continuous range between a minimum and maximum value. Ideal for use cases like filtering by price or time.
+         */
+        "range": boolean;
+        /**
+          * Makes the slider and input non-editable while keeping them focusable and included in form submissions.
+         */
+        "readonly": boolean;
+        /**
+          * Controls the visibility of tick marks on the slider. When enabled, all visual ticks that indicate step points along the track are shown. If custom ticks are provided, they are always shown regardless of this setting.
+         */
+        "showTicks": boolean;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "show-ticks"?: boolean;
+        /**
+          * Controls whether the slider handle should visually snap to step values during dragging. When false, the handle can be positioned at any point along the track while dragging, but the actual value will still snap to the nearest step value. When true, the handle will visually snap to the nearest step value during dragging.
+         */
+        "snap": boolean;
+        /**
+          * When true and custom ticks are provided, the slider will snap to the nearest tick value during dragging, instead of using the step value. This is useful when you have custom ticks at specific values that don't align with regular step intervals.
+         */
+        "snapTicks": boolean;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "snap-ticks"?: boolean;
+        /**
+          * Sets the ID for the start input element and the for attribute of the associated label. If no ID is provided, a random one will be automatically generated.
+         */
+        "startInputId": string;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "start-input-id"?: string;
+        /**
+          * Defines the interval between selectable values on the slider. Controls how much the value increases or decreases with each keyboard interaction, drag movement, or direct input.
+         */
+        "step": number;
+        /**
+          * Changes the slider's appearance to indicate successful input or validation.
+         */
+        "success": boolean;
+        /**
+          * Allows you to specify custom tick marks at specific values along the slider. Each tick can optionally display a label to provide additional context or guidance for users.
+         */
+        "ticks": {
+    /** The numeric value of the tick */
+    value: number;
+    /** The label of the tick */
+    label?: string;
+  }[];
+        /**
+          * Numeric value of the slider as a string, if range mode is on, the values will be a comma-separated string.
+         */
+        "value": string;
+    }
     interface NvFieldtext {
         /**
           * The autocomplete prop helps users fill out the input field faster by suggesting entries they’ve used before, like their email or address. You can turn it on to make forms more convenient or off to ensure users always type in fresh data.
@@ -1658,6 +1852,10 @@ export namespace Components {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "error-description"?: string;
+        /**
+          * Allows the field to stretch and fill the entire width of its container.
+         */
+        "fluid": boolean;
         /**
           * 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.
          */
@@ -1765,6 +1963,10 @@ export namespace Components {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "error-description"?: string;
+        /**
+          * Allows the field to stretch and fill the entire width of its container.
+         */
+        "fluid": boolean;
         /**
           * 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.
          */
@@ -2196,6 +2398,10 @@ export namespace Components {
          */
         "vertical": boolean;
     }
+    /**
+     * @deprecated [EXPERIMENTAL]
+     * @experimental - This component is used as a base for the nv-datagrid component. Do not use it directly.
+     */
     interface NvTable {
         /**
           * Configuration of the columns of the table
@@ -2399,6 +2605,10 @@ export interface NvFieldselectCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLNvFieldselectElement;
 }
+export interface NvFieldsliderCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLNvFieldsliderElement;
+}
 export interface NvFieldtextCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLNvFieldtextElement;
@@ -2435,7 +2645,7 @@ declare global {
     interface HTMLNvAlertElementEventMap {
         "hiddenChanged": boolean;
         "hiddenChangedComplete": boolean;
-        "closeClicked": MouseEvent;
+        "closeClicked": void;
     }
     interface HTMLNvAlertElement extends Components.NvAlert, HTMLStencilElement {
         addEventListener<K extends keyof HTMLNvAlertElementEventMap>(type: K, listener: (this: HTMLNvAlertElement, ev: NvAlertCustomEvent<HTMLNvAlertElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -2458,7 +2668,7 @@ declare global {
         new (): HTMLNvAvatarElement;
     };
     interface HTMLNvBadgeElementEventMap {
-        "closeClicked": MouseEvent;
+        "closeClicked": void;
         "hiddenChanged": boolean;
         "hiddenChangedComplete": boolean;
     }
@@ -2496,7 +2706,7 @@ declare global {
     };
     interface HTMLNvCalendarElementEventMap {
         "singleDateChange": string;
-        "rangeDateChange": DateRange;
+        "rangeDateChange": HTMLNvCalendarElement['rangeValue'];
     }
     interface HTMLNvCalendarElement extends Components.NvCalendar, HTMLStencilElement {
         addEventListener<K extends keyof HTMLNvCalendarElementEventMap>(type: K, listener: (this: HTMLNvCalendarElement, ev: NvCalendarCustomEvent<HTMLNvCalendarElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -2519,12 +2729,21 @@ declare global {
         new (): HTMLNvColElement;
     };
     interface HTMLNvDatagridElementEventMap {
-        "action": ActionEvent;
+        "action": {
+    /**
+     * Key action to be performed
+     */
+    keyAction: string;
+
+    /**
+     * Details of the action to be performed
+     */
+    details: any;
+  };
+        "selectedRows": any[];
     }
     /**
      * A flexible data grid component powered by `@tanstack/table-core`.
-     * @deprecated [EXPERIMENTAL]
-     * @experimental - This component is still under development and is not ready for use.
      */
     interface HTMLNvDatagridElement extends Components.NvDatagrid, HTMLStencilElement {
         addEventListener<K extends keyof HTMLNvDatagridElementEventMap>(type: K, listener: (this: HTMLNvDatagridElement, ev: NvDatagridCustomEvent<HTMLNvDatagridElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -2627,7 +2846,7 @@ declare global {
         new (): HTMLNvFielddateElement;
     };
     interface HTMLNvFielddaterangeElementEventMap {
-        "dateRangeChange": DateRange;
+        "dateRangeChange": HTMLNvCalendarElementEventMap['rangeDateChange'];
     }
     interface HTMLNvFielddaterangeElement extends Components.NvFielddaterange, HTMLStencilElement {
         addEventListener<K extends keyof HTMLNvFielddaterangeElementEventMap>(type: K, listener: (this: HTMLNvFielddaterangeElement, ev: NvFielddaterangeCustomEvent<HTMLNvFielddaterangeElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -2799,6 +3018,27 @@ declare global {
         prototype: HTMLNvFieldselectElement;
         new (): HTMLNvFieldselectElement;
     };
+    interface HTMLNvFieldsliderElementEventMap {
+        "valueChanged": string;
+    }
+    /**
+     * @deprecated [EXPERIMENTAL]
+     * @experimental This component is still in development and subject to change in future releases.
+     */
+    interface HTMLNvFieldsliderElement extends Components.NvFieldslider, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLNvFieldsliderElementEventMap>(type: K, listener: (this: HTMLNvFieldsliderElement, ev: NvFieldsliderCustomEvent<HTMLNvFieldsliderElementEventMap[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 HTMLNvFieldsliderElementEventMap>(type: K, listener: (this: HTMLNvFieldsliderElement, ev: NvFieldsliderCustomEvent<HTMLNvFieldsliderElementEventMap[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 HTMLNvFieldsliderElement: {
+        prototype: HTMLNvFieldsliderElement;
+        new (): HTMLNvFieldsliderElement;
+    };
     interface HTMLNvFieldtextElementEventMap {
         "valueChanged": string;
     }
@@ -2948,8 +3188,22 @@ declare global {
         new (): HTMLNvStackElement;
     };
     interface HTMLNvTableElementEventMap {
-        "action": ActionEvent;
+        "action": {
+    /**
+     * Key action to be performed
+     */
+    keyAction: string;
+
+    /**
+     * Details of the action to be performed
+     */
+    details: any;
+  };
     }
+    /**
+     * @deprecated [EXPERIMENTAL]
+     * @experimental - This component is used as a base for the nv-datagrid component. Do not use it directly.
+     */
     interface HTMLNvTableElement extends Components.NvTable, HTMLStencilElement {
         addEventListener<K extends keyof HTMLNvTableElementEventMap>(type: K, listener: (this: HTMLNvTableElement, ev: NvTableCustomEvent<HTMLNvTableElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
         addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
@@ -3018,6 +3272,7 @@ declare global {
         "nv-fieldpassword": HTMLNvFieldpasswordElement;
         "nv-fieldradio": HTMLNvFieldradioElement;
         "nv-fieldselect": HTMLNvFieldselectElement;
+        "nv-fieldslider": HTMLNvFieldsliderElement;
         "nv-fieldtext": HTMLNvFieldtextElement;
         "nv-fieldtextarea": HTMLNvFieldtextareaElement;
         "nv-fieldtime": HTMLNvFieldtimeElement;
@@ -3077,7 +3332,7 @@ declare namespace LocalJSX {
         /**
           * Emitted when the close button is clicked.
          */
-        "onCloseClicked"?: (event: NvAlertCustomEvent<MouseEvent>) => void;
+        "onCloseClicked"?: (event: NvAlertCustomEvent<void>) => void;
         /**
           * Emits when the 'hidden' prop changes, reflecting a change in visibility. Passes hidden value to the detail.
           * @bind hidden
@@ -3155,7 +3410,7 @@ declare namespace LocalJSX {
     }
     interface NvBadge {
         /**
-          * The color of the badge. Use a string between 1 to 10
+          * The color of the badge. deprecated Use status values or named colors instead. Use a string between 1 to 10 or one of the status values: error, information, neutral, success, warning or one of the color names: amber, orange, turquoise, crimson, lime
          */
         "color"?: string;
         /**
@@ -3185,6 +3440,14 @@ declare namespace LocalJSX {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "icon-location"?: 'left' | 'right';
+        /**
+          * When true, the badge will only display an icon without label. The label will be visually hidden but still accessible for screen readers.
+         */
+        "isIconOnly"?: boolean;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "is-icon-only"?: boolean;
         /**
           * Main content of the badge.
          */
@@ -3200,7 +3463,7 @@ declare namespace LocalJSX {
         /**
           * Emitted when the badge is dismissed.
          */
-        "onCloseClicked"?: (event: NvBadgeCustomEvent<MouseEvent>) => void;
+        "onCloseClicked"?: (event: NvBadgeCustomEvent<void>) => void;
         /**
           * Emits when the 'hidden' prop changes, reflecting a change in visibility. Passes hidden value to the detail.
          */
@@ -3286,13 +3549,8 @@ declare namespace LocalJSX {
         "date-format"?: string;
         /**
           * Disabled dates (ISO string array)
-          * @default '[]'
          */
-        "disabledDates"?: string;
-        /**
-         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
-         */
-        "disabled-dates"?: string;
+        "disabledDates"?: Array<string>;
         /**
           * First day of the week (0 = Sunday, 1 = Monday, etc.)
           * @default 0
@@ -3327,7 +3585,7 @@ declare namespace LocalJSX {
         /**
           * Emitted when a date range is selected
          */
-        "onRangeDateChange"?: (event: NvCalendarCustomEvent<DateRange>) => void;
+        "onRangeDateChange"?: (event: NvCalendarCustomEvent<HTMLNvCalendarElement['rangeValue']>) => void;
         /**
           * Emitted when a single date is selected
          */
@@ -3335,11 +3593,12 @@ declare namespace LocalJSX {
         /**
           * Selected date range format: { start: ISO string, end: ISO string } ex: { start: "2025-03-15", end: "2025-03-20" }
          */
-        "rangeValue"?: string;
-        /**
-         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
-         */
-        "range-value"?: string;
+        "rangeValue"?: {
+    /** ISO string for start date */
+    start: string;
+    /** ISO string for end date */
+    end: string;
+  };
         /**
           * Selection type (single date or date range)
           * @default 'single'
@@ -3350,10 +3609,16 @@ declare namespace LocalJSX {
          */
         "selection-type"?: 'single' | 'range';
         /**
-          * Custom actions to display in the footer JSON array of objects with the following properties: - label: string - onClick: function
-          * @default '[]'
+          * Custom actions to display in the footer
          */
-        "shortcuts"?: string;
+        "shortcuts"?: {
+    /** Label of the shortcut */
+    label: string;
+    /** Selected date value for single selection mode */
+    singleValue?: string;
+    /** Date range values for range selection mode */
+    rangeValue?: HTMLNvCalendarElement['rangeValue'];
+  }[];
         /**
           * Footer placement
           * @default 'bottom'
@@ -3365,7 +3630,6 @@ declare namespace LocalJSX {
         "shortcuts-placement"?: 'bottom' | 'left' | 'right';
         /**
           * Show action buttons
-          * @default false
          */
         "showActions"?: boolean;
         /**
@@ -3374,7 +3638,6 @@ declare namespace LocalJSX {
         "show-actions"?: boolean;
         /**
           * Show week numbers
-          * @default true
          */
         "showWeekNumbers"?: boolean;
         /**
@@ -3398,8 +3661,6 @@ declare namespace LocalJSX {
     }
     /**
      * A flexible data grid component powered by `@tanstack/table-core`.
-     * @deprecated [EXPERIMENTAL]
-     * @experimental - This component is still under development and is not ready for use.
      */
     interface NvDatagrid {
         /**
@@ -3417,30 +3678,12 @@ declare namespace LocalJSX {
           * @default []
          */
         "columns"?: Column[];
-        /**
-          * The columns to display in the data grid. It can be passed directly as an array of objects or as a JSON string. If both `columns` and `columnsJson` are provided, `columns` takes precedence.
-          * @example `[{"header":"Name","accessor":"name"},{"header":"Age","accessor":"age"},{"header":"Email","accessor":"email"}]`
-         */
-        "columnsJson"?: string;
-        /**
-         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
-         */
-        "columns-json"?: string;
         /**
           * The data to display in the data grid.
           * @example [{ "name": "Alice", "age": 25 }, { "name": "Bob", "age": 30 }]
           * @default []
          */
         "data"?: any[];
-        /**
-          * The data to display in the data grid. It can be passed directly as an array of objects or as a JSON string. If both `data` and `dataJson` are provided, `data` takes precedence.
-          * @example `[{ "name": "Alice", "age": 25 }, { "name": "Bob", "age": 30 }]`
-         */
-        "dataJson"?: string;
-        /**
-         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
-         */
-        "data-json"?: string;
         /**
           * Whether to enable global filtering for the data grid. This allows users to search across all columns for a specific value. The search is case-insensitive and supports partial matches. It use string.includes() to match the search term.
           * @default false
@@ -3459,6 +3702,23 @@ declare namespace LocalJSX {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "enable-pagination"?: boolean;
+        /**
+          * Whether to enable row selection for the data grid.
+         */
+        "enableRowSelection"?: boolean;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "enable-row-selection"?: boolean;
+        /**
+          * Whether to enable sorting for the data grid.
+          * @default false
+         */
+        "enableSorting"?: boolean;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "enable-sorting"?: boolean;
         /**
           * Fallback value to be displayed when data is not available
           * @default 'N/A'
@@ -3468,6 +3728,14 @@ declare namespace LocalJSX {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "fallback-value"?: string;
+        /**
+          * Position the global filter input field
+         */
+        "globalFilterPosition"?: `${GlobalFilterPosition}`;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "global-filter-position"?: `${GlobalFilterPosition}`;
         /**
           * The message to display when there are no columns or data available.
           * @default 'No data or columns available to display.'
@@ -3489,9 +3757,23 @@ declare namespace LocalJSX {
         /**
           * Emitted when an action is triggered on a cell.
          */
-        "onAction"?: (event: NvDatagridCustomEvent<ActionEvent>) => void;
+        "onAction"?: (event: NvDatagridCustomEvent<{
+    /**
+     * Key action to be performed
+     */
+    keyAction: string;
+
+    /**
+     * Details of the action to be performed
+     */
+    details: any;
+  }>) => void;
+        /**
+          * Emitted when the selection of the rows are changed.
+         */
+        "onSelectedRows"?: (event: NvDatagridCustomEvent<any[]>) => void;
         /**
-          * The number of rows to display per page.
+          * The number of rows to display per page. If the number is not present in the property pageSizes it takes the first of the list.
           * @default 10
          */
         "pageSize"?: number;
@@ -3510,6 +3792,10 @@ declare namespace LocalJSX {
           * Defines the accessor of the column.
          */
         "accessor": string;
+        /**
+          * Defines the group header of the column.
+         */
+        "group"?: string;
         /**
           * Defines the header of the column.
          */
@@ -3760,13 +4046,8 @@ declare namespace LocalJSX {
         "disabled"?: boolean;
         /**
           * Disabled dates ISO string array
-          * @default '[]'
          */
-        "disabledDates"?: string;
-        /**
-         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
-         */
-        "disabled-dates"?: string;
+        "disabledDates"?: Array<string>;
         /**
           * Indicates an error state.
          */
@@ -3788,6 +4069,10 @@ declare namespace LocalJSX {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "first-day-of-week"?: number;
+        /**
+          * Allows the field to stretch and fill the entire width of its container.
+         */
+        "fluid"?: boolean;
         /**
           * 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.
          */
@@ -3848,10 +4133,9 @@ declare namespace LocalJSX {
          */
         "required"?: boolean;
         /**
-          * Custom actions to display in the footer JSON array of objects with the following properties: - label: string - onClick: function
-          * @default '[]'
+          * Custom actions to display in the footer
          */
-        "shortcuts"?: string;
+        "shortcuts"?: HTMLNvCalendarElement['shortcuts'];
         /**
           * Footer placement
           * @default 'bottom'
@@ -3889,6 +4173,10 @@ declare namespace LocalJSX {
         "value"?: string;
     }
     interface NvFielddaterange {
+        /**
+          * Autofocus the start input when the component is mounted.
+         */
+        "autofocus"?: boolean;
         /**
           * Date format ex: YYYY-MM-DD, DD-MM-YYYY, etc.
           * @default 'YYYY-MM-DD'
@@ -3908,13 +4196,8 @@ declare namespace LocalJSX {
         "disabled"?: boolean;
         /**
           * Disabled dates ISO string array
-          * @default '[]'
-         */
-        "disabledDates"?: string;
-        /**
-         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
-        "disabled-dates"?: string;
+        "disabledDates"?: Array<string>;
         /**
           * Sets the ID for the end input element and the for attribute of the associated label. If no ID is provided, a random one will be automatically generated.
          */
@@ -3960,6 +4243,10 @@ declare namespace LocalJSX {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "first-day-of-week"?: number;
+        /**
+          * Allows the field to stretch and fill the entire width of its container.
+         */
+        "fluid"?: boolean;
         /**
           * Text displayed as label. A slot label can override this prop.
          */
@@ -3989,7 +4276,7 @@ declare namespace LocalJSX {
         /**
           * Emits an event when the date range changes.
          */
-        "onDateRangeChange"?: (event: NvFielddaterangeCustomEvent<DateRange>) => void;
+        "onDateRangeChange"?: (event: NvFielddaterangeCustomEvent<HTMLNvCalendarElementEventMap['rangeDateChange']>) => void;
         /**
           * Sets both input fields as read-only.
          */
@@ -3999,10 +4286,9 @@ declare namespace LocalJSX {
          */
         "required"?: boolean;
         /**
-          * Custom actions to display in the footer JSON array of objects with the following properties: - label: string - onClick: function
-          * @default '[]'
+          * Custom actions to display in the footer
          */
-        "shortcuts"?: string;
+        "shortcuts"?: HTMLNvCalendarElement['shortcuts'];
         /**
           * Footer placement
           * @default 'bottom'
@@ -4012,14 +4298,6 @@ declare namespace LocalJSX {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "shortcuts-placement"?: 'bottom' | 'left' | 'right';
-        /**
-          * Autofocus the start input when the component is mounted.
-         */
-        "shouldAutoFocus"?: boolean;
-        /**
-         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
-         */
-        "should-auto-focus"?: boolean;
         /**
           * Show action buttons
           * @default false
@@ -4031,7 +4309,6 @@ declare namespace LocalJSX {
         "show-actions"?: boolean;
         /**
           * Show week numbers
-          * @default true
          */
         "showWeekNumbers"?: boolean;
         /**
@@ -4080,6 +4357,15 @@ 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;
+        /**
+          * Delay in milliseconds before the search is triggered when typing in the filter input.
+          * @default 300
+         */
+        "debounceDelay"?: number;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "debounce-delay"?: number;
         /**
           * Add helpful hints or extra information under the text input field. This is where you can clarify what users should enter or provide additional instructions, making the form easier to fill out correctly.
          */
@@ -4114,6 +4400,10 @@ declare namespace LocalJSX {
           * Enables or disables the filtering feature for the dropdown items.
          */
         "filterable"?: boolean;
+        /**
+          * Allows the field to stretch and fill the entire width of its container.
+         */
+        "fluid"?: boolean;
         /**
           * 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.
          */
@@ -4126,6 +4416,14 @@ declare namespace LocalJSX {
           * Lets you define the text that explains what users should enter in the text input field. It's a crucial element for making forms clear and user-friendly.
          */
         "label"?: string;
+        /**
+          * Defines the maximum height of the multiselect list when open.
+         */
+        "maxHeight"?: string;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "max-height"?: string;
         /**
           * Defines the name attribute of the input field, which is crucial for form submission. This value is used as the key in the key-value pair sent to the server, representing the input's data in form submissions. It should be unique within the form to avoid conflicts.
          */
@@ -4246,7 +4544,7 @@ declare namespace LocalJSX {
     }
     interface NvFieldmultiselect {
         /**
-          * The autocomplete prop for faster input filling.
+          * The autocomplete prop helps users fill out the input field faster by suggesting entries they've used before, like their email or address. You can turn it on to make forms more convenient or off to ensure users always type in fresh data.
          */
         "autocomplete"?: `${TextInputAutocomplete}`;
         /**
@@ -4304,6 +4602,10 @@ declare namespace LocalJSX {
           * Enables or disables the filtering feature for the multiselect items.
          */
         "filterable"?: boolean;
+        /**
+          * Allows the field to stretch and fill the entire width of its container.
+         */
+        "fluid"?: boolean;
         /**
           * 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.
          */
@@ -4403,6 +4705,10 @@ declare namespace LocalJSX {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "error-description"?: string;
+        /**
+          * Allows the field to stretch and fill the entire width of its container.
+         */
+        "fluid"?: boolean;
         /**
           * 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.
          */
@@ -4498,6 +4804,10 @@ declare namespace LocalJSX {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "error-description"?: string;
+        /**
+          * Allows the field to stretch and fill the entire width of its container.
+         */
+        "fluid"?: boolean;
         /**
           * Hide the button to show/hide the password.
          */
@@ -4687,6 +4997,10 @@ declare namespace LocalJSX {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "error-description"?: string;
+        /**
+          * Allows the field to stretch and fill the entire width of its container.
+         */
+        "fluid"?: boolean;
         /**
           * Sets the ID for the select 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.
          */
@@ -4743,6 +5057,164 @@ declare namespace LocalJSX {
          */
         "value"?: string;
     }
+    /**
+     * @deprecated [EXPERIMENTAL]
+     * @experimental This component is still in development and subject to change in future releases.
+     */
+    interface NvFieldslider {
+        /**
+          * Add helpful hints or extra information under the slider. This is where you can clarify what users should enter or provide additional instructions, making the form easier to fill out correctly.
+         */
+        "description"?: string;
+        /**
+          * Disables user interaction with the slider and its associated input fields.
+         */
+        "disabled"?: boolean;
+        /**
+          * Sets the ID for the end input element and the for attribute of the associated label. If no ID is provided, a random one will be automatically generated.
+         */
+        "endInputId"?: string;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "end-input-id"?: string;
+        /**
+          * Name attribute for the end value input when using range mode. If not provided, the name attribute will be used with '-end' appended.
+         */
+        "endName"?: string;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "end-name"?: string;
+        /**
+          * Alters the slider's appearance to indicate an error, helping users identify fields that need correction.
+          * @validator error
+         */
+        "error"?: boolean;
+        /**
+          * A description that appears when there is an error related to the slider.
+          * @validator message
+         */
+        "errorDescription"?: string;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "error-description"?: string;
+        /**
+          * Allows the field to stretch and fill the entire width of its container.
+         */
+        "fluid"?: boolean;
+        /**
+          * Enables an optional numeric input field alongside the slider, allowing users to type a value directly instead of—or in addition to—using the slider handle.
+         */
+        "hasField"?: boolean;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "has-field"?: boolean;
+        /**
+          * Keeps the interface clean by removing visible labels, but still announces the label to screen readers so users relying on assistive tech aren't left guessing.
+         */
+        "hideLabel"?: boolean;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "hide-label"?: boolean;
+        /**
+          * Provides a textual description of the slider's function, helping users understand what the control adjusts. It also supports accessibility by serving as the accessible name for the component.
+         */
+        "label"?: string;
+        /**
+          * Use this to automatically show a label, like “$” or “kg,” after the value on the slider’s tooltip or input, helping users better understand the number.
+         */
+        "labelAfterValue"?: string;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "label-after-value"?: string;
+        /**
+          * Use this to automatically show a label, like “~” for approximate values, before the slider’s value in the tooltip or input, giving users quick context about the number.
+         */
+        "labelBeforeValue"?: string;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "label-before-value"?: string;
+        /**
+          * Defines the maximum allowed value for the slider. The thumb cannot move above this value, and manual input is also constrained accordingly.
+         */
+        "max"?: number;
+        /**
+          * Defines the minimum allowed value for the slider. The thumb cannot move below this value, and manual input is also constrained accordingly.
+         */
+        "min"?: number;
+        /**
+          * Name attribute for the form input element. Required for form submission. For range sliders, this will be used for the start value input and add -end to the end input name.
+         */
+        "name"?: string;
+        /**
+          * Emitted when the slider values change.
+          * @bind value
+         */
+        "onValueChanged"?: (event: NvFieldsliderCustomEvent<string>) => void;
+        /**
+          * Allows the slider to display two thumbs, enabling users to select a continuous range between a minimum and maximum value. Ideal for use cases like filtering by price or time.
+         */
+        "range"?: boolean;
+        /**
+          * Makes the slider and input non-editable while keeping them focusable and included in form submissions.
+         */
+        "readonly"?: boolean;
+        /**
+          * Controls the visibility of tick marks on the slider. When enabled, all visual ticks that indicate step points along the track are shown. If custom ticks are provided, they are always shown regardless of this setting.
+         */
+        "showTicks"?: boolean;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "show-ticks"?: boolean;
+        /**
+          * Controls whether the slider handle should visually snap to step values during dragging. When false, the handle can be positioned at any point along the track while dragging, but the actual value will still snap to the nearest step value. When true, the handle will visually snap to the nearest step value during dragging.
+         */
+        "snap"?: boolean;
+        /**
+          * When true and custom ticks are provided, the slider will snap to the nearest tick value during dragging, instead of using the step value. This is useful when you have custom ticks at specific values that don't align with regular step intervals.
+         */
+        "snapTicks"?: boolean;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "snap-ticks"?: boolean;
+        /**
+          * Sets the ID for the start input element and the for attribute of the associated label. If no ID is provided, a random one will be automatically generated.
+         */
+        "startInputId"?: string;
+        /**
+         * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
+         */
+        "start-input-id"?: string;
+        /**
+          * Defines the interval between selectable values on the slider. Controls how much the value increases or decreases with each keyboard interaction, drag movement, or direct input.
+         */
+        "step"?: number;
+        /**
+          * Changes the slider's appearance to indicate successful input or validation.
+         */
+        "success"?: boolean;
+        /**
+          * Allows you to specify custom tick marks at specific values along the slider. Each tick can optionally display a label to provide additional context or guidance for users.
+         */
+        "ticks"?: {
+    /** The numeric value of the tick */
+    value: number;
+    /** The label of the tick */
+    label?: string;
+  }[];
+        /**
+          * Numeric value of the slider as a string, if range mode is on, the values will be a comma-separated string.
+         */
+        "value"?: string;
+    }
     interface NvFieldtext {
         /**
           * The autocomplete prop helps users fill out the input field faster by suggesting entries they’ve used before, like their email or address. You can turn it on to make forms more convenient or off to ensure users always type in fresh data.
@@ -4774,6 +5246,10 @@ declare namespace LocalJSX {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "error-description"?: string;
+        /**
+          * Allows the field to stretch and fill the entire width of its container.
+         */
+        "fluid"?: boolean;
         /**
           * 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.
          */
@@ -4886,6 +5362,10 @@ declare namespace LocalJSX {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "error-description"?: string;
+        /**
+          * Allows the field to stretch and fill the entire width of its container.
+         */
+        "fluid"?: boolean;
         /**
           * 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.
          */
@@ -5331,6 +5811,10 @@ declare namespace LocalJSX {
          */
         "vertical"?: boolean;
     }
+    /**
+     * @deprecated [EXPERIMENTAL]
+     * @experimental - This component is used as a base for the nv-datagrid component. Do not use it directly.
+     */
     interface NvTable {
         /**
           * Configuration of the columns of the table
@@ -5384,7 +5868,17 @@ declare namespace LocalJSX {
         /**
           * *************************************************************************
          */
-        "onAction"?: (event: NvTableCustomEvent<ActionEvent>) => void;
+        "onAction"?: (event: NvTableCustomEvent<{
+    /**
+     * Key action to be performed
+     */
+    keyAction: string;
+
+    /**
+     * Details of the action to be performed
+     */
+    details: any;
+  }>) => void;
     }
     interface NvTablecolumn {
         /**
@@ -5498,6 +5992,7 @@ declare namespace LocalJSX {
         "nv-fieldpassword": NvFieldpassword;
         "nv-fieldradio": NvFieldradio;
         "nv-fieldselect": NvFieldselect;
+        "nv-fieldslider": NvFieldslider;
         "nv-fieldtext": NvFieldtext;
         "nv-fieldtextarea": NvFieldtextarea;
         "nv-fieldtime": NvFieldtime;
@@ -5529,8 +6024,6 @@ declare module "@stencil/core" {
             "nv-col": LocalJSX.NvCol & JSXBase.HTMLAttributes<HTMLNvColElement>;
             /**
              * A flexible data grid component powered by `@tanstack/table-core`.
-             * @deprecated [EXPERIMENTAL]
-             * @experimental - This component is still under development and is not ready for use.
              */
             "nv-datagrid": LocalJSX.NvDatagrid & JSXBase.HTMLAttributes<HTMLNvDatagridElement>;
             "nv-datagridcolumn": LocalJSX.NvDatagridcolumn & JSXBase.HTMLAttributes<HTMLNvDatagridcolumnElement>;
@@ -5548,6 +6041,11 @@ declare module "@stencil/core" {
             "nv-fieldpassword": LocalJSX.NvFieldpassword & JSXBase.HTMLAttributes<HTMLNvFieldpasswordElement>;
             "nv-fieldradio": LocalJSX.NvFieldradio & JSXBase.HTMLAttributes<HTMLNvFieldradioElement>;
             "nv-fieldselect": LocalJSX.NvFieldselect & JSXBase.HTMLAttributes<HTMLNvFieldselectElement>;
+            /**
+             * @deprecated [EXPERIMENTAL]
+             * @experimental This component is still in development and subject to change in future releases.
+             */
+            "nv-fieldslider": LocalJSX.NvFieldslider & JSXBase.HTMLAttributes<HTMLNvFieldsliderElement>;
             "nv-fieldtext": LocalJSX.NvFieldtext & JSXBase.HTMLAttributes<HTMLNvFieldtextElement>;
             "nv-fieldtextarea": LocalJSX.NvFieldtextarea & JSXBase.HTMLAttributes<HTMLNvFieldtextareaElement>;
             "nv-fieldtime": LocalJSX.NvFieldtime & JSXBase.HTMLAttributes<HTMLNvFieldtimeElement>;
@@ -5562,6 +6060,10 @@ declare module "@stencil/core" {
              * @deprecated Please use tailwind classes instead
              */
             "nv-stack": LocalJSX.NvStack & JSXBase.HTMLAttributes<HTMLNvStackElement>;
+            /**
+             * @deprecated [EXPERIMENTAL]
+             * @experimental - This component is used as a base for the nv-datagrid component. Do not use it directly.
+             */
             "nv-table": LocalJSX.NvTable & JSXBase.HTMLAttributes<HTMLNvTableElement>;
             "nv-tablecolumn": LocalJSX.NvTablecolumn & JSXBase.HTMLAttributes<HTMLNvTablecolumnElement>;
             "nv-toggle": LocalJSX.NvToggle & JSXBase.HTMLAttributes<HTMLNvToggleElement>;