@carbon/react 1.63.1 → 1.64.0-rc.0

package/es/components/MultiSelect/MultiSelect.js

@@ -311,7 +311,7 @@ const MultiSelect = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
         setIsOpenWrapper(changes.isOpen || false);
         return {
           ...changes,
-          highlightedIndex: 0
+          highlightedIndex: controlledSelectedItems.length > 0 ? 0 : undefined
         };
       case ItemClick:
         setHighlightedIndex(changes.selectedItem);
@@ -386,7 +386,7 @@ const MultiSelect = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
 
   // Slug is always size `mini`
   let normalizedSlug;
-  if (slug && slug['type']?.displayName === 'Slug') {
+  if (slug && slug['type']?.displayName === 'AILabel') {
     normalizedSlug = /*#__PURE__*/React__default.cloneElement(slug, {
       size: 'mini'
     });
@@ -506,7 +506,8 @@ MultiSelect.propTypes = {
   clearSelectionText: PropTypes.string,
   /**
    * Provide a compare function that is used to determine the ordering of
-   * options. See 'sortItems' for more control.
+   * options. See 'sortItems' for more control. Consider
+   * declaring function with `useCallback` to prevent unnecessary re-renders.
    */
   compareItems: PropTypes.func,
   /**
@@ -518,10 +519,12 @@ MultiSelect.propTypes = {
    */
   disabled: PropTypes.bool,
   /**
-   * Additional props passed to Downshift. Use with caution: anything you define
-   * here overrides the components' internal handling of that prop. Downshift
-   * internals are subject to change, and in some cases they can not be shimmed
-   * to shield you from potentially breaking changes.
+   * Additional props passed to Downshift.
+   *
+   * **Use with caution:** anything you define here overrides the components'
+   * internal handling of that prop. Downshift APIs and internals are subject to
+   * change, and in some cases they can not be shimmed by Carbon to shield you
+   * from potentially breaking changes.
    */
   downshiftProps: PropTypes.object,
   /**
@@ -558,7 +561,8 @@ MultiSelect.propTypes = {
   /**
    * Helper function passed to downshift that allows the library to render a
    * given item to a string label. By default, it extracts the `label` field
-   * from a given item to serve as the item label in the list.
+   * from a given item to serve as the item label in the list. Consider
+   * declaring function with `useCallback` to prevent unnecessary re-renders.
    */
   itemToString: PropTypes.func,
   /**

package/es/components/NumberInput/NumberInput.js

@@ -180,7 +180,7 @@ const NumberInput = /*#__PURE__*/React__default.forwardRef(function NumberInput(
 
   // Slug is always size `mini`
   let normalizedSlug;
-  if (slug && slug['type']?.displayName === 'Slug') {
+  if (slug && slug['type']?.displayName === 'AILabel') {
     normalizedSlug = /*#__PURE__*/React__default.cloneElement(slug, {
       size: 'mini'
     });
@@ -188,7 +188,7 @@ const NumberInput = /*#__PURE__*/React__default.forwardRef(function NumberInput(
 
   // Need to update the internal value when the revert button is clicked
   let isRevertActive;
-  if (slug && slug['type']?.displayName === 'Slug') {
+  if (slug && slug['type']?.displayName === 'AILabel') {
     isRevertActive = normalizedSlug.props.revertActive;
   }
   useEffect(() => {

package/es/components/OverflowMenu/OverflowMenu.js

@@ -405,7 +405,8 @@ class OverflowMenu extends React__default.Component {
       id: id,
       ref: mergeRefs(this._triggerRef, ref),
       size: size,
-      label: iconDescription
+      label: iconDescription,
+      kind: "ghost"
     }), /*#__PURE__*/React__default.createElement(IconElement, iconProps)), open && this.state.hasMountedTrigger && wrappedMenuBody));
   }
 }

package/es/components/OverflowMenu/next/index.js

@@ -96,7 +96,8 @@ const OverflowMenu = /*#__PURE__*/React__default.forwardRef(function OverflowMen
     onMouseDown: handleMousedown,
     ref: floatingRef,
     label: label,
-    align: tooltipAlignment
+    align: tooltipAlignment,
+    kind: "ghost"
   }, /*#__PURE__*/React__default.createElement(IconElement, {
     className: `${prefix}--overflow-menu__icon`
   })), /*#__PURE__*/React__default.createElement(Menu, {

package/es/components/RadioButtonGroup/RadioButtonGroup.js

@@ -101,7 +101,7 @@ const RadioButtonGroup = /*#__PURE__*/React__default.forwardRef((props, ref) =>
 
   // Slug is always size `mini`
   let normalizedSlug;
-  if (slug && slug['type']?.displayName === 'Slug') {
+  if (slug && slug['type']?.displayName === 'AILabel') {
     normalizedSlug = /*#__PURE__*/React__default.cloneElement(slug, {
       size: 'mini',
       kind: 'default'

package/es/components/RadioTile/RadioTile.js

@@ -71,7 +71,7 @@ const RadioTile = /*#__PURE__*/React__default.forwardRef(function RadioTile(_ref
 
   // Slug is always size `xs`
   let normalizedSlug;
-  if (slug && slug['type']?.displayName === 'Slug') {
+  if (slug && slug['type']?.displayName === 'AILabel') {
     normalizedSlug = /*#__PURE__*/React__default.cloneElement(slug, {
       size: 'xs'
     });

package/es/components/Select/Select.js

@@ -125,7 +125,7 @@ const Select = /*#__PURE__*/React__default.forwardRef(function Select(_ref, ref)
 
   // Slug is always size `mini`
   let normalizedSlug;
-  if (slug && slug['type']?.displayName === 'Slug') {
+  if (slug && slug['type']?.displayName === 'AILabel') {
     normalizedSlug = /*#__PURE__*/React__default.cloneElement(slug, {
       size: 'mini'
     });

package/es/components/Tabs/Tabs.js

@@ -11,7 +11,7 @@ import { breakpoints } from '@carbon/layout';
 import cx from 'classnames';
 import debounce from 'lodash.debounce';
 import PropTypes from 'prop-types';
-import React__default, { useState, useRef, useCallback, useEffect, forwardRef, useLayoutEffect } from 'react';
+import React__default, { useState, useRef, useCallback, useEffect, forwardRef } from 'react';
 import '../Grid/FlexGrid.js';
 import { Grid as GridAsGridComponent } from '../Grid/Grid.js';
 import '../Grid/Row.js';
@@ -787,7 +787,7 @@ const Tab = /*#__PURE__*/forwardRef(function Tab(_ref8, forwardRef) {
   };
   useEvent(dismissIconRef, 'mouseover', onDismissIconMouseEnter);
   useEvent(dismissIconRef, 'mouseleave', onDismissIconMouseLeave);
-  useLayoutEffect(() => {
+  useIsomorphicEffect(() => {
     function handler() {
       const elementTabId = document.getElementById(`${id}`) || tabRef.current;
       if (elementTabId?.closest(`.${prefix}--tabs--vertical`)) {
@@ -1128,7 +1128,7 @@ function TabPanels(_ref11) {
   const prefix = usePrefix();
   const refs = useRef([]);
   const hiddenStates = useRef([]);
-  useLayoutEffect(() => {
+  useIsomorphicEffect(() => {
     const tabContainer = refs.current[0]?.previousElementSibling;
     const isVertical = tabContainer?.classList.contains(`${prefix}--tabs--vertical`);
     const parentHasHeight = tabContainer?.parentElement?.style.height;

package/es/components/Tag/DismissibleTag.js

@@ -50,7 +50,7 @@ const DismissibleTag = _ref => {
     }
   };
   let normalizedSlug;
-  if (slug && slug['type']?.displayName === 'Slug') {
+  if (slug && slug['type']?.displayName === 'AILabel') {
     normalizedSlug = /*#__PURE__*/React__default.cloneElement(slug, {
       size: 'sm',
       kind: 'inline'

package/es/components/Tag/OperationalTag.js

@@ -52,7 +52,7 @@ const OperationalTag = _ref => {
     setIsEllipsisApplied(isEllipsisActive(newElement));
   }, [prefix, tagRef]);
   let normalizedSlug;
-  if (slug && slug['type']?.displayName === 'Slug') {
+  if (slug && slug['type']?.displayName === 'AILabel') {
     normalizedSlug = /*#__PURE__*/React__default.cloneElement(slug, {
       size: 'sm',
       kind: 'inline'

package/es/components/Tag/SelectableTag.js

@@ -43,7 +43,7 @@ const SelectableTag = _ref => {
     setIsEllipsisApplied(isEllipsisActive(newElement));
   }, [prefix, tagRef]);
   let normalizedSlug;
-  if (slug && slug['type']?.displayName === 'Slug') {
+  if (slug && slug['type']?.displayName === 'AILabel') {
     normalizedSlug = /*#__PURE__*/React__default.cloneElement(slug, {
       size: 'sm',
       kind: 'inline'
@@ -65,6 +65,7 @@ const SelectableTag = _ref => {
       leaveDelayMs: 0,
       onMouseEnter: () => false
     }, /*#__PURE__*/React__default.createElement(Tag, _extends({
+      "aria-pressed": selectedTag,
       ref: tagRef,
       slug: slug,
       size: size,
@@ -79,6 +80,7 @@ const SelectableTag = _ref => {
     }, text), normalizedSlug));
   }
   return /*#__PURE__*/React__default.createElement(Tag, _extends({
+    "aria-pressed": selectedTag,
     ref: tagRef,
     slug: slug,
     size: size,

package/es/components/Tag/Tag.js

@@ -89,7 +89,7 @@ const Tag = /*#__PURE__*/React__default.forwardRef(function Tag(_ref, forwardRef
 
   // Slug is always size `md` and `inline`
   let normalizedSlug;
-  if (slug && slug['type']?.displayName === 'Slug' && !isInteractiveTag) {
+  if (slug && slug['type']?.displayName === 'AILabel' && !isInteractiveTag) {
     normalizedSlug = /*#__PURE__*/React__default.cloneElement(slug, {
       size: 'sm',
       kind: 'inline'

package/es/components/TextArea/TextArea.js

@@ -255,7 +255,7 @@ const TextArea = /*#__PURE__*/React__default.forwardRef((props, forwardRef) => {
 
   // Slug is always size `mini`
   let normalizedSlug;
-  if (slug && slug['type']?.displayName === 'Slug') {
+  if (slug && slug['type']?.displayName === 'AILabel') {
     normalizedSlug = /*#__PURE__*/React__default.cloneElement(slug, {
       size: 'mini'
     });

package/es/components/TextInput/PasswordInput.js

@@ -148,6 +148,11 @@ const PasswordInput = /*#__PURE__*/React__default.forwardRef(function PasswordIn
   if (tooltipPosition === 'right' || tooltipPosition === 'left') {
     align = tooltipPosition;
   }
+  if (!hidePasswordLabel || hidePasswordLabel.trim() === '') {
+    console.warn('Warning: The "hidePasswordLabel" should not be blank.');
+  } else if (!showPasswordLabel || showPasswordLabel.trim() === '') {
+    console.warn('Warning: The "showPasswordLabel" should not be blank.');
+  }
   const input = /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("input", _extends({}, textInputProps({
     sharedTextInputProps,
     invalid: normalizedProps.invalid,

package/es/components/TextInput/TextInput.js

@@ -181,7 +181,7 @@ const TextInput = /*#__PURE__*/React__default.forwardRef(function TextInput(_ref
 
   // Slug is always size `mini`
   let normalizedSlug;
-  if (slug && slug['type']?.displayName === 'Slug') {
+  if (slug && slug['type']?.displayName === 'AILabel') {
     normalizedSlug = /*#__PURE__*/React__default.cloneElement(slug, {
       size: 'mini'
     });

package/es/components/Tile/Tile.js

@@ -269,7 +269,7 @@ const SelectableTile = /*#__PURE__*/React__default.forwardRef(function Selectabl
   // Slug is always size `xs`
   const slugRef = useRef(null);
   let normalizedSlug;
-  if (slug && slug['type']?.displayName === 'Slug') {
+  if (slug && slug['type']?.displayName === 'AILabel') {
     normalizedSlug = /*#__PURE__*/React__default.cloneElement(slug, {
       size: 'xs',
       ref: slugRef
@@ -495,7 +495,7 @@ const ExpandableTile = /*#__PURE__*/React__default.forwardRef(function Expandabl
 
   // Slug is always size `xs`
   let normalizedSlug;
-  if (slug && slug['type']?.displayName === 'Slug') {
+  if (slug && slug['type']?.displayName === 'AILabel') {
     normalizedSlug = /*#__PURE__*/React__default.cloneElement(slug, {
       size: 'xs'
     });

package/es/components/TreeView/TreeNode.d.ts

@@ -0,0 +1,150 @@
+/**
+ * Copyright IBM Corp. 2016, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import React, { ComponentType, FunctionComponent } from 'react';
+export type TreeNodeProps = {
+    /**
+     * **Note:** this is controlled by the parent TreeView component, do not set manually.
+     * The ID of the active node in the tree
+     */
+    active?: string | number;
+    /**
+     * Specify the children of the TreeNode
+     */
+    children?: React.ReactNode;
+    /**
+     * Specify an optional className to be applied to the TreeNode
+     */
+    className?: string;
+    /**
+     * **[Experimental]** The default expansion state of the node.
+     * *This is only supported with the `enable-treeview-controllable` feature flag!*
+     */
+    defaultIsExpanded?: boolean;
+    /**
+     * **Note:** this is controlled by the parent TreeView component, do not set manually.
+     * TreeNode depth to determine spacing
+     */
+    depth?: number;
+    /**
+     * Specify if the TreeNode is disabled
+     */
+    disabled?: boolean;
+    /**
+     * Specify the TreeNode's ID. Must be unique in the DOM and is used for props.active and props.selected
+     */
+    id?: string;
+    /**
+     * Specify if the TreeNode is expanded (only applicable to parent nodes)
+     */
+    isExpanded?: boolean;
+    /**
+     * Rendered label for the TreeNode
+     */
+    label: React.ReactNode;
+    /**
+     * Callback function for when the node receives or loses focus
+     */
+    onNodeFocusEvent?: (event: React.FocusEvent<HTMLLIElement>) => void;
+    /**
+     * Callback function for when the node is selected
+     */
+    onSelect?: (event: React.MouseEvent, node?: TreeNodeProps) => void;
+    /**
+     * Callback function for when a parent node is expanded or collapsed
+     */
+    onToggle?: (event: React.MouseEvent, node?: TreeNodeProps) => void;
+    /**
+     * Callback function for when any node in the tree is selected
+     */
+    onTreeSelect?: (event: React.MouseEvent, node?: TreeNodeProps) => void;
+    /**
+     * Optional prop to allow each node to have an associated icon.
+     * Can be a React component class
+     */
+    renderIcon?: ComponentType | FunctionComponent;
+    /**
+     * **Note:** this is controlled by the parent TreeView component, do not set manually.
+     * Array containing all selected node IDs in the tree
+     */
+    selected?: Array<string | number>;
+    /**
+     * Specify the value of the TreeNode
+     */
+    value?: string;
+} & Omit<React.LiHTMLAttributes<HTMLLIElement>, 'onSelect'>;
+declare const TreeNode: React.ForwardRefExoticComponent<{
+    /**
+     * **Note:** this is controlled by the parent TreeView component, do not set manually.
+     * The ID of the active node in the tree
+     */
+    active?: string | number | undefined;
+    /**
+     * Specify the children of the TreeNode
+     */
+    children?: React.ReactNode;
+    /**
+     * Specify an optional className to be applied to the TreeNode
+     */
+    className?: string | undefined;
+    /**
+     * **[Experimental]** The default expansion state of the node.
+     * *This is only supported with the `enable-treeview-controllable` feature flag!*
+     */
+    defaultIsExpanded?: boolean | undefined;
+    /**
+     * **Note:** this is controlled by the parent TreeView component, do not set manually.
+     * TreeNode depth to determine spacing
+     */
+    depth?: number | undefined;
+    /**
+     * Specify if the TreeNode is disabled
+     */
+    disabled?: boolean | undefined;
+    /**
+     * Specify the TreeNode's ID. Must be unique in the DOM and is used for props.active and props.selected
+     */
+    id?: string | undefined;
+    /**
+     * Specify if the TreeNode is expanded (only applicable to parent nodes)
+     */
+    isExpanded?: boolean | undefined;
+    /**
+     * Rendered label for the TreeNode
+     */
+    label: React.ReactNode;
+    /**
+     * Callback function for when the node receives or loses focus
+     */
+    onNodeFocusEvent?: ((event: React.FocusEvent<HTMLLIElement>) => void) | undefined;
+    /**
+     * Callback function for when the node is selected
+     */
+    onSelect?: ((event: React.MouseEvent, node?: TreeNodeProps) => void) | undefined;
+    /**
+     * Callback function for when a parent node is expanded or collapsed
+     */
+    onToggle?: ((event: React.MouseEvent, node?: TreeNodeProps) => void) | undefined;
+    /**
+     * Callback function for when any node in the tree is selected
+     */
+    onTreeSelect?: ((event: React.MouseEvent, node?: TreeNodeProps) => void) | undefined;
+    /**
+     * Optional prop to allow each node to have an associated icon.
+     * Can be a React component class
+     */
+    renderIcon?: React.ComponentType<{}> | undefined;
+    /**
+     * **Note:** this is controlled by the parent TreeView component, do not set manually.
+     * Array containing all selected node IDs in the tree
+     */
+    selected?: (string | number)[] | undefined;
+    /**
+     * Specify the value of the TreeNode
+     */
+    value?: string | undefined;
+} & Omit<React.LiHTMLAttributes<HTMLLIElement>, "onSelect"> & React.RefAttributes<HTMLLIElement>>;
+export default TreeNode;

package/es/components/TreeView/TreeNode.js

@@ -6,13 +6,13 @@
  */
 
 import { extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
-import React__default, { useRef, useState, useEffect } from 'react';
-import PropTypes from 'prop-types';
 import { CaretDown } from '@carbon/icons-react';
 import cx from 'classnames';
-import uniqueId from '../../tools/uniqueId.js';
-import { usePrefix } from '../../internal/usePrefix.js';
+import PropTypes from 'prop-types';
+import React__default, { useRef, useState, useEffect } from 'react';
 import { useControllableState } from '../../internal/useControllableState.js';
+import { usePrefix } from '../../internal/usePrefix.js';
+import uniqueId from '../../tools/uniqueId.js';
 import { useFeatureFlag } from '../FeatureFlags/index.js';
 import { matches, match } from '../../internal/keyboard/match.js';
 import { ArrowLeft, ArrowRight, Enter, Space } from '../../internal/keyboard/keys.js';
@@ -22,7 +22,7 @@ const TreeNode = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
     active,
     children,
     className,
-    depth,
+    depth: propDepth,
     disabled,
     id: nodeId,
     isExpanded,
@@ -33,10 +33,13 @@ const TreeNode = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
     onToggle,
     onTreeSelect,
     renderIcon: Icon,
-    selected,
+    selected: propSelected,
     value,
     ...rest
   } = _ref;
+  // These are provided by the parent TreeView component
+  const depth = propDepth;
+  const selected = propSelected;
   const enableTreeviewControllable = useFeatureFlag('enable-treeview-controllable');
   const {
     current: id
@@ -141,7 +144,7 @@ const TreeNode = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
          * When focus is on a leaf node or a closed parent node, move focus to
          * its parent node (unless its depth is level 1)
          */
-        findParentTreeNode(currentNode.current.parentNode)?.focus();
+        findParentTreeNode(currentNode.current?.parentNode)?.focus();
       }
     }
     if (children && match(event, ArrowRight)) {
@@ -150,7 +153,7 @@ const TreeNode = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
          * When focus is on an expanded parent node, move focus to the first
          * child node
          */
-        currentNode.current.lastChild.firstChild.focus();
+        (currentNode.current?.lastChild?.firstChild).focus();
       } else {
         if (!enableTreeviewControllable) {
           onToggle?.(event, {
@@ -217,8 +220,8 @@ const TreeNode = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
   }, [children, depth, Icon, isExpanded, enableTreeviewControllable, setExpanded]);
   const treeNodeProps = {
     ...rest,
-    ['aria-current']: isActive || null,
-    ['aria-selected']: disabled ? null : isSelected,
+    ['aria-current']: isActive || undefined,
+    ['aria-selected']: disabled ? undefined : isSelected,
     ['aria-disabled']: disabled,
     className: treeNodeClasses,
     id,
@@ -226,8 +229,9 @@ const TreeNode = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
     onClick: handleClick,
     onFocus: handleFocusEvent,
     onKeyDown: handleKeyDown,
-    ref: currentNode,
-    role: 'treeitem'
+    role: 'treeitem',
+    // @ts-ignore
+    ref: currentNode
   };
   if (!children) {
     return /*#__PURE__*/React__default.createElement("li", treeNodeProps, /*#__PURE__*/React__default.createElement("div", {
@@ -247,7 +251,9 @@ const TreeNode = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
       className: `${prefix}--tree-node__label`,
       ref: currentNodeLabel
     }, /*#__PURE__*/React__default.createElement("span", {
-      className: `${prefix}--tree-parent-node__toggle`,
+      className: `${prefix}--tree-parent-node__toggle`
+      // @ts-ignore
+      ,
       disabled: disabled,
       onClick: handleToggleClick
     }, /*#__PURE__*/React__default.createElement(CaretDown, {
@@ -322,11 +328,13 @@ TreeNode.propTypes = {
    * Optional prop to allow each node to have an associated icon.
    * Can be a React component class
    */
+  // @ts-ignore
   renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
   /**
    * **Note:** this is controlled by the parent TreeView component, do not set manually.
    * Array containing all selected node IDs in the tree
    */
+  // @ts-ignore
   selected: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])),
   /**
    * Specify the value of the TreeNode
@@ -334,6 +342,5 @@ TreeNode.propTypes = {
   value: PropTypes.string
 };
 TreeNode.displayName = 'TreeNode';
-var TreeNode$1 = TreeNode;
 
-export { TreeNode$1 as default };
+export { TreeNode as default };

package/es/components/TreeView/TreeView.d.ts

@@ -0,0 +1,59 @@
+/**
+ * Copyright IBM Corp. 2016, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import React from 'react';
+import TreeNode from './TreeNode';
+export type TreeViewProps = {
+    /**
+     * Mark the active node in the tree, represented by its ID
+     */
+    active?: string | number;
+    /**
+     * Specify the children of the TreeView
+     */
+    children?: React.ReactNode;
+    /**
+     * Specify an optional className to be applied to the TreeView
+     */
+    className?: string;
+    /**
+     * Specify whether or not the label should be hidden
+     */
+    hideLabel?: boolean;
+    /**
+     * Provide the label text that will be read by a screen reader
+     */
+    label: string;
+    /**
+     * **[Experimental]** Specify the selection mode of the tree.
+     * If `multiselect` is `false` then only one node can be selected at a time
+     */
+    multiselect?: boolean;
+    /**
+     * **[Experimental]** Callback function that is called when any node is activated.
+     * *This is only supported with the `enable-treeview-controllable` feature flag!*
+     */
+    onActivate?: (activated?: string | number) => void;
+    /**
+     * Callback function that is called when any node is selected
+     */
+    onSelect?: (selected: Array<string | number>, payload: any) => void;
+    /**
+     * Array representing all selected node IDs in the tree
+     */
+    selected?: Array<string | number>;
+    /**
+     * Specify the size of the tree from a list of available sizes.
+     */
+    size?: 'xs' | 'sm';
+} & React.HTMLAttributes<HTMLUListElement>;
+type TreeViewComponent = {
+    (props: TreeViewProps): JSX.Element;
+    propTypes?: any;
+    TreeNode: typeof TreeNode;
+};
+declare const TreeView: TreeViewComponent;
+export default TreeView;