@elliemae/ds-treeview 3.12.0-rc.2 → 3.12.0-rc.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (61) hide show
  1. package/dist/cjs/TreeView.js +1 -4
  2. package/dist/cjs/TreeView.js.map +1 -1
  3. package/dist/cjs/config/useTreeview.js +1 -1
  4. package/dist/cjs/config/useTreeview.js.map +2 -2
  5. package/dist/cjs/hoc/WithConditionalDnDContext.js +24 -31
  6. package/dist/cjs/hoc/WithConditionalDnDContext.js.map +1 -1
  7. package/dist/cjs/hoc/WithDnDSortableItemContext.js +1 -6
  8. package/dist/cjs/hoc/WithDnDSortableItemContext.js.map +1 -1
  9. package/dist/cjs/parts/CheckboxSelectable.js +5 -4
  10. package/dist/cjs/parts/CheckboxSelectable.js.map +1 -1
  11. package/dist/cjs/parts/ChildrenCountDisplayer.js +4 -8
  12. package/dist/cjs/parts/ChildrenCountDisplayer.js.map +1 -1
  13. package/dist/cjs/parts/DnDHandle.js +19 -16
  14. package/dist/cjs/parts/DnDHandle.js.map +1 -1
  15. package/dist/cjs/parts/DropIndicator.js +5 -21
  16. package/dist/cjs/parts/DropIndicator.js.map +1 -1
  17. package/dist/cjs/parts/ExpandCaret.js +32 -38
  18. package/dist/cjs/parts/ExpandCaret.js.map +1 -1
  19. package/dist/cjs/parts/NestingSpace.js +1 -4
  20. package/dist/cjs/parts/NestingSpace.js.map +1 -1
  21. package/dist/cjs/parts/RadioSelectable.js +12 -9
  22. package/dist/cjs/parts/RadioSelectable.js.map +1 -1
  23. package/dist/cjs/parts/TreeItem.js +38 -60
  24. package/dist/cjs/parts/TreeItem.js.map +1 -1
  25. package/dist/cjs/parts/TreeItemText.js +39 -53
  26. package/dist/cjs/parts/TreeItemText.js.map +1 -1
  27. package/dist/cjs/parts/TreeList.js +61 -62
  28. package/dist/cjs/parts/TreeList.js.map +1 -1
  29. package/dist/cjs/related-components/TreeViewSearchBar.js +14 -11
  30. package/dist/cjs/related-components/TreeViewSearchBar.js.map +1 -1
  31. package/dist/esm/TreeView.js +1 -4
  32. package/dist/esm/TreeView.js.map +1 -1
  33. package/dist/esm/config/useTreeview.js +1 -1
  34. package/dist/esm/config/useTreeview.js.map +2 -2
  35. package/dist/esm/hoc/WithConditionalDnDContext.js +24 -31
  36. package/dist/esm/hoc/WithConditionalDnDContext.js.map +1 -1
  37. package/dist/esm/hoc/WithDnDSortableItemContext.js +1 -6
  38. package/dist/esm/hoc/WithDnDSortableItemContext.js.map +1 -1
  39. package/dist/esm/parts/CheckboxSelectable.js +5 -4
  40. package/dist/esm/parts/CheckboxSelectable.js.map +1 -1
  41. package/dist/esm/parts/ChildrenCountDisplayer.js +4 -8
  42. package/dist/esm/parts/ChildrenCountDisplayer.js.map +1 -1
  43. package/dist/esm/parts/DnDHandle.js +19 -16
  44. package/dist/esm/parts/DnDHandle.js.map +1 -1
  45. package/dist/esm/parts/DropIndicator.js +5 -21
  46. package/dist/esm/parts/DropIndicator.js.map +1 -1
  47. package/dist/esm/parts/ExpandCaret.js +32 -38
  48. package/dist/esm/parts/ExpandCaret.js.map +1 -1
  49. package/dist/esm/parts/NestingSpace.js +1 -4
  50. package/dist/esm/parts/NestingSpace.js.map +1 -1
  51. package/dist/esm/parts/RadioSelectable.js +12 -9
  52. package/dist/esm/parts/RadioSelectable.js.map +1 -1
  53. package/dist/esm/parts/TreeItem.js +38 -60
  54. package/dist/esm/parts/TreeItem.js.map +1 -1
  55. package/dist/esm/parts/TreeItemText.js +39 -53
  56. package/dist/esm/parts/TreeItemText.js.map +1 -1
  57. package/dist/esm/parts/TreeList.js +61 -62
  58. package/dist/esm/parts/TreeList.js.map +1 -1
  59. package/dist/esm/related-components/TreeViewSearchBar.js +14 -11
  60. package/dist/esm/related-components/TreeViewSearchBar.js.map +1 -1
  61. package/package.json +11 -11
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/TreeItem.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\n/* eslint-disable complexity */\n/* eslint-disable max-lines */\nimport React, { useContext, useMemo, useCallback } from 'react';\n\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\n\nimport RadioSelectable from './RadioSelectable';\nimport CheckboxSelectable from './CheckboxSelectable';\nimport TreeViewContext from '../TreeViewContext';\nimport { setMultipleRefs } from '../utils/refs-helpers';\nimport { useOnItemKeyDown } from '../utils/keyboard-helpers';\nimport { NestingSpace } from './NestingSpace';\nimport { Icon } from './Icon';\nimport { ExpandCaret } from './ExpandCaret';\nimport { TreeItemText } from './TreeItemText';\nimport { DSTreeViewPrefix, treeItemBlockName } from '../config/cssClassesConstants';\nimport type { DSTreeviewT } from '../react-desc-prop-types';\nimport { DnDHandle } from './DnDHandle';\nimport { withDnDSortableItemContext } from '../hoc/WithDnDSortableItemContext';\nimport { DropIndicatorPosition, SortableItemContext } from '../hoc/SortableItemContext';\nimport DropIndicator from './DropIndicator';\n\nexport const TreeListItem = aggregatedClasses('li', {\n 'data-testid': treeItemBlockName,\n role: 'treeitem',\n // temp fix untill we move to styled components\n})(treeItemBlockName) as unknown as React.ComponentType<React.ComponentProps<'li'>>;\n\nexport const TreeListItemAddonsWrapper = aggregatedClasses('div')(\n treeItemBlockName,\n 'addons',\n // temp fix untill we move to styled components\n) as unknown as React.ComponentType;\n\ninterface PropsT {\n item: DSTreeviewT.Item;\n itemIndex: number;\n isDragOverlay?: boolean;\n virtualItemRef?: React.RefObject<HTMLLIElement>;\n itemWrapperStyle?: { [key: string]: unknown };\n spaceForNestingLevel?: number;\n}\nexport const TreeItem = (props: PropsT): JSX.Element => {\n const {\n item,\n itemIndex,\n itemWrapperStyle = {},\n virtualItemRef,\n spaceForNestingLevel = 1.5,\n isDragOverlay = false,\n } = props;\n const { id, node, children } = item;\n const { nodeItemRef } = node.model;\n\n const { draggableProps } = useContext(SortableItemContext);\n\n const onItemKeyDown = useOnItemKeyDown(item, draggableProps);\n\n const ctx = useContext(TreeViewContext);\n const {\n props: {\n disableIcons,\n rightAddons,\n onItemClick,\n onItemActivate,\n onItemFocus,\n rowSize,\n labelOverflow,\n nameKey,\n showChildrenAmount,\n },\n withRadioChecks,\n withCheckboxChecks,\n withDragAndDrop,\n selectedItem,\n selectedCheckboxes,\n hoverItem,\n virtualListHelpers: { scrollToIndex },\n setHoverItem,\n setSelectedItem,\n setFocusedItem,\n } = ctx;\n const itemLabelText = item[nameKey] as DSTreeviewT.Item['name'];\n\n // Sortable Items needs to update\n // - the virtual list ref (for react-virtual requirement)\n // - nodeItemRef which is a prop avaiable in the TreeModel nodes\n // - the drag and drop node reference\n const setItemRefs: React.LegacyRef<HTMLLIElement> | undefined = (ref: HTMLLIElement) => {\n setMultipleRefs(\n virtualItemRef,\n !isDragOverlay && nodeItemRef,\n !isDragOverlay && draggableProps && draggableProps.setNodeRef,\n )(ref);\n };\n\n const dropIndicatorPosition =\n draggableProps && draggableProps.shouldShowDropIndicatorPosition && draggableProps.dropIndicatorPosition;\n\n const isDropIndicatorPositionInside = dropIndicatorPosition === DropIndicatorPosition.Inside;\n\n const isDragging = draggableProps && draggableProps.isDragging;\n\n const isDropValid = draggableProps && draggableProps.isDropValid;\n\n const dropPreviewClassName = useMemo(() => {\n if (isDropIndicatorPositionInside) {\n const className = `${DSTreeViewPrefix}-${treeItemBlockName}${isDropValid ? '--valid' : '--invalid'}-drop-in`;\n return className;\n }\n return '';\n }, [isDropIndicatorPositionInside, isDropValid]);\n\n const dragOverlayClassName = useMemo(() => (isDragOverlay ? 'drag-overlay' : ''), [isDragOverlay]);\n\n const selectedClassName = useMemo(\n () => (selectedItem?.id === item.id && !isDragOverlay ? 'selected' : ''),\n [isDragOverlay, item.id, selectedItem?.id],\n );\n const hoverClassName = useMemo(\n () => (!isDragOverlay && hoverItem?.id === item.id && !isDragging ? 'hover' : ''),\n [isDragOverlay, hoverItem?.id, item.id, isDragging],\n );\n const fixedHeightClassname = useMemo(() => {\n if (labelOverflow === 'truncate') {\n if (rowSize === 'compact') return `${DSTreeViewPrefix}-${treeItemBlockName}--fixed-height-compact`;\n return `${DSTreeViewPrefix}-${treeItemBlockName}--fixed-height`;\n }\n return '';\n }, [labelOverflow, rowSize]);\n\n const isDraggingClassname = useMemo(() => {\n if (isDragging) return `${DSTreeViewPrefix}-${treeItemBlockName}--dragging`;\n return '';\n }, [isDragging]);\n\n const finalClassName = useMemo(\n () =>\n `${dropPreviewClassName} ${fixedHeightClassname} ${selectedClassName} ${hoverClassName} ${dragOverlayClassName} ${isDraggingClassname}`,\n [\n dropPreviewClassName,\n fixedHeightClassname,\n selectedClassName,\n hoverClassName,\n dragOverlayClassName,\n isDraggingClassname,\n ],\n );\n\n const handleItemClick = useCallback(\n (e: React.MouseEvent<HTMLLIElement>) => {\n onItemClick(item, e);\n setFocusedItem(item);\n setSelectedItem(item);\n onItemActivate(item, e);\n const itemVirtualIndex = typeof item.virtualIndex === 'number' ? item.virtualIndex : -1;\n onItemFocus({\n itemIndex: itemVirtualIndex,\n scrollToItem: (opts = { align: 'start' }) => scrollToIndex(itemVirtualIndex, opts),\n item,\n });\n },\n [onItemClick, item, setFocusedItem, setSelectedItem, onItemActivate, onItemFocus, scrollToIndex],\n );\n\n const childrenLength = useMemo(() => children?.length ?? 0, [children]);\n\n const ariaLabel = `${itemLabelText}${showChildrenAmount && childrenLength > 0 ? `, ${childrenLength} Items` : ''}`;\n\n return (\n <TreeListItem\n tabIndex={0}\n onMouseLeave={() => {\n if (hoverItem?.id === item.id) {\n setHoverItem(null);\n }\n }}\n onMouseEnter={() => {\n setHoverItem(item);\n }}\n onClick={handleItemClick}\n onBlur={() => setFocusedItem(null)}\n ref={setItemRefs}\n style={{ ...itemWrapperStyle }}\n className={finalClassName}\n aria-expanded={!!item.isExpanded}\n aria-selected={!!selectedCheckboxes[item.id]}\n aria-label={ariaLabel}\n data-id={item.id}\n data-index={item.virtualIndex}\n onKeyDown={onItemKeyDown}\n >\n <TreeListItemAddonsWrapper>\n {withDragAndDrop ? <DnDHandle id={id} isDragOverlay={isDragOverlay} /> : null}\n {withRadioChecks && !isDragOverlay ? <RadioSelectable item={item} itemIndex={itemIndex} /> : null}\n {withCheckboxChecks && !isDragOverlay ? <CheckboxSelectable item={item} itemIndex={itemIndex} /> : null}\n {!isDragOverlay && <NestingSpace item={item} spaceForNestingLevel={spaceForNestingLevel} />}\n {!isDragOverlay && <ExpandCaret item={item} />}\n {!disableIcons ? <Icon item={item} /> : null}\n </TreeListItemAddonsWrapper>\n <TreeItemText item={item} />\n {rightAddons && (\n <TreeListItemAddonsWrapper>\n {typeof rightAddons === 'function' ? rightAddons(item) : rightAddons}\n </TreeListItemAddonsWrapper>\n )}\n <DropIndicator dropIndicatorPosition={dropIndicatorPosition} isDropValid={isDropValid} />\n </TreeListItem>\n );\n};\n\nexport default withDnDSortableItemContext(TreeItem);\n"],
5
- "mappings": "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",
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -11,11 +11,7 @@ const ItemContent = aggregatedClasses("div")(`${treeItemBlockName}-content`);
11
11
  const ItemValue = aggregatedClasses("span")(treeItemBlockName, "value");
12
12
  const classNameModifierWrapAll = `${DSTreeViewPrefix}-${treeItemBlockName}__value--wrap-all`;
13
13
  const classNameModifierTruncate = `${DSTreeViewPrefix}-${treeItemBlockName}__value--truncate`;
14
- const CustomHighlight = ({ children }) => /* @__PURE__ */ jsx("mark", {
15
- className: "tree-text-highlight",
16
- "data-testid": "tree-text-highlight",
17
- children
18
- });
14
+ const CustomHighlight = ({ children }) => /* @__PURE__ */ jsx("mark", { className: "tree-text-highlight", "data-testid": "tree-text-highlight", children });
19
15
  const TreeItemText = (props) => {
20
16
  const { item } = props;
21
17
  const ctx = useContext(TreeViewContext);
@@ -26,69 +22,59 @@ const TreeItemText = (props) => {
26
22
  const itemLabelText = item[nameKey];
27
23
  if (searchQuery) {
28
24
  if (labelOverflow === "truncate") {
29
- return /* @__PURE__ */ jsx(SimpleTruncatedTooltipText, {
30
- value: /* @__PURE__ */ jsxs(Fragment, {
31
- children: [
32
- /* @__PURE__ */ jsx(Highlighter, {
33
- autoEscape: true,
34
- highlightTag: CustomHighlight,
35
- searchWords: [searchQuery],
36
- textToHighlight: itemLabelText
37
- }),
38
- showChildrenAmount ? /* @__PURE__ */ jsx(ChildrenCountDisplayer, {
39
- item
40
- }) : null
41
- ]
42
- })
43
- });
25
+ return /* @__PURE__ */ jsx(
26
+ SimpleTruncatedTooltipText,
27
+ {
28
+ value: /* @__PURE__ */ jsxs(Fragment, { children: [
29
+ /* @__PURE__ */ jsx(
30
+ Highlighter,
31
+ {
32
+ autoEscape: true,
33
+ highlightTag: CustomHighlight,
34
+ searchWords: [searchQuery],
35
+ textToHighlight: itemLabelText
36
+ }
37
+ ),
38
+ showChildrenAmount ? /* @__PURE__ */ jsx(ChildrenCountDisplayer, { item }) : null
39
+ ] })
40
+ }
41
+ );
44
42
  }
45
- return /* @__PURE__ */ jsxs(Fragment, {
46
- children: [
47
- /* @__PURE__ */ jsx(Highlighter, {
43
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
44
+ /* @__PURE__ */ jsx(
45
+ Highlighter,
46
+ {
48
47
  autoEscape: true,
49
48
  highlightTag: CustomHighlight,
50
49
  searchWords: [searchQuery],
51
50
  textToHighlight: itemLabelText
52
- }),
53
- showChildrenAmount ? /* @__PURE__ */ jsx(ChildrenCountDisplayer, {
54
- item
55
- }) : null
56
- ]
57
- });
51
+ }
52
+ ),
53
+ showChildrenAmount ? /* @__PURE__ */ jsx(ChildrenCountDisplayer, { item }) : null
54
+ ] });
58
55
  }
59
56
  if (labelOverflow === "truncate") {
60
- return /* @__PURE__ */ jsx(SimpleTruncatedTooltipText, {
61
- value: /* @__PURE__ */ jsxs(Fragment, {
62
- children: [
57
+ return /* @__PURE__ */ jsx(
58
+ SimpleTruncatedTooltipText,
59
+ {
60
+ value: /* @__PURE__ */ jsxs(Fragment, { children: [
63
61
  itemLabelText,
64
- showChildrenAmount ? /* @__PURE__ */ jsx(ChildrenCountDisplayer, {
65
- item
66
- }) : null
67
- ]
68
- })
69
- });
62
+ showChildrenAmount ? /* @__PURE__ */ jsx(ChildrenCountDisplayer, { item }) : null
63
+ ] })
64
+ }
65
+ );
70
66
  }
71
- return /* @__PURE__ */ jsxs(Fragment, {
72
- children: [
73
- itemLabelText,
74
- showChildrenAmount ? /* @__PURE__ */ jsx(ChildrenCountDisplayer, {
75
- item
76
- }) : null
77
- ]
78
- });
67
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
68
+ itemLabelText,
69
+ showChildrenAmount ? /* @__PURE__ */ jsx(ChildrenCountDisplayer, { item }) : null
70
+ ] });
79
71
  }, [item, searchQuery, nameKey, showChildrenAmount, labelOverflow]);
