@elliemae/ds-treeview 3.4.2 → 3.4.3
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.
- package/dist/cjs/TreeView.js +9 -5
- package/dist/cjs/TreeView.js.map +2 -2
- package/dist/cjs/TreeViewContext.js +4 -1
- package/dist/cjs/TreeViewContext.js.map +1 -1
- package/dist/cjs/config/cssClassesConstants.js +4 -1
- package/dist/cjs/config/cssClassesConstants.js.map +1 -1
- package/dist/cjs/config/useTreeview.js +62 -52
- package/dist/cjs/config/useTreeview.js.map +2 -2
- package/dist/cjs/hoc/DnDTreeContext.js +4 -1
- package/dist/cjs/hoc/DnDTreeContext.js.map +1 -1
- package/dist/cjs/hoc/SortableItemContext.js +4 -1
- package/dist/cjs/hoc/SortableItemContext.js.map +2 -2
- package/dist/cjs/hoc/WithConditionalDnDContext.js +67 -50
- package/dist/cjs/hoc/WithConditionalDnDContext.js.map +2 -2
- package/dist/cjs/hoc/WithDnDSortableItemContext.js +24 -13
- package/dist/cjs/hoc/WithDnDSortableItemContext.js.map +2 -2
- package/dist/cjs/index.js +4 -1
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/parts/CheckboxSelectable.js +20 -11
- package/dist/cjs/parts/CheckboxSelectable.js.map +2 -2
- package/dist/cjs/parts/ChildrenCountDisplayer.js +12 -5
- package/dist/cjs/parts/ChildrenCountDisplayer.js.map +1 -1
- package/dist/cjs/parts/DnDHandle.js +7 -3
- package/dist/cjs/parts/DnDHandle.js.map +1 -1
- package/dist/cjs/parts/DropIndicator.js +27 -16
- package/dist/cjs/parts/DropIndicator.js.map +1 -1
- package/dist/cjs/parts/ExpandCaret.js +11 -8
- package/dist/cjs/parts/ExpandCaret.js.map +2 -2
- package/dist/cjs/parts/Icon.js +4 -1
- package/dist/cjs/parts/Icon.js.map +2 -2
- package/dist/cjs/parts/NestingSpace.js +6 -3
- package/dist/cjs/parts/NestingSpace.js.map +1 -1
- package/dist/cjs/parts/RadioSelectable.js +7 -3
- package/dist/cjs/parts/RadioSelectable.js.map +2 -2
- package/dist/cjs/parts/TreeItem.js +89 -49
- package/dist/cjs/parts/TreeItem.js.map +2 -2
- package/dist/cjs/parts/TreeItemText.js +58 -31
- package/dist/cjs/parts/TreeItemText.js.map +2 -2
- package/dist/cjs/parts/TreeList.js +62 -49
- package/dist/cjs/parts/TreeList.js.map +2 -2
- package/dist/cjs/plugins/dnd/TreeDndPlugin.js +4 -1
- package/dist/cjs/plugins/dnd/TreeDndPlugin.js.map +1 -1
- package/dist/cjs/plugins/dnd/index.js +4 -1
- package/dist/cjs/plugins/dnd/index.js.map +1 -1
- package/dist/cjs/plugins/index.js +4 -1
- package/dist/cjs/plugins/index.js.map +1 -1
- package/dist/cjs/react-desc-prop-types.js +16 -9
- package/dist/cjs/react-desc-prop-types.js.map +1 -1
- package/dist/cjs/related-components/TreeViewSearchBar.js +6 -3
- package/dist/cjs/related-components/TreeViewSearchBar.js.map +1 -1
- package/dist/cjs/sharedTypes.js +4 -1
- package/dist/cjs/sharedTypes.js.map +1 -1
- package/dist/cjs/utils/array-helpers.js +4 -1
- package/dist/cjs/utils/array-helpers.js.map +1 -1
- package/dist/cjs/utils/group-expands-helpers.js +8 -2
- package/dist/cjs/utils/group-expands-helpers.js.map +1 -1
- package/dist/cjs/utils/keyboard-helpers.js +104 -92
- package/dist/cjs/utils/keyboard-helpers.js.map +2 -2
- package/dist/cjs/utils/object-helpers.js +4 -1
- package/dist/cjs/utils/object-helpers.js.map +1 -1
- package/dist/cjs/utils/refs-helpers.js +4 -1
- package/dist/cjs/utils/refs-helpers.js.map +1 -1
- package/dist/cjs/utils/selectable-helper.js +4 -1
- package/dist/cjs/utils/selectable-helper.js.map +1 -1
- package/dist/cjs/utils/string-helpers.js +4 -1
- package/dist/cjs/utils/string-helpers.js.map +1 -1
- package/dist/cjs/utils/tree-helpers.js +8 -2
- package/dist/cjs/utils/tree-helpers.js.map +1 -1
- package/dist/cjs/utils/useInstanceRefActions.js +50 -35
- package/dist/cjs/utils/useInstanceRefActions.js.map +1 -1
- package/dist/cjs/utils/useTree.js +12 -4
- package/dist/cjs/utils/useTree.js.map +2 -2
- package/dist/esm/TreeView.js +5 -4
- package/dist/esm/TreeView.js.map +1 -1
- package/dist/esm/TreeViewContext.js.map +1 -1
- package/dist/esm/config/cssClassesConstants.js.map +1 -1
- package/dist/esm/config/useTreeview.js +58 -51
- package/dist/esm/config/useTreeview.js.map +1 -1
- package/dist/esm/hoc/DnDTreeContext.js.map +1 -1
- package/dist/esm/hoc/SortableItemContext.js.map +2 -2
- package/dist/esm/hoc/WithConditionalDnDContext.js +63 -49
- package/dist/esm/hoc/WithConditionalDnDContext.js.map +1 -1
- package/dist/esm/hoc/WithDnDSortableItemContext.js +20 -12
- package/dist/esm/hoc/WithDnDSortableItemContext.js.map +1 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/parts/CheckboxSelectable.js +16 -10
- package/dist/esm/parts/CheckboxSelectable.js.map +1 -1
- package/dist/esm/parts/ChildrenCountDisplayer.js +8 -4
- package/dist/esm/parts/ChildrenCountDisplayer.js.map +1 -1
- package/dist/esm/parts/DnDHandle.js +3 -2
- package/dist/esm/parts/DnDHandle.js.map +1 -1
- package/dist/esm/parts/DropIndicator.js +23 -15
- package/dist/esm/parts/DropIndicator.js.map +1 -1
- package/dist/esm/parts/ExpandCaret.js +7 -7
- package/dist/esm/parts/ExpandCaret.js.map +1 -1
- package/dist/esm/parts/Icon.js.map +2 -2
- package/dist/esm/parts/NestingSpace.js +2 -2
- package/dist/esm/parts/NestingSpace.js.map +1 -1
- package/dist/esm/parts/RadioSelectable.js +3 -2
- package/dist/esm/parts/RadioSelectable.js.map +1 -1
- package/dist/esm/parts/TreeItem.js +85 -48
- package/dist/esm/parts/TreeItem.js.map +1 -1
- package/dist/esm/parts/TreeItemText.js +54 -30
- package/dist/esm/parts/TreeItemText.js.map +1 -1
- package/dist/esm/parts/TreeList.js +58 -48
- package/dist/esm/parts/TreeList.js.map +1 -1
- package/dist/esm/plugins/dnd/TreeDndPlugin.js.map +1 -1
- package/dist/esm/plugins/dnd/index.js.map +1 -1
- package/dist/esm/plugins/index.js.map +1 -1
- package/dist/esm/react-desc-prop-types.js +12 -8
- package/dist/esm/react-desc-prop-types.js.map +1 -1
- package/dist/esm/related-components/TreeViewSearchBar.js +2 -2
- package/dist/esm/related-components/TreeViewSearchBar.js.map +1 -1
- package/dist/esm/sharedTypes.js.map +1 -1
- package/dist/esm/utils/array-helpers.js.map +1 -1
- package/dist/esm/utils/group-expands-helpers.js +4 -1
- package/dist/esm/utils/group-expands-helpers.js.map +1 -1
- package/dist/esm/utils/keyboard-helpers.js +100 -91
- package/dist/esm/utils/keyboard-helpers.js.map +1 -1
- package/dist/esm/utils/object-helpers.js.map +1 -1
- package/dist/esm/utils/refs-helpers.js.map +1 -1
- package/dist/esm/utils/selectable-helper.js.map +1 -1
- package/dist/esm/utils/string-helpers.js.map +1 -1
- package/dist/esm/utils/tree-helpers.js +4 -1
- package/dist/esm/utils/tree-helpers.js.map +1 -1
- package/dist/esm/utils/useInstanceRefActions.js +46 -34
- package/dist/esm/utils/useInstanceRefActions.js.map +1 -1
- package/dist/esm/utils/useTree.js +8 -3
- package/dist/esm/utils/useTree.js.map +1 -1
- package/package.json +10 -10
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var CheckboxSelectable_exports = {};
|
|
23
26
|
__export(CheckboxSelectable_exports, {
|
|
@@ -25,7 +28,8 @@ __export(CheckboxSelectable_exports, {
|
|
|
25
28
|
});
|
|
26
29
|
module.exports = __toCommonJS(CheckboxSelectable_exports);
|
|
27
30
|
var React = __toESM(require("react"));
|
|
28
|
-
var
|
|
31
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
|
+
var import_react = require("react");
|
|
29
33
|
var import_ds_form = require("@elliemae/ds-form");
|
|
30
34
|
var import_ds_system = require("@elliemae/ds-system");
|
|
31
35
|
var import_TreeViewContext = __toESM(require("../TreeViewContext"));
|
|
@@ -47,7 +51,10 @@ function CheckboxSelectable(props) {
|
|
|
47
51
|
} = ctx;
|
|
48
52
|
const onCheckboxChange = (0, import_react.useCallback)(() => {
|
|
49
53
|
const newSelections = (0, import_selectable_helper.toggleCheckboxItem)(item);
|
|
50
|
-
const newSelectionHasmap = (0, import_object_helpers.filterObject)(
|
|
54
|
+
const newSelectionHasmap = (0, import_object_helpers.filterObject)(
|
|
55
|
+
{ ...selectedCheckboxes, ...newSelections },
|
|
56
|
+
(value) => value !== false
|
|
57
|
+
);
|
|
51
58
|
setSelectedCheckboxes(newSelectionHasmap);
|
|
52
59
|
triggerTreeRerender();
|
|
53
60
|
const indexAndScrollTo = {
|
|
@@ -78,14 +85,16 @@ function CheckboxSelectable(props) {
|
|
|
78
85
|
return false;
|
|
79
86
|
}, [selectedCheckboxes, id]);
|
|
80
87
|
const isDisabled = (0, import_react.useMemo)(() => isItemDisabled(item), [item, isItemDisabled]);
|
|
81
|
-
return /* @__PURE__ */
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
88
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledCheckboxWrapper, {
|
|
89
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_form.DSCheckbox, {
|
|
90
|
+
checked: isChecked,
|
|
91
|
+
disabled: isDisabled,
|
|
92
|
+
className: "em-ds-tree-item-checkbox",
|
|
93
|
+
"data-testid": "tree-item-checkbox",
|
|
94
|
+
onChange: onCheckboxChange,
|
|
95
|
+
tabIndex: "0"
|
|
96
|
+
})
|
|
97
|
+
});
|
|
89
98
|
}
|
|
90
99
|
var CheckboxSelectable_default = CheckboxSelectable;
|
|
91
100
|
//# sourceMappingURL=CheckboxSelectable.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/parts/CheckboxSelectable.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useContext, useCallback, useMemo } from 'react';\nimport { DSCheckbox } from '@elliemae/ds-form';\nimport { styled } from '@elliemae/ds-system';\nimport TreeViewContext from '../TreeViewContext';\nimport { toggleCheckboxItem } from '../utils/selectable-helper';\nimport { filterObject } from '../utils/object-helpers';\nimport type { DSTreeviewT } from '../react-desc-prop-types';\nconst StyledCheckboxWrapper = styled.span`\n padding-top: 3px;\n`;\ninterface PropsT {\n item: DSTreeviewT.Item;\n itemIndex: number;\n}\nfunction CheckboxSelectable(props: PropsT): JSX.Element | null {\n const { item, itemIndex } = props;\n const { id } = item;\n\n const ctx = useContext(TreeViewContext);\n const {\n props: { onSelectionChange, isItemDisabled },\n virtualListHelpers: { scrollToIndex },\n triggerTreeRerender,\n selectedCheckboxes,\n setSelectedCheckboxes,\n } = ctx;\n\n const onCheckboxChange = useCallback(() => {\n const newSelections = toggleCheckboxItem(item);\n const newSelectionHasmap = filterObject<DSTreeviewT.SelectionState>(\n { ...selectedCheckboxes, ...newSelections },\n (value) => value !== false,\n );\n setSelectedCheckboxes(newSelectionHasmap);\n triggerTreeRerender();\n\n const indexAndScrollTo = {\n scrollToItem: () => {\n if (typeof item.virtualIndex === 'number') scrollToIndex(item.virtualIndex);\n },\n itemIndex,\n };\n if (onSelectionChange) onSelectionChange(newSelectionHasmap, item, indexAndScrollTo);\n }, [\n item,\n triggerTreeRerender,\n onSelectionChange,\n itemIndex,\n scrollToIndex,\n selectedCheckboxes,\n setSelectedCheckboxes,\n ]);\n const isChecked = useMemo(() => {\n if (selectedCheckboxes[id] === 'mixed') {\n return 'mixed' as const;\n }\n if (selectedCheckboxes[id] === true) {\n return true;\n }\n return false;\n }, [selectedCheckboxes, id]);\n\n const isDisabled = useMemo(() => isItemDisabled(item), [item, isItemDisabled]);\n\n return (\n <StyledCheckboxWrapper>\n <DSCheckbox\n checked={isChecked}\n disabled={isDisabled}\n className=\"em-ds-tree-item-checkbox\"\n data-testid=\"tree-item-checkbox\"\n onChange={onCheckboxChange}\n tabIndex=\"0\"\n />\n </StyledCheckboxWrapper>\n );\n}\n\nexport default CheckboxSelectable;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAAwD;AACxD,qBAA2B;AAC3B,uBAAuB;AACvB,6BAA4B;AAC5B,+BAAmC;AACnC,4BAA6B;AAE7B,MAAM,wBAAwB,wBAAO;AAAA;AAAA;AAOrC,SAAS,mBAAmB,OAAmC;AAC7D,QAAM,EAAE,MAAM,UAAU,IAAI;AAC5B,QAAM,EAAE,GAAG,IAAI;AAEf,QAAM,UAAM,yBAAW,uBAAAA,OAAe;AACtC,QAAM;AAAA,IACJ,OAAO,EAAE,mBAAmB,eAAe;AAAA,IAC3C,oBAAoB,EAAE,cAAc;AAAA,IACpC;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,uBAAmB,0BAAY,MAAM;AACzC,UAAM,oBAAgB,6CAAmB,IAAI;AAC7C,UAAM,yBAAqB;AAAA,MACzB,EAAE,GAAG,oBAAoB,GAAG,cAAc;AAAA,MAC1C,CAAC,UAAU,UAAU;AAAA,IACvB;AACA,0BAAsB,kBAAkB;AACxC,wBAAoB;AAEpB,UAAM,mBAAmB;AAAA,MACvB,cAAc,MAAM;AAClB,YAAI,OAAO,KAAK,iBAAiB;AAAU,wBAAc,KAAK,YAAY;AAAA,MAC5E;AAAA,MACA;AAAA,IACF;AACA,QAAI;AAAmB,wBAAkB,oBAAoB,MAAM,gBAAgB;AAAA,EACrF,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM,gBAAY,sBAAQ,MAAM;AAC9B,QAAI,mBAAmB,QAAQ,SAAS;AACtC,aAAO;AAAA,IACT;AACA,QAAI,mBAAmB,QAAQ,MAAM;AACnC,aAAO;AAAA,IACT;AACA,WAAO;AAAA,EACT,GAAG,CAAC,oBAAoB,EAAE,CAAC;AAE3B,QAAM,iBAAa,sBAAQ,MAAM,eAAe,IAAI,GAAG,CAAC,MAAM,cAAc,CAAC;AAE7E,SACE,4CAAC;AAAA,IACC,sDAAC;AAAA,MACC,SAAS;AAAA,MACT,UAAU;AAAA,MACV,WAAU;AAAA,MACV,eAAY;AAAA,MACZ,UAAU;AAAA,MACV,UAAS;AAAA,KACX;AAAA,GACF;AAEJ;AAEA,IAAO,6BAAQ;",
|
|
6
|
+
"names": ["TreeViewContext"]
|
|
7
7
|
}
|
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var ChildrenCountDisplayer_exports = {};
|
|
23
26
|
__export(ChildrenCountDisplayer_exports, {
|
|
@@ -25,7 +28,7 @@ __export(ChildrenCountDisplayer_exports, {
|
|
|
25
28
|
});
|
|
26
29
|
module.exports = __toCommonJS(ChildrenCountDisplayer_exports);
|
|
27
30
|
var React = __toESM(require("react"));
|
|
28
|
-
var
|
|
31
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
29
32
|
var import_ds_system = require("@elliemae/ds-system");
|
|
30
33
|
var import_cssClassesConstants = require("../config/cssClassesConstants");
|
|
31
34
|
const Separator = import_ds_system.styled.span`
|
|
@@ -41,9 +44,13 @@ const ChildrenCountDisplayer = (props) => {
|
|
|
41
44
|
const { isGroup, children } = item;
|
|
42
45
|
if (!isGroup)
|
|
43
46
|
return null;
|
|
44
|
-
return /* @__PURE__ */
|
|
47
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
|
|
45
48
|
"data-testid": "tree-item-children-count-displayer",
|
|
46
|
-
className
|
|
47
|
-
|
|
49
|
+
className,
|
|
50
|
+
children: [
|
|
51
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Separator, {}),
|
|
52
|
+
`${children.length} Items`
|
|
53
|
+
]
|
|
54
|
+
});
|
|
48
55
|
};
|
|
49
56
|
//# sourceMappingURL=ChildrenCountDisplayer.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/parts/ChildrenCountDisplayer.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable react/function-component-definition */\nimport React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { DSTreeViewPrefix, treeItemBlockName } from '../config/cssClassesConstants';\nimport type { DSTreeviewT } from '../react-desc-prop-types';\n\nconst Separator = styled.span`\n width: 1px;\n height: 12px;\n margin: 0 8px;\n border-left: 1px solid ${(props) => props.theme.colors.neutral['600']};\n font-size: 12px;\n`;\n\nconst className = `${DSTreeViewPrefix}-${treeItemBlockName}-children-count-displayer`;\n\ninterface PropsT {\n item: DSTreeviewT.Item;\n}\n\nexport const ChildrenCountDisplayer: React.ComponentType<PropsT> = (props) => {\n const { item } = props;\n const { isGroup, children } = item;\n\n if (!isGroup) return null;\n return (\n <span data-testid=\"tree-item-children-count-displayer\" className={className}>\n <Separator />\n {`${children.length} Items`}\n </span>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAEA,uBAAuB;AACvB,iCAAoD;AAGpD,MAAM,YAAY,wBAAO;AAAA;AAAA;AAAA;AAAA,2BAIE,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAIjE,MAAM,YAAY,GAAG,+CAAoB;AAMlC,MAAM,yBAAsD,CAAC,UAAU;AAC5E,QAAM,EAAE,KAAK,IAAI;AACjB,QAAM,EAAE,SAAS,SAAS,IAAI;AAE9B,MAAI,CAAC;AAAS,WAAO;AACrB,SACE,6CAAC;AAAA,IAAK,eAAY;AAAA,IAAqC;AAAA,IACrD;AAAA,kDAAC,aAAU;AAAA,MACV,GAAG,SAAS;AAAA;AAAA,GACf;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var DnDHandle_exports = {};
|
|
23
26
|
__export(DnDHandle_exports, {
|
|
@@ -25,13 +28,14 @@ __export(DnDHandle_exports, {
|
|
|
25
28
|
});
|
|
26
29
|
module.exports = __toCommonJS(DnDHandle_exports);
|
|
27
30
|
var React = __toESM(require("react"));
|
|
28
|
-
var import_react =
|
|
31
|
+
var import_react = require("react");
|
|
32
|
+
var import_react = require("react");
|
|
29
33
|
var import_ds_icons = require("@elliemae/ds-icons");
|
|
30
34
|
var import_SortableItemContext = require("../hoc/SortableItemContext");
|
|
31
35
|
const DnDHandle = ({ id, isDragOverlay }) => {
|
|
32
36
|
const { draggableProps } = (0, import_react.useContext)(import_SortableItemContext.SortableItemContext);
|
|
33
37
|
const isDragging = draggableProps && draggableProps.isDragging;
|
|
34
|
-
return /* @__PURE__ */ import_react.
|
|
38
|
+
return /* @__PURE__ */ (0, import_react.createElement)(import_ds_icons.GripperVertical, {
|
|
35
39
|
role: "button",
|
|
36
40
|
...draggableProps && {
|
|
37
41
|
...draggableProps.listeners,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/parts/DnDHandle.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useContext } from 'react';\nimport { GripperVertical } from '@elliemae/ds-icons';\nimport { SortableItemContext } from '../hoc/SortableItemContext';\nimport { DSTreeviewT } from '../react-desc-prop-types';\n\ninterface DnDHandleProps {\n id: DSTreeviewT.StringOrNum;\n isDragOverlay: boolean;\n}\n\nexport const DnDHandle = ({ id, isDragOverlay }: DnDHandleProps) => {\n const { draggableProps } = useContext(SortableItemContext);\n\n const isDragging = draggableProps && draggableProps.isDragging;\n\n return (\n <GripperVertical\n role=\"button\"\n {...(draggableProps && {\n ...draggableProps.listeners,\n ...draggableProps.attributes,\n })}\n data-testid=\"drag-handle\"\n data-isactive={draggableProps && !!draggableProps.active}\n data-isdragoverlay={isDragOverlay}\n id={`${id}-drag-handle`}\n key={`${id}-drag-handle`}\n className={`drag-handle ${isDragging ? '' : 'focuseable'}`}\n color={isDragging ? ['neutral', '080'] : ['brand-primary', '800']}\n size=\"s\"\n tabIndex={0}\n />\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAAkC;AAClC,sBAAgC;AAChC,iCAAoC;AAQ7B,MAAM,YAAY,CAAC,EAAE,IAAI,cAAc,MAAsB;AAClE,QAAM,EAAE,eAAe,QAAI,yBAAW,8CAAmB;AAEzD,QAAM,aAAa,kBAAkB,eAAe;AAEpD,SACE,gDAAC;AAAA,IACC,MAAK;AAAA,IACJ,GAAI,kBAAkB;AAAA,MACrB,GAAG,eAAe;AAAA,MAClB,GAAG,eAAe;AAAA,IACpB;AAAA,IACA,eAAY;AAAA,IACZ,iBAAe,kBAAkB,CAAC,CAAC,eAAe;AAAA,IAClD,sBAAoB;AAAA,IACpB,IAAI,GAAG;AAAA,IACP,KAAK,GAAG;AAAA,IACR,WAAW,eAAe,aAAa,KAAK;AAAA,IAC5C,OAAO,aAAa,CAAC,WAAW,KAAK,IAAI,CAAC,iBAAiB,KAAK;AAAA,IAChE,MAAK;AAAA,IACL,UAAU;AAAA,GACZ;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var DropIndicator_exports = {};
|
|
23
26
|
__export(DropIndicator_exports, {
|
|
@@ -25,7 +28,7 @@ __export(DropIndicator_exports, {
|
|
|
25
28
|
});
|
|
26
29
|
module.exports = __toCommonJS(DropIndicator_exports);
|
|
27
30
|
var React = __toESM(require("react"));
|
|
28
|
-
var
|
|
31
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
29
32
|
var import_ds_system = require("@elliemae/ds-system");
|
|
30
33
|
var import_SortableItemContext = require("../hoc/SortableItemContext");
|
|
31
34
|
const getPositionStyles = ({ dropIndicatorPosition }) => `
|
|
@@ -50,25 +53,33 @@ const StyledIndicator = import_ds_system.styled.div`
|
|
|
50
53
|
background-color: ${({ isDropValid, theme }) => isDropValid ? theme.colors.brand[600] : theme.colors.danger[900]};
|
|
51
54
|
z-index: 20;
|
|
52
55
|
`;
|
|
53
|
-
const CircleIndicator = (style, isDropValid) => /* @__PURE__ */
|
|
56
|
+
const CircleIndicator = (style, isDropValid) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", {
|
|
54
57
|
height: "6",
|
|
55
58
|
width: "6",
|
|
56
|
-
style
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
})
|
|
59
|
+
style,
|
|
60
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", {
|
|
61
|
+
cx: "3",
|
|
62
|
+
cy: "3",
|
|
63
|
+
r: "3",
|
|
64
|
+
strokeWidth: "0",
|
|
65
|
+
fill: isDropValid ? "#1E79C2" : "#C64252"
|
|
66
|
+
})
|
|
67
|
+
});
|
|
64
68
|
const DropIndicator = ({ dropIndicatorPosition, isLast, isDropValid }) => {
|
|
65
|
-
if (![import_SortableItemContext.DropIndicatorPosition.After, import_SortableItemContext.DropIndicatorPosition.Before].includes(
|
|
69
|
+
if (![import_SortableItemContext.DropIndicatorPosition.After, import_SortableItemContext.DropIndicatorPosition.Before].includes(
|
|
70
|
+
dropIndicatorPosition
|
|
71
|
+
))
|
|
66
72
|
return null;
|
|
67
73
|
const safeDropIndicatorPosition = isLast ? import_SortableItemContext.DropIndicatorPosition.Before : dropIndicatorPosition;
|
|
68
|
-
return /* @__PURE__ */
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
74
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
|
|
75
|
+
children: [
|
|
76
|
+
CircleIndicator(getCircleStyles({ dropIndicatorPosition: safeDropIndicatorPosition }), isDropValid),
|
|
77
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledIndicator, {
|
|
78
|
+
dropIndicatorPosition: safeDropIndicatorPosition,
|
|
79
|
+
isDropValid
|
|
80
|
+
})
|
|
81
|
+
]
|
|
82
|
+
});
|
|
72
83
|
};
|
|
73
84
|
var DropIndicator_default = DropIndicator;
|
|
74
85
|
//# sourceMappingURL=DropIndicator.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/parts/DropIndicator.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { DropIndicatorPosition } from '../hoc/SortableItemContext';\n\ninterface DropIndicatorProps {\n vertical?: boolean;\n dropIndicatorPosition: DropIndicatorPosition | false;\n isLast?: boolean;\n isDropValid?: boolean;\n}\n\nconst getPositionStyles = ({ dropIndicatorPosition }: DropIndicatorProps) => `\n top: ${dropIndicatorPosition === DropIndicatorPosition.Before ? '0' : 'unset'};\n bottom: ${dropIndicatorPosition === DropIndicatorPosition.After ? '0' : 'unset'};\n left: -2px;\n `;\n\nconst getCircleStyles = ({ dropIndicatorPosition }: DropIndicatorProps) => ({\n position: 'absolute',\n zIndex: 20,\n top: dropIndicatorPosition === DropIndicatorPosition.After ? 'unset' : '-2px',\n bottom: dropIndicatorPosition === DropIndicatorPosition.Before ? 'unset' : '-2px',\n left: '0px',\n opacity: 1,\n});\n\nconst StyledIndicator = styled.div<DropIndicatorProps>`\n position: absolute;\n ${getPositionStyles}\n box-sizing: border-box;\n width: ${(props) => (props.vertical ? '2px' : '100%')};\n height: ${(props) => (props.vertical ? '100%' : '2px')};\n background-color: ${({ isDropValid, theme }) => (isDropValid ? theme.colors.brand[600] : theme.colors.danger[900])};\n z-index: 20;\n`;\n\nconst CircleIndicator = (style: Record<string, unknown>, isDropValid: boolean | null | undefined) => (\n <svg height=\"6\" width=\"6\" style={style}>\n <circle cx=\"3\" cy=\"3\" r=\"3\" strokeWidth=\"0\" fill={isDropValid ? '#1E79C2' : '#C64252'} />\n </svg>\n);\n\nconst DropIndicator: React.ComponentType<DropIndicatorProps> = ({ dropIndicatorPosition, isLast, isDropValid }) => {\n if (\n ![DropIndicatorPosition.After, DropIndicatorPosition.Before].includes(\n dropIndicatorPosition as DropIndicatorPosition,\n )\n )\n return null;\n\n const safeDropIndicatorPosition = isLast ? DropIndicatorPosition.Before : dropIndicatorPosition;\n\n return (\n <>\n {CircleIndicator(getCircleStyles({ dropIndicatorPosition: safeDropIndicatorPosition }), isDropValid)}\n <StyledIndicator dropIndicatorPosition={safeDropIndicatorPosition} isDropValid={isDropValid} />\n </>\n );\n};\n\nexport default DropIndicator;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,uBAAuB;AACvB,iCAAsC;AAStC,MAAM,oBAAoB,CAAC,EAAE,sBAAsB,MAA0B;AAAA,aAChE,0BAA0B,iDAAsB,SAAS,MAAM;AAAA,gBAC5D,0BAA0B,iDAAsB,QAAQ,MAAM;AAAA;AAAA;AAI9E,MAAM,kBAAkB,CAAC,EAAE,sBAAsB,OAA2B;AAAA,EAC1E,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,KAAK,0BAA0B,iDAAsB,QAAQ,UAAU;AAAA,EACvE,QAAQ,0BAA0B,iDAAsB,SAAS,UAAU;AAAA,EAC3E,MAAM;AAAA,EACN,SAAS;AACX;AAEA,MAAM,kBAAkB,wBAAO;AAAA;AAAA,IAE3B;AAAA;AAAA,WAEO,CAAC,UAAW,MAAM,WAAW,QAAQ;AAAA,YACpC,CAAC,UAAW,MAAM,WAAW,SAAS;AAAA,sBAC5B,CAAC,EAAE,aAAa,MAAM,MAAO,cAAc,MAAM,OAAO,MAAM,OAAO,MAAM,OAAO,OAAO;AAAA;AAAA;AAI/G,MAAM,kBAAkB,CAAC,OAAgC,gBACvD,4CAAC;AAAA,EAAI,QAAO;AAAA,EAAI,OAAM;AAAA,EAAI;AAAA,EACxB,sDAAC;AAAA,IAAO,IAAG;AAAA,IAAI,IAAG;AAAA,IAAI,GAAE;AAAA,IAAI,aAAY;AAAA,IAAI,MAAM,cAAc,YAAY;AAAA,GAAW;AAAA,CACzF;AAGF,MAAM,gBAAyD,CAAC,EAAE,uBAAuB,QAAQ,YAAY,MAAM;AACjH,MACE,CAAC,CAAC,iDAAsB,OAAO,iDAAsB,MAAM,EAAE;AAAA,IAC3D;AAAA,EACF;AAEA,WAAO;AAET,QAAM,4BAA4B,SAAS,iDAAsB,SAAS;AAE1E,SACE;AAAA,IACG;AAAA,sBAAgB,gBAAgB,EAAE,uBAAuB,0BAA0B,CAAC,GAAG,WAAW;AAAA,MACnG,4CAAC;AAAA,QAAgB,uBAAuB;AAAA,QAA2B;AAAA,OAA0B;AAAA;AAAA,GAC/F;AAEJ;AAEA,IAAO,wBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var ExpandCaret_exports = {};
|
|
23
26
|
__export(ExpandCaret_exports, {
|
|
@@ -25,7 +28,8 @@ __export(ExpandCaret_exports, {
|
|
|
25
28
|
});
|
|
26
29
|
module.exports = __toCommonJS(ExpandCaret_exports);
|
|
27
30
|
var React = __toESM(require("react"));
|
|
28
|
-
var
|
|
31
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
|
+
var import_react = require("react");
|
|
29
33
|
var import_ds_button = __toESM(require("@elliemae/ds-button"));
|
|
30
34
|
var import_ds_icons = require("@elliemae/ds-icons");
|
|
31
35
|
var import_group_expands_helpers = require("../utils/group-expands-helpers");
|
|
@@ -47,16 +51,15 @@ const ExpandCaret = (props) => {
|
|
|
47
51
|
virtualListHelpers: { scrollToIndex }
|
|
48
52
|
} = ctx;
|
|
49
53
|
if (isGroupOrHasChildrens)
|
|
50
|
-
return /* @__PURE__ */
|
|
54
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_button.default, {
|
|
51
55
|
buttonType: "text",
|
|
52
56
|
className: "expandable-arrow",
|
|
53
57
|
"data-testid": "tree-item-expand-toggle",
|
|
54
|
-
|
|
55
|
-
icon: isExpanded ? /* @__PURE__ */ import_react.default.createElement(import_ds_icons.ArrowheadDown, {
|
|
58
|
+
icon: isExpanded ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.ArrowheadDown, {
|
|
56
59
|
size: "s",
|
|
57
60
|
"data-testid": "ic-arrow-head-down",
|
|
58
61
|
color: ["brand-primary", "800"]
|
|
59
|
-
}) : /* @__PURE__ */
|
|
62
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.ArrowheadRight, {
|
|
60
63
|
size: "s",
|
|
61
64
|
"data-testid": "ic-arrow-head-right",
|
|
62
65
|
color: ["brand-primary", "800"]
|
|
@@ -84,8 +87,8 @@ const ExpandCaret = (props) => {
|
|
|
84
87
|
},
|
|
85
88
|
size: "s",
|
|
86
89
|
tabIndex: -1
|
|
87
|
-
});
|
|
88
|
-
return /* @__PURE__ */
|
|
90
|
+
}, `${id}-expand-addon`);
|
|
91
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
89
92
|
style: { width: "24px" }
|
|
90
93
|
});
|
|
91
94
|
};
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/parts/ExpandCaret.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useContext, useCallback } from 'react';\nimport Button from '@elliemae/ds-button';\nimport { ArrowheadDown, ArrowheadRight } from '@elliemae/ds-icons';\nimport { toggleItemExpand } from '../utils/group-expands-helpers';\nimport { focusItem } from '../utils/tree-helpers';\nimport TreeViewContext from '../TreeViewContext';\nimport type { DSTreeviewT } from '../react-desc-prop-types';\n\ninterface PropsT {\n item: DSTreeviewT.Item;\n}\n\nexport const ExpandCaret = (props: PropsT): JSX.Element | null => {\n const defaultHandleExpandGroup = useCallback(toggleItemExpand, []);\n const { item } = props;\n const { id, isExpanded, isGroup, children } = item;\n const isGroupOrHasChildrens = isGroup || (Array.isArray(children) && children.length > 0);\n const ctx = useContext(TreeViewContext);\n const {\n props: { onItemFocus },\n handleExpandGroup = defaultHandleExpandGroup,\n triggerTreeRerender,\n updateUserExpandedState,\n setLatestToggledItem,\n setFocusedItem,\n virtualListHelpers: { scrollToIndex },\n } = ctx;\n\n if (isGroupOrHasChildrens)\n return (\n <Button\n buttonType=\"text\"\n className=\"expandable-arrow\"\n data-testid=\"tree-item-expand-toggle\"\n key={`${id}-expand-addon`}\n icon={\n isExpanded ? (\n <ArrowheadDown size=\"s\" data-testid=\"ic-arrow-head-down\" color={['brand-primary', '800']} />\n ) : (\n <ArrowheadRight size=\"s\" data-testid=\"ic-arrow-head-right\" color={['brand-primary', '800']} />\n )\n }\n onMouseDown={(e: React.MouseEvent) => {\n // prevent focusing the caret\n if (e) {\n e.preventDefault();\n }\n }}\n onClick={(e) => {\n e.stopPropagation();\n if (e) handleExpandGroup(item, triggerTreeRerender, updateUserExpandedState, scrollToIndex, e);\n setLatestToggledItem(item);\n const itemVitualIndex = item.virtualIndex;\n if (typeof itemVitualIndex === 'number') {\n onItemFocus({\n itemIndex: itemVitualIndex,\n scrollToItem: (opts = { align: 'start' }) => scrollToIndex(itemVitualIndex, opts),\n item,\n });\n }\n setFocusedItem(item);\n focusItem(item);\n }}\n size=\"s\"\n tabIndex={-1}\n />\n );\n return <div style={{ width: '24px' }} />;\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAA+C;AAC/C,uBAAmB;AACnB,sBAA8C;AAC9C,mCAAiC;AACjC,0BAA0B;AAC1B,6BAA4B;AAOrB,MAAM,cAAc,CAAC,UAAsC;AAChE,QAAM,+BAA2B,0BAAY,+CAAkB,CAAC,CAAC;AACjE,QAAM,EAAE,KAAK,IAAI;AACjB,QAAM,EAAE,IAAI,YAAY,SAAS,SAAS,IAAI;AAC9C,QAAM,wBAAwB,WAAY,MAAM,QAAQ,QAAQ,KAAK,SAAS,SAAS;AACvF,QAAM,UAAM,yBAAW,uBAAAA,OAAe;AACtC,QAAM;AAAA,IACJ,OAAO,EAAE,YAAY;AAAA,IACrB,oBAAoB;AAAA,IACpB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,oBAAoB,EAAE,cAAc;AAAA,EACtC,IAAI;AAEJ,MAAI;AACF,WACE,4CAAC,iBAAAC,SAAA;AAAA,MACC,YAAW;AAAA,MACX,WAAU;AAAA,MACV,eAAY;AAAA,MAEZ,MACE,aACE,4CAAC;AAAA,QAAc,MAAK;AAAA,QAAI,eAAY;AAAA,QAAqB,OAAO,CAAC,iBAAiB,KAAK;AAAA,OAAG,IAE1F,4CAAC;AAAA,QAAe,MAAK;AAAA,QAAI,eAAY;AAAA,QAAsB,OAAO,CAAC,iBAAiB,KAAK;AAAA,OAAG;AAAA,MAGhG,aAAa,CAAC,MAAwB;AAEpC,YAAI,GAAG;AACL,YAAE,eAAe;AAAA,QACnB;AAAA,MACF;AAAA,MACA,SAAS,CAAC,MAAM;AACd,UAAE,gBAAgB;AAClB,YAAI;AAAG,4BAAkB,MAAM,qBAAqB,yBAAyB,eAAe,CAAC;AAC7F,6BAAqB,IAAI;AACzB,cAAM,kBAAkB,KAAK;AAC7B,YAAI,OAAO,oBAAoB,UAAU;AACvC,sBAAY;AAAA,YACV,WAAW;AAAA,YACX,cAAc,CAAC,OAAO,EAAE,OAAO,QAAQ,MAAM,cAAc,iBAAiB,IAAI;AAAA,YAChF;AAAA,UACF,CAAC;AAAA,QACH;AACA,uBAAe,IAAI;AACnB,2CAAU,IAAI;AAAA,MAChB;AAAA,MACA,MAAK;AAAA,MACL,UAAU;AAAA,OA9BL,GAAG,iBA+BV;AAEJ,SAAO,4CAAC;AAAA,IAAI,OAAO,EAAE,OAAO,OAAO;AAAA,GAAG;AACxC;",
|
|
6
|
+
"names": ["TreeViewContext", "Button"]
|
|
7
7
|
}
|
package/dist/cjs/parts/Icon.js
CHANGED
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var Icon_exports = {};
|
|
23
26
|
__export(Icon_exports, {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/parts/Icon.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useContext } from 'react';\nimport { cx } from '@elliemae/ds-utilities';\n\nimport TreeViewContext from '../TreeViewContext';\nimport type { DSTreeviewT } from '../react-desc-prop-types';\ninterface PropsT {\n item: DSTreeviewT.Item;\n}\nexport const Icon = (props: PropsT): JSX.Element | null => {\n const { item } = props;\n const isGroupOrHasChildrens = item.isGroup || (Array.isArray(item.children) && item.children.length > 0);\n const ctx = useContext(TreeViewContext);\n const {\n props: { groupIcon, itemIcon },\n } = ctx;\n const icon = isGroupOrHasChildrens ? groupIcon : itemIcon;\n if (!icon) return null;\n\n return React.cloneElement(icon, {\n 'data-testid': isGroupOrHasChildrens ? 'tree-item-group-icon' : 'tree-item-icon',\n // legacy class-name way of handling things,\n // this will eventually be deprecated in favor of styled components\n // untill then, just eslint-ignore and move on\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-assignment\n className: cx(icon.props.className, 'tree-item-icon'),\n });\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkC;AAClC,0BAAmB;AAEnB,6BAA4B;AAKrB,MAAM,OAAO,CAAC,UAAsC;AACzD,QAAM,EAAE,KAAK,IAAI;AACjB,QAAM,wBAAwB,KAAK,WAAY,MAAM,QAAQ,KAAK,QAAQ,KAAK,KAAK,SAAS,SAAS;AACtG,QAAM,UAAM,yBAAW,uBAAAA,OAAe;AACtC,QAAM;AAAA,IACJ,OAAO,EAAE,WAAW,SAAS;AAAA,EAC/B,IAAI;AACJ,QAAM,OAAO,wBAAwB,YAAY;AACjD,MAAI,CAAC;AAAM,WAAO;AAElB,SAAO,aAAAC,QAAM,aAAa,MAAM;AAAA,IAC9B,eAAe,wBAAwB,yBAAyB;AAAA,IAKhE,eAAW,wBAAG,KAAK,MAAM,WAAW,gBAAgB;AAAA,EACtD,CAAC;AACH;",
|
|
6
|
+
"names": ["TreeViewContext", "React"]
|
|
7
7
|
}
|
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var NestingSpace_exports = {};
|
|
23
26
|
__export(NestingSpace_exports, {
|
|
@@ -25,7 +28,7 @@ __export(NestingSpace_exports, {
|
|
|
25
28
|
});
|
|
26
29
|
module.exports = __toCommonJS(NestingSpace_exports);
|
|
27
30
|
var React = __toESM(require("react"));
|
|
28
|
-
var
|
|
31
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
29
32
|
const getItemNestingLeftPadding = (level, opts) => {
|
|
30
33
|
const { spaceForNestingLevel = 1.5 } = opts;
|
|
31
34
|
const groupLeftPadding = spaceForNestingLevel * (level - 1);
|
|
@@ -39,7 +42,7 @@ const NestingSpace = (props) => {
|
|
|
39
42
|
const itemNestingLeftPadding = getItemNestingLeftPadding(treeDepth - 1, {
|
|
40
43
|
spaceForNestingLevel
|
|
41
44
|
});
|
|
42
|
-
return /* @__PURE__ */
|
|
45
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
43
46
|
"data-testid": "tree-item-nested-space",
|
|
44
47
|
style: { width: itemNestingLeftPadding }
|
|
45
48
|
});
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/parts/NestingSpace.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\nimport type { DSTreeviewT } from '../react-desc-prop-types';\n\nconst getItemNestingLeftPadding = (level: number, opts: { spaceForNestingLevel: number }) => {\n const { spaceForNestingLevel = 1.5 } = opts;\n const groupLeftPadding = spaceForNestingLevel * (level - 1);\n const finalLeftPadding = groupLeftPadding + spaceForNestingLevel - 0.1;\n // root level left-padding would be negative and would not be applied\n // if \"root-level\" nesting, then defaults to 0 left-padding.\n return finalLeftPadding > 0 ? `${finalLeftPadding}em` : '0';\n};\n\ntype NestingSpacePropsType = {\n item: DSTreeviewT.Item;\n spaceForNestingLevel: number;\n};\n\nexport const NestingSpace = (props: NestingSpacePropsType): JSX.Element | null => {\n const { item, spaceForNestingLevel } = props;\n const { treeDepth } = item;\n if (treeDepth) {\n const itemNestingLeftPadding = getItemNestingLeftPadding(treeDepth - 1, {\n spaceForNestingLevel,\n });\n\n return <div data-testid=\"tree-item-nested-space\" style={{ width: itemNestingLeftPadding }} />;\n }\n return null;\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAGA,MAAM,4BAA4B,CAAC,OAAe,SAA2C;AAC3F,QAAM,EAAE,uBAAuB,IAAI,IAAI;AACvC,QAAM,mBAAmB,wBAAwB,QAAQ;AACzD,QAAM,mBAAmB,mBAAmB,uBAAuB;AAGnE,SAAO,mBAAmB,IAAI,GAAG,uBAAuB;AAC1D;AAOO,MAAM,eAAe,CAAC,UAAqD;AAChF,QAAM,EAAE,MAAM,qBAAqB,IAAI;AACvC,QAAM,EAAE,UAAU,IAAI;AACtB,MAAI,WAAW;AACb,UAAM,yBAAyB,0BAA0B,YAAY,GAAG;AAAA,MACtE;AAAA,IACF,CAAC;AAED,WAAO,4CAAC;AAAA,MAAI,eAAY;AAAA,MAAyB,OAAO,EAAE,OAAO,uBAAuB;AAAA,KAAG;AAAA,EAC7F;AACA,SAAO;AACT;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -17,7 +17,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
17
17
|
}
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
21
24
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
25
|
var RadioSelectable_exports = {};
|
|
23
26
|
__export(RadioSelectable_exports, {
|
|
@@ -25,7 +28,8 @@ __export(RadioSelectable_exports, {
|
|
|
25
28
|
});
|
|
26
29
|
module.exports = __toCommonJS(RadioSelectable_exports);
|
|
27
30
|
var React = __toESM(require("react"));
|
|
28
|
-
var
|
|
31
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
|
+
var import_react = require("react");
|
|
29
33
|
var import_ds_form = require("@elliemae/ds-form");
|
|
30
34
|
var import_TreeViewContext = __toESM(require("../TreeViewContext"));
|
|
31
35
|
function RadioSelectable(props) {
|
|
@@ -54,7 +58,7 @@ function RadioSelectable(props) {
|
|
|
54
58
|
}, [id, setSelectedCheckboxes, itemIndex, onSelectionChange, item, scrollToIndex]);
|
|
55
59
|
const radioName = (0, import_react.useMemo)(() => `radios-${uniqueTreeViewUUID}`, [uniqueTreeViewUUID]);
|
|
56
60
|
const isDisabled = (0, import_react.useMemo)(() => isItemDisabled(item), [item, isItemDisabled]);
|
|
57
|
-
return /* @__PURE__ */
|
|
61
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_form.DSRadio, {
|
|
58
62
|
checked: selectedCheckboxes[id] === true,
|
|
59
63
|
name: radioName,
|
|
60
64
|
disabled: isDisabled,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/parts/RadioSelectable.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useContext, useCallback, useMemo } from 'react';\nimport { DSRadio } from '@elliemae/ds-form';\nimport TreeViewContext from '../TreeViewContext';\nimport type { DSTreeviewT } from '../react-desc-prop-types';\ninterface PropsT {\n item: DSTreeviewT.Item;\n itemIndex: number;\n}\nfunction RadioSelectable(props: PropsT) {\n const { item, itemIndex } = props;\n\n const ctx = useContext(TreeViewContext);\n const {\n props: { onSelectionChange, isItemDisabled },\n virtualListHelpers: { scrollToIndex },\n uniqueTreeViewUUID,\n selectedCheckboxes,\n setSelectedCheckboxes,\n } = ctx;\n\n const { id } = item;\n\n const onRadioChange = useCallback(() => {\n const newSelectionHasmap = { [id]: true };\n setSelectedCheckboxes(newSelectionHasmap);\n const indexAndScrollTo = {\n scrollToItem: () => {\n if (item.virtualIndex) scrollToIndex(item.virtualIndex);\n },\n itemIndex,\n };\n if (onSelectionChange) onSelectionChange(newSelectionHasmap, item, indexAndScrollTo);\n }, [id, setSelectedCheckboxes, itemIndex, onSelectionChange, item, scrollToIndex]);\n\n const radioName = useMemo(() => `radios-${uniqueTreeViewUUID}`, [uniqueTreeViewUUID]);\n\n const isDisabled = useMemo(() => isItemDisabled(item), [item, isItemDisabled]);\n\n return (\n <DSRadio\n checked={selectedCheckboxes[id] === true}\n name={radioName}\n disabled={isDisabled}\n className=\"em-ds-tree-item-radio\"\n data-testid=\"tree-item-radio\"\n onChange={onRadioChange}\n tabIndex={0}\n />\n );\n}\n\nexport default RadioSelectable;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAAwD;AACxD,qBAAwB;AACxB,6BAA4B;AAM5B,SAAS,gBAAgB,OAAe;AACtC,QAAM,EAAE,MAAM,UAAU,IAAI;AAE5B,QAAM,UAAM,yBAAW,uBAAAA,OAAe;AACtC,QAAM;AAAA,IACJ,OAAO,EAAE,mBAAmB,eAAe;AAAA,IAC3C,oBAAoB,EAAE,cAAc;AAAA,IACpC;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,EAAE,GAAG,IAAI;AAEf,QAAM,oBAAgB,0BAAY,MAAM;AACtC,UAAM,qBAAqB,EAAE,CAAC,KAAK,KAAK;AACxC,0BAAsB,kBAAkB;AACxC,UAAM,mBAAmB;AAAA,MACvB,cAAc,MAAM;AAClB,YAAI,KAAK;AAAc,wBAAc,KAAK,YAAY;AAAA,MACxD;AAAA,MACA;AAAA,IACF;AACA,QAAI;AAAmB,wBAAkB,oBAAoB,MAAM,gBAAgB;AAAA,EACrF,GAAG,CAAC,IAAI,uBAAuB,WAAW,mBAAmB,MAAM,aAAa,CAAC;AAEjF,QAAM,gBAAY,sBAAQ,MAAM,UAAU,sBAAsB,CAAC,kBAAkB,CAAC;AAEpF,QAAM,iBAAa,sBAAQ,MAAM,eAAe,IAAI,GAAG,CAAC,MAAM,cAAc,CAAC;AAE7E,SACE,4CAAC;AAAA,IACC,SAAS,mBAAmB,QAAQ;AAAA,IACpC,MAAM;AAAA,IACN,UAAU;AAAA,IACV,WAAU;AAAA,IACV,eAAY;AAAA,IACZ,UAAU;AAAA,IACV,UAAU;AAAA,GACZ;AAEJ;AAEA,IAAO,0BAAQ;",
|
|
6
|
+
"names": ["TreeViewContext"]
|
|
7
7
|
}
|