diff --git a/src/components/TreePicker/TreePickerHeader.jsx b/src/components/TreePicker/TreePickerHeader.jsx
index 96586376d..095edc46e 100644
--- a/src/components/TreePicker/TreePickerHeader.jsx
+++ b/src/components/TreePicker/TreePickerHeader.jsx
@@ -4,6 +4,7 @@ import cc from 'classnames';
import _ from 'lodash';
import Button from '../Button';
import { useTreePickerGetState, useTreePickerSlice } from './TreePickerContext';
+import { expandDts } from '../../utils';
import './TreePickerHeader.css';
@@ -37,13 +38,13 @@ const getCurrentNodeHeader = (state) => {
return currentNode?.header;
};
-const TreePickerHeader = ({ children, className, label }) => {
+const TreePickerHeader = ({ children, className, label, dts }) => {
const header = useTreePickerSlice(getCurrentNodeHeader);
const finalLabel = !_.isUndefined(header) ? header : label;
return !finalLabel ? null : (
-
+
{finalLabel}
{children ??
}
@@ -54,6 +55,7 @@ TreePickerHeader.propTypes = {
label: PropTypes.node,
children: PropTypes.node,
className: PropTypes.string,
+ dts: PropTypes.string,
};
export default TreePickerHeader;
diff --git a/src/components/TreePicker/TreePickerNode.jsx b/src/components/TreePicker/TreePickerNode.jsx
index bf32f63a1..592dfa01e 100644
--- a/src/components/TreePicker/TreePickerNode.jsx
+++ b/src/components/TreePicker/TreePickerNode.jsx
@@ -16,6 +16,7 @@ import {
useHiddenById,
useTreePickerSlice,
} from './TreePickerContext';
+import { expandDts } from '../../utils';
import './TreePickerNode.css';
@@ -23,7 +24,7 @@ const TreePickerNodeContext = React.createContext({ level: 0 });
export const useTreePickerNode = () => React.useContext(TreePickerNodeContext);
-const TreePickerNode = ({ className, children, node }) => {
+const TreePickerNode = ({ className, children, node, dts }) => {
const { goTo } = useInternalActions();
const [state, setState] = React.useState(() => ({ expanded: false, subNodes: [] }));
@@ -61,7 +62,9 @@ const TreePickerNode = ({ className, children, node }) => {
return (
- {children}
+
+ {children}
+
{state.subNodes.length === 0 ? null : }
);
@@ -73,6 +76,7 @@ TreePickerNode.propTypes = {
id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
label: PropTypes.string.isRequired,
}).isRequired,
+ dts: PropTypes.string,
};
const TreePickerNodeBranch = ({ nodes }) => {
diff --git a/src/components/TreePicker/TreePickerTree.jsx b/src/components/TreePicker/TreePickerTree.jsx
index 5391eb321..8b858d61b 100644
--- a/src/components/TreePicker/TreePickerTree.jsx
+++ b/src/components/TreePicker/TreePickerTree.jsx
@@ -13,6 +13,7 @@ import {
HiddenByIdCtx,
} from './TreePickerContext';
import TreePickerNode from './TreePickerNode';
+import { expandDts } from '../../utils';
import './TreePickerTree.css';
@@ -71,6 +72,7 @@ const TreePickerTree = ({
className,
resolveRootNodes,
hiddenNodeIds,
+ dts,
placeholder = defaultPlaceholder,
emptyState = defaultEmptyState,
}) => {
@@ -114,7 +116,7 @@ const TreePickerTree = ({
return (
-
+
{isResolvingRoot ? placeholder : visibleNodes.length === 0 ? emptyState : visibleNodes.map(renderNode)}
@@ -127,6 +129,7 @@ TreePickerTree.propTypes = {
resolveRootNodes: PropTypes.func.isRequired,
placeholder: PropTypes.node,
emptyState: PropTypes.node,
+ dts: PropTypes.string,
};
TreePickerTree.Placeholder = TreePickerTreePlaceholder;
diff --git a/src/components/TreePicker/index.d.ts b/src/components/TreePicker/index.d.ts
index 8ab022d4c..b03694965 100644
--- a/src/components/TreePicker/index.d.ts
+++ b/src/components/TreePicker/index.d.ts
@@ -40,6 +40,7 @@ export interface TreePickerNodeProps {
node: TreePickerNodeNode;
children: React.ReactNode;
className?: string;
+ dts?: string;
}
declare const TreePickerNode: React.FC
& {
@@ -61,6 +62,7 @@ export interface TreePickerHeaderProps {
label?: React.ReactNode;
children?: React.ReactNode;
className?: string;
+ dts?: string;
}
declare const TreePickerHeader: React.FC;
@@ -79,6 +81,7 @@ export interface TreePickerTreeProps {
hiddenNodeIds?: string[];
placeholder?: React.ReactNode;
emptyState?: React.ReactNode;
+ dts?: string;
}
declare const TreePickerTree: React.FC;