@hitachivantara/uikit-react-core 5.36.2 → 5.36.3

package/dist/types/index.d.ts

@@ -22,7 +22,6 @@ import { CSSInterpolation as CSSInterpolation_2 } from '@emotion/css';
 import { CSSProperties } from 'react';
 import { defaultCacheKey } from '@hitachivantara/uikit-react-shared';
 import { defaultEmotionCache } from '@hitachivantara/uikit-react-shared';
-import { DefaultTreeViewPluginParameters } from '@mui/x-tree-view/internals/plugins/defaultPlugins';
 import { DialogActionsProps } from '@mui/material/DialogActions';
 import { DialogContentProps } from '@mui/material/DialogContent';
 import { DialogProps } from '@mui/material/Dialog';
@@ -68,6 +67,7 @@ import { InputBaseComponentProps } from '@mui/material';
 import { InputBaseProps } from '@mui/material';
 import { InputProps } from '@mui/material';
 import type { JSX as JSX_2 } from '@emotion/react/jsx-runtime';
+import type { JSXElementConstructor } from 'react';
 import { MouseEvent as MouseEvent_2 } from 'react';
 import { MouseEventHandler } from 'react';
 import type { OptionsObject } from 'notistack';
@@ -112,8 +112,7 @@ import { theme } from '@hitachivantara/uikit-styles';
 import { themes } from '@hitachivantara/uikit-styles';
 import type { ThHTMLAttributes } from 'react';
 import { TooltipProps } from '@mui/material';
-import type { TreeItemContentProps } from '@mui/x-tree-view';
-import type { TreeItemProps } from '@mui/x-tree-view';
+import { TransitionProps } from '@mui/material/transitions';
 import { UseColumnOrderInstanceProps } from 'react-table';
 import { UseColumnOrderState } from 'react-table';
 import { useEffect } from 'react';
@@ -157,11 +156,6 @@ import { UseSortByInstanceProps } from 'react-table';
 import { UseSortByOptions } from 'react-table';
 import { UseSortByState } from 'react-table';
 import { UseTableHeaderGroupProps } from 'react-table';
