@nova-design-system/nova-webcomponents 3.26.0 → 3.27.0

package/dist/types/components/nv-pagination-nav/nv-pagination-nav.d.ts

@@ -0,0 +1,82 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * A pagination navigation component that displays page numbers with Previous/Next controls.
+ * Use the isOnlyIcon prop to display Previous/Next as icon buttons for compact layouts.
+ */
+export declare class NvPaginationNav {
+    /****************************************************************************/
+    /**
+     * Label for the previous button.
+     */
+    readonly previousButtonLabel: string;
+    /**
+     * Label for the next button.
+     */
+    readonly nextButtonLabel: string;
+    /**
+     * Number of page buttons to show at the start of the pagination range.
+     */
+    readonly numStartZoneButtons: number;
+    /**
+     * Number of page buttons to show at the end of the pagination range.
+     */
+    readonly numEndZoneButtons: number;
+    /**
+     * Number of page buttons to show in the middle zone around the current page.
+     */
+    readonly numMiddleButtons: number;
+    /**
+     * Current page number (1-based index).
+     */
+    currentPage: number;
+    /**
+     * Total number of items to paginate.
+     */
+    readonly totalCount: number;
+    /**
+     * Number of items per page.
+     */
+    readonly pageSize: number;
+    /**
+     * If true, the Previous/Next navigation buttons will be displayed as icon buttons.
+     * Page number buttons always use regular buttons.
+     */
+    readonly isOnlyIcon: boolean;
+    /**
+     * If true, shows the middle zone with the current page when it's not in start/end zones.
+     * If false (default), only shows one ellipsis between start and end zones (simpler pagination).
+     */
+    readonly showMiddleZone: boolean;
+    /****************************************************************************/
+    /**
+     * Calculates the total number of pages based on totalCount and pageSize.
+     * @returns {number} The total number of pages.
+     */
+    private get totalPages();
+    /**
+     * Handles page change events.
+     * @param {number} pageNumber The page number to navigate to.
+     */
+    private handlePageChange;
+    /****************************************************************************/
+    /**
+     * Watches for changes to currentPage and emits the currentPageChanged event.
+     * @param {number} newValue The new current page value.
+     */
+    onCurrentPageChange(newValue: number): void;
+    /****************************************************************************/
+    /****************************************************************************/
+    /**
+     * Emitted when the current page changes.
+     * @bind currentPage
+     */
+    currentPageChanged: EventEmitter<number>;
+    /****************************************************************************/
+    /**
+     * Renders a single page button.
+     * @param {number} pageNumber The page number to render.
+     * @returns {JSX.Element} The rendered page button element.
+     */
+    private renderPageButton;
+    render(): any;
+}

package/dist/types/components/nv-pagination-nav/nv-pagination-nav.docs.d.ts

@@ -0,0 +1,4 @@
+import type { NovaDocs } from '../../nova-docs';
+import { Components } from '../../components';
+declare const NvPaginationNavDocs: NovaDocs<Components.NvPaginationNav>;
+export default NvPaginationNavDocs;

package/dist/types/components/nv-pagination-nav/nv-pagination-nav.utils.d.ts

@@ -0,0 +1,26 @@
+export type PaginationRangeItem = number | '...';
+/**
+ * Configuration used to compute a pagination range.
+ */
+export interface PaginationRangeConfig {
+    /** Current page (1-based). */
+    currentPage: number;
+    /** Total number of paginated items. */
+    totalCount: number;
+    /** Number of items per page. */
+    pageSize: number;
+    /** Number of visible page buttons in the start zone. */
+    numStartZoneButtons: number;
+    /** Number of visible page buttons in the end zone. */
+    numEndZoneButtons: number;
+    /** Number of visible page buttons in the middle zone. */
+    numMiddleButtons: number;
+    /** Enables the explicit middle zone rendering mode. */
+    showMiddleZone: boolean;
+}
+/**
+ * Generates a pagination range with page numbers and ellipsis items.
+ * @param {PaginationRangeConfig} config Pagination configuration.
+ * @returns {PaginationRangeItem[]} Ordered range items.
+ */
+export declare function calculatePaginationRange({ currentPage, totalCount, pageSize, numStartZoneButtons, numEndZoneButtons, numMiddleButtons, showMiddleZone, }: PaginationRangeConfig): PaginationRangeItem[];

package/dist/types/components/nv-pagination-nav/test/nv-pagination-nav.utils.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/components/nv-sidebarlogo/nv-sidebarlogo.d.ts

@@ -1,6 +1,8 @@
 /**
  * Displays the logo and title at the top of the sidebar.
  * Automatically switches between full and collapsed logos based on the sidebar state.
+ *
+ * @slot label - The label/name to display next to the logo. Make sure to add the class nv-sidebarlogo-title to the slot.
  */
 export declare class NvSidebarlogo {
     /****************************************************************************/

package/dist/types/components.d.ts

@@ -2710,6 +2710,62 @@ export namespace Components {
          */
         "position": `${NotificationPosition}`;
     }
+    /**
+     * A pagination navigation component that displays page numbers with Previous/Next controls.
+     * Use the isOnlyIcon prop to display Previous/Next as icon buttons for compact layouts.
+     */
+    interface NvPaginationNav {
+        /**
+          * Current page number (1-based index).
+          * @default 1
+         */
+        "currentPage": number;
+        /**
+          * If true, the Previous/Next navigation buttons will be displayed as icon buttons. Page number buttons always use regular buttons.
+          * @default false
+         */
+        "isOnlyIcon": boolean;
+        /**
+          * Label for the next button.
+          * @default 'Next'
+         */
+        "nextButtonLabel": string;
+        /**
+          * Number of page buttons to show at the end of the pagination range.
+          * @default 2
+         */
+        "numEndZoneButtons": number;
+        /**
+          * Number of page buttons to show in the middle zone around the current page.
+          * @default 1
+         */
+        "numMiddleButtons": number;
+        /**
+          * Number of page buttons to show at the start of the pagination range.
+          * @default 2
+         */
+        "numStartZoneButtons": number;
+        /**
+          * Number of items per page.
+          * @default 10
+         */
+        "pageSize": number;
+        /**
+          * Label for the previous button.
+          * @default 'Previous'
+         */
+        "previousButtonLabel": string;
+        /**
+          * If true, shows the middle zone with the current page when it's not in start/end zones. If false (default), only shows one ellipsis between start and end zones (simpler pagination).
+          * @default false
+         */
+        "showMiddleZone": boolean;
+        /**
+          * Total number of items to paginate.
+          * @default 100
+         */
+        "totalCount": number;
+    }
     interface NvPaginationtable {
         /**
           * Navigates to the first page.
@@ -3298,6 +3354,10 @@ export interface NvNotificationCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLNvNotificationElement;
 }
+export interface NvPaginationNavCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLNvPaginationNavElement;
+}
 export interface NvPaginationtableCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLNvPaginationtableElement;
@@ -4007,6 +4067,27 @@ declare global {
         prototype: HTMLNvNotificationcontainerElement;
         new (): HTMLNvNotificationcontainerElement;
     };
+    interface HTMLNvPaginationNavElementEventMap {
+        "currentPageChanged": number;
+    }
+    /**
+     * A pagination navigation component that displays page numbers with Previous/Next controls.
+     * Use the isOnlyIcon prop to display Previous/Next as icon buttons for compact layouts.
+     */
+    interface HTMLNvPaginationNavElement extends Components.NvPaginationNav, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLNvPaginationNavElementEventMap>(type: K, listener: (this: HTMLNvPaginationNavElement, ev: NvPaginationNavCustomEvent<HTMLNvPaginationNavElementEventMap[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 HTMLNvPaginationNavElementEventMap>(type: K, listener: (this: HTMLNvPaginationNavElement, ev: NvPaginationNavCustomEvent<HTMLNvPaginationNavElementEventMap[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 HTMLNvPaginationNavElement: {
+        prototype: HTMLNvPaginationNavElement;
+        new (): HTMLNvPaginationNavElement;
+    };
     interface HTMLNvPaginationtableElementEventMap {
         "pageIndexChanged": number;
         "pageSizeChanged": number;
@@ -4311,6 +4392,7 @@ declare global {
         "nv-notification": HTMLNvNotificationElement;
         "nv-notification-bullet": HTMLNvNotificationBulletElement;
         "nv-notificationcontainer": HTMLNvNotificationcontainerElement;
+        "nv-pagination-nav": HTMLNvPaginationNavElement;
         "nv-paginationtable": HTMLNvPaginationtableElement;
         "nv-popover": HTMLNvPopoverElement;
         "nv-row": HTMLNvRowElement;
@@ -7194,6 +7276,67 @@ declare namespace LocalJSX {
          */
         "position"?: `${NotificationPosition}`;
     }
+    /**
+     * A pagination navigation component that displays page numbers with Previous/Next controls.
+     * Use the isOnlyIcon prop to display Previous/Next as icon buttons for compact layouts.
+     */
+    interface NvPaginationNav {
+        /**
+          * Current page number (1-based index).
+          * @default 1
+         */
+        "currentPage"?: number;
+        /**
+          * If true, the Previous/Next navigation buttons will be displayed as icon buttons. Page number buttons always use regular buttons.
+          * @default false
+         */
+        "isOnlyIcon"?: boolean;
+        /**
+          * Label for the next button.
+          * @default 'Next'
+         */
+        "nextButtonLabel"?: string;
+        /**
+          * Number of page buttons to show at the end of the pagination range.
+          * @default 2
+         */
+        "numEndZoneButtons"?: number;
+        /**
+          * Number of page buttons to show in the middle zone around the current page.
+          * @default 1
+         */
+        "numMiddleButtons"?: number;
+        /**
+          * Number of page buttons to show at the start of the pagination range.
+          * @default 2
+         */
+        "numStartZoneButtons"?: number;
+        /**
+          * Emitted when the current page changes.
+          * @bind currentPage
+         */
+        "onCurrentPageChanged"?: (event: NvPaginationNavCustomEvent<number>) => void;
+        /**
+          * Number of items per page.
+          * @default 10
+         */
+        "pageSize"?: number;
+        /**
+          * Label for the previous button.
+          * @default 'Previous'
+         */
+        "previousButtonLabel"?: string;
+        /**
+          * If true, shows the middle zone with the current page when it's not in start/end zones. If false (default), only shows one ellipsis between start and end zones (simpler pagination).
+          * @default false
+         */
+        "showMiddleZone"?: boolean;
+        /**
+          * Total number of items to paginate.
+          * @default 100
+         */
+        "totalCount"?: number;
+    }
     interface NvPaginationtable {
         /**
           * Hides all arrow navigation controls when set to true. By default, all controls are visible.
@@ -7701,6 +7844,7 @@ declare namespace LocalJSX {
         "nv-notification": NvNotification;
         "nv-notification-bullet": NvNotificationBullet;
         "nv-notificationcontainer": NvNotificationcontainer;
+        "nv-pagination-nav": NvPaginationNav;
         "nv-paginationtable": NvPaginationtable;
         "nv-popover": NvPopover;
         "nv-row": NvRow;
@@ -7792,6 +7936,11 @@ declare module "@stencil/core" {
              * @experimental - Container for notifications TODO: add animations etc...
              */
             "nv-notificationcontainer": LocalJSX.NvNotificationcontainer & JSXBase.HTMLAttributes<HTMLNvNotificationcontainerElement>;
+            /**
+             * A pagination navigation component that displays page numbers with Previous/Next controls.
+             * Use the isOnlyIcon prop to display Previous/Next as icon buttons for compact layouts.
+             */
+            "nv-pagination-nav": LocalJSX.NvPaginationNav & JSXBase.HTMLAttributes<HTMLNvPaginationNavElement>;
             "nv-paginationtable": LocalJSX.NvPaginationtable & JSXBase.HTMLAttributes<HTMLNvPaginationtableElement>;
             "nv-popover": LocalJSX.NvPopover & JSXBase.HTMLAttributes<HTMLNvPopoverElement>;
             "nv-row": LocalJSX.NvRow & JSXBase.HTMLAttributes<HTMLNvRowElement>;

package/dist/vscode-data.json

@@ -5137,6 +5137,55 @@
         }
       ]
     },
+    {
+      "name": "nv-pagination-nav",
+      "description": {
+        "kind": "markdown",
+        "value": "A pagination navigation component that displays page numbers with Previous/Next controls.\nUse the isOnlyIcon prop to display Previous/Next as icon buttons for compact layouts."
+      },
+      "attributes": [
+        {
+          "name": "current-page",
+          "description": "Current page number (1-based index)."
+        },
+        {
+          "name": "is-only-icon",
+          "description": "If true, the Previous/Next navigation buttons will be displayed as icon buttons.\nPage number buttons always use regular buttons."
+        },
+        {
+          "name": "next-button-label",
+          "description": "Label for the next button."
+        },
+        {
+          "name": "num-end-zone-buttons",
+          "description": "Number of page buttons to show at the end of the pagination range."
+        },
+        {
+          "name": "num-middle-buttons",
+          "description": "Number of page buttons to show in the middle zone around the current page."
+        },
+        {
+          "name": "num-start-zone-buttons",
+          "description": "Number of page buttons to show at the start of the pagination range."
+        },
+        {
+          "name": "page-size",
+          "description": "Number of items per page."
+        },
+        {
+          "name": "previous-button-label",
+          "description": "Label for the previous button."
+        },
+        {
+          "name": "show-middle-zone",
+          "description": "If true, shows the middle zone with the current page when it's not in start/end zones.\nIf false (default), only shows one ellipsis between start and end zones (simpler pagination)."
+        },
+        {
+          "name": "total-count",
+          "description": "Total number of items to paginate."
+        }
+      ]
+    },
     {
       "name": "nv-paginationtable",
       "description": {