80
72
  let className = "";
81
73
  if (labelOverflow === "wrap-all")
82
74
  className += `${classNameModifierWrapAll} `;
83
75
  if (labelOverflow === "truncate")
84
76
  className += `${classNameModifierTruncate} `;
85
- return /* @__PURE__ */ jsx(ItemContent, {
86
- "data-testid": `${treeItemBlockName}-content`,
87
- children: /* @__PURE__ */ jsx(ItemValue, {
88
- className,
89
- children: Text
90
- })
91
- });
77
+ return /* @__PURE__ */ jsx(ItemContent, { "data-testid": `${treeItemBlockName}-content`, children: /* @__PURE__ */ jsx(ItemValue, { className, children: Text }) });
92
78
  };
93
79
  export {
94
80
  TreeItemText
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/TreeItemText.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useMemo, useContext } from 'react';\nimport Highlighter from 'react-highlight-words';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\n\nimport { ChildrenCountDisplayer } from './ChildrenCountDisplayer';\nimport { DSTreeViewPrefix, treeItemBlockName } from '../config/cssClassesConstants';\n\nimport TreeViewContext from '../TreeViewContext';\nimport type { DSTreeviewT } from '../react-desc-prop-types';\n\nconst ItemContent = aggregatedClasses('div')(`${treeItemBlockName}-content`) as unknown as React.ComponentType<\n React.ComponentProps<'div'>\n>;\nconst ItemValue = aggregatedClasses('span')(treeItemBlockName, 'value') as unknown as React.ComponentType<\n React.ComponentProps<'span'>\n>;\n\n// const wrapperClassName = `${DSTreeViewPrefix}-${treeItemBlockName}-content`;\nconst classNameModifierWrapAll = `${DSTreeViewPrefix}-${treeItemBlockName}__value--wrap-all`;\nconst classNameModifierTruncate = `${DSTreeViewPrefix}-${treeItemBlockName}__value--truncate`;\n\n// eslint-disable-next-line react/prop-types\nconst CustomHighlight = ({ children }: { children: React.ReactNode }) => (\n <mark className=\"tree-text-highlight\" data-testid=\"tree-text-highlight\">\n {children}\n </mark>\n);\ninterface PropsT {\n item: DSTreeviewT.Item;\n}\nexport const TreeItemText = (props: PropsT): JSX.Element => {\n const { item } = props;\n const ctx = useContext(TreeViewContext);\n const {\n props: { searchQuery, showChildrenAmount, labelOverflow, nameKey },\n } = ctx;\n\n const Text = useMemo(() => {\n const itemLabelText = item[nameKey] as DSTreeviewT.Item['name'];\n if (searchQuery) {\n if (labelOverflow === 'truncate') {\n return (\n <SimpleTruncatedTooltipText\n value={\n <>\n <Highlighter\n autoEscape\n highlightTag={CustomHighlight}\n searchWords={[searchQuery]}\n textToHighlight={itemLabelText}\n />\n {showChildrenAmount ? <ChildrenCountDisplayer item={item} /> : null}\n </>\n }\n />\n );\n }\n return (\n <>\n <Highlighter\n autoEscape\n highlightTag={CustomHighlight}\n searchWords={[searchQuery]}\n textToHighlight={itemLabelText}\n />\n {showChildrenAmount ? <ChildrenCountDisplayer item={item} /> : null}\n </>\n );\n }\n if (labelOverflow === 'truncate') {\n return (\n <SimpleTruncatedTooltipText\n value={\n <>\n {itemLabelText}\n {showChildrenAmount ? <ChildrenCountDisplayer item={item} /> : null}\n </>\n }\n />\n );\n }\n return (\n <>\n {itemLabelText}\n {showChildrenAmount ? <ChildrenCountDisplayer item={item} /> : null}\n </>\n );\n }, [item, searchQuery, nameKey, showChildrenAmount, labelOverflow]);\n\n let className = '';\n if (labelOverflow === 'wrap-all') className += `${classNameModifierWrapAll} `;\n if (labelOverflow === 'truncate') className += `${classNameModifierTruncate} `;\n\n return (\n <ItemContent data-testid={`${treeItemBlockName}-content`}>\n <ItemValue className={className}>{Text}</ItemValue>\n </ItemContent>\n );\n};\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACyBrB,SAqBY,UArBZ,KAqBY,YArBZ;AAxBF,SAAgB,SAAS,kBAAkB;AAC3C,OAAO,iBAAiB;AACxB,SAAS,kCAAkC;AAC3C,SAAS,yBAAyB;AAElC,SAAS,8BAA8B;AACvC,SAAS,kBAAkB,yBAAyB;AAEpD,OAAO,qBAAqB;AAG5B,MAAM,cAAc,kBAAkB,KAAK,EAAE,GAAG,2BAA2B;AAG3E,MAAM,YAAY,kBAAkB,MAAM,EAAE,mBAAmB,OAAO;AAKtE,MAAM,2BAA2B,GAAG,oBAAoB;AACxD,MAAM,4BAA4B,GAAG,oBAAoB;AAGzD,MAAM,kBAAkB,CAAC,EAAE,SAAS,MAClC,oBAAC;AAAA,EAAK,WAAU;AAAA,EAAsB,eAAY;AAAA,EAC/C;AAAA,CACH;AAKK,MAAM,eAAe,CAAC,UAA+B;AAC1D,QAAM,EAAE,KAAK,IAAI;AACjB,QAAM,MAAM,WAAW,eAAe;AACtC,QAAM;AAAA,IACJ,OAAO,EAAE,aAAa,oBAAoB,eAAe,QAAQ;AAAA,EACnE,IAAI;AAEJ,QAAM,OAAO,QAAQ,MAAM;AACzB,UAAM,gBAAgB,KAAK;AAC3B,QAAI,aAAa;AACf,UAAI,kBAAkB,YAAY;AAChC,eACE,oBAAC;AAAA,UACC,OACE;AAAA,YACE;AAAA,kCAAC;AAAA,gBACC,YAAU;AAAA,gBACV,cAAc;AAAA,gBACd,aAAa,CAAC,WAAW;AAAA,gBACzB,iBAAiB;AAAA,eACnB;AAAA,cACC,qBAAqB,oBAAC;AAAA,gBAAuB;AAAA,eAAY,IAAK;AAAA;AAAA,WACjE;AAAA,SAEJ;AAAA,MAEJ;AACA,aACE;AAAA,QACE;AAAA,8BAAC;AAAA,YACC,YAAU;AAAA,YACV,cAAc;AAAA,YACd,aAAa,CAAC,WAAW;AAAA,YACzB,iBAAiB;AAAA,WACnB;AAAA,UACC,qBAAqB,oBAAC;AAAA,YAAuB;AAAA,WAAY,IAAK;AAAA;AAAA,OACjE;AAAA,IAEJ;AACA,QAAI,kBAAkB,YAAY;AAChC,aACE,oBAAC;AAAA,QACC,OACE;AAAA,UACG;AAAA;AAAA,YACA,qBAAqB,oBAAC;AAAA,cAAuB;AAAA,aAAY,IAAK;AAAA;AAAA,SACjE;AAAA,OAEJ;AAAA,IAEJ;AACA,WACE;AAAA,MACG;AAAA;AAAA,QACA,qBAAqB,oBAAC;AAAA,UAAuB;AAAA,SAAY,IAAK;AAAA;AAAA,KACjE;AAAA,EAEJ,GAAG,CAAC,MAAM,aAAa,SAAS,oBAAoB,aAAa,CAAC;AAElE,MAAI,YAAY;AAChB,MAAI,kBAAkB;AAAY,iBAAa,GAAG;AAClD,MAAI,kBAAkB;AAAY,iBAAa,GAAG;AAElD,SACE,oBAAC;AAAA,IAAY,eAAa,GAAG;AAAA,IAC3B,8BAAC;AAAA,MAAU;AAAA,MAAuB;AAAA,KAAK;AAAA,GACzC;AAEJ;",
5
+ "mappings": "AAAA,YAAY,WAAW;ACyBrB,SAqBY,UArBZ,KAqBY,YArBZ;AAxBF,SAAgB,SAAS,kBAAkB;AAC3C,OAAO,iBAAiB;AACxB,SAAS,kCAAkC;AAC3C,SAAS,yBAAyB;AAElC,SAAS,8BAA8B;AACvC,SAAS,kBAAkB,yBAAyB;AAEpD,OAAO,qBAAqB;AAG5B,MAAM,cAAc,kBAAkB,KAAK,EAAE,GAAG,2BAA2B;AAG3E,MAAM,YAAY,kBAAkB,MAAM,EAAE,mBAAmB,OAAO;AAKtE,MAAM,2BAA2B,GAAG,oBAAoB;AACxD,MAAM,4BAA4B,GAAG,oBAAoB;AAGzD,MAAM,kBAAkB,CAAC,EAAE,SAAS,MAClC,oBAAC,UAAK,WAAU,uBAAsB,eAAY,uBAC/C,UACH;AAKK,MAAM,eAAe,CAAC,UAA+B;AAC1D,QAAM,EAAE,KAAK,IAAI;AACjB,QAAM,MAAM,WAAW,eAAe;AACtC,QAAM;AAAA,IACJ,OAAO,EAAE,aAAa,oBAAoB,eAAe,QAAQ;AAAA,EACnE,IAAI;AAEJ,QAAM,OAAO,QAAQ,MAAM;AACzB,UAAM,gBAAgB,KAAK;AAC3B,QAAI,aAAa;AACf,UAAI,kBAAkB,YAAY;AAChC,eACE;AAAA,UAAC;AAAA;AAAA,YACC,OACE,iCACE;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACC,YAAU;AAAA,kBACV,cAAc;AAAA,kBACd,aAAa,CAAC,WAAW;AAAA,kBACzB,iBAAiB;AAAA;AAAA,cACnB;AAAA,cACC,qBAAqB,oBAAC,0BAAuB,MAAY,IAAK;AAAA,eACjE;AAAA;AAAA,QAEJ;AAAA,MAEJ;AACA,aACE,iCACE;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,YAAU;AAAA,YACV,cAAc;AAAA,YACd,aAAa,CAAC,WAAW;AAAA,YACzB,iBAAiB;AAAA;AAAA,QACnB;AAAA,QACC,qBAAqB,oBAAC,0BAAuB,MAAY,IAAK;AAAA,SACjE;AAAA,IAEJ;AACA,QAAI,kBAAkB,YAAY;AAChC,aACE;AAAA,QAAC;AAAA;AAAA,UACC,OACE,iCACG;AAAA;AAAA,YACA,qBAAqB,oBAAC,0BAAuB,MAAY,IAAK;AAAA,aACjE;AAAA;AAAA,MAEJ;AAAA,IAEJ;AACA,WACE,iCACG;AAAA;AAAA,MACA,qBAAqB,oBAAC,0BAAuB,MAAY,IAAK;AAAA,OACjE;AAAA,EAEJ,GAAG,CAAC,MAAM,aAAa,SAAS,oBAAoB,aAAa,CAAC;AAElE,MAAI,YAAY;AAChB,MAAI,kBAAkB;AAAY,iBAAa,GAAG;AAClD,MAAI,kBAAkB;AAAY,iBAAa,GAAG;AAElD,SACE,oBAAC,eAAY,eAAa,GAAG,6BAC3B,8BAAC,aAAU,WAAuB,gBAAK,GACzC;AAEJ;",
6
6
  "names": []