-import type { UseTreeViewExpansionInstance } from '@mui/x-tree-view/internals/plugins/useTreeViewExpansion/useTreeViewExpansion.types';
-import type { UseTreeViewFocusInstance } from '@mui/x-tree-view/internals/plugins/useTreeViewFocus/useTreeViewFocus.types';
-import type { UseTreeViewKeyboardNavigationInstance } from '@mui/x-tree-view/internals/plugins/useTreeViewKeyboardNavigation/useTreeViewKeyboardNavigation.types';
-import type { UseTreeViewNodesInstance } from '@mui/x-tree-view/internals/plugins/useTreeViewNodes/useTreeViewNodes.types';
-import type { UseTreeViewSelectionInstance } from '@mui/x-tree-view/internals/plugins/useTreeViewSelection/useTreeViewSelection.types';
 
 declare type Accessor<D extends object> = (originalRow: D, index: number, sub: {
     subRows: D[];
@@ -653,6 +647,9 @@ export declare const defaultGetToggleAllRowsSelectedProps: (props: any, { instan
 
 export declare const defaultGetToggleRowSelectedProps: (props: any, meta: any) => any[];
 
+declare interface DefaultTreeViewPluginParameters<Multiple extends boolean | undefined> extends UseTreeViewNodesParameters, UseTreeViewExpansionParameters, UseTreeViewFocusParameters, UseTreeViewSelectionParameters<Multiple>, UseTreeViewContextValueBuilderParameters {
+}
+
 declare interface Descriptor {
     id?: string;
     htmlFor?: string;
@@ -5434,9 +5431,9 @@ export declare interface HvScrollToVerticalProps extends HvBaseProps<HTMLOListEl
 /**
  * Sections allow grouping information on a page under the same topic.
  */
-export declare const HvSection: (props: HvSectionProps) => JSX_2.Element;
+export declare const HvSection: ForwardRefExoticComponent<HvSectionProps & RefAttributes<HTMLDivElement>>;
 
-export declare type HvSectionClasses = ExtractNames<typeof useClasses_121>;
+export declare type HvSectionClasses = ExtractNames<typeof useClasses_122>;
 
 export declare interface HvSectionProps extends Omit<HvBaseProps<HTMLDivElement>, "title"> {
     /** The title of the section */
@@ -6756,18 +6753,60 @@ export declare interface HvTooltipProps extends Omit<TooltipProps, "classes"> {
     containerId?: string;
 }
 
-export declare interface HvTreeContentProps extends TreeItemContentProps {
+declare type HvTreeContentClasses = ExtractNames<typeof useClasses_121>;
+
+export declare interface HvTreeContentProps extends HTMLAttributes<HTMLElement> {
+    /** className applied to the root element. */
+    className?: string;
+    /** Override or extend the styles applied to the component. */
+    classes?: HvTreeContentClasses;
+    /** The tree node label. */
+    label?: ReactNode;
+    /** The id of the node. */
+    nodeId: string;
+    /** The icon to display next to the tree node's label. */
+    icon?: ReactNode;
+    /** The icon to display next to the tree node's label. Either an expansion or collapse icon. */
+    expansionIcon?: ReactNode;
+    /** The icon to display next to the tree node's label. Either a parent or end icon. */
+    displayIcon?: ReactNode;
 }
 
 export declare const HvTreeItem: ForwardRefExoticComponent<HvTreeItemProps & RefAttributes<HTMLLIElement>>;
 
 export declare type HvTreeItemClasses = ExtractNames<typeof useClasses_120>;
 
-export declare interface HvTreeItemProps extends TreeItemProps {
+export declare interface HvTreeItemProps extends HTMLAttributes<HTMLElement> {
+    /** The element id */
+    id?: string;
+    /** The id of the node. */
+    nodeId: string;
+    /** The tree node label. */
+    label?: ReactNode;
+    /** Override or extend the styles applied to the component. */
     classes?: HvTreeItemClasses;
+    /** If `true`, the node is disabled. */
     disabled?: boolean;
+    /** The icon to display next to the tree node's label. */
     icon?: ReactNode;
-    ContentComponent?: React.JSXElementConstructor<HvTreeContentProps>;
+    /** The component used for the content node. */
+    ContentComponent?: JSXElementConstructor<HvTreeContentProps>;
+    /** Props applied to the content component */
+    ContentProps?: HvTreeContentProps;
+    /** The content of the component. */
+    children?: ReactNode;
+    /** className applied to the root element. */
+    className?: string;
+    /** The icon used to collapse the node. */
+    collapseIcon?: ReactNode;
+    /** The icon displayed next to an end node. */
+    endIcon?: ReactNode;
+    /** The icon used to expand the node. */
+    expandIcon?: ReactNode;
+    /** The component used for the transition. */
+    TransitionComponent?: JSXElementConstructor<TransitionProps>;
+    /** Props applied to the transition component */
+    TransitionProps?: TransitionProps;
 }
 
 /**
@@ -8021,6 +8060,24 @@ export declare const treeViewItemClasses: {
     labelExpandable: "HvVerticalNavigationTreeViewItem-labelExpandable";
 };
 
+declare interface TreeViewItemRange {
+    start?: string | null;
+    end?: string | null;
+    next?: string | null;
+    current?: string;
+}
+
+declare interface TreeViewNode {
+    id: string;
+    idAttribute: string | undefined;
+    index: number;
+    parentId: string | null;
+    expandable: boolean;
+    disabled: boolean | undefined;
+}
+
+declare type TreeViewSelectionValue<Multiple extends boolean | undefined> = Multiple extends true ? string[] : string | null;
+
 export declare const typographyClasses: {
     link: "HvTypography-link";
     body: "HvTypography-body";
@@ -8546,7 +8603,24 @@ declare const useClasses_120: (classesProp?: Partial<Record<"content" | "label"
     cx: (...args: any) => string;
 };
 
-declare const useClasses_121: (classesProp?: Partial<Record<"hidden" | "content" | "header" | "root" | "actions", string>>, addStatic?: boolean) => {
+declare const useClasses_121: (classesProp?: Partial<Record<"label" | "root" | "expanded" | "disabled" | "selected" | "focused" | "iconContainer", string>>, addStatic?: boolean) => {
+    classes: {
+        label: string;
+        root: string;
+        expanded: string;
+        disabled: string;
+        selected: string;
+        focused: string;
+        iconContainer: string;
+    };
+    css: {
+        (template: TemplateStringsArray, ...args: CSSInterpolation[]): string;
+        (...args: CSSInterpolation[]): string;
+    };
+    cx: (...args: any) => string;
+};
+
+declare const useClasses_122: (classesProp?: Partial<Record<"hidden" | "content" | "header" | "root" | "actions", string>>, addStatic?: boolean) => {
     classes: {
         hidden: string;
         content: string;
@@ -10535,6 +10609,134 @@ export declare const useTheme: () => HvThemeContextValue & {
     colors?: HvThemeColorModeStructure;
 };
 
+declare interface UseTreeViewContextValueBuilderParameters {
+    /**
+     * This prop is used to help implement the accessibility logic.
+     * If you don't provide this prop. It falls back to a randomly generated id.
+     */
+    id?: string;
+    /**
+     * The default icon used to collapse the node.
+     */
+    defaultCollapseIcon?: React.ReactNode;
+    /**
+     * The default icon displayed next to a end node. This is applied to all
+     * tree nodes and can be overridden by the TreeItem `icon` prop.
+     */
+    defaultEndIcon?: React.ReactNode;
+    /**
+     * The default icon used to expand the node.
+     */
+    defaultExpandIcon?: React.ReactNode;
+    /**
+     * The default icon displayed next to a parent node. This is applied to all
+     * parent nodes and can be overridden by the TreeItem `icon` prop.
+     */
+    defaultParentIcon?: React.ReactNode;
+}
+
+declare interface UseTreeViewExpansionInstance {
+    isNodeExpanded: (nodeId: string) => boolean;
+    isNodeExpandable: (nodeId: string) => boolean;
+    toggleNodeExpansion: (event: React_3.SyntheticEvent, value: string) => void;
+    expandAllSiblings: (event: React_3.KeyboardEvent<HTMLUListElement>, nodeId: string) => void;
+}
+
+declare interface UseTreeViewExpansionParameters {
+    /**
+     * Expanded node ids.
+     * Used when the item's expansion is controlled.
+     */
+    expanded?: string[];
+    /**
+     * Expanded node ids.
+     * Used when the item's expansion is not controlled.
+     * @default []
+     */
+    defaultExpanded?: string[];
+    /**
+     * Callback fired when tree items are expanded/collapsed.
+     * @param {React.SyntheticEvent} event The event source of the callback.
+     * @param {array} nodeIds The ids of the expanded nodes.
+     */
+    onNodeToggle?: (event: React_3.SyntheticEvent, nodeIds: string[]) => void;
+}
+
+declare interface UseTreeViewFocusInstance {
+    isNodeFocused: (nodeId: string) => boolean;
+    focusNode: (event: React_3.SyntheticEvent, nodeId: string | null) => void;
+}
+
+declare interface UseTreeViewFocusParameters {
+    /**
+     * Callback fired when tree items are focused.
+     * @param {React.SyntheticEvent} event The event source of the callback **Warning**: This is a generic event not a focus event.
+     * @param {string} nodeId The id of the node focused.
+     * @param {string} value of the focused node.
+     */
+    onNodeFocus?: (event: React_3.SyntheticEvent, nodeId: string) => void;
+}
+
+declare interface UseTreeViewKeyboardNavigationInstance {
+    mapFirstChar: (nodeId: string, firstChar: string) => () => void;
+}
+
+declare interface UseTreeViewNodesInstance {
+    getNode: (nodeId: string) => TreeViewNode;
+    updateNode: (node: TreeViewNode) => void;
+    removeNode: (nodeId: string) => void;
+    getChildrenIds: (nodeId: string | null) => string[];
+    getNavigableChildrenIds: (nodeId: string | null) => string[];
+    isNodeDisabled: (nodeId: string | null) => nodeId is string;
+}
+
+declare interface UseTreeViewNodesParameters {
+    /**
+     * If `true`, will allow focus on disabled items.
+     * @default false
+     */
+    disabledItemsFocusable?: boolean;
+}
+
+declare interface UseTreeViewSelectionInstance {
+    isNodeSelected: (nodeId: string) => boolean;
+    selectNode: (event: React_3.SyntheticEvent, nodeId: string, multiple?: boolean) => void;
+    selectRange: (event: React_3.SyntheticEvent, nodes: TreeViewItemRange, stacked?: boolean) => void;
+    rangeSelectToFirst: (event: React_3.KeyboardEvent<HTMLUListElement>, nodeId: string) => void;
+    rangeSelectToLast: (event: React_3.KeyboardEvent<HTMLUListElement>, nodeId: string) => void;
+}
+
+declare interface UseTreeViewSelectionParameters<Multiple extends boolean | undefined> {
+    /**
+     * If `true` selection is disabled.
+     * @default false
+     */
+    disableSelection?: boolean;
+    /**
+     * Selected node ids. (Uncontrolled)
+     * When `multiSelect` is true this takes an array of strings; when false (default) a string.
+     * @default []
+     */
+    defaultSelected?: TreeViewSelectionValue<Multiple>;
+    /**
+     * Selected node ids. (Controlled)
+     * When `multiSelect` is true this takes an array of strings; when false (default) a string.
+     */
+    selected?: TreeViewSelectionValue<Multiple>;
+    /**
+     * If true `ctrl` and `shift` will trigger multiselect.
+     * @default false
+     */
+    multiSelect?: Multiple;
+    /**
+     * Callback fired when tree items are selected/unselected.
+     * @param {React.SyntheticEvent} event The event source of the callback
+     * @param {string[] | string} nodeIds Ids of the selected nodes. When `multiSelect` is true
+     * this is an array of strings; when false (default) a string.
+     */
+    onNodeSelect?: (event: React_3.SyntheticEvent, nodeIds: Exclude<TreeViewSelectionValue<Multiple>, null>) => void;
+}
+
 export declare const useUniqueId: (id?: string, idPrefix?: string) => string;
 
 export declare const useWidth: () => Breakpoint_2;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hitachivantara/uikit-react-core",
-  "version": "5.36.2",
+  "version": "5.36.3",
   "private": false,
   "author": "Hitachi Vantara UI Kit Team",
   "description": "Core React components for the NEXT Design System.",
@@ -33,12 +33,11 @@
     "@emotion/css": "^11.11.0",
     "@emotion/serialize": "^1.1.2",
     "@emotion/utils": "^1.2.1",
-    "@hitachivantara/uikit-react-icons": "^5.7.1",
-    "@hitachivantara/uikit-react-shared": "^5.1.16",
-    "@hitachivantara/uikit-styles": "^5.16.0",
+    "@hitachivantara/uikit-react-icons": "^5.7.2",
+    "@hitachivantara/uikit-react-shared": "^5.1.17",
+    "@hitachivantara/uikit-styles": "^5.16.1",
     "@internationalized/date": "^3.2.0",
     "@mui/base": "^5.0.0-beta.4",
-    "@mui/x-tree-view": "6.0.0-beta.0",
     "@popperjs/core": "^2.11.8",
     "@react-aria/datepicker": "^3.4.1",
     "@react-stately/datepicker": "^3.4.1",
@@ -65,7 +64,7 @@
     "access": "public",
     "directory": "package"
   },
-  "gitHead": "e275b72fdcf3da36dc5139ed37d2f3a7e7b240c9",
+  "gitHead": "1464c1eda257df2ecca90646bc1e01474bc69d67",
   "main": "dist/cjs/index.cjs",
   "exports": {
     ".": {

package/dist/cjs/components/TreeView/internals.cjs

@@ -1,30 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const useTreeViewContext = require("@mui/x-tree-view/internals/TreeViewProvider/useTreeViewContext");
-const TreeViewProvider = require("@mui/x-tree-view/internals/TreeViewProvider");
-const DescendantProvider = require("@mui/x-tree-view/internals/TreeViewProvider/DescendantProvider");
-const defaultPlugins = require("@mui/x-tree-view/internals/plugins/defaultPlugins");
-const useTreeView = require("@mui/x-tree-view/internals/useTreeView");
-const HV_TREE_VIEW_PLUGINS = [...defaultPlugins.DEFAULT_TREE_VIEW_PLUGINS];
-Object.defineProperty(exports, "useTreeViewContext", {
-  enumerable: true,
-  get: () => useTreeViewContext.useTreeViewContext
-});
-Object.defineProperty(exports, "TreeViewProvider", {
-  enumerable: true,
-  get: () => TreeViewProvider.TreeViewProvider
-});
-Object.defineProperty(exports, "DescendantProvider", {
-  enumerable: true,
-  get: () => DescendantProvider.DescendantProvider
-});
-Object.defineProperty(exports, "useDescendant", {
-  enumerable: true,
-  get: () => DescendantProvider.useDescendant
-});
-Object.defineProperty(exports, "useTreeView", {
-  enumerable: true,
-  get: () => useTreeView.useTreeView
-});
-exports.HV_TREE_VIEW_PLUGINS = HV_TREE_VIEW_PLUGINS;
-//# sourceMappingURL=internals.cjs.map

package/dist/cjs/components/TreeView/internals.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"internals.cjs","sources":["../../../../src/components/TreeView/internals.ts"],"sourcesContent":["import { useTreeViewContext } from \"@mui/x-tree-view/internals/TreeViewProvider/useTreeViewContext\";\nimport { TreeViewProvider } from \"@mui/x-tree-view/internals/TreeViewProvider\";\nimport {\n  DescendantProvider,\n  TreeItemDescendant,\n  useDescendant,\n} from \"@mui/x-tree-view/internals/TreeViewProvider/DescendantProvider\";\nimport {\n  DEFAULT_TREE_VIEW_PLUGINS,\n  DefaultTreeViewPlugins,\n  DefaultTreeViewPluginParameters,\n} from \"@mui/x-tree-view/internals/plugins/defaultPlugins\";\nimport { useTreeView } from \"@mui/x-tree-view/internals/useTreeView\";\n\nexport type {\n  DefaultTreeViewPlugins as HvTreeViewPlugins,\n  DefaultTreeViewPluginParameters as HvTreeViewPluginParameters,\n  TreeItemDescendant,\n};\n\nexport const HV_TREE_VIEW_PLUGINS = [...DEFAULT_TREE_VIEW_PLUGINS] as const;\n\nexport {\n  DescendantProvider,\n  TreeViewProvider,\n  useDescendant,\n  useTreeView,\n  useTreeViewContext,\n};\n"],"names":["HV_TREE_VIEW_PLUGINS","DEFAULT_TREE_VIEW_PLUGINS"],"mappings":";;;;;;;AAoBaA,MAAAA,uBAAuB,CAAC,GAAGC,eAAyB,yBAAA;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/esm/components/TreeView/internals.js

@@ -1,15 +0,0 @@
-import { useTreeViewContext } from "@mui/x-tree-view/internals/TreeViewProvider/useTreeViewContext";
-import { TreeViewProvider } from "@mui/x-tree-view/internals/TreeViewProvider";
-import { DescendantProvider, useDescendant } from "@mui/x-tree-view/internals/TreeViewProvider/DescendantProvider";
-import { DEFAULT_TREE_VIEW_PLUGINS } from "@mui/x-tree-view/internals/plugins/defaultPlugins";
-import { useTreeView } from "@mui/x-tree-view/internals/useTreeView";
-const HV_TREE_VIEW_PLUGINS = [...DEFAULT_TREE_VIEW_PLUGINS];
-export {
-  DescendantProvider,
-  HV_TREE_VIEW_PLUGINS,
-  TreeViewProvider,
-  useDescendant,
-  useTreeView,
-  useTreeViewContext
-};
-//# sourceMappingURL=internals.js.map

package/dist/esm/components/TreeView/internals.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"internals.js","sources":["../../../../src/components/TreeView/internals.ts"],"sourcesContent":["import { useTreeViewContext } from \"@mui/x-tree-view/internals/TreeViewProvider/useTreeViewContext\";\nimport { TreeViewProvider } from \"@mui/x-tree-view/internals/TreeViewProvider\";\nimport {\n  DescendantProvider,\n  TreeItemDescendant,\n  useDescendant,\n} from \"@mui/x-tree-view/internals/TreeViewProvider/DescendantProvider\";\nimport {\n  DEFAULT_TREE_VIEW_PLUGINS,\n  DefaultTreeViewPlugins,\n  DefaultTreeViewPluginParameters,\n} from \"@mui/x-tree-view/internals/plugins/defaultPlugins\";\nimport { useTreeView } from \"@mui/x-tree-view/internals/useTreeView\";\n\nexport type {\n  DefaultTreeViewPlugins as HvTreeViewPlugins,\n  DefaultTreeViewPluginParameters as HvTreeViewPluginParameters,\n  TreeItemDescendant,\n};\n\nexport const HV_TREE_VIEW_PLUGINS = [...DEFAULT_TREE_VIEW_PLUGINS] as const;\n\nexport {\n  DescendantProvider,\n  TreeViewProvider,\n  useDescendant,\n  useTreeView,\n  useTreeViewContext,\n};\n"],"names":["HV_TREE_VIEW_PLUGINS","DEFAULT_TREE_VIEW_PLUGINS"],"mappings":";;;;;AAoBaA,MAAAA,uBAAuB,CAAC,GAAGC,yBAAyB;"}