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

package/dist/types/components.d.ts

@@ -255,7 +255,7 @@ export namespace Components {
         "disabledDates": Array<string>;
         /**
           * First day of the week (0 = Sunday, 1 = Monday, etc.)
-          * @default 0
+          * @default 1
          */
         "firstDayOfWeek": number;
         /**
@@ -346,6 +346,11 @@ export namespace Components {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "single-value"?: string;
+        /**
+          * Selected date value. For single mode: ISO date string. For range mode: comma-separated ISO date strings. Examples: - Single: "2025-03-15" - Range: "2025-03-15,2025-03-20"
+          * @default ""
+         */
+        "value": string;
     }
     interface NvCol {
         /**
@@ -462,6 +467,41 @@ export namespace Components {
           * @default [10, 20, 30, 40, 50]
          */
         "pageSizes": number[];
+        /**
+          * The overall state
+         */
+        "state": {
+    /**
+     * Global filter search term
+     */
+    globalFilterSearchTerm: string;
+    /**
+     * Pagination State
+     */
+    paginationState: {
+      /**
+       * Page Index
+       */
+      pageIndex: number;
+      /**
+       * Page Size
+       */
+      pageSize: number;
+    };
+    /**
+     * Sorting the columns
+     */
+    sortingState: {
+      /**
+       * Descending
+       */
+      desc: boolean;
+      /**
+       * Column Id
+       */
+      id: string;
+    }[];
+  };
     }
     interface NvDatagridcolumn {
         /**
@@ -829,6 +869,7 @@ export namespace Components {
         "success": boolean;
         /**
           * The initial value of the input (date in string format).
+          * @bind value
          */
         "value": string;
     }
@@ -1668,10 +1709,6 @@ 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.
@@ -1817,9 +1854,9 @@ export namespace Components {
     label?: string;
   }[];
         /**
-          * Numeric value of the slider as a string, if range mode is on, the values will be a comma-separated string.
+          * Numeric value of the slider as an array of numbers. When in single mode, the value should be a an array of one number. When in range mode, the value should be an array of two numbers.
          */
-        "value": string;
+        "value": number[];
     }
     interface NvFieldtext {
         /**
@@ -2707,6 +2744,7 @@ declare global {
     interface HTMLNvCalendarElementEventMap {
         "singleDateChange": string;
         "rangeDateChange": HTMLNvCalendarElement['rangeValue'];
+        "valueChanged": string;
     }
     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;
@@ -2741,6 +2779,38 @@ declare global {
     details: any;
   };
         "selectedRows": any[];
+        "stateChanged": {
+    /**
+     * Global filter search term
+     */
+    globalFilterSearchTerm: string;
+    /**
+     * Pagination State
+     */
+    paginationState: {
+      /**
+       * Page Index
+       */
+      pageIndex: number;
+      /**
+       * Page Size
+       */
+      pageSize: number;
+    };
+    /**
+     * Sorting the columns
+     */
+    sortingState: {
+      /**
+       * Descending
+       */
+      desc: boolean;
+      /**
+       * Column Id
+       */
+      id: string;
+    }[];
+  };
     }
     /**
      * A flexible data grid component powered by `@tanstack/table-core`.
@@ -2824,12 +2894,7 @@ declare global {
         new (): HTMLNvFieldcheckboxElement;
     };
     interface HTMLNvFielddateElementEventMap {
-        "dateChange": {
-    /**
-     * The date value.
-     */
-    value: string;
-  };
+        "valueChanged": string;
     }
     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;
@@ -2847,6 +2912,7 @@ declare global {
     };
     interface HTMLNvFielddaterangeElementEventMap {
         "dateRangeChange": HTMLNvCalendarElementEventMap['rangeDateChange'];
+        "valueChanged": string;
     }
     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;
@@ -3019,12 +3085,8 @@ declare global {
         new (): HTMLNvFieldselectElement;
     };
     interface HTMLNvFieldsliderElementEventMap {
-        "valueChanged": string;
+        "valueChanged": number[];
     }
-    /**
-     * @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;
@@ -3553,7 +3615,7 @@ declare namespace LocalJSX {
         "disabledDates"?: Array<string>;
         /**
           * First day of the week (0 = Sunday, 1 = Monday, etc.)
-          * @default 0
+          * @default 1
          */
         "firstDayOfWeek"?: number;
         /**
@@ -3590,6 +3652,11 @@ declare namespace LocalJSX {
           * Emitted when a single date is selected
          */
         "onSingleDateChange"?: (event: NvCalendarCustomEvent<string>) => void;
+        /**
+          * Emitted when the unified value changes
+          * @bind value
+         */
+        "onValueChanged"?: (event: NvCalendarCustomEvent<string>) => void;
         /**
           * Selected date range format: { start: ISO string, end: ISO string } ex: { start: "2025-03-15", end: "2025-03-20" }
          */