7
7
  }
@@ -31,68 +31,67 @@ const TreeListComp = () => {
31
31
  const { totalSize, virtualItems } = virtualListHelpers;
32
32
  const className = `${rowSize === "compact" ? `${compactRowClass}` : `${normaRowClass}`}`;
33
33
  const { visibleItems } = useContext(DnDTreeContext);
34
- return /* @__PURE__ */ jsxs(TreeListWrapper, {
35
- ref: virtualListRef,
36
- className,
37
- style: {
38
- height: `${typeof height === "number" ? `${height}px` : height}`,
39
- width: `${typeof width === "number" ? `${width}px` : width}`,
40
- overflow: "auto"
41
- },
42
- children: [
43
- isLoading ? /* @__PURE__ */ jsx("div", {
44
- style: {
45
- width: "100%",
46
- height: "100%",
47
- display: "flex",
48
- alignItems: "center",
49
- justifyContent: "center"
50
- },
51
- children: /* @__PURE__ */ jsx(DSCircularProgressIndicator, {
52
- size: "xl",
53
- loading: isLoading,
54
- showLabel: true,
55
- waiting: false,
56
- showTooltip: false
57
- })
58
- }) : null,
59
- !isLoading && virtualItems.length === 0 ? /* @__PURE__ */ jsx(TreeListNoItems, {
60
- children: noItemsPlaceholder
61
- }) : null,
62
- !isLoading && virtualItems.length !== 0 ? /* @__PURE__ */ jsx("div", {
63
- style: {
64
- height: `${totalSize}px`,
65
- width: "100%",
66
- position: "relative"
67
- },
68
- children: virtualItems.map((virtualItem) => {
69
- const { index, measureRef, start } = virtualItem;
70
- const item = (visibleItems || flattenedVisibleItems)[index];
71
- if (!item)
72
- return null;
73
- item.virtualIndex = index;
74
- const { id } = item;
75
- const style = {
76
- position: "absolute",
77
- top: `${start}px`,
78
- left: 0,
79
- width: "100%"
80
- };
81
- const listItemProps = {
82
- key: `DS-TreeView-List-Item-${id}`,
83
- virtualItemRef: measureRef,
84
- index,
85
- itemIndex: index,
86
- item,
87
- itemWrapperStyle: style
88
- };
89
- return /* @__PURE__ */ jsx(TreeItem, {
90
- ...listItemProps
91
- });
92
- })
93
- }) : null
94
- ]
95
- });
34
+ return /* @__PURE__ */ jsxs(
35
+ TreeListWrapper,
36
+ {
37
+ ref: virtualListRef,
38
+ className,
39
+ style: {
40
+ height: `${typeof height === "number" ? `${height}px` : height}`,
41
+ width: `${typeof width === "number" ? `${width}px` : width}`,
42
+ overflow: "auto"
43
+ },
44
+ children: [
45
+ isLoading ? /* @__PURE__ */ jsx(
46
+ "div",
47
+ {
48
+ style: {
49
+ width: "100%",
50
+ height: "100%",
51
+ display: "flex",
52
+ alignItems: "center",
53
+ justifyContent: "center"
54
+ },
55
+ children: /* @__PURE__ */ jsx(DSCircularProgressIndicator, { size: "xl", loading: isLoading, showLabel: true, waiting: false, showTooltip: false })
56
+ }
57
+ ) : null,
58
+ !isLoading && virtualItems.length === 0 ? /* @__PURE__ */ jsx(TreeListNoItems, { children: noItemsPlaceholder }) : null,
59
+ !isLoading && virtualItems.length !== 0 ? /* @__PURE__ */ jsx(
60
+ "div",
61
+ {
62
+ style: {
63
+ height: `${totalSize}px`,
64
+ width: "100%",
65
+ position: "relative"
66
+ },
67
+ children: virtualItems.map((virtualItem) => {
68
+ const { index, measureRef, start } = virtualItem;
69
+ const item = (visibleItems || flattenedVisibleItems)[index];
70
+ if (!item)
71
+ return null;
72
+ item.virtualIndex = index;
73
+ const { id } = item;
74
+ const style = {
75
+ position: "absolute",
76
+ top: `${start}px`,
77
+ left: 0,
78
+ width: "100%"
79
+ };
80
+ const listItemProps = {
81
+ key: `DS-TreeView-List-Item-${id}`,
82
+ virtualItemRef: measureRef,
83
+ index,
84
+ itemIndex: index,
85
+ item,
86
+ itemWrapperStyle: style
87
+ };
88
+ return /* @__PURE__ */ jsx(TreeItem, { ...listItemProps });
89
+ })
90
+ }
91
+ ) : null
92
+ ]
93
+ }
94
+ );
96
95
  };
