@elliemae/ds-left-navigation 3.60.0-next.4 → 3.60.0-next.40
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/LeftNavigation.js +3 -3
- package/dist/cjs/LeftNavigation.js.map +2 -2
- package/dist/cjs/LeftNavigationContext.js +3 -19
- package/dist/cjs/LeftNavigationContext.js.map +2 -2
- package/dist/cjs/{configs → config}/index.js +5 -5
- package/dist/cjs/{configs → config}/index.js.map +2 -2
- package/dist/cjs/{configs → config}/useLeftNavConfig.js +4 -4
- package/dist/cjs/config/useLeftNavConfig.js.map +7 -0
- package/dist/cjs/{configs → config}/useLeftNavItems.js +4 -5
- package/dist/cjs/config/useLeftNavItems.js.map +7 -0
- package/dist/cjs/{configs → config}/useLeftNavSmoothExpand.js.map +1 -1
- package/dist/cjs/constants/{constants.js → index.js} +41 -2
- package/dist/cjs/constants/{constants.js.map → index.js.map} +3 -3
- package/dist/cjs/exported-related/ItemRenderer/index.js +12 -3
- package/dist/cjs/exported-related/ItemRenderer/index.js.map +3 -3
- package/dist/cjs/exported-related/ItemRenderer/styled.js +1 -1
- package/dist/cjs/exported-related/ItemRenderer/styled.js.map +1 -1
- package/dist/cjs/exported-related/Notifications/index.js +60 -42
- package/dist/cjs/exported-related/Notifications/index.js.map +3 -3
- package/dist/cjs/exported-related/index.js +16 -7
- package/dist/cjs/exported-related/index.js.map +2 -2
- package/dist/cjs/hooks/useKeyboardNavigation.js +1 -1
- package/dist/cjs/hooks/useKeyboardNavigation.js.map +1 -1
- package/dist/cjs/hooks/useSelectFirstBodyItem.js +1 -1
- package/dist/cjs/hooks/useSelectFirstBodyItem.js.map +2 -2
- package/dist/cjs/index.js +16 -4
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/outOfTheBox/ItemControlledDrilldown/index.js +16 -5
- package/dist/cjs/outOfTheBox/ItemControlledDrilldown/index.js.map +3 -3
- package/dist/cjs/outOfTheBox/ItemHeader/index.js +20 -8
- package/dist/cjs/outOfTheBox/ItemHeader/index.js.map +3 -3
- package/dist/cjs/outOfTheBox/ItemLink/index.js +11 -2
- package/dist/cjs/outOfTheBox/ItemLink/index.js.map +3 -3
- package/dist/cjs/outOfTheBox/ItemSection/index.js +23 -4
- package/dist/cjs/outOfTheBox/ItemSection/index.js.map +3 -3
- package/dist/cjs/outOfTheBox/ItemSeparator/index.js +11 -3
- package/dist/cjs/outOfTheBox/ItemSeparator/index.js.map +3 -3
- package/dist/cjs/outOfTheBox/ItemSkeleton/index.js +11 -2
- package/dist/cjs/outOfTheBox/ItemSkeleton/index.js.map +3 -3
- package/dist/cjs/outOfTheBox/ItemSubmenu/index.js +17 -5
- package/dist/cjs/outOfTheBox/ItemSubmenu/index.js.map +3 -3
- package/dist/cjs/outOfTheBox/ItemTextLabel/index.js +7 -1
- package/dist/cjs/outOfTheBox/ItemTextLabel/index.js.map +3 -3
- package/dist/cjs/outOfTheBox/ItemUncontrolledDrilldown/index.js +16 -5
- package/dist/cjs/outOfTheBox/ItemUncontrolledDrilldown/index.js.map +3 -3
- package/dist/cjs/outOfTheBox/ItemWithDate/index.js +11 -1
- package/dist/cjs/outOfTheBox/ItemWithDate/index.js.map +3 -3
- package/dist/cjs/outOfTheBox/index.js +6 -8
- package/dist/cjs/outOfTheBox/index.js.map +2 -2
- package/dist/cjs/outOfTheBox/styled.js +1 -1
- package/dist/cjs/outOfTheBox/styled.js.map +1 -1
- package/dist/cjs/parts/LeftNavContent/index.js +24 -3
- package/dist/cjs/parts/LeftNavContent/index.js.map +2 -2
- package/dist/cjs/parts/LeftNavContent/styled.js +1 -1
- package/dist/cjs/parts/LeftNavContent/styled.js.map +1 -1
- package/dist/cjs/parts/LeftNavFooterItem/index.js +13 -13
- package/dist/cjs/parts/LeftNavFooterItem/index.js.map +3 -3
- package/dist/cjs/parts/LeftNavFooterItem/styled.js +1 -1
- package/dist/cjs/parts/LeftNavFooterItem/styled.js.map +1 -1
- package/dist/cjs/parts/LeftNavLoading/index.js +26 -10
- package/dist/cjs/parts/LeftNavLoading/index.js.map +3 -3
- package/dist/cjs/react-desc-prop-types.js +52 -22
- package/dist/cjs/react-desc-prop-types.js.map +2 -2
- package/dist/cjs/typescript-testing/slot-props.js +94 -0
- package/dist/cjs/typescript-testing/slot-props.js.map +7 -0
- package/dist/cjs/typescript-testing/typescript-left-navigation-valid.js +1 -1
- package/dist/cjs/typescript-testing/typescript-left-navigation-valid.js.map +1 -1
- package/dist/esm/LeftNavigation.js +4 -4
- package/dist/esm/LeftNavigation.js.map +2 -2
- package/dist/esm/LeftNavigationContext.js +2 -18
- package/dist/esm/LeftNavigationContext.js.map +2 -2
- package/dist/esm/{configs → config}/index.js +2 -2
- package/dist/esm/{configs → config}/index.js.map +2 -2
- package/dist/esm/{configs → config}/useLeftNavConfig.js +3 -3
- package/dist/esm/config/useLeftNavConfig.js.map +7 -0
- package/dist/esm/{configs → config}/useLeftNavItems.js +1 -2
- package/dist/esm/config/useLeftNavItems.js.map +7 -0
- package/dist/esm/{configs → config}/useLeftNavSmoothExpand.js.map +1 -1
- package/dist/esm/constants/{constants.js → index.js} +41 -2
- package/dist/esm/constants/{constants.js.map → index.js.map} +3 -3
- package/dist/esm/exported-related/ItemRenderer/index.js +12 -3
- package/dist/esm/exported-related/ItemRenderer/index.js.map +3 -3
- package/dist/esm/exported-related/ItemRenderer/styled.js +1 -1
- package/dist/esm/exported-related/ItemRenderer/styled.js.map +1 -1
- package/dist/esm/exported-related/Notifications/index.js +60 -42
- package/dist/esm/exported-related/Notifications/index.js.map +3 -3
- package/dist/esm/exported-related/index.js +12 -6
- package/dist/esm/exported-related/index.js.map +2 -2
- package/dist/esm/hooks/useKeyboardNavigation.js +1 -1
- package/dist/esm/hooks/useKeyboardNavigation.js.map +1 -1
- package/dist/esm/hooks/useSelectFirstBodyItem.js +1 -1
- package/dist/esm/hooks/useSelectFirstBodyItem.js.map +2 -2
- package/dist/esm/index.js +31 -7
- package/dist/esm/index.js.map +2 -2
- package/dist/esm/outOfTheBox/ItemControlledDrilldown/index.js +14 -3
- package/dist/esm/outOfTheBox/ItemControlledDrilldown/index.js.map +3 -3
- package/dist/esm/outOfTheBox/ItemHeader/index.js +18 -6
- package/dist/esm/outOfTheBox/ItemHeader/index.js.map +3 -3
- package/dist/esm/outOfTheBox/ItemLink/index.js +11 -2
- package/dist/esm/outOfTheBox/ItemLink/index.js.map +3 -3
- package/dist/esm/outOfTheBox/ItemSection/index.js +27 -8
- package/dist/esm/outOfTheBox/ItemSection/index.js.map +3 -3
- package/dist/esm/outOfTheBox/ItemSeparator/index.js +11 -3
- package/dist/esm/outOfTheBox/ItemSeparator/index.js.map +3 -3
- package/dist/esm/outOfTheBox/ItemSkeleton/index.js +11 -2
- package/dist/esm/outOfTheBox/ItemSkeleton/index.js.map +3 -3
- package/dist/esm/outOfTheBox/ItemSubmenu/index.js +16 -4
- package/dist/esm/outOfTheBox/ItemSubmenu/index.js.map +3 -3
- package/dist/esm/outOfTheBox/ItemTextLabel/index.js +7 -1
- package/dist/esm/outOfTheBox/ItemTextLabel/index.js.map +3 -3
- package/dist/esm/outOfTheBox/ItemUncontrolledDrilldown/index.js +14 -3
- package/dist/esm/outOfTheBox/ItemUncontrolledDrilldown/index.js.map +3 -3
- package/dist/esm/outOfTheBox/ItemWithDate/index.js +11 -1
- package/dist/esm/outOfTheBox/ItemWithDate/index.js.map +3 -3
- package/dist/esm/outOfTheBox/index.js +5 -7
- package/dist/esm/outOfTheBox/index.js.map +2 -2
- package/dist/esm/outOfTheBox/styled.js +1 -1
- package/dist/esm/outOfTheBox/styled.js.map +1 -1
- package/dist/esm/parts/LeftNavContent/index.js +24 -3
- package/dist/esm/parts/LeftNavContent/index.js.map +2 -2
- package/dist/esm/parts/LeftNavContent/styled.js +1 -1
- package/dist/esm/parts/LeftNavContent/styled.js.map +1 -1
- package/dist/esm/parts/LeftNavFooterItem/index.js +11 -11
- package/dist/esm/parts/LeftNavFooterItem/index.js.map +2 -2
- package/dist/esm/parts/LeftNavFooterItem/styled.js +1 -1
- package/dist/esm/parts/LeftNavFooterItem/styled.js.map +1 -1
- package/dist/esm/parts/LeftNavLoading/index.js +26 -10
- package/dist/esm/parts/LeftNavLoading/index.js.map +3 -3
- package/dist/esm/react-desc-prop-types.js +59 -23
- package/dist/esm/react-desc-prop-types.js.map +2 -2
- package/dist/esm/typescript-testing/slot-props.js +71 -0
- package/dist/esm/typescript-testing/slot-props.js.map +7 -0
- package/dist/esm/typescript-testing/typescript-left-navigation-valid.js +1 -1
- package/dist/esm/typescript-testing/typescript-left-navigation-valid.js.map +1 -1
- package/dist/types/LeftNavigationContext.d.ts +1 -2
- package/dist/types/constants/{constants.d.ts → index.d.ts} +32 -0
- package/dist/types/exported-related/index.d.ts +5 -6
- package/dist/types/index.d.ts +3 -3
- package/dist/types/outOfTheBox/ItemSkeleton/index.d.ts +1 -1
- package/dist/types/outOfTheBox/index.d.ts +1 -2
- package/dist/types/react-desc-prop-types.d.ts +47 -13
- package/dist/types/tests/LeftNavigation.exports.test.d.ts +1 -0
- package/dist/types/typescript-testing/slot-props.d.ts +1 -0
- package/package.json +27 -29
- package/dist/cjs/configs/useLeftNavConfig.js.map +0 -7
- package/dist/cjs/configs/useLeftNavItems.js.map +0 -7
- package/dist/cjs/exported-related/constants.js +0 -71
- package/dist/cjs/exported-related/constants.js.map +0 -7
- package/dist/esm/configs/useLeftNavConfig.js.map +0 -7
- package/dist/esm/configs/useLeftNavItems.js.map +0 -7
- package/dist/esm/exported-related/constants.js +0 -41
- package/dist/esm/exported-related/constants.js.map +0 -7
- package/dist/types/exported-related/constants.d.ts +0 -31
- /package/dist/cjs/{configs → config}/useLeftNavSmoothExpand.js +0 -0
- /package/dist/esm/{configs → config}/useLeftNavSmoothExpand.js +0 -0
- /package/dist/types/{configs → config}/index.d.ts +0 -0
- /package/dist/types/{configs → config}/useLeftNavConfig.d.ts +0 -0
- /package/dist/types/{configs → config}/useLeftNavItems.d.ts +0 -0
- /package/dist/types/{configs → config}/useLeftNavSmoothExpand.d.ts +0 -0
|
@@ -33,9 +33,10 @@ __export(ItemSection_exports, {
|
|
|
33
33
|
module.exports = __toCommonJS(ItemSection_exports);
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
35
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
36
|
+
var import_react = __toESM(require("react"));
|
|
37
|
+
var import_constants = require("../../constants/index.js");
|
|
36
38
|
var import_exported_related = require("../../exported-related/index.js");
|
|
37
39
|
var import_styled = require("../styled.js");
|
|
38
|
-
var import_constants = require("../../constants/constants.js");
|
|
39
40
|
const ItemSection = (props) => {
|
|
40
41
|
const {
|
|
41
42
|
item,
|
|
@@ -43,8 +44,10 @@ const ItemSection = (props) => {
|
|
|
43
44
|
itemOpts: { label, LeftComponent, RightComponent, labelRightSection, labelDataTestId }
|
|
44
45
|
},
|
|
45
46
|
ctx,
|
|
46
|
-
ctx: { setFocusedItem }
|
|
47
|
+
ctx: { leftNavProps, setFocusedItem }
|
|
47
48
|
} = props;
|
|
49
|
+
const getOwnerProps = import_react.default.useCallback(() => leftNavProps, [leftNavProps]);
|
|
50
|
+
const getOwnerPropsArguments = import_react.default.useCallback(() => ({}), []);
|
|
48
51
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
49
52
|
import_exported_related.ItemRenderer,
|
|
50
53
|
{
|
|
@@ -63,19 +66,33 @@ const ItemSection = (props) => {
|
|
|
63
66
|
pl: "xxs",
|
|
64
67
|
alignItems: "center",
|
|
65
68
|
"data-testid": import_constants.LEFT_NAVIGATION_DATA_TESTID.SECTION_CONTAINER,
|
|
69
|
+
getOwnerProps,
|
|
70
|
+
getOwnerPropsArguments,
|
|
66
71
|
children: [
|
|
67
72
|
LeftComponent ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LeftComponent, { ctx, item }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {}),
|
|
68
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
73
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
74
|
+
import_styled.StyledSectionLabel,
|
|
75
|
+
{
|
|
76
|
+
"data-testid": labelDataTestId || import_constants.LEFT_NAVIGATION_DATA_TESTID.SECTION_LABEL,
|
|
77
|
+
getOwnerProps,
|
|
78
|
+
getOwnerPropsArguments,
|
|
79
|
+
children: label
|
|
80
|
+
}
|
|
81
|
+
),
|
|
69
82
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
70
83
|
import_styled.StyledVerticalSeparator,
|
|
71
84
|
{
|
|
72
|
-
"data-testid": import_constants.LEFT_NAVIGATION_DATA_TESTID.VERTICAL_SEPARATOR
|
|
85
|
+
"data-testid": import_constants.LEFT_NAVIGATION_DATA_TESTID.VERTICAL_SEPARATOR,
|
|
86
|
+
getOwnerProps,
|
|
87
|
+
getOwnerPropsArguments
|
|
73
88
|
}
|
|
74
89
|
),
|
|
75
90
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
76
91
|
import_styled.StyledRightLabel,
|
|
77
92
|
{
|
|
78
93
|
"data-testid": import_constants.LEFT_NAVIGATION_DATA_TESTID.SECTION_RIGHT_LABEL,
|
|
94
|
+
getOwnerProps,
|
|
95
|
+
getOwnerPropsArguments,
|
|
79
96
|
children: labelRightSection
|
|
80
97
|
}
|
|
81
98
|
)
|
|
@@ -94,6 +111,8 @@ const ItemSection = (props) => {
|
|
|
94
111
|
pr: "xxs2",
|
|
95
112
|
alignItems: "center",
|
|
96
113
|
"data-testid": import_constants.LEFT_NAVIGATION_DATA_TESTID.RIGHT_CONTAINER,
|
|
114
|
+
getOwnerProps,
|
|
115
|
+
getOwnerPropsArguments,
|
|
97
116
|
children: RightComponent && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(RightComponent, { ctx, item })
|
|
98
117
|
}
|
|
99
118
|
)
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/outOfTheBox/ItemSection/index.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { ItemRenderer } from '../../exported-related/index.js';\nimport type { DSLeftNavigationT } from '../../react-desc-prop-types.js';\nimport {\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
6
|
-
"names": []
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { LEFT_NAVIGATION_DATA_TESTID } from '../../constants/index.js';\nimport { ItemRenderer } from '../../exported-related/index.js';\nimport type { DSLeftNavigationT } from '../../react-desc-prop-types.js';\nimport {\n StyledRightContainer,\n StyledRightLabel,\n StyledSectionContainer,\n StyledSectionLabel,\n StyledVerticalSeparator,\n} from '../styled.js';\n\nexport const ItemSection = (props: DSLeftNavigationT.ComponentProps): JSX.Element => {\n const {\n item,\n item: {\n itemOpts: { label, LeftComponent, RightComponent, labelRightSection, labelDataTestId },\n },\n ctx,\n ctx: { leftNavProps, setFocusedItem },\n } = props;\n\n const getOwnerProps = React.useCallback(() => leftNavProps, [leftNavProps]);\n const getOwnerPropsArguments = React.useCallback(() => ({}), []);\n return (\n <ItemRenderer\n item={{\n ...item,\n itemOpts: { ...item.itemOpts, selectable: false, focuseable: false },\n CollapsedComponent: null,\n }}\n minHeight=\"32px\"\n paddingTop=\"8px\"\n >\n <StyledSectionContainer\n cols={['min-content', 'auto', 'min-content', 'auto']}\n pl=\"xxs\"\n alignItems=\"center\"\n data-testid={LEFT_NAVIGATION_DATA_TESTID.SECTION_CONTAINER} // https://jira.elliemae.io/browse/PUI-15589\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {LeftComponent ? <LeftComponent ctx={ctx} item={item} /> : <div />}\n <StyledSectionLabel\n data-testid={labelDataTestId || LEFT_NAVIGATION_DATA_TESTID.SECTION_LABEL}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {label}\n </StyledSectionLabel>\n <StyledVerticalSeparator\n data-testid={LEFT_NAVIGATION_DATA_TESTID.VERTICAL_SEPARATOR} // https://jira.elliemae.io/browse/PUI-15589\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n />\n <StyledRightLabel\n data-testid={LEFT_NAVIGATION_DATA_TESTID.SECTION_RIGHT_LABEL} // https://jira.elliemae.io/browse/PUI-15589\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {labelRightSection}\n </StyledRightLabel>\n </StyledSectionContainer>\n <StyledRightContainer\n ml=\"auto\"\n onFocus={(e: React.FocusEvent) => {\n setFocusedItem(null);\n e.stopPropagation();\n }}\n onKeyDown={(e: React.KeyboardEvent) => e.stopPropagation()}\n pr=\"xxs2\"\n alignItems=\"center\"\n data-testid={LEFT_NAVIGATION_DATA_TESTID.RIGHT_CONTAINER} // https://jira.elliemae.io/browse/PUI-15589\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {RightComponent && <RightComponent ctx={ctx} item={item} />}\n </StyledRightContainer>\n </ItemRenderer>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADkCjB;AAlCN,mBAAkB;AAClB,uBAA4C;AAC5C,8BAA6B;AAE7B,oBAMO;AAEA,MAAM,cAAc,CAAC,UAAyD;AACnF,QAAM;AAAA,IACJ;AAAA,IACA,MAAM;AAAA,MACJ,UAAU,EAAE,OAAO,eAAe,gBAAgB,mBAAmB,gBAAgB;AAAA,IACvF;AAAA,IACA;AAAA,IACA,KAAK,EAAE,cAAc,eAAe;AAAA,EACtC,IAAI;AAEJ,QAAM,gBAAgB,aAAAA,QAAM,YAAY,MAAM,cAAc,CAAC,YAAY,CAAC;AAC1E,QAAM,yBAAyB,aAAAA,QAAM,YAAY,OAAO,CAAC,IAAI,CAAC,CAAC;AAC/D,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,QACJ,GAAG;AAAA,QACH,UAAU,EAAE,GAAG,KAAK,UAAU,YAAY,OAAO,YAAY,MAAM;AAAA,QACnE,oBAAoB;AAAA,MACtB;AAAA,MACA,WAAU;AAAA,MACV,YAAW;AAAA,MAEX;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,MAAM,CAAC,eAAe,QAAQ,eAAe,MAAM;AAAA,YACnD,IAAG;AAAA,YACH,YAAW;AAAA,YACX,eAAa,6CAA4B;AAAA,YACzC;AAAA,YACA;AAAA,YAEC;AAAA,8BAAgB,4CAAC,iBAAc,KAAU,MAAY,IAAK,4CAAC,SAAI;AAAA,cAChE;AAAA,gBAAC;AAAA;AAAA,kBACC,eAAa,mBAAmB,6CAA4B;AAAA,kBAC5D;AAAA,kBACA;AAAA,kBAEC;AAAA;AAAA,cACH;AAAA,cACA;AAAA,gBAAC;AAAA;AAAA,kBACC,eAAa,6CAA4B;AAAA,kBACzC;AAAA,kBACA;AAAA;AAAA,cACF;AAAA,cACA;AAAA,gBAAC;AAAA;AAAA,kBACC,eAAa,6CAA4B;AAAA,kBACzC;AAAA,kBACA;AAAA,kBAEC;AAAA;AAAA,cACH;AAAA;AAAA;AAAA,QACF;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,IAAG;AAAA,YACH,SAAS,CAAC,MAAwB;AAChC,6BAAe,IAAI;AACnB,gBAAE,gBAAgB;AAAA,YACpB;AAAA,YACA,WAAW,CAAC,MAA2B,EAAE,gBAAgB;AAAA,YACzD,IAAG;AAAA,YACH,YAAW;AAAA,YACX,eAAa,6CAA4B;AAAA,YACzC;AAAA,YACA;AAAA,YAEC,4BAAkB,4CAAC,kBAAe,KAAU,MAAY;AAAA;AAAA,QAC3D;AAAA;AAAA;AAAA,EACF;AAEJ;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -33,9 +33,10 @@ __export(ItemSeparator_exports, {
|
|
|
33
33
|
module.exports = __toCommonJS(ItemSeparator_exports);
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
35
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
36
|
+
var import_react = __toESM(require("react"));
|
|
36
37
|
var import_ds_system = require("@elliemae/ds-system");
|
|
38
|
+
var import_constants = require("../../constants/index.js");
|
|
37
39
|
var import_exported_related = require("../../exported-related/index.js");
|
|
38
|
-
var import_constants = require("../../constants/constants.js");
|
|
39
40
|
const StyledSeparator = (0, import_ds_system.styled)("div", { name: import_constants.DSLeftNavigationName, slot: import_constants.LEFT_NAVIGATION_SLOTS.ITEM_SEPARATOR })`
|
|
40
41
|
height: 1px;
|
|
41
42
|
background-color: ${(props) => props.theme.colors.neutral[100]};
|
|
@@ -45,7 +46,12 @@ const StyledSeparator = (0, import_ds_system.styled)("div", { name: import_const
|
|
|
45
46
|
grid-column: span 3;
|
|
46
47
|
`;
|
|
47
48
|
const ItemSeparator = (props) => {
|
|
48
|
-
const {
|
|
49
|
+
const {
|
|
50
|
+
item,
|
|
51
|
+
ctx: { leftNavProps }
|
|
52
|
+
} = props;
|
|
53
|
+
const getOwnerProps = import_react.default.useCallback(() => leftNavProps, [leftNavProps]);
|
|
54
|
+
const getOwnerPropsArguments = import_react.default.useCallback(() => ({}), []);
|
|
49
55
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
50
56
|
import_exported_related.ItemRenderer,
|
|
51
57
|
{
|
|
@@ -64,7 +70,9 @@ const ItemSeparator = (props) => {
|
|
|
64
70
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
65
71
|
StyledSeparator,
|
|
66
72
|
{
|
|
67
|
-
"data-testid": import_constants.LEFT_NAVIGATION_DATA_TESTID.ITEM_SEPARATOR
|
|
73
|
+
"data-testid": import_constants.LEFT_NAVIGATION_DATA_TESTID.ITEM_SEPARATOR,
|
|
74
|
+
getOwnerProps,
|
|
75
|
+
getOwnerPropsArguments
|
|
68
76
|
}
|
|
69
77
|
)
|
|
70
78
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/outOfTheBox/ItemSeparator/index.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
6
|
-
"names": []
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { DSLeftNavigationName, LEFT_NAVIGATION_DATA_TESTID, LEFT_NAVIGATION_SLOTS } from '../../constants/index.js';\nimport { ItemRenderer } from '../../exported-related/index.js';\nimport type { DSLeftNavigationT } from '../../react-desc-prop-types.js';\n\nconst StyledSeparator = styled('div', { name: DSLeftNavigationName, slot: LEFT_NAVIGATION_SLOTS.ITEM_SEPARATOR })`\n height: 1px;\n background-color: ${(props) => props.theme.colors.neutral[100]};\n width: auto;\n margin: ${(props) => props.theme.space.xxxs} 0;\n margin-left: ${(props) => props.theme.space.xxxs};\n grid-column: span 3;\n`;\n\nexport const ItemSeparator = (props: DSLeftNavigationT.ComponentProps): JSX.Element => {\n const {\n item,\n ctx: { leftNavProps },\n } = props;\n const getOwnerProps = React.useCallback(() => leftNavProps, [leftNavProps]);\n const getOwnerPropsArguments = React.useCallback(() => ({}), []);\n return (\n <ItemRenderer\n item={{\n ...item,\n itemOpts: {\n ...item.itemOpts,\n ariaRole: 'separator',\n selectable: false,\n focuseable: false,\n },\n CollapsedComponent: null,\n }}\n minHeight=\"1px\"\n paddingTop=\"0px\"\n >\n <StyledSeparator\n data-testid={LEFT_NAVIGATION_DATA_TESTID.ITEM_SEPARATOR} // https://jira.elliemae.io/browse/PUI-15589\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n />\n </ItemRenderer>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADqCjB;AArCN,mBAAkB;AAClB,uBAAuB;AACvB,uBAAyF;AACzF,8BAA6B;AAG7B,MAAM,sBAAkB,yBAAO,OAAO,EAAE,MAAM,uCAAsB,MAAM,uCAAsB,eAAe,CAAC;AAAA;AAAA,sBAE1F,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA;AAAA,YAEpD,CAAC,UAAU,MAAM,MAAM,MAAM,IAAI;AAAA,iBAC5B,CAAC,UAAU,MAAM,MAAM,MAAM,IAAI;AAAA;AAAA;AAI3C,MAAM,gBAAgB,CAAC,UAAyD;AACrF,QAAM;AAAA,IACJ;AAAA,IACA,KAAK,EAAE,aAAa;AAAA,EACtB,IAAI;AACJ,QAAM,gBAAgB,aAAAA,QAAM,YAAY,MAAM,cAAc,CAAC,YAAY,CAAC;AAC1E,QAAM,yBAAyB,aAAAA,QAAM,YAAY,OAAO,CAAC,IAAI,CAAC,CAAC;AAC/D,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,QACJ,GAAG;AAAA,QACH,UAAU;AAAA,UACR,GAAG,KAAK;AAAA,UACR,UAAU;AAAA,UACV,YAAY;AAAA,UACZ,YAAY;AAAA,QACd;AAAA,QACA,oBAAoB;AAAA,MACtB;AAAA,MACA,WAAU;AAAA,MACV,YAAW;AAAA,MAEX;AAAA,QAAC;AAAA;AAAA,UACC,eAAa,6CAA4B;AAAA,UACzC;AAAA,UACA;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -33,14 +33,21 @@ __export(ItemSkeleton_exports, {
|
|
|
33
33
|
module.exports = __toCommonJS(ItemSkeleton_exports);
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
35
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
36
|
+
var import_react = __toESM(require("react"));
|
|
36
37
|
var import_ds_skeleton = require("@elliemae/ds-skeleton");
|
|
37
|
-
var import_constants = require("../../constants/
|
|
38
|
+
var import_constants = require("../../constants/index.js");
|
|
38
39
|
var import_exported_related = require("../../exported-related/index.js");
|
|
39
40
|
var import_styled = require("../styled.js");
|
|
40
41
|
const noShadowStyle = () => () => "box-shadow: none;";
|
|
41
42
|
const CollapsedComponent = () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_skeleton.DSSkeleton, { variant: "circular", w: 24, h: 24 });
|
|
42
43
|
const ItemSkeleton = (props) => {
|
|
43
|
-
const {
|
|
44
|
+
const {
|
|
45
|
+
item,
|
|
46
|
+
hasBorderBottom,
|
|
47
|
+
ctx: { leftNavProps }
|
|
48
|
+
} = props;
|
|
49
|
+
const getOwnerProps = import_react.default.useCallback(() => leftNavProps, [leftNavProps]);
|
|
50
|
+
const getOwnerPropsArguments = import_react.default.useCallback(() => ({}), []);
|
|
44
51
|
const variant = item?.itemOpts?.skeletonVariant ?? "item";
|
|
45
52
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
46
53
|
import_exported_related.ItemRenderer,
|
|
@@ -68,6 +75,8 @@ const ItemSkeleton = (props) => {
|
|
|
68
75
|
pl: 0,
|
|
69
76
|
justifyItems: "center",
|
|
70
77
|
"data-testid": import_constants.LEFT_NAVIGATION_DATA_TESTID.LEFT_CONTAINER,
|
|
78
|
+
getOwnerProps,
|
|
79
|
+
getOwnerPropsArguments,
|
|
71
80
|
children: variant === "item" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CollapsedComponent, {})
|
|
72
81
|
}
|
|
73
82
|
),
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/outOfTheBox/ItemSkeleton/index.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { DSSkeleton } from '@elliemae/ds-skeleton';\nimport { LEFT_NAVIGATION_DATA_TESTID } from '../../constants/
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
6
|
-
"names": []
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { DSSkeleton } from '@elliemae/ds-skeleton';\nimport { LEFT_NAVIGATION_DATA_TESTID } from '../../constants/index.js';\nimport { ItemRenderer } from '../../exported-related/index.js';\nimport type { DSLeftNavigationT } from '../../react-desc-prop-types.js';\nimport { StyledLeftContainer } from '../styled.js';\n\nconst noShadowStyle = () => () => 'box-shadow: none;';\n\nconst CollapsedComponent = () => <DSSkeleton variant=\"circular\" w={24} h={24} />;\n\ninterface SkeletonPropsT extends DSLeftNavigationT.ComponentProps {\n item: DSLeftNavigationT.ComponentProps['item'];\n hasBorderBottom?: boolean;\n}\nexport const ItemSkeleton = (props: SkeletonPropsT): JSX.Element => {\n const {\n item,\n hasBorderBottom,\n ctx: { leftNavProps },\n } = props;\n const getOwnerProps = React.useCallback(() => leftNavProps, [leftNavProps]);\n const getOwnerPropsArguments = React.useCallback(() => ({}), []);\n const variant = item?.itemOpts?.skeletonVariant ?? 'item';\n\n return (\n <ItemRenderer\n item={{\n ...item,\n itemOpts: item?.itemOpts\n ? {\n ...item.itemOpts,\n selectable: false,\n focuseable: false,\n ariaRole: 'menuitem',\n ariaLabel: 'Loading',\n }\n : {},\n CollapsedComponent: variant === 'item' ? CollapsedComponent : null,\n }}\n minHeight={variant === 'item' ? '48px' : '32px'}\n shadowStyle={noShadowStyle}\n hasBorderBottom={hasBorderBottom}\n >\n <StyledLeftContainer\n cols={['38px']}\n gutter=\"1px\"\n pl={0}\n justifyItems=\"center\"\n data-testid={LEFT_NAVIGATION_DATA_TESTID.LEFT_CONTAINER} // https://jira.elliemae.io/browse/PUI-15589\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {variant === 'item' && <CollapsedComponent />}\n </StyledLeftContainer>\n <DSSkeleton variant=\"rectangular\" mt=\"2px\" mb=\"15px\" w=\"auto\" mr=\"xs\" />\n </ItemRenderer>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADSU;AATjC,mBAAkB;AAClB,yBAA2B;AAC3B,uBAA4C;AAC5C,8BAA6B;AAE7B,oBAAoC;AAEpC,MAAM,gBAAgB,MAAM,MAAM;AAElC,MAAM,qBAAqB,MAAM,4CAAC,iCAAW,SAAQ,YAAW,GAAG,IAAI,GAAG,IAAI;AAMvE,MAAM,eAAe,CAAC,UAAuC;AAClE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,KAAK,EAAE,aAAa;AAAA,EACtB,IAAI;AACJ,QAAM,gBAAgB,aAAAA,QAAM,YAAY,MAAM,cAAc,CAAC,YAAY,CAAC;AAC1E,QAAM,yBAAyB,aAAAA,QAAM,YAAY,OAAO,CAAC,IAAI,CAAC,CAAC;AAC/D,QAAM,UAAU,MAAM,UAAU,mBAAmB;AAEnD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,QACJ,GAAG;AAAA,QACH,UAAU,MAAM,WACZ;AAAA,UACE,GAAG,KAAK;AAAA,UACR,YAAY;AAAA,UACZ,YAAY;AAAA,UACZ,UAAU;AAAA,UACV,WAAW;AAAA,QACb,IACA,CAAC;AAAA,QACL,oBAAoB,YAAY,SAAS,qBAAqB;AAAA,MAChE;AAAA,MACA,WAAW,YAAY,SAAS,SAAS;AAAA,MACzC,aAAa;AAAA,MACb;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,MAAM,CAAC,MAAM;AAAA,YACb,QAAO;AAAA,YACP,IAAI;AAAA,YACJ,cAAa;AAAA,YACb,eAAa,6CAA4B;AAAA,YACzC;AAAA,YACA;AAAA,YAEC,sBAAY,UAAU,4CAAC,sBAAmB;AAAA;AAAA,QAC7C;AAAA,QACA,4CAAC,iCAAW,SAAQ,eAAc,IAAG,OAAM,IAAG,QAAO,GAAE,QAAO,IAAG,MAAK;AAAA;AAAA;AAAA,EACxE;AAEJ;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -35,9 +35,8 @@ var React = __toESM(require("react"));
|
|
|
35
35
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
36
36
|
var import_ds_icons = require("@elliemae/ds-icons");
|
|
37
37
|
var import_ds_truncated_tooltip_text = require("@elliemae/ds-truncated-tooltip-text");
|
|
38
|
-
var import_react = require("react");
|
|
39
|
-
var import_constants = require("../../constants/
|
|
40
|
-
var import_constants2 = require("../../exported-related/constants.js");
|
|
38
|
+
var import_react = __toESM(require("react"));
|
|
39
|
+
var import_constants = require("../../constants/index.js");
|
|
41
40
|
var import_exported_related = require("../../exported-related/index.js");
|
|
42
41
|
var import_styled = require("../styled.js");
|
|
43
42
|
const notOpenedShadowStyle = (isSelected) => (theme) => `
|
|
@@ -61,6 +60,7 @@ const ItemSubmenu = (props) => {
|
|
|
61
60
|
},
|
|
62
61
|
ctx,
|
|
63
62
|
ctx: {
|
|
63
|
+
leftNavProps,
|
|
64
64
|
leftNavProps: { openedItem, labelOverflow: leftNavLabelOverflow, onItemClick },
|
|
65
65
|
expandedForAnimation,
|
|
66
66
|
selectedItem,
|
|
@@ -68,10 +68,12 @@ const ItemSubmenu = (props) => {
|
|
|
68
68
|
setFocusedItem
|
|
69
69
|
}
|
|
70
70
|
} = props;
|
|
71
|
+
const getOwnerProps = import_react.default.useCallback(() => leftNavProps, [leftNavProps]);
|
|
72
|
+
const getOwnerPropsArguments = import_react.default.useCallback(() => ({}), []);
|
|
71
73
|
const labelOverflow = itemLabelOverflow || leftNavLabelOverflow;
|
|
72
74
|
const opened = openedItem === dsId;
|
|
73
75
|
const isSelected = selectedItem === dsId;
|
|
74
|
-
const shadowStyle =
|
|
76
|
+
const shadowStyle = import_react.default.useCallback(
|
|
75
77
|
(opened_) => (theme) => !opened_ ? notOpenedShadowStyle(isSelected || selectedParent === dsId)(theme) : `box-shadow: inset 4px 0 0 0 #52A6EC`,
|
|
76
78
|
[dsId, isSelected, selectedParent]
|
|
77
79
|
);
|
|
@@ -102,6 +104,8 @@ const ItemSubmenu = (props) => {
|
|
|
102
104
|
pl: opened ? "xxs" : 0,
|
|
103
105
|
justifyItems: "center",
|
|
104
106
|
"data-testid": import_constants.LEFT_NAVIGATION_DATA_TESTID.LEFT_CONTAINER,
|
|
107
|
+
getOwnerProps,
|
|
108
|
+
getOwnerPropsArguments,
|
|
105
109
|
children: [
|
|
106
110
|
opened && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
107
111
|
import_styled.StyledChevronLeft,
|
|
@@ -113,10 +117,12 @@ const ItemSubmenu = (props) => {
|
|
|
113
117
|
tabIndex: 0,
|
|
114
118
|
onFocus: (e) => {
|
|
115
119
|
e.stopPropagation();
|
|
116
|
-
setFocusedItem(
|
|
120
|
+
setFocusedItem(import_constants.CHEVRON_BACK_DS_ID);
|
|
117
121
|
},
|
|
118
122
|
"aria-label": `Close ${ariaLabel}`,
|
|
119
123
|
"data-testid": import_constants.LEFT_NAVIGATION_DATA_TESTID.ITEM_CHEVRON_BACK,
|
|
124
|
+
getOwnerProps,
|
|
125
|
+
getOwnerPropsArguments,
|
|
120
126
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.ChevronSmallLeft, { size: "m", color: ["brand-primary", "800"] })
|
|
121
127
|
}
|
|
122
128
|
),
|
|
@@ -132,6 +138,8 @@ const ItemSubmenu = (props) => {
|
|
|
132
138
|
mb: "15px",
|
|
133
139
|
labelOverflow,
|
|
134
140
|
"data-testid": labelDataTestId || import_constants.LEFT_NAVIGATION_DATA_TESTID.ITEM_LABEL,
|
|
141
|
+
getOwnerProps,
|
|
142
|
+
getOwnerPropsArguments,
|
|
135
143
|
children: labelOverflow === "truncate" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_truncated_tooltip_text.SimpleTruncatedTooltipText, { value: label, placement: "bottom-start" }) : label
|
|
136
144
|
}
|
|
137
145
|
),
|
|
@@ -147,6 +155,8 @@ const ItemSubmenu = (props) => {
|
|
|
147
155
|
onKeyDown: (e) => e.stopPropagation(),
|
|
148
156
|
onClick: (e) => openedItem === dsId && e.stopPropagation(),
|
|
149
157
|
"data-testid": import_constants.LEFT_NAVIGATION_DATA_TESTID.RIGHT_CONTAINER,
|
|
158
|
+
getOwnerProps,
|
|
159
|
+
getOwnerPropsArguments,
|
|
150
160
|
children: RightComponent && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(RightComponent, { ctx, item })
|
|
151
161
|
}
|
|
152
162
|
),
|
|
@@ -164,6 +174,8 @@ const ItemSubmenu = (props) => {
|
|
|
164
174
|
onKeyDown: (e) => e.stopPropagation(),
|
|
165
175
|
onClick: (e) => openedItem && e.stopPropagation(),
|
|
166
176
|
"data-testid": import_constants.LEFT_NAVIGATION_DATA_TESTID.BOTTOM_CONTAINER,
|
|
177
|
+
getOwnerProps,
|
|
178
|
+
getOwnerPropsArguments,
|
|
167
179
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(BottomComponent, { ctx, item })
|
|
168
180
|
}
|
|
169
181
|
)
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/outOfTheBox/ItemSubmenu/index.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable complexity */\n/* eslint-disable indent */\nimport { ChevronSmallLeft } from '@elliemae/ds-icons';\nimport type { Theme } from '@elliemae/ds-system';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport React
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
6
|
-
"names": ["
|
|
4
|
+
"sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable complexity */\n/* eslint-disable indent */\nimport { ChevronSmallLeft } from '@elliemae/ds-icons';\nimport type { Theme } from '@elliemae/ds-system';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport React from 'react';\nimport { CHEVRON_BACK_DS_ID, LEFT_NAVIGATION_DATA_TESTID } from '../../constants/index.js';\nimport { ItemRenderer } from '../../exported-related/index.js';\nimport type { DSLeftNavigationT } from '../../react-desc-prop-types.js';\nimport {\n StyledBottomContainer,\n StyledChevronLeft,\n StyledItemLabel,\n StyledLeftContainer,\n StyledRightContainer,\n} from '../styled.js';\n\nconst notOpenedShadowStyle = (isSelected: boolean) => (theme: Theme) =>\n `\n box-shadow: inset 4px 0 0 0 ${isSelected ? theme.colors.brand[400] : 'transparent'};\n\n :hover {\n box-shadow: inset 4px 0 0 0 ${isSelected ? theme.colors.brand[400] : theme.colors.brand[300]};\n }\n\n :active {\n box-shadow: inset 4px 0 0 0 ${theme.colors.brand[400]};\n }\n`;\n\nexport const ItemSubmenu = (props: DSLeftNavigationT.ComponentProps): JSX.Element => {\n const {\n item,\n item: {\n dsId,\n itemOpts: { label, RightComponent, BottomComponent, labelDataTestId, labelOverflow: itemLabelOverflow },\n CollapsedComponent = () => null,\n },\n ctx,\n ctx: {\n leftNavProps,\n leftNavProps: { openedItem, labelOverflow: leftNavLabelOverflow, onItemClick },\n expandedForAnimation,\n selectedItem,\n selectedParent,\n setFocusedItem,\n },\n } = props;\n const getOwnerProps = React.useCallback(() => leftNavProps, [leftNavProps]);\n const getOwnerPropsArguments = React.useCallback(() => ({}), []);\n\n const labelOverflow = itemLabelOverflow || leftNavLabelOverflow;\n\n const opened = openedItem === dsId;\n\n const isSelected = selectedItem === dsId;\n\n const shadowStyle = React.useCallback(\n (opened_: boolean) => (theme: Theme) =>\n !opened_\n ? notOpenedShadowStyle(isSelected || selectedParent === dsId)(theme)\n : `box-shadow: inset 4px 0 0 0 #52A6EC`,\n [dsId, isSelected, selectedParent],\n );\n\n const ariaLabel = item.itemOpts.ariaLabel ?? (typeof label === 'string' ? `${label}, category` : 'category');\n\n return (\n <ItemRenderer\n item={{\n ...item,\n itemOpts: {\n ...item.itemOpts,\n ariaLabel,\n ariaExpanded: opened,\n openable: expandedForAnimation && !opened,\n closable: expandedForAnimation && opened,\n selectable: !opened,\n },\n }}\n shadowStyle={shadowStyle}\n hasBorderBottom={opened}\n borderBottomMr=\"12px\"\n >\n <StyledLeftContainer\n cols={opened ? ['auto', 'auto'] : ['38px']}\n gutter=\"1px\"\n pl={opened ? 'xxs' : 0}\n justifyItems=\"center\"\n data-testid={LEFT_NAVIGATION_DATA_TESTID.LEFT_CONTAINER} // https://jira.elliemae.io/browse/PUI-15589\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {opened && (\n <StyledChevronLeft\n buttonType=\"raw\"\n onClick={(e: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>) => {\n if (onItemClick) onItemClick(item, e as React.MouseEvent<HTMLElement>);\n }}\n tabIndex={0}\n onFocus={(e: React.FocusEvent) => {\n e.stopPropagation();\n setFocusedItem(CHEVRON_BACK_DS_ID);\n }}\n aria-label={`Close ${ariaLabel}`}\n data-testid={LEFT_NAVIGATION_DATA_TESTID.ITEM_CHEVRON_BACK} // https://jira.elliemae.io/browse/PUI-15589\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <ChevronSmallLeft size=\"m\" color={['brand-primary', '800']} />\n </StyledChevronLeft>\n )}\n {CollapsedComponent && <CollapsedComponent item={item} ctx={ctx} />}\n </StyledLeftContainer>\n <StyledItemLabel\n ml={opened ? 'xxs' : '1px'}\n mt=\"xxxs\"\n mb=\"15px\"\n labelOverflow={labelOverflow}\n data-testid={labelDataTestId || LEFT_NAVIGATION_DATA_TESTID.ITEM_LABEL}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {labelOverflow === 'truncate' ? <SimpleTruncatedTooltipText value={label} placement=\"bottom-start\" /> : label}\n </StyledItemLabel>\n <StyledRightContainer\n pl=\"xs\"\n pr={opened ? 'xxs2' : 'xxs'}\n onFocus={(e: React.FocusEvent) => {\n e.stopPropagation();\n setFocusedItem(null);\n }}\n onKeyDown={(e: React.KeyboardEvent) => e.stopPropagation()}\n onClick={(e: React.MouseEvent) => openedItem === dsId && e.stopPropagation()}\n data-testid={LEFT_NAVIGATION_DATA_TESTID.RIGHT_CONTAINER} // https://jira.elliemae.io/browse/PUI-15589\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {RightComponent && <RightComponent ctx={ctx} item={item} />}\n </StyledRightContainer>\n {BottomComponent && (\n <StyledBottomContainer\n style={{ gridColumn: 'span 3' }}\n pb=\"xxxs\"\n pl=\"xxs\"\n pr=\"xxs\"\n onFocus={(e: React.FocusEvent) => {\n e.stopPropagation();\n setFocusedItem(null);\n }}\n onKeyDown={(e: React.KeyboardEvent) => e.stopPropagation()}\n onClick={(e: React.MouseEvent) => openedItem && e.stopPropagation()}\n data-testid={LEFT_NAVIGATION_DATA_TESTID.BOTTOM_CONTAINER} // https://jira.elliemae.io/browse/PUI-15589\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <BottomComponent ctx={ctx} item={item} />\n </StyledBottomContainer>\n )}\n </ItemRenderer>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADqFjB;AAlFN,sBAAiC;AAEjC,uCAA2C;AAC3C,mBAAkB;AAClB,uBAAgE;AAChE,8BAA6B;AAE7B,oBAMO;AAEP,MAAM,uBAAuB,CAAC,eAAwB,CAAC,UACrD;AAAA,gCAC8B,aAAa,MAAM,OAAO,MAAM,GAAG,IAAI,aAAa;AAAA;AAAA;AAAA,kCAGlD,aAAa,MAAM,OAAO,MAAM,GAAG,IAAI,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAAA,kCAI9D,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAIlD,MAAM,cAAc,CAAC,UAAyD;AACnF,QAAM;AAAA,IACJ;AAAA,IACA,MAAM;AAAA,MACJ;AAAA,MACA,UAAU,EAAE,OAAO,gBAAgB,iBAAiB,iBAAiB,eAAe,kBAAkB;AAAA,MACtG,qBAAqB,MAAM;AAAA,IAC7B;AAAA,IACA;AAAA,IACA,KAAK;AAAA,MACH;AAAA,MACA,cAAc,EAAE,YAAY,eAAe,sBAAsB,YAAY;AAAA,MAC7E;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF,IAAI;AACJ,QAAM,gBAAgB,aAAAA,QAAM,YAAY,MAAM,cAAc,CAAC,YAAY,CAAC;AAC1E,QAAM,yBAAyB,aAAAA,QAAM,YAAY,OAAO,CAAC,IAAI,CAAC,CAAC;AAE/D,QAAM,gBAAgB,qBAAqB;AAE3C,QAAM,SAAS,eAAe;AAE9B,QAAM,aAAa,iBAAiB;AAEpC,QAAM,cAAc,aAAAA,QAAM;AAAA,IACxB,CAAC,YAAqB,CAAC,UACrB,CAAC,UACG,qBAAqB,cAAc,mBAAmB,IAAI,EAAE,KAAK,IACjE;AAAA,IACN,CAAC,MAAM,YAAY,cAAc;AAAA,EACnC;AAEA,QAAM,YAAY,KAAK,SAAS,cAAc,OAAO,UAAU,WAAW,GAAG,KAAK,eAAe;AAEjG,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,QACJ,GAAG;AAAA,QACH,UAAU;AAAA,UACR,GAAG,KAAK;AAAA,UACR;AAAA,UACA,cAAc;AAAA,UACd,UAAU,wBAAwB,CAAC;AAAA,UACnC,UAAU,wBAAwB;AAAA,UAClC,YAAY,CAAC;AAAA,QACf;AAAA,MACF;AAAA,MACA;AAAA,MACA,iBAAiB;AAAA,MACjB,gBAAe;AAAA,MAEf;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,MAAM,SAAS,CAAC,QAAQ,MAAM,IAAI,CAAC,MAAM;AAAA,YACzC,QAAO;AAAA,YACP,IAAI,SAAS,QAAQ;AAAA,YACrB,cAAa;AAAA,YACb,eAAa,6CAA4B;AAAA,YACzC;AAAA,YACA;AAAA,YAEC;AAAA,wBACC;AAAA,gBAAC;AAAA;AAAA,kBACC,YAAW;AAAA,kBACX,SAAS,CAAC,MAAwE;AAChF,wBAAI,YAAa,aAAY,MAAM,CAAkC;AAAA,kBACvE;AAAA,kBACA,UAAU;AAAA,kBACV,SAAS,CAAC,MAAwB;AAChC,sBAAE,gBAAgB;AAClB,mCAAe,mCAAkB;AAAA,kBACnC;AAAA,kBACA,cAAY,SAAS,SAAS;AAAA,kBAC9B,eAAa,6CAA4B;AAAA,kBACzC;AAAA,kBACA;AAAA,kBAEA,sDAAC,oCAAiB,MAAK,KAAI,OAAO,CAAC,iBAAiB,KAAK,GAAG;AAAA;AAAA,cAC9D;AAAA,cAED,sBAAsB,4CAAC,sBAAmB,MAAY,KAAU;AAAA;AAAA;AAAA,QACnE;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,IAAI,SAAS,QAAQ;AAAA,YACrB,IAAG;AAAA,YACH,IAAG;AAAA,YACH;AAAA,YACA,eAAa,mBAAmB,6CAA4B;AAAA,YAC5D;AAAA,YACA;AAAA,YAEC,4BAAkB,aAAa,4CAAC,+DAA2B,OAAO,OAAO,WAAU,gBAAe,IAAK;AAAA;AAAA,QAC1G;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,IAAG;AAAA,YACH,IAAI,SAAS,SAAS;AAAA,YACtB,SAAS,CAAC,MAAwB;AAChC,gBAAE,gBAAgB;AAClB,6BAAe,IAAI;AAAA,YACrB;AAAA,YACA,WAAW,CAAC,MAA2B,EAAE,gBAAgB;AAAA,YACzD,SAAS,CAAC,MAAwB,eAAe,QAAQ,EAAE,gBAAgB;AAAA,YAC3E,eAAa,6CAA4B;AAAA,YACzC;AAAA,YACA;AAAA,YAEC,4BAAkB,4CAAC,kBAAe,KAAU,MAAY;AAAA;AAAA,QAC3D;AAAA,QACC,mBACC;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,EAAE,YAAY,SAAS;AAAA,YAC9B,IAAG;AAAA,YACH,IAAG;AAAA,YACH,IAAG;AAAA,YACH,SAAS,CAAC,MAAwB;AAChC,gBAAE,gBAAgB;AAClB,6BAAe,IAAI;AAAA,YACrB;AAAA,YACA,WAAW,CAAC,MAA2B,EAAE,gBAAgB;AAAA,YACzD,SAAS,CAAC,MAAwB,cAAc,EAAE,gBAAgB;AAAA,YAClE,eAAa,6CAA4B;AAAA,YACzC;AAAA,YACA;AAAA,YAEA,sDAAC,mBAAgB,KAAU,MAAY;AAAA;AAAA,QACzC;AAAA;AAAA;AAAA,EAEJ;AAEJ;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -34,9 +34,10 @@ module.exports = __toCommonJS(ItemTextLabel_exports);
|
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
35
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
36
36
|
var import_ds_truncated_tooltip_text = require("@elliemae/ds-truncated-tooltip-text");
|
|
37
|
+
var import_react = __toESM(require("react"));
|
|
38
|
+
var import_constants = require("../../constants/index.js");
|
|
37
39
|
var import_exported_related = require("../../exported-related/index.js");
|
|
38
40
|
var import_styled = require("../styled.js");
|
|
39
|
-
var import_constants = require("../../constants/constants.js");
|
|
40
41
|
const ItemTextLabel = (props) => {
|
|
41
42
|
const {
|
|
42
43
|
item,
|
|
@@ -44,9 +45,12 @@ const ItemTextLabel = (props) => {
|
|
|
44
45
|
itemOpts: { label, labelOverflow: itemLabelOverflow, labelBold, labelColor, labelDataTestId }
|
|
45
46
|
},
|
|
46
47
|
ctx: {
|
|
48
|
+
leftNavProps,
|
|
47
49
|
leftNavProps: { labelOverflow: leftNavLabelOverflow }
|
|
48
50
|
}
|
|
49
51
|
} = props;
|
|
52
|
+
const getOwnerProps = import_react.default.useCallback(() => leftNavProps, [leftNavProps]);
|
|
53
|
+
const getOwnerPropsArguments = import_react.default.useCallback(() => ({}), []);
|
|
50
54
|
const labelOverflow = itemLabelOverflow || leftNavLabelOverflow;
|
|
51
55
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
52
56
|
import_exported_related.ItemRenderer,
|
|
@@ -70,6 +74,8 @@ const ItemTextLabel = (props) => {
|
|
|
70
74
|
mr: "xxs2",
|
|
71
75
|
pb: "xxxs",
|
|
72
76
|
"data-testid": labelDataTestId || import_constants.LEFT_NAVIGATION_DATA_TESTID.LIST_ITEM_LABEL_ID_EXCEPTION,
|
|
77
|
+
getOwnerProps,
|
|
78
|
+
getOwnerPropsArguments,
|
|
73
79
|
children: labelOverflow === "truncate" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_truncated_tooltip_text.SimpleTruncatedTooltipText, { value: label, placement: "bottom-start" }) : label
|
|
74
80
|
}
|
|
75
81
|
)
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/outOfTheBox/ItemTextLabel/index.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
6
|
-
"names": []
|
|
4
|
+
"sourcesContent": ["import { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport React from 'react';\nimport { LEFT_NAVIGATION_DATA_TESTID } from '../../constants/index.js';\nimport { ItemRenderer } from '../../exported-related/index.js';\nimport type { DSLeftNavigationT } from '../../react-desc-prop-types.js';\nimport { StyledLabel } from '../styled.js';\n\nexport const ItemTextLabel = (props: DSLeftNavigationT.ComponentProps): JSX.Element => {\n const {\n item,\n item: {\n itemOpts: { label, labelOverflow: itemLabelOverflow, labelBold, labelColor, labelDataTestId },\n },\n ctx: {\n leftNavProps,\n leftNavProps: { labelOverflow: leftNavLabelOverflow },\n },\n } = props;\n const getOwnerProps = React.useCallback(() => leftNavProps, [leftNavProps]);\n const getOwnerPropsArguments = React.useCallback(() => ({}), []);\n\n const labelOverflow = itemLabelOverflow || leftNavLabelOverflow;\n return (\n <ItemRenderer\n item={{\n ...item,\n CollapsedComponent: null,\n }}\n minHeight=\"32px\"\n paddingTop=\"8px\"\n >\n {/* Empty LeftComponent */} <div />\n <StyledLabel\n pl=\"24px\"\n labelOverflow={labelOverflow}\n labelBold={labelBold}\n labelColor={labelColor}\n mr=\"xxs2\"\n pb=\"xxxs\"\n data-testid={labelDataTestId || LEFT_NAVIGATION_DATA_TESTID.LIST_ITEM_LABEL_ID_EXCEPTION}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {labelOverflow === 'truncate' ? <SimpleTruncatedTooltipText value={label} placement=\"bottom-start\" /> : label}\n </StyledLabel>\n </ItemRenderer>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADuBnB;AAvBJ,uCAA2C;AAC3C,mBAAkB;AAClB,uBAA4C;AAC5C,8BAA6B;AAE7B,oBAA4B;AAErB,MAAM,gBAAgB,CAAC,UAAyD;AACrF,QAAM;AAAA,IACJ;AAAA,IACA,MAAM;AAAA,MACJ,UAAU,EAAE,OAAO,eAAe,mBAAmB,WAAW,YAAY,gBAAgB;AAAA,IAC9F;AAAA,IACA,KAAK;AAAA,MACH;AAAA,MACA,cAAc,EAAE,eAAe,qBAAqB;AAAA,IACtD;AAAA,EACF,IAAI;AACJ,QAAM,gBAAgB,aAAAA,QAAM,YAAY,MAAM,cAAc,CAAC,YAAY,CAAC;AAC1E,QAAM,yBAAyB,aAAAA,QAAM,YAAY,OAAO,CAAC,IAAI,CAAC,CAAC;AAE/D,QAAM,gBAAgB,qBAAqB;AAC3C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,QACJ,GAAG;AAAA,QACH,oBAAoB;AAAA,MACtB;AAAA,MACA,WAAU;AAAA,MACV,YAAW;AAAA,MAEgB;AAAA;AAAA,QAAC,4CAAC,SAAI;AAAA,QACjC;AAAA,UAAC;AAAA;AAAA,YACC,IAAG;AAAA,YACH;AAAA,YACA;AAAA,YACA;AAAA,YACA,IAAG;AAAA,YACH,IAAG;AAAA,YACH,eAAa,mBAAmB,6CAA4B;AAAA,YAC5D;AAAA,YACA;AAAA,YAEC,4BAAkB,aAAa,4CAAC,+DAA2B,OAAO,OAAO,WAAU,gBAAe,IAAK;AAAA;AAAA,QAC1G;AAAA;AAAA;AAAA,EACF;AAEJ;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -35,17 +35,17 @@ var React = __toESM(require("react"));
|
|
|
35
35
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
36
36
|
var import_ds_icons = require("@elliemae/ds-icons");
|
|
37
37
|
var import_ds_truncated_tooltip_text = require("@elliemae/ds-truncated-tooltip-text");
|
|
38
|
-
var import_react = require("react");
|
|
39
|
-
var import_constants = require("../../constants/
|
|
38
|
+
var import_react = __toESM(require("react"));
|
|
39
|
+
var import_constants = require("../../constants/index.js");
|
|
40
40
|
var import_exported_related = require("../../exported-related/index.js");
|
|
41
41
|
var import_ItemSeparator = require("../ItemSeparator/index.js");
|
|
42
42
|
var import_ItemTextLabel = require("../ItemTextLabel/index.js");
|
|
43
43
|
var import_ItemWithDate = require("../ItemWithDate/index.js");
|
|
44
44
|
var import_styled = require("../styled.js");
|
|
45
45
|
const outOfTheBoxSubitemsComponents = {
|
|
46
|
-
[
|
|
47
|
-
[
|
|
48
|
-
[
|
|
46
|
+
[import_constants.ITEM_TYPES.LEFT_NAV_ITEM_SEPARATOR]: import_ItemSeparator.ItemSeparator,
|
|
47
|
+
[import_constants.ITEM_TYPES.LEFT_NAV_ITEM_WITH_DATE]: import_ItemWithDate.ItemWithDate,
|
|
48
|
+
[import_constants.ITEM_TYPES.LEFT_NAV_ITEM_TEXT_LABEL]: import_ItemTextLabel.ItemTextLabel
|
|
49
49
|
};
|
|
50
50
|
const OutOfTheBoxMapSubitem = (props) => {
|
|
51
51
|
const {
|
|
@@ -84,11 +84,14 @@ const ItemUncontrolledDrilldown = (props) => {
|
|
|
84
84
|
},
|
|
85
85
|
ctx,
|
|
86
86
|
ctx: {
|
|
87
|
+
leftNavProps,
|
|
87
88
|
leftNavProps: { labelOverflow: leftNavLabelOverflow },
|
|
88
89
|
openedDrilldowns,
|
|
89
90
|
setOpenedDrilldowns
|
|
90
91
|
}
|
|
91
92
|
} = props;
|
|
93
|
+
const getOwnerProps = import_react.default.useCallback(() => leftNavProps, [leftNavProps]);
|
|
94
|
+
const getOwnerPropsArguments = import_react.default.useCallback(() => ({}), []);
|
|
92
95
|
(0, import_react.useEffect)(() => {
|
|
93
96
|
if (startOpened) setOpenedDrilldowns([...openedDrilldowns, dsId]);
|
|
94
97
|
}, []);
|
|
@@ -131,6 +134,8 @@ const ItemUncontrolledDrilldown = (props) => {
|
|
|
131
134
|
pl: "xxs",
|
|
132
135
|
mt: "-2px",
|
|
133
136
|
"data-testid": import_constants.LEFT_NAVIGATION_DATA_TESTID.ARROW_CONTAINER,
|
|
137
|
+
getOwnerProps,
|
|
138
|
+
getOwnerPropsArguments,
|
|
134
139
|
children: arrowIcon
|
|
135
140
|
}
|
|
136
141
|
),
|
|
@@ -142,6 +147,8 @@ const ItemUncontrolledDrilldown = (props) => {
|
|
|
142
147
|
labelBold,
|
|
143
148
|
labelColor,
|
|
144
149
|
"data-testid": labelDataTestId || import_constants.LEFT_NAVIGATION_DATA_TESTID.LIST_ITEM_LABEL_ID_EXCEPTION,
|
|
150
|
+
getOwnerProps,
|
|
151
|
+
getOwnerPropsArguments,
|
|
145
152
|
children: labelOverflow === "truncate" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_truncated_tooltip_text.SimpleTruncatedTooltipText, { value: label, placement: "bottom-start" }) : label
|
|
146
153
|
}
|
|
147
154
|
),
|
|
@@ -153,12 +160,16 @@ const ItemUncontrolledDrilldown = (props) => {
|
|
|
153
160
|
alignItems: "center",
|
|
154
161
|
gutter: "xxs",
|
|
155
162
|
"data-testid": import_constants.LEFT_NAVIGATION_DATA_TESTID.RIGHT_CONTAINER,
|
|
163
|
+
getOwnerProps,
|
|
164
|
+
getOwnerPropsArguments,
|
|
156
165
|
children: [
|
|
157
166
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
158
167
|
import_styled.StyledDate,
|
|
159
168
|
{
|
|
160
169
|
ml: "xxs",
|
|
161
170
|
"data-testid": import_constants.LEFT_NAVIGATION_DATA_TESTID.ITEM_DATE,
|
|
171
|
+
getOwnerProps,
|
|
172
|
+
getOwnerPropsArguments,
|
|
162
173
|
children: labelRightSection
|
|
163
174
|
}
|
|
164
175
|
),
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/outOfTheBox/ItemUncontrolledDrilldown/index.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-lines */\nimport { ArrowheadDown, ArrowheadRight } from '@elliemae/ds-icons';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport React, { useCallback, useEffect, useMemo } from 'react';\nimport { LEFT_NAVIGATION_DATA_TESTID } from '../../constants/
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADiCZ;AAhCX,sBAA8C;AAC9C,uCAA2C;AAC3C,mBAAuD;AACvD,
|
|
6
|
-
"names": []
|
|
4
|
+
"sourcesContent": ["/* eslint-disable max-lines */\nimport { ArrowheadDown, ArrowheadRight } from '@elliemae/ds-icons';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport React, { useCallback, useEffect, useMemo } from 'react';\nimport { ITEM_TYPES, LEFT_NAVIGATION_DATA_TESTID } from '../../constants/index.js';\nimport { ItemRenderer } from '../../exported-related/index.js';\nimport type { DSLeftNavigationT } from '../../react-desc-prop-types.js';\nimport { ItemSeparator } from '../ItemSeparator/index.js';\nimport { ItemTextLabel } from '../ItemTextLabel/index.js';\nimport { ItemWithDate } from '../ItemWithDate/index.js';\nimport { StyledArrowContainer, StyledDate, StyledLabel, StyledRightContainer } from '../styled.js';\n\n// Subitem mapping\nconst outOfTheBoxSubitemsComponents: Record<string, React.ComponentType<DSLeftNavigationT.ComponentProps>> = {\n [ITEM_TYPES.LEFT_NAV_ITEM_SEPARATOR]: ItemSeparator,\n [ITEM_TYPES.LEFT_NAV_ITEM_WITH_DATE]: ItemWithDate,\n [ITEM_TYPES.LEFT_NAV_ITEM_TEXT_LABEL]: ItemTextLabel,\n};\n\nconst OutOfTheBoxMapSubitem: React.ComponentType<DSLeftNavigationT.ComponentProps> = (props) => {\n const {\n item,\n item: { type, Component },\n ctx,\n } = props;\n\n if (typeof type === 'string' && !!outOfTheBoxSubitemsComponents[type]) {\n const OutOfTheBoxComponent = outOfTheBoxSubitemsComponents[type];\n const currentIndent = item.itemOpts?.indent ?? 0;\n const newItem = {\n ...item,\n itemOpts: { ...item.itemOpts, indent: currentIndent + 44 },\n };\n return <OutOfTheBoxComponent item={newItem} ctx={ctx} />;\n }\n if (!Component) return null;\n // we expect an error to be threw if Component is not defined and type is not a valid out-of-the-box...\n return <Component item={item} ctx={ctx} />;\n};\n\nexport const ItemUncontrolledDrilldown = (props: DSLeftNavigationT.ComponentProps): JSX.Element => {\n const {\n item,\n item: {\n dsId,\n itemOpts: {\n label,\n RightComponent,\n labelRightSection,\n labelOverflow: itemLabelOverflow,\n labelBold,\n labelColor,\n startOpened,\n items,\n labelDataTestId,\n },\n },\n ctx,\n ctx: {\n leftNavProps,\n leftNavProps: { labelOverflow: leftNavLabelOverflow },\n openedDrilldowns,\n setOpenedDrilldowns,\n },\n } = props;\n const getOwnerProps = React.useCallback(() => leftNavProps, [leftNavProps]);\n const getOwnerPropsArguments = React.useCallback(() => ({}), []);\n\n // Start opened functionality\n useEffect(() => {\n if (startOpened) setOpenedDrilldowns([...openedDrilldowns, dsId as string]);\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n\n const opened = openedDrilldowns.includes(dsId as string);\n\n const labelOverflow = itemLabelOverflow || leftNavLabelOverflow;\n\n const arrowIcon = useMemo(() => {\n const Component = opened ? ArrowheadDown : ArrowheadRight;\n return <Component width=\"24px\" height=\"18px\" color={['brand-primary', '800']} />;\n }, [opened]);\n\n // Array of subitems\n const subitems = useMemo(() => {\n if (!opened || !items) return [];\n return items.map((subitem) => <OutOfTheBoxMapSubitem item={subitem} ctx={ctx} key={subitem.dsId} />);\n }, [ctx, items, opened]);\n\n const handleOnClick = useCallback(() => {\n if (opened) setOpenedDrilldowns(openedDrilldowns.filter((openedDrilldown) => openedDrilldown !== dsId));\n else setOpenedDrilldowns([...openedDrilldowns, dsId as string]);\n }, [opened, setOpenedDrilldowns, openedDrilldowns, dsId]);\n\n return (\n <ItemRenderer\n item={{\n ...item,\n itemOpts: {\n ariaExpanded: opened,\n ariaRole: 'menuitem',\n ...item.itemOpts,\n openable: !opened,\n closable: opened,\n },\n CollapsedComponent: null,\n }}\n subitems={subitems}\n minHeight=\"32px\"\n paddingTop=\"8px\"\n onClick={handleOnClick}\n >\n <StyledArrowContainer\n pl=\"xxs\"\n mt=\"-2px\"\n data-testid={LEFT_NAVIGATION_DATA_TESTID.ARROW_CONTAINER} // https://jira.elliemae.io/browse/PUI-15589\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {arrowIcon}\n </StyledArrowContainer>\n <StyledLabel\n pb=\"xxxs\"\n labelOverflow={labelOverflow}\n labelBold={labelBold}\n labelColor={labelColor}\n data-testid={labelDataTestId || LEFT_NAVIGATION_DATA_TESTID.LIST_ITEM_LABEL_ID_EXCEPTION}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {labelOverflow === 'truncate' ? <SimpleTruncatedTooltipText value={label} placement=\"bottom-start\" /> : label}\n </StyledLabel>\n <StyledRightContainer\n pr=\"xxs2\"\n cols={['auto', 'auto']}\n alignItems=\"center\"\n gutter=\"xxs\"\n data-testid={LEFT_NAVIGATION_DATA_TESTID.RIGHT_CONTAINER} // https://jira.elliemae.io/browse/PUI-15589\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <StyledDate\n ml=\"xxs\"\n data-testid={LEFT_NAVIGATION_DATA_TESTID.ITEM_DATE} // https://jira.elliemae.io/browse/PUI-15589\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {labelRightSection}\n </StyledDate>\n {RightComponent && <RightComponent ctx={ctx} item={item} />}\n </StyledRightContainer>\n </ItemRenderer>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -34,7 +34,8 @@ module.exports = __toCommonJS(ItemWithDate_exports);
|
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
35
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
36
36
|
var import_ds_truncated_tooltip_text = require("@elliemae/ds-truncated-tooltip-text");
|
|
37
|
-
var
|
|
37
|
+
var import_react = __toESM(require("react"));
|
|
38
|
+
var import_constants = require("../../constants/index.js");
|
|
38
39
|
var import_exported_related = require("../../exported-related/index.js");
|
|
39
40
|
var import_styled = require("../styled.js");
|
|
40
41
|
const ItemWithDate = (props) => {
|
|
@@ -53,9 +54,12 @@ const ItemWithDate = (props) => {
|
|
|
53
54
|
},
|
|
54
55
|
ctx,
|
|
55
56
|
ctx: {
|
|
57
|
+
leftNavProps,
|
|
56
58
|
leftNavProps: { labelOverflow: leftNavLabelOverflow }
|
|
57
59
|
}
|
|
58
60
|
} = props;
|
|
61
|
+
const getOwnerProps = import_react.default.useCallback(() => leftNavProps, [leftNavProps]);
|
|
62
|
+
const getOwnerPropsArguments = import_react.default.useCallback(() => ({}), []);
|
|
59
63
|
const labelOverflow = itemLabelOverflow || leftNavLabelOverflow;
|
|
60
64
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
61
65
|
import_exported_related.ItemRenderer,
|
|
@@ -78,6 +82,8 @@ const ItemWithDate = (props) => {
|
|
|
78
82
|
labelBold,
|
|
79
83
|
labelColor,
|
|
80
84
|
"data-testid": labelDataTestId || import_constants.LEFT_NAVIGATION_DATA_TESTID.LIST_ITEM_LABEL_ID_EXCEPTION,
|
|
85
|
+
getOwnerProps,
|
|
86
|
+
getOwnerPropsArguments,
|
|
81
87
|
children: labelOverflow === "truncate" && label ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_truncated_tooltip_text.SimpleTruncatedTooltipText, { value: label, placement: "bottom-start" }) : label
|
|
82
88
|
}
|
|
83
89
|
),
|
|
@@ -89,12 +95,16 @@ const ItemWithDate = (props) => {
|
|
|
89
95
|
alignItems: "center",
|
|
90
96
|
gutter: "xxs",
|
|
91
97
|
"data-testid": import_constants.LEFT_NAVIGATION_DATA_TESTID.RIGHT_CONTAINER,
|
|
98
|
+
getOwnerProps,
|
|
99
|
+
getOwnerPropsArguments,
|
|
92
100
|
children: [
|
|
93
101
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
94
102
|
import_styled.StyledDate,
|
|
95
103
|
{
|
|
96
104
|
ml: "xxs",
|
|
97
105
|
"data-testid": import_constants.LEFT_NAVIGATION_DATA_TESTID.ITEM_DATE,
|
|
106
|
+
getOwnerProps,
|
|
107
|
+
getOwnerPropsArguments,
|
|
98
108
|
children: labelRightSection
|
|
99
109
|
}
|
|
100
110
|
),
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/outOfTheBox/ItemWithDate/index.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport { LEFT_NAVIGATION_DATA_TESTID } from '../../constants/
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
6
|
-
"names": []
|
|
4
|
+
"sourcesContent": ["import { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport React from 'react';\nimport { LEFT_NAVIGATION_DATA_TESTID } from '../../constants/index.js';\nimport { ItemRenderer } from '../../exported-related/index.js';\nimport type { DSLeftNavigationT } from '../../react-desc-prop-types.js';\nimport { StyledDate, StyledLabel, StyledRightContainer } from '../styled.js';\n\nexport const ItemWithDate = (props: DSLeftNavigationT.ComponentProps): JSX.Element => {\n const {\n item,\n item: {\n itemOpts: {\n label,\n RightComponent,\n labelRightSection,\n labelOverflow: itemLabelOverflow,\n labelBold,\n labelColor,\n labelDataTestId,\n },\n },\n ctx,\n ctx: {\n leftNavProps,\n leftNavProps: { labelOverflow: leftNavLabelOverflow },\n },\n } = props;\n const getOwnerProps = React.useCallback(() => leftNavProps, [leftNavProps]);\n const getOwnerPropsArguments = React.useCallback(() => ({}), []);\n\n const labelOverflow = itemLabelOverflow || leftNavLabelOverflow;\n return (\n <ItemRenderer\n item={{\n ...item,\n CollapsedComponent: null,\n }}\n minHeight=\"32px\"\n paddingTop=\"8px\"\n >\n {/* Empty LeftComponent */} <div />\n <StyledLabel\n pl=\"xxs\"\n pb=\"xxxs\"\n labelOverflow={labelOverflow}\n labelBold={labelBold}\n labelColor={labelColor}\n data-testid={labelDataTestId || LEFT_NAVIGATION_DATA_TESTID.LIST_ITEM_LABEL_ID_EXCEPTION}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {labelOverflow === 'truncate' && label ? (\n <SimpleTruncatedTooltipText value={label} placement=\"bottom-start\" />\n ) : (\n label\n )}\n </StyledLabel>\n <StyledRightContainer\n pr=\"xxs2\"\n cols={['auto', 'auto']}\n alignItems=\"center\"\n gutter=\"xxs\"\n data-testid={LEFT_NAVIGATION_DATA_TESTID.RIGHT_CONTAINER} // https://jira.elliemae.io/browse/PUI-15589\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <StyledDate\n ml=\"xxs\"\n data-testid={LEFT_NAVIGATION_DATA_TESTID.ITEM_DATE} // https://jira.elliemae.io/browse/PUI-15589\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {labelRightSection}\n </StyledDate>\n {RightComponent && <RightComponent ctx={ctx} item={item} />}\n </StyledRightContainer>\n </ItemRenderer>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADwCW;AAxClC,uCAA2C;AAC3C,mBAAkB;AAClB,uBAA4C;AAC5C,8BAA6B;AAE7B,oBAA8D;AAEvD,MAAM,eAAe,CAAC,UAAyD;AACpF,QAAM;AAAA,IACJ;AAAA,IACA,MAAM;AAAA,MACJ,UAAU;AAAA,QACR;AAAA,QACA;AAAA,QACA;AAAA,QACA,eAAe;AAAA,QACf;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,IACF;AAAA,IACA;AAAA,IACA,KAAK;AAAA,MACH;AAAA,MACA,cAAc,EAAE,eAAe,qBAAqB;AAAA,IACtD;AAAA,EACF,IAAI;AACJ,QAAM,gBAAgB,aAAAA,QAAM,YAAY,MAAM,cAAc,CAAC,YAAY,CAAC;AAC1E,QAAM,yBAAyB,aAAAA,QAAM,YAAY,OAAO,CAAC,IAAI,CAAC,CAAC;AAE/D,QAAM,gBAAgB,qBAAqB;AAC3C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,QACJ,GAAG;AAAA,QACH,oBAAoB;AAAA,MACtB;AAAA,MACA,WAAU;AAAA,MACV,YAAW;AAAA,MAEgB;AAAA;AAAA,QAAC,4CAAC,SAAI;AAAA,QACjC;AAAA,UAAC;AAAA;AAAA,YACC,IAAG;AAAA,YACH,IAAG;AAAA,YACH;AAAA,YACA;AAAA,YACA;AAAA,YACA,eAAa,mBAAmB,6CAA4B;AAAA,YAC5D;AAAA,YACA;AAAA,YAEC,4BAAkB,cAAc,QAC/B,4CAAC,+DAA2B,OAAO,OAAO,WAAU,gBAAe,IAEnE;AAAA;AAAA,QAEJ;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,IAAG;AAAA,YACH,MAAM,CAAC,QAAQ,MAAM;AAAA,YACrB,YAAW;AAAA,YACX,QAAO;AAAA,YACP,eAAa,6CAA4B;AAAA,YACzC;AAAA,YACA;AAAA,YAEA;AAAA;AAAA,gBAAC;AAAA;AAAA,kBACC,IAAG;AAAA,kBACH,eAAa,6CAA4B;AAAA,kBACzC;AAAA,kBACA;AAAA,kBAEC;AAAA;AAAA,cACH;AAAA,cACC,kBAAkB,4CAAC,kBAAe,KAAU,MAAY;AAAA;AAAA;AAAA,QAC3D;AAAA;AAAA;AAAA,EACF;AAEJ;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|