@nova-design-system/nova-react 3.22.0 → 3.24.0

package/dist/providers/NotificationProvider.js

@@ -1,13 +1,12 @@
 import React, { createContext, useContext, useState, useCallback, createRef, useEffect, useRef, } from 'react';
 import { createPortal } from 'react-dom';
 import { NvNotificationcontainer, NvNotification, NvButton, } from '../generated/components';
+import { v4 as uuidv4 } from 'uuid';
 const NotificationContext = createContext(null);
 const DEFAULT_POSITION = 'top-right';
 const DEFAULT_MAX_NOTIFICATIONS = 50;
 const generateId = () => {
-    return `notification-${Date.now()}-${Math.random()
-        .toString(36)
-        .substr(2, 9)}`;
+    return `notification-${uuidv4()}`;
 };
 export const NotificationProvider = ({ children, position = DEFAULT_POSITION, maxNotifications = DEFAULT_MAX_NOTIFICATIONS, className, }) => {
     const [notifications, setNotifications] = useState([]);
@@ -92,7 +91,7 @@ export const NotificationProvider = ({ children, position = DEFAULT_POSITION, ma
     };
     return (React.createElement(NotificationContext.Provider, { value: contextValue },
         children,
-        createPortal(React.createElement(NvNotificationcontainer, { position: position, className: className, "data-testid": "notification-container" }, notifications.map((notification) => (React.createElement(NvNotification, { key: notification.id, heading: notification.heading, message: notification.message, dismissible: notification.dismissible, emphasis: notification.emphasis, feedback: notification.feedback, icon: notification.icon, onHiddenChanged: (event) => {
+        createPortal(React.createElement(NvNotificationcontainer, { position: position, className: className, "data-testid": "notification-container" }, notifications.map((notification) => (React.createElement(NvNotification, { key: notification.id, uid: notification.id, heading: notification.heading, message: notification.message, dismissible: notification.dismissible, emphasis: notification.emphasis, feedback: notification.feedback, icon: notification.icon, onHiddenChanged: (event) => {
                 if (event.detail) {
                     handleNotificationClose(notification.id);
                 }

package/dist/types/components/NvDatatable/NvDatatable.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { NvDatatableProps } from './types';
-declare function NvDatatable<T>({ columns, rows, pagination, sorting, filtering, renderPagination, renderFiltering, stickyHeader, ...htmlProps }: NvDatatableProps<T>): React.JSX.Element;
+declare function NvDatatable<T>({ mode, columns, rows, pagination, sorting, filtering, renderPagination, renderFiltering, stickyHeader, ...htmlProps }: NvDatatableProps<T>): React.JSX.Element;
 declare namespace NvDatatable {
     var displayName: string;
 }

package/dist/types/components/NvDatatable/types.d.ts

@@ -1,6 +1,8 @@
 import type { ComponentProps } from 'react';
 import type { SortingFn, NoInfer, SortingState, Row } from '@tanstack/react-table';
+export type NvDatatableMode = 'client' | 'server';
 export type NvDatatableProps<T> = {
+    mode?: NvDatatableMode;
     columns: Array<NvDatatableColumn<T>>;
     rows: Array<T>;
     pagination?: NvDatatablePaginationConfig;
@@ -18,12 +20,17 @@ export interface NvDatatableColumn<Row, K extends keyof Row = keyof Row, F = Row
     hidden?: boolean;
     valueFormatter?: (params: NvTableValueFormatterParams<Row, Row[K], K>) => F;
     renderCell?: (params: NvTableRenderCellParams<Row, F, K>) => React.ReactNode;
+    renderHeader?: (params: NvTableRenderHeaderParams<K>) => React.ReactNode;
     sortable?: boolean;
     sortingFn?: SortingFn<Row> | string;
     sortDescFirst?: boolean;
     invertSorting?: boolean;
     sortUndefined?: 'first' | 'last' | false | -1 | 1;
 }
+export interface NvTableRenderHeaderParams<Field> {
+    headerName: string;
+    field: Field;
+}
 export interface NvTableRenderCellParams<Row, Value, Field> {
     value: Value | NoInfer<Value>;
     row: Row;
@@ -36,7 +43,7 @@ export interface NvTableValueFormatterParams<Row, Value, Field> {
     field: Field;
 }
 export interface NvDatatablePaginationConfig {
-    mode: 'client' | 'server' | 'infinite';
+    infinite?: boolean;
     initialPageSize?: number;
     pageSizeOptions?: number[];
     totalRowCount?: number;
@@ -68,7 +75,6 @@ export interface NvDatatableRenderPaginationAPI {
 }
 export type NvDataTableSortingState = SortingState;
 export interface NvDatatableSortingConfig {
-    mode: 'client' | 'server';
     enableMultiSort?: boolean;
     enableSortingRemoval?: boolean;
     maxMultiSortColCount?: number;
@@ -77,7 +83,6 @@ export interface NvDatatableSortingConfig {
     onSortingChange?: (sorting: SortingState) => void;
 }
 export interface NvDatatableFilteringConfig<T> {
-    mode: 'client' | 'server';
     filterState?: unknown;
     onFilterChange?: (filterState: unknown) => void;
     globalFilterFn?: (row: Row<T>, columnId: string, filterValue: unknown) => boolean;

package/dist/types/generated/components.d.ts

@@ -15,6 +15,9 @@ import { NvDatagridcolumn as NvDatagridcolumnElement } from "@nova-design-system
 import { NvDialog as NvDialogElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-dialog.js";
 import { NvDialogfooter as NvDialogfooterElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-dialogfooter.js";
 import { NvDialogheader as NvDialogheaderElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-dialogheader.js";
+import { NvDrawer as NvDrawerElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-drawer.js";
+import { NvDrawerfooter as NvDrawerfooterElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-drawerfooter.js";
+import { NvDrawerheader as NvDrawerheaderElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-drawerheader.js";
 import { NvFieldcheckbox as NvFieldcheckboxElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-fieldcheckbox.js";
 import { NvFielddate as NvFielddateElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-fielddate.js";
 import { NvFielddaterange as NvFielddaterangeElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-fielddaterange.js";
@@ -35,10 +38,20 @@ import { NvIconbutton as NvIconbuttonElement } from "@nova-design-system/nova-we
 import { NvLoader as NvLoaderElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-loader.js";
 import { NvMenu as NvMenuElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-menu.js";
 import { NvMenuitem as NvMenuitemElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-menuitem.js";
+import { NvNotificationBullet as NvNotificationBulletElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-notification-bullet.js";
 import { NvNotification as NvNotificationElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-notification.js";
 import { NvNotificationcontainer as NvNotificationcontainerElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-notificationcontainer.js";
 import { NvPopover as NvPopoverElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-popover.js";
 import { NvRow as NvRowElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-row.js";
+import { NvSidebar as NvSidebarElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-sidebar.js";
+import { NvSidebarcontent as NvSidebarcontentElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-sidebarcontent.js";
+import { NvSidebardivider as NvSidebardividerElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-sidebardivider.js";
+import { NvSidebarfooter as NvSidebarfooterElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-sidebarfooter.js";
+import { NvSidebargroup as NvSidebargroupElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-sidebargroup.js";
+import { NvSidebarheader as NvSidebarheaderElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-sidebarheader.js";
+import { NvSidebarlogo as NvSidebarlogoElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-sidebarlogo.js";
+import { NvSidebarnavitem as NvSidebarnavitemElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-sidebarnavitem.js";
+import { NvSidebarnavsubitem as NvSidebarnavsubitemElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-sidebarnavsubitem.js";
 import { NvSplit as NvSplitElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-split.js";
 import { NvStack as NvStackElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-stack.js";
 import { NvTable as NvTableElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-table.js";
@@ -118,6 +131,17 @@ export type NvDialogfooterEvents = {
 export declare const NvDialogfooter: StencilReactComponent<NvDialogfooterElement, NvDialogfooterEvents>;
 export type NvDialogheaderEvents = NonNullable<unknown>;
 export declare const NvDialogheader: StencilReactComponent<NvDialogheaderElement, NvDialogheaderEvents>;
+export type NvDrawerEvents = {
+    onOpenChanged: EventName<CustomEvent<boolean>>;
+};
+export declare const NvDrawer: StencilReactComponent<NvDrawerElement, NvDrawerEvents>;
+export type NvDrawerfooterEvents = {
+    onDrawerCanceled: EventName<CustomEvent<void>>;
+    onDrawerPrimaryClicked: EventName<CustomEvent<void>>;
+};
+export declare const NvDrawerfooter: StencilReactComponent<NvDrawerfooterElement, NvDrawerfooterEvents>;
+export type NvDrawerheaderEvents = NonNullable<unknown>;
+export declare const NvDrawerheader: StencilReactComponent<NvDrawerheaderElement, NvDrawerheaderEvents>;
 export type NvFieldcheckboxEvents = {
     onCheckedChanged: EventName<CustomEvent<boolean>>;
 };
@@ -213,6 +237,8 @@ export type NvNotificationEvents = {
     onHiddenChanged: EventName<CustomEvent<boolean>>;
 };
 export declare const NvNotification: StencilReactComponent<NvNotificationElement, NvNotificationEvents>;
+export type NvNotificationBulletEvents = NonNullable<unknown>;
+export declare const NvNotificationBullet: StencilReactComponent<NvNotificationBulletElement, NvNotificationBulletEvents>;
 export type NvNotificationcontainerEvents = NonNullable<unknown>;
 export declare const NvNotificationcontainer: StencilReactComponent<NvNotificationcontainerElement, NvNotificationcontainerEvents>;
 export type NvPopoverEvents = {
@@ -221,6 +247,26 @@ export type NvPopoverEvents = {
 export declare const NvPopover: StencilReactComponent<NvPopoverElement, NvPopoverEvents>;
 export type NvRowEvents = NonNullable<unknown>;
 export declare const NvRow: StencilReactComponent<NvRowElement, NvRowEvents>;
+export type NvSidebarEvents = {
+    onOpenChanged: EventName<CustomEvent<boolean>>;
+};
+export declare const NvSidebar: StencilReactComponent<NvSidebarElement, NvSidebarEvents>;
+export type NvSidebarcontentEvents = NonNullable<unknown>;
+export declare const NvSidebarcontent: StencilReactComponent<NvSidebarcontentElement, NvSidebarcontentEvents>;
+export type NvSidebardividerEvents = NonNullable<unknown>;
+export declare const NvSidebardivider: StencilReactComponent<NvSidebardividerElement, NvSidebardividerEvents>;
+export type NvSidebarfooterEvents = NonNullable<unknown>;
+export declare const NvSidebarfooter: StencilReactComponent<NvSidebarfooterElement, NvSidebarfooterEvents>;
+export type NvSidebargroupEvents = NonNullable<unknown>;
+export declare const NvSidebargroup: StencilReactComponent<NvSidebargroupElement, NvSidebargroupEvents>;
+export type NvSidebarheaderEvents = NonNullable<unknown>;
+export declare const NvSidebarheader: StencilReactComponent<NvSidebarheaderElement, NvSidebarheaderEvents>;
+export type NvSidebarlogoEvents = NonNullable<unknown>;
+export declare const NvSidebarlogo: StencilReactComponent<NvSidebarlogoElement, NvSidebarlogoEvents>;
+export type NvSidebarnavitemEvents = NonNullable<unknown>;
+export declare const NvSidebarnavitem: StencilReactComponent<NvSidebarnavitemElement, NvSidebarnavitemEvents>;
+export type NvSidebarnavsubitemEvents = NonNullable<unknown>;
+export declare const NvSidebarnavsubitem: StencilReactComponent<NvSidebarnavsubitemElement, NvSidebarnavsubitemEvents>;
 export type NvSplitEvents = {
     onSizesChanged: EventName<CustomEvent<number[]>>;
 };

package/dist/types/generated/components.server.d.ts

@@ -15,6 +15,9 @@ import { NvDatagridcolumn as NvDatagridcolumnElement } from "@nova-design-system
 import { NvDialog as NvDialogElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-dialog.js";
 import { NvDialogfooter as NvDialogfooterElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-dialogfooter.js";
 import { NvDialogheader as NvDialogheaderElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-dialogheader.js";
+import { NvDrawer as NvDrawerElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-drawer.js";
+import { NvDrawerfooter as NvDrawerfooterElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-drawerfooter.js";
+import { NvDrawerheader as NvDrawerheaderElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-drawerheader.js";
 import { NvFieldcheckbox as NvFieldcheckboxElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-fieldcheckbox.js";
 import { NvFielddate as NvFielddateElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-fielddate.js";
 import { NvFielddaterange as NvFielddaterangeElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-fielddaterange.js";
@@ -35,10 +38,20 @@ import { NvIconbutton as NvIconbuttonElement } from "@nova-design-system/nova-we
 import { NvLoader as NvLoaderElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-loader.js";
 import { NvMenu as NvMenuElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-menu.js";
 import { NvMenuitem as NvMenuitemElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-menuitem.js";
+import { NvNotificationBullet as NvNotificationBulletElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-notification-bullet.js";
 import { NvNotification as NvNotificationElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-notification.js";
 import { NvNotificationcontainer as NvNotificationcontainerElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-notificationcontainer.js";
 import { NvPopover as NvPopoverElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-popover.js";
 import { NvRow as NvRowElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-row.js";
+import { NvSidebar as NvSidebarElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-sidebar.js";
+import { NvSidebarcontent as NvSidebarcontentElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-sidebarcontent.js";
+import { NvSidebardivider as NvSidebardividerElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-sidebardivider.js";
+import { NvSidebarfooter as NvSidebarfooterElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-sidebarfooter.js";
+import { NvSidebargroup as NvSidebargroupElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-sidebargroup.js";
+import { NvSidebarheader as NvSidebarheaderElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-sidebarheader.js";
+import { NvSidebarlogo as NvSidebarlogoElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-sidebarlogo.js";
+import { NvSidebarnavitem as NvSidebarnavitemElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-sidebarnavitem.js";
+import { NvSidebarnavsubitem as NvSidebarnavsubitemElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-sidebarnavsubitem.js";
 import { NvSplit as NvSplitElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-split.js";
 import { NvStack as NvStackElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-stack.js";
 import { NvTable as NvTableElement } from "@nova-design-system/nova-webcomponents/dist/components/nv-table.js";
@@ -120,6 +133,17 @@ export type NvDialogfooterEvents = {
 export declare const NvDialogfooter: StencilReactComponent<NvDialogfooterElement, NvDialogfooterEvents>;
 export type NvDialogheaderEvents = NonNullable<unknown>;
 export declare const NvDialogheader: StencilReactComponent<NvDialogheaderElement, NvDialogheaderEvents>;
+export type NvDrawerEvents = {
+    onOpenChanged: EventName<CustomEvent<boolean>>;
+};
+export declare const NvDrawer: StencilReactComponent<NvDrawerElement, NvDrawerEvents>;
+export type NvDrawerfooterEvents = {
+    onDrawerCanceled: EventName<CustomEvent<void>>;
+    onDrawerPrimaryClicked: EventName<CustomEvent<void>>;
+};
+export declare const NvDrawerfooter: StencilReactComponent<NvDrawerfooterElement, NvDrawerfooterEvents>;
+export type NvDrawerheaderEvents = NonNullable<unknown>;
+export declare const NvDrawerheader: StencilReactComponent<NvDrawerheaderElement, NvDrawerheaderEvents>;
 export type NvFieldcheckboxEvents = {
     onCheckedChanged: EventName<CustomEvent<boolean>>;
 };
@@ -215,6 +239,8 @@ export type NvNotificationEvents = {
     onHiddenChanged: EventName<CustomEvent<boolean>>;
 };
 export declare const NvNotification: StencilReactComponent<NvNotificationElement, NvNotificationEvents>;
+export type NvNotificationBulletEvents = NonNullable<unknown>;
+export declare const NvNotificationBullet: StencilReactComponent<NvNotificationBulletElement, NvNotificationBulletEvents>;
 export type NvNotificationcontainerEvents = NonNullable<unknown>;
 export declare const NvNotificationcontainer: StencilReactComponent<NvNotificationcontainerElement, NvNotificationcontainerEvents>;
 export type NvPopoverEvents = {
@@ -223,6 +249,26 @@ export type NvPopoverEvents = {
 export declare const NvPopover: StencilReactComponent<NvPopoverElement, NvPopoverEvents>;
 export type NvRowEvents = NonNullable<unknown>;
 export declare const NvRow: StencilReactComponent<NvRowElement, NvRowEvents>;
+export type NvSidebarEvents = {
+    onOpenChanged: EventName<CustomEvent<boolean>>;
+};
+export declare const NvSidebar: StencilReactComponent<NvSidebarElement, NvSidebarEvents>;
+export type NvSidebarcontentEvents = NonNullable<unknown>;
+export declare const NvSidebarcontent: StencilReactComponent<NvSidebarcontentElement, NvSidebarcontentEvents>;
+export type NvSidebardividerEvents = NonNullable<unknown>;
+export declare const NvSidebardivider: StencilReactComponent<NvSidebardividerElement, NvSidebardividerEvents>;
+export type NvSidebarfooterEvents = NonNullable<unknown>;
+export declare const NvSidebarfooter: StencilReactComponent<NvSidebarfooterElement, NvSidebarfooterEvents>;
+export type NvSidebargroupEvents = NonNullable<unknown>;
+export declare const NvSidebargroup: StencilReactComponent<NvSidebargroupElement, NvSidebargroupEvents>;
+export type NvSidebarheaderEvents = NonNullable<unknown>;
+export declare const NvSidebarheader: StencilReactComponent<NvSidebarheaderElement, NvSidebarheaderEvents>;
+export type NvSidebarlogoEvents = NonNullable<unknown>;
+export declare const NvSidebarlogo: StencilReactComponent<NvSidebarlogoElement, NvSidebarlogoEvents>;
+export type NvSidebarnavitemEvents = NonNullable<unknown>;
+export declare const NvSidebarnavitem: StencilReactComponent<NvSidebarnavitemElement, NvSidebarnavitemEvents>;
+export type NvSidebarnavsubitemEvents = NonNullable<unknown>;
+export declare const NvSidebarnavsubitem: StencilReactComponent<NvSidebarnavsubitemElement, NvSidebarnavsubitemEvents>;
 export type NvSplitEvents = {
     onSizesChanged: EventName<CustomEvent<number[]>>;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nova-design-system/nova-react",
-  "version": "3.22.0",
+  "version": "3.24.0",
   "description": "Nova is a design system created by Elia Group to empower creators to efficiently build solutions that people love to use.",
   "author": "Elia Group",
   "homepage": "https://nova.eliagroup.io",
@@ -57,6 +57,6 @@
     "@rollup/plugin-typescript": "12.1.2"
   },
   "peerDependencies": {
-    "@stencil/react-output-target": "1.0.4"
+    "@stencil/react-output-target": "1.2.0"
   }
 }

package/dist/cjs/_commonjsHelpers-1789f0cf-BJu3ubxk.js

@@ -1,10 +0,0 @@
-'use strict';
-
-var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
-
-function getDefaultExportFromCjs (x) {
-	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
-}
-
-exports.commonjsGlobal = commonjsGlobal;
-exports.getDefaultExportFromCjs = getDefaultExportFromCjs;