97
96
  const TreeList = withConditionalDnDRowContext(TreeListComp);
98
97
  export {
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/TreeList.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useContext } from 'react';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport { DSCircularProgressIndicator } from '@elliemae/ds-circular-progress-indicator';\n\nimport TreeViewContext from '../TreeViewContext';\nimport { DSTreeViewPrefix, treeListBlockName } from '../config/cssClassesConstants';\nimport TreeItem from './TreeItem';\n\nimport type { DSTreeviewT } from '../react-desc-prop-types';\nimport { withConditionalDnDRowContext } from '../hoc/WithConditionalDnDContext';\nimport { DnDTreeContext } from '../hoc/DnDTreeContext';\n\nexport const treeListNoItemsBn = `${treeListBlockName}-no-items`;\nexport const TreeListNoItems = aggregatedClasses('div', {\n 'data-testid': treeListNoItemsBn,\n})(treeListNoItemsBn) as unknown as React.ComponentType<React.ComponentProps<'div'>>;\n\n// React.ComponentProps<'ul'> uses LegacyRef typings that existed pre-hook era\n// we omit the LegacyRef typings in favor of hook-era typings\ninterface UlProps extends Omit<React.ComponentProps<'ul'>, 'ref'> {\n ref: React.MutableRefObject<HTMLUListElement | undefined> | undefined;\n}\nexport const TreeListWrapper = aggregatedClasses('ul', {\n 'data-testid': treeListBlockName,\n role: 'tree',\n})(treeListBlockName, null, ({ rowSize }: { rowSize: 'normal' | 'compact' }) => ({\n [`rowsize-${rowSize}`]: rowSize,\n})) as unknown as React.ComponentType<UlProps>;\n\nconst compactRowClass = `${DSTreeViewPrefix}-tv-row-size-compact`;\nconst normaRowClass = `${DSTreeViewPrefix}-tv-row-size-normal`;\n\ninterface PropsT {\n onMouseDragOverItem?: (opts: {\n event: React.MouseEvent<HTMLLIElement>;\n item: DSTreeviewT.Item;\n itemIndex: number;\n setIsDraggingOverThis: React.Dispatch<React.SetStateAction<boolean>>;\n openFolderOnHoverTimeout: React.MutableRefObject<NodeJS.Timeout | null>;\n }) => void;\n}\n\nconst TreeListComp: React.ComponentType<PropsT> = () => {\n const ctx = useContext(TreeViewContext);\n const {\n virtualListRef,\n virtualListHelpers,\n visibleItems: flattenedVisibleItems,\n props: { width, height, rowSize, noItemsPlaceholder, isLoading },\n } = ctx;\n const { totalSize, virtualItems } = virtualListHelpers;\n const className = `${rowSize === 'compact' ? `${compactRowClass}` : `${normaRowClass}`}`;\n\n const { visibleItems } = useContext(DnDTreeContext);\n\n return (\n <TreeListWrapper\n ref={virtualListRef}\n className={className}\n style={{\n height: `${typeof height === 'number' ? `${height}px` : height}`,\n width: `${typeof width === 'number' ? `${width}px` : width}`,\n overflow: 'auto',\n }}\n >\n {isLoading ? (\n <div\n style={{\n width: '100%',\n height: '100%',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n }}\n >\n <DSCircularProgressIndicator size=\"xl\" loading={isLoading} showLabel waiting={false} showTooltip={false} />\n </div>\n ) : null}\n {!isLoading && virtualItems.length === 0 ? <TreeListNoItems>{noItemsPlaceholder}</TreeListNoItems> : null}\n {!isLoading && virtualItems.length !== 0 ? (\n <div\n style={{\n height: `${totalSize}px`,\n width: '100%',\n position: 'relative',\n }}\n >\n {virtualItems.map((virtualItem) => {\n const { index, measureRef, start } = virtualItem;\n const item = (visibleItems || flattenedVisibleItems)[index];\n if (!item) return null;\n item.virtualIndex = index;\n const { id } = item;\n\n const style = {\n position: 'absolute',\n top: `${start}px`,\n left: 0,\n width: '100%',\n };\n\n const listItemProps = {\n key: `DS-TreeView-List-Item-${id}`,\n virtualItemRef: measureRef,\n index, // this is consumed by the DnD HOC\n itemIndex: index,\n item,\n itemWrapperStyle: style,\n };\n\n return <TreeItem {...listItemProps} />;\n })}\n </div>\n ) : null}\n </TreeListWrapper>\n );\n};\n\nexport const TreeList = withConditionalDnDRowContext(TreeListComp);\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACyDnB,SAmBM,KAnBN;AAxDJ,SAAgB,kBAAkB;AAClC,SAAS,yBAAyB;AAClC,SAAS,mCAAmC;AAE5C,OAAO,qBAAqB;AAC5B,SAAS,kBAAkB,yBAAyB;AACpD,OAAO,cAAc;AAGrB,SAAS,oCAAoC;AAC7C,SAAS,sBAAsB;AAExB,MAAM,oBAAoB,GAAG;AAC7B,MAAM,kBAAkB,kBAAkB,OAAO;AAAA,EACtD,eAAe;AACjB,CAAC,EAAE,iBAAiB;AAOb,MAAM,kBAAkB,kBAAkB,MAAM;AAAA,EACrD,eAAe;AAAA,EACf,MAAM;AACR,CAAC,EAAE,mBAAmB,MAAM,CAAC,EAAE,QAAQ,OAA0C;AAAA,EAC/E,CAAC,WAAW,YAAY;AAC1B,EAAE;AAEF,MAAM,kBAAkB,GAAG;AAC3B,MAAM,gBAAgB,GAAG;AAYzB,MAAM,eAA4C,MAAM;AACtD,QAAM,MAAM,WAAW,eAAe;AACtC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd,OAAO,EAAE,OAAO,QAAQ,SAAS,oBAAoB,UAAU;AAAA,EACjE,IAAI;AACJ,QAAM,EAAE,WAAW,aAAa,IAAI;AACpC,QAAM,YAAY,GAAG,YAAY,YAAY,GAAG,oBAAoB,GAAG;AAEvE,QAAM,EAAE,aAAa,IAAI,WAAW,cAAc;AAElD,SACE,qBAAC;AAAA,IACC,KAAK;AAAA,IACL;AAAA,IACA,OAAO;AAAA,MACL,QAAQ,GAAG,OAAO,WAAW,WAAW,GAAG,aAAa;AAAA,MACxD,OAAO,GAAG,OAAO,UAAU,WAAW,GAAG,YAAY;AAAA,MACrD,UAAU;AAAA,IACZ;AAAA,IAEC;AAAA,kBACC,oBAAC;AAAA,QACC,OAAO;AAAA,UACL,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,SAAS;AAAA,UACT,YAAY;AAAA,UACZ,gBAAgB;AAAA,QAClB;AAAA,QAEA,8BAAC;AAAA,UAA4B,MAAK;AAAA,UAAK,SAAS;AAAA,UAAW,WAAS;AAAA,UAAC,SAAS;AAAA,UAAO,aAAa;AAAA,SAAO;AAAA,OAC3G,IACE;AAAA,MACH,CAAC,aAAa,aAAa,WAAW,IAAI,oBAAC;AAAA,QAAiB;AAAA,OAAmB,IAAqB;AAAA,MACpG,CAAC,aAAa,aAAa,WAAW,IACrC,oBAAC;AAAA,QACC,OAAO;AAAA,UACL,QAAQ,GAAG;AAAA,UACX,OAAO;AAAA,UACP,UAAU;AAAA,QACZ;AAAA,QAEC,uBAAa,IAAI,CAAC,gBAAgB;AACjC,gBAAM,EAAE,OAAO,YAAY,MAAM,IAAI;AACrC,gBAAM,QAAQ,gBAAgB,uBAAuB;AACrD,cAAI,CAAC;AAAM,mBAAO;AAClB,eAAK,eAAe;AACpB,gBAAM,EAAE,GAAG,IAAI;AAEf,gBAAM,QAAQ;AAAA,YACZ,UAAU;AAAA,YACV,KAAK,GAAG;AAAA,YACR,MAAM;AAAA,YACN,OAAO;AAAA,UACT;AAEA,gBAAM,gBAAgB;AAAA,YACpB,KAAK,yBAAyB;AAAA,YAC9B,gBAAgB;AAAA,YAChB;AAAA,YACA,WAAW;AAAA,YACX;AAAA,YACA,kBAAkB;AAAA,UACpB;AAEA,iBAAO,oBAAC;AAAA,YAAU,GAAG;AAAA,WAAe;AAAA,QACtC,CAAC;AAAA,OACH,IACE;AAAA;AAAA,GACN;AAEJ;AAEO,MAAM,WAAW,6BAA6B,YAAY;",
5
+ "mappings": "AAAA,YAAY,WAAW;ACyDnB,SAmBM,KAnBN;AAxDJ,SAAgB,kBAAkB;AAClC,SAAS,yBAAyB;AAClC,SAAS,mCAAmC;AAE5C,OAAO,qBAAqB;AAC5B,SAAS,kBAAkB,yBAAyB;AACpD,OAAO,cAAc;AAGrB,SAAS,oCAAoC;AAC7C,SAAS,sBAAsB;AAExB,MAAM,oBAAoB,GAAG;AAC7B,MAAM,kBAAkB,kBAAkB,OAAO;AAAA,EACtD,eAAe;AACjB,CAAC,EAAE,iBAAiB;AAOb,MAAM,kBAAkB,kBAAkB,MAAM;AAAA,EACrD,eAAe;AAAA,EACf,MAAM;AACR,CAAC,EAAE,mBAAmB,MAAM,CAAC,EAAE,QAAQ,OAA0C;AAAA,EAC/E,CAAC,WAAW,YAAY;AAC1B,EAAE;AAEF,MAAM,kBAAkB,GAAG;AAC3B,MAAM,gBAAgB,GAAG;AAYzB,MAAM,eAA4C,MAAM;AACtD,QAAM,MAAM,WAAW,eAAe;AACtC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd,OAAO,EAAE,OAAO,QAAQ,SAAS,oBAAoB,UAAU;AAAA,EACjE,IAAI;AACJ,QAAM,EAAE,WAAW,aAAa,IAAI;AACpC,QAAM,YAAY,GAAG,YAAY,YAAY,GAAG,oBAAoB,GAAG;AAEvE,QAAM,EAAE,aAAa,IAAI,WAAW,cAAc;AAElD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL;AAAA,MACA,OAAO;AAAA,QACL,QAAQ,GAAG,OAAO,WAAW,WAAW,GAAG,aAAa;AAAA,QACxD,OAAO,GAAG,OAAO,UAAU,WAAW,GAAG,YAAY;AAAA,QACrD,UAAU;AAAA,MACZ;AAAA,MAEC;AAAA,oBACC;AAAA,UAAC;AAAA;AAAA,YACC,OAAO;AAAA,cACL,OAAO;AAAA,cACP,QAAQ;AAAA,cACR,SAAS;AAAA,cACT,YAAY;AAAA,cACZ,gBAAgB;AAAA,YAClB;AAAA,YAEA,8BAAC,+BAA4B,MAAK,MAAK,SAAS,WAAW,WAAS,MAAC,SAAS,OAAO,aAAa,OAAO;AAAA;AAAA,QAC3G,IACE;AAAA,QACH,CAAC,aAAa,aAAa,WAAW,IAAI,oBAAC,mBAAiB,8BAAmB,IAAqB;AAAA,QACpG,CAAC,aAAa,aAAa,WAAW,IACrC;AAAA,UAAC;AAAA;AAAA,YACC,OAAO;AAAA,cACL,QAAQ,GAAG;AAAA,cACX,OAAO;AAAA,cACP,UAAU;AAAA,YACZ;AAAA,YAEC,uBAAa,IAAI,CAAC,gBAAgB;AACjC,oBAAM,EAAE,OAAO,YAAY,MAAM,IAAI;AACrC,oBAAM,QAAQ,gBAAgB,uBAAuB;AACrD,kBAAI,CAAC;AAAM,uBAAO;AAClB,mBAAK,eAAe;AACpB,oBAAM,EAAE,GAAG,IAAI;AAEf,oBAAM,QAAQ;AAAA,gBACZ,UAAU;AAAA,gBACV,KAAK,GAAG;AAAA,gBACR,MAAM;AAAA,gBACN,OAAO;AAAA,cACT;AAEA,oBAAM,gBAAgB;AAAA,gBACpB,KAAK,yBAAyB;AAAA,gBAC9B,gBAAgB;AAAA,gBAChB;AAAA,gBACA,WAAW;AAAA,gBACX;AAAA,gBACA,kBAAkB;AAAA,cACpB;AAEA,qBAAO,oBAAC,YAAU,GAAG,eAAe;AAAA,YACtC,CAAC;AAAA;AAAA,QACH,IACE;AAAA;AAAA;AAAA,EACN;AAEJ;AAEO,MAAM,WAAW,6BAA6B,YAAY;",
6
6
  "names": []