@@ -3652,6 +3719,11 @@ declare namespace LocalJSX {
          * @deprecated use camelCase instead. Support for dash-casing will be removed in Stencil v5.
          */
         "single-value"?: string;
+        /**
+          * Selected date value. For single mode: ISO date string. For range mode: comma-separated ISO date strings. Examples: - Single: "2025-03-15" - Range: "2025-03-15,2025-03-20"
+          * @default ""
+         */
+        "value"?: string;
     }
     interface NvCol {
         /**
@@ -3772,6 +3844,42 @@ declare namespace LocalJSX {
           * Emitted when the selection of the rows are changed.
          */
         "onSelectedRows"?: (event: NvDatagridCustomEvent<any[]>) => void;
+        /**
+          * Emitted when the state is changed
+          * @bind state
+         */
+        "onStateChanged"?: (event: NvDatagridCustomEvent<{
+    /**
+     * Global filter search term
+     */
+    globalFilterSearchTerm: string;
+    /**
+     * Pagination State
+     */
+    paginationState: {
+      /**
+       * Page Index
+       */
+      pageIndex: number;
+      /**
+       * Page Size
+       */
+      pageSize: number;
+    };
+    /**
+     * Sorting the columns
+     */
+    sortingState: {
+      /**
+       * Descending
+       */
+      desc: boolean;
+      /**
+       * Column Id
+       */
+      id: string;
+    }[];
+  }>) => void;
         /**
           * 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
@@ -3786,6 +3894,41 @@ declare namespace LocalJSX {
           * @default [10, 20, 30, 40, 50]
          */
         "pageSizes"?: number[];
+        /**
+          * The overall state
+         */
+        "state"?: {
+    /**
+     * Global filter search term
+     */
+    globalFilterSearchTerm: string;
+    /**
+     * Pagination State
+     */
+    paginationState: {
+      /**
+       * Page Index
+       */
+      pageIndex: number;
+      /**
+       * Page Size
+       */
+      pageSize: number;
+    };
+    /**
+     * Sorting the columns
+     */
+    sortingState: {
+      /**
+       * Descending
+       */
+      desc: boolean;
+      /**
+       * Column Id
+       */
+      id: string;
+    }[];
+  };
     }
     interface NvDatagridcolumn {
         /**
@@ -4112,14 +4255,10 @@ declare namespace LocalJSX {
          */
         "number-of-calendars"?: number;
         /**
-          * Emits an event when the date changes.
+          * Emitted when the value changes (unified value binding).
+          * @bind value
          */
-        "onDateChange"?: (event: NvFielddateCustomEvent<{
-    /**
-     * The date value.
-     */
-    value: string;
-  }>) => void;
+        "onValueChanged"?: (event: NvFielddateCustomEvent<string>) => void;
         /**
           * Placeholder for the input field.
          */
@@ -4169,6 +4308,7 @@ declare namespace LocalJSX {
         "success"?: boolean;
         /**
           * The initial value of the input (date in string format).
+          * @bind value
          */
         "value"?: string;
     }
@@ -4274,9 +4414,14 @@ declare namespace LocalJSX {
          */
         "number-of-calendars"?: number;
         /**
-          * Emits an event when the date range changes.
+          * Emitted when the date range changes.
          */
         "onDateRangeChange"?: (event: NvFielddaterangeCustomEvent<HTMLNvCalendarElementEventMap['rangeDateChange']>) => void;
+        /**
+          * Emitted when the unified value changes
+          * @bind value
+         */
+        "onValueChanged"?: (event: NvFielddaterangeCustomEvent<string>) => void;
         /**
           * Sets both input fields as read-only.
          */
@@ -5057,10 +5202,6 @@ 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.
@@ -5156,7 +5297,7 @@ declare namespace LocalJSX {
           * Emitted when the slider values change.
           * @bind value
          */
-        "onValueChanged"?: (event: NvFieldsliderCustomEvent<string>) => void;
+        "onValueChanged"?: (event: NvFieldsliderCustomEvent<number[]>) => 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.
          */
@@ -5211,9 +5352,9 @@ declare namespace LocalJSX {
     label?: string;
   }[];
         /**
-          * Numeric value of the slider as a string, if range mode is on, the values will be a comma-separated string.
+          * Numeric value of the slider as an array of numbers. When in single mode, the value should be a an array of one number. When in range mode, the value should be an array of two numbers.
          */
-        "value"?: string;
+        "value"?: number[];
     }
     interface NvFieldtext {
         /**
@@ -6041,10 +6182,6 @@ 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>;

package/dist/vscode-data.json

@@ -401,6 +401,10 @@
         {
           "name": "single-value",
           "description": "Selected date (ISO string format)\nex: \"2025-03-15\""
+        },
+        {
+          "name": "value",
+          "description": "Selected date value. For single mode: ISO date string. For range mode: comma-separated ISO date strings.\nExamples:\n- Single: \"2025-03-15\"\n- Range: \"2025-03-15,2025-03-20\""
         }
       ]
     },
@@ -2177,10 +2181,6 @@
         {
           "name": "success",
           "description": "Changes the slider's appearance to indicate successful input or validation."
-        },
-        {
-          "name": "value",
-          "description": "Numeric value of the slider as a string, if range mode is on, the values\nwill be a comma-separated string."
         }
       ]
     },