7
7
  }
@@ -3,17 +3,20 @@ import { jsx } from "react/jsx-runtime";
3
3
  import { DSNavSearchBox } from "@elliemae/ds-form";
4
4
  const TreeViewSearchBar = (props) => {
5
5
  const { handleChange, onNext, onPrevious, onClear, currentResultIndex, totalResults, value } = props;
6
- return /* @__PURE__ */ jsx(DSNavSearchBox, {
7
- onChange: (v) => {
8
- handleChange({ target: { value: v } });
9
- },
10
- onNext,
11
- onPrevious,
12
- onClear,
13
- currentResultIndex,
14
- totalResults,
15
- value
16
- });
6
+ return /* @__PURE__ */ jsx(
7
+ DSNavSearchBox,
8
+ {
9
+ onChange: (v) => {
10
+ handleChange({ target: { value: v } });
11
+ },
12
+ onNext,
13
+ onPrevious,
14
+ onClear,
15
+ currentResultIndex,
16
+ totalResults,
17
+ value
18
+ }
19
+ );
17
20
  };
18
21
  export {
19
22
  TreeViewSearchBar
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/related-components/TreeViewSearchBar.tsx"],
4
4
  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React from 'react';\nimport { DSNavSearchBox } from '@elliemae/ds-form';\n\ninterface PropsT {\n handleChange: (opt: { target: { value: string } }) => void;\n onNext: () => void;\n onPrevious: () => void;\n onClear: () => void;\n currentResultIndex: number;\n totalResults: number;\n value: string;\n}\n\nexport const TreeViewSearchBar = (props: PropsT) => {\n const { handleChange, onNext, onPrevious, onClear, currentResultIndex, totalResults, value } = props;\n\n return (\n <DSNavSearchBox\n onChange={(v: string) => {\n handleChange({ target: { value: v } });\n }}\n onNext={onNext}\n onPrevious={onPrevious}\n onClear={onClear}\n currentResultIndex={currentResultIndex}\n totalResults={totalResults}\n value={value}\n />\n );\n};\n\n// TreeViewSearchBar.propTypes = {\n// value: PropTypes.string.isRequired,\n// handleChange: PropTypes.func.isRequired,\n// onNext: PropTypes.func.isRequired,\n// onPrevious: PropTypes.func.isRequired,\n// onClear: PropTypes.func.isRequired,\n// currentResultIndex: PropTypes.number.isRequired,\n// totalResults: PropTypes.number.isRequired,\n// };\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACkBnB;AAhBJ,SAAS,sBAAsB;AAYxB,MAAM,oBAAoB,CAAC,UAAkB;AAClD,QAAM,EAAE,cAAc,QAAQ,YAAY,SAAS,oBAAoB,cAAc,MAAM,IAAI;AAE/F,SACE,oBAAC;AAAA,IACC,UAAU,CAAC,MAAc;AACvB,mBAAa,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,CAAC;AAAA,IACvC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,GACF;AAEJ;",
5
+ "mappings": "AAAA,YAAY,WAAW;ACkBnB;AAhBJ,SAAS,sBAAsB;AAYxB,MAAM,oBAAoB,CAAC,UAAkB;AAClD,QAAM,EAAE,cAAc,QAAQ,YAAY,SAAS,oBAAoB,cAAc,MAAM,IAAI;AAE/F,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU,CAAC,MAAc;AACvB,qBAAa,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,CAAC;AAAA,MACvC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,EACF;AAEJ;",
6
6
  "names": []
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-treeview",
3
- "version": "3.12.0-rc.2",
3
+ "version": "3.12.0-rc.21",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Tree View",
6
6
  "files": [
@@ -227,19 +227,19 @@
227
227
  "typeSafety": false
228
228
  },
229
229
  "dependencies": {
230
- "@elliemae/ds-button": "3.12.0-rc.2",
231
- "@elliemae/ds-circular-progress-indicator": "3.12.0-rc.2",
232
- "@elliemae/ds-classnames": "3.12.0-rc.2",
233
- "@elliemae/ds-drag-and-drop": "3.12.0-rc.2",
234
- "@elliemae/ds-form": "3.12.0-rc.2",
235
- "@elliemae/ds-icons": "3.12.0-rc.2",
236
- "@elliemae/ds-system": "3.12.0-rc.2",
237
- "@elliemae/ds-truncated-tooltip-text": "3.12.0-rc.2",
238
- "@elliemae/ds-utilities": "3.12.0-rc.2",
239
230
  "react-highlight-words": "~0.18.0",
240
231
  "react-virtual": "~2.10.4",
241
232
  "tree-model": "~1.0.7",
242
- "uid": "~2.0.1"
233
+ "uid": "~2.0.1",
234
+ "@elliemae/ds-button": "3.12.0-rc.21",
235
+ "@elliemae/ds-circular-progress-indicator": "3.12.0-rc.21",
236
+ "@elliemae/ds-classnames": "3.12.0-rc.21",
237
+ "@elliemae/ds-form": "3.12.0-rc.21",
238
+ "@elliemae/ds-icons": "3.12.0-rc.21",
239
+ "@elliemae/ds-system": "3.12.0-rc.21",
240
+ "@elliemae/ds-truncated-tooltip-text": "3.12.0-rc.21",
241
+ "@elliemae/ds-utilities": "3.12.0-rc.21",
242
+ "@elliemae/ds-drag-and-drop": "3.12.0-rc.21"
243
243
  },
244
244
  "devDependencies": {
245
245
  "@testing-library/jest-dom": "~5.16.4",