@elliemae/ds-left-navigation 2.0.0-rc.8 → 2.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (25) hide show
  1. package/cjs/configs/useLeftNavConfig.js +1 -1
  2. package/cjs/exported-related/ItemRenderer/index.js +2 -2
  3. package/cjs/exported-related/ItemRenderer/usePropsWithDefaults.js +3 -2
  4. package/cjs/hooks/useSelectFirstBodyItem.js +3 -3
  5. package/cjs/outOfTheBox/ItemHeader/index.js +1 -1
  6. package/cjs/outOfTheBox/ItemLink/index.js +1 -1
  7. package/cjs/outOfTheBox/ItemSection/index.js +5 -2
  8. package/cjs/outOfTheBox/ItemSubmenu/index.js +2 -2
  9. package/cjs/parts/LeftNavContent/index.js +3 -2
  10. package/cjs/prop-types.js +2 -1
  11. package/esm/configs/useLeftNavConfig.js +1 -1
  12. package/esm/exported-related/ItemRenderer/index.js +2 -2
  13. package/esm/exported-related/ItemRenderer/usePropsWithDefaults.js +3 -2
  14. package/esm/hooks/useSelectFirstBodyItem.js +3 -3
  15. package/esm/outOfTheBox/ItemHeader/index.js +1 -1
  16. package/esm/outOfTheBox/ItemLink/index.js +1 -1
  17. package/esm/outOfTheBox/ItemSection/index.js +5 -2
  18. package/esm/outOfTheBox/ItemSubmenu/index.js +2 -2
  19. package/esm/parts/LeftNavContent/index.js +3 -2
  20. package/esm/prop-types.js +2 -1
  21. package/package.json +8 -6
  22. package/types/LeftNavigation.d.ts +3 -0
  23. package/types/hooks/useSelectFirstBodyItem.d.ts +1 -1
  24. package/types/index.d.d.ts +2 -0
  25. package/types/prop-types.d.ts +3 -0
package/cjs/configs/useLeftNavConfig.js CHANGED
@@ -57,7 +57,7 @@ const useLeftNavConfig = props => {
57
57
  React__default["default"].useEffect(() => {
58
58
  onFocusChange(focusedItem);
59
59
  }, [focusedItem, onFocusChange]);
60
- useSelectFirstBodyItem.useSelectFirstBodyItem(items, openedItem, props.selectedItem !== undefined ? props.selectedItem : selectedItem, setSelectedItem); // -----------------------------------------------------------------------------
60
+ useSelectFirstBodyItem.useSelectFirstBodyItem(items, openedItem, props.selectedItem !== undefined ? props.selectedItem : selectedItem, setSelectedItem, props.disableDefaultSelection); // -----------------------------------------------------------------------------
61
61
  // ************************** ------------ **************************
62
62
  // * ITEMS MANAGEMENT *
63
63
  // ************************** ------------ **************************
package/cjs/exported-related/ItemRenderer/index.js CHANGED
@@ -79,14 +79,14 @@ const ItemRenderer = props => {
79
79
 
80
80
  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
81
81
  children: [/*#__PURE__*/_jsx__default["default"](styled.StyledItemWrapper, {
82
- shadowStyle: shadowStyle,
82
+ shadowStyle: shadowStyle(opened, item.type),
83
83
  "data-testid": "leftnav-item-wrapper"
84
84
  }, void 0, /*#__PURE__*/jsxRuntime.jsx(styled.StyledItem, {
85
85
  ref: visibleItemsRefs.current[dsId],
86
86
  pt: paddingTop,
87
87
  pl: indent === undefined ? 'xxxs' : "".concat(indent, "px"),
88
88
  minHeight: minHeight,
89
- shadowStyle: shadowStyle,
89
+ shadowStyle: shadowStyle(opened, item.type),
90
90
  alignItems: "flex-start",
91
91
  cols: cols,
92
92
  onClick: !opened ? handleOnClick : () => null,
package/cjs/exported-related/ItemRenderer/usePropsWithDefaults.js CHANGED
@@ -29,7 +29,8 @@ const itemDefaultProps = {
29
29
  ariaLive: 'off',
30
30
  ariaExpanded: undefined,
31
31
  ariaDescribedBy: undefined
32
- }; // Make use Item props with defaults
32
+ };
33
+ const itemWithoutShadows = ['ds-left-nav-item-header', 'ds-left-nav-item-link', 'ds-left-nav-item-submenu']; // Make use Item props with defaults
33
34
 
34
35
  const usePropsWithDefaults = props => {
35
36
  const propsWithDefault = React.useMemo(() => {
@@ -43,7 +44,7 @@ const usePropsWithDefaults = props => {
43
44
  minHeight: '48px',
44
45
  paddingTop: '12px',
45
46
  subitems: [],
46
- shadowStyle: () => 'box-shadow: inherit',
47
+ shadowStyle: (opened, type) => theme => "box-shadow: ".concat(opened || !itemWithoutShadows.includes(type) ? 'inset 4px 0 0 0 #52A6EC' : 'inset 4px 0 0 0 white'),
47
48
  hasBorderBottom: false,
48
49
  borderBottomMr: '0px'
49
50
  }, props), {}, {
package/cjs/hooks/useSelectFirstBodyItem.js CHANGED
@@ -23,14 +23,14 @@ const isItemInsideTheTree = (item, itemID) => {
23
23
  return item.dsId === itemID || (item === null || item === void 0 ? void 0 : (_item$itemOpts = item.itemOpts) === null || _item$itemOpts === void 0 ? void 0 : (_item$itemOpts$items = _item$itemOpts.items) === null || _item$itemOpts$items === void 0 ? void 0 : _item$itemOpts$items.some(it => isItemInsideTheTree(it, itemID)));
24
24
  };
25
25
 
26
- const useSelectFirstBodyItem = (items, openedItem, selectedItem, setSelectedItem) => {
26
+ const useSelectFirstBodyItem = (items, openedItem, selectedItem, setSelectedItem, disableDefaultSelection) => {
27
27
  React.useEffect(() => {
28
- if (items && items.length && openedItem) {
28
+ if (!disableDefaultSelection && items && items.length && openedItem) {
29
29
  const index = items.findIndex(elem => isSelectableOutOfTheBox(elem) || isSelectableCustom(elem));
30
30
  const isItemInside = items.some(it => isItemInsideTheTree(it, selectedItem));
31
31
  if (isItemInside) setSelectedItem(selectedItem);else if (index !== -1) setSelectedItem(items[index].dsId);
32
32
  }
33
- }, [openedItem, setSelectedItem]);
33
+ }, [openedItem, setSelectedItem, disableDefaultSelection]);
34
34
  };
35
35
 
36
36
  exports.useSelectFirstBodyItem = useSelectFirstBodyItem;
package/cjs/outOfTheBox/ItemHeader/index.js CHANGED
@@ -62,7 +62,7 @@ const ItemHeader = props => {
62
62
  const opened = openedItem === dsId;
63
63
  const ariaLabel = (_item$itemOpts$ariaLa = item.itemOpts.ariaLabel) !== null && _item$itemOpts$ariaLa !== void 0 ? _item$itemOpts$ariaLa : typeof label === 'string' ? label : 'menuitem';
64
64
  const isSelected = selectedItem === dsId || selectedParent === dsId;
65
- const shadowStyle = React.useCallback(theme => !openedItem ? notOpenedShadowStyle(isSelected)(theme) : "box-shadow: inherit", [isSelected, openedItem]);
65
+ const shadowStyle = React.useCallback(opened => theme => !opened ? notOpenedShadowStyle(isSelected)(theme) : "box-shadow: inset 4px 0 0 0 #52A6EC", [isSelected, openedItem]);
66
66
  return /*#__PURE__*/_jsx__default["default"](index.ItemRenderer, {
67
67
  item: _objectSpread(_objectSpread({}, item), {}, {
68
68
  itemOpts: _objectSpread(_objectSpread({
package/cjs/outOfTheBox/ItemLink/index.js CHANGED
@@ -53,7 +53,7 @@ const ItemLink = props => {
53
53
  }
54
54
  } = props;
55
55
  const isSelected = selectedItem === dsId || selectedParent === dsId;
56
- const shadowStyle = React.useCallback(theme => !openedItem ? notOpenedShadowStyle(isSelected)(theme) : "box-shadow: inherit", [isSelected, openedItem]);
56
+ const shadowStyle = React.useCallback(opened => theme => !opened ? notOpenedShadowStyle(isSelected)(theme) : "box-shadow: inset 4px 0 0 0 #52A6EC", [isSelected, openedItem]);
57
57
  return /*#__PURE__*/_jsx__default["default"](index.ItemRenderer, {
58
58
  item: _objectSpread(_objectSpread({}, item), {}, {
59
59
  itemOpts: _objectSpread(_objectSpread({
package/cjs/outOfTheBox/ItemSection/index.js CHANGED
@@ -36,7 +36,8 @@ const ItemSection = props => {
36
36
  label,
37
37
  LeftComponent,
38
38
  RightComponent,
39
- labelRightSection
39
+ labelRightSection,
40
+ labelDataTestId
40
41
  }
41
42
  },
42
43
  ctx,
@@ -61,7 +62,9 @@ const ItemSection = props => {
61
62
  }, void 0, LeftComponent ? /*#__PURE__*/_jsx__default["default"](LeftComponent, {
62
63
  ctx: ctx,
63
64
  item: item
64
- }) : _div || (_div = /*#__PURE__*/_jsx__default["default"]("div", {})), /*#__PURE__*/_jsx__default["default"](styled.StyledLabel, {}, void 0, label), _StyledVerticalSepara || (_StyledVerticalSepara = /*#__PURE__*/_jsx__default["default"](styled.StyledVerticalSeparator, {})), /*#__PURE__*/_jsx__default["default"](styled.StyledRightLabel, {}, void 0, labelRightSection)), /*#__PURE__*/_jsx__default["default"](Grid__default["default"], {
65
+ }) : _div || (_div = /*#__PURE__*/_jsx__default["default"]("div", {})), /*#__PURE__*/_jsx__default["default"](styled.StyledLabel, {
66
+ "data-testid": labelDataTestId || 'leftnav-section-item-label'
67
+ }, void 0, label), _StyledVerticalSepara || (_StyledVerticalSepara = /*#__PURE__*/_jsx__default["default"](styled.StyledVerticalSeparator, {})), /*#__PURE__*/_jsx__default["default"](styled.StyledRightLabel, {}, void 0, labelRightSection)), /*#__PURE__*/_jsx__default["default"](Grid__default["default"], {
65
68
  ml: "auto",
66
69
  onFocus: e => {
67
70
  setFocusedItem(null);
package/cjs/outOfTheBox/ItemSubmenu/index.js CHANGED
@@ -61,7 +61,7 @@ const ItemSubmenu = props => {
61
61
  } = props;
62
62
  const opened = openedItem === dsId;
63
63
  const isSelected = selectedItem === dsId;
64
- const shadowStyle = React.useCallback(theme => !openedItem ? notOpenedShadowStyle(isSelected || selectedParent === dsId)(theme) : "box-shadow: inherit", [dsId, isSelected, openedItem, selectedParent]);
64
+ const shadowStyle = React.useCallback(opened => theme => !opened ? notOpenedShadowStyle(isSelected || selectedParent === dsId)(theme) : "box-shadow: inset 4px 0 0 0 #52A6EC", [dsId, isSelected, openedItem, selectedParent]);
65
65
  const ariaLabel = (_item$itemOpts$ariaLa = item.itemOpts.ariaLabel) !== null && _item$itemOpts$ariaLa !== void 0 ? _item$itemOpts$ariaLa : typeof label === 'string' ? label : 'menuitem';
66
66
  return /*#__PURE__*/_jsx__default["default"](index.ItemRenderer, {
67
67
  item: _objectSpread(_objectSpread({}, item), {}, {
@@ -116,7 +116,7 @@ const ItemSubmenu = props => {
116
116
  setFocusedItem(null);
117
117
  },
118
118
  onKeyDown: e => e.stopPropagation(),
119
- onClick: e => openedItem && e.stopPropagation(),
119
+ onClick: e => openedItem === dsId && e.stopPropagation(),
120
120
  "data-testid": "leftnav-right-component"
121
121
  }, void 0, RightComponent && /*#__PURE__*/_jsx__default["default"](RightComponent, {
122
122
  ctx: ctx,
package/cjs/parts/LeftNavContent/index.js CHANGED
@@ -26,7 +26,8 @@ const LeftNavInnerContent = () => {
26
26
  HeaderComponent,
27
27
  BodyHeaderComponent,
28
28
  openedItem,
29
- items
29
+ items,
30
+ withoutBodyShadow
30
31
  },
31
32
  selectedItem
32
33
  } = React__default["default"].useContext(LeftNavigationContext.LeftNavContext);
@@ -42,7 +43,7 @@ const LeftNavInnerContent = () => {
42
43
  }, void 0, BodyHeaderComponent ? /*#__PURE__*/_jsx__default["default"](OutOfTheBoxMapItem.OutOfTheBoxMapItem, {
43
44
  item: BodyHeaderComponent
44
45
  }) : null), /*#__PURE__*/_jsx__default["default"](styled.StyledLeftNavBodyItemsArea, {
45
- selected: openedItem !== null,
46
+ selected: !withoutBodyShadow && openedItem !== null,
46
47
  "data-testid": "leftnav-body-items-area",
47
48
  tabIndex: -1
48
49
  }, void 0, /*#__PURE__*/_jsx__default["default"](index$2.LeftNavContentWithScrollbar, {}, void 0, items.map(item => /*#__PURE__*/_jsx__default["default"](OutOfTheBoxMapItem.OutOfTheBoxMapItem, {
package/cjs/prop-types.js CHANGED
@@ -27,7 +27,8 @@ const leftNavigationProps = {
27
27
  onFooterClose: reactDesc.PropTypes.func.description('The function to call when the left-nav is closed via the footer'),
28
28
  onSelectedChange: reactDesc.PropTypes.func.description('A callback which triggers when the selected item changes').defaultValue(() => null),
29
29
  onFocusChange: reactDesc.PropTypes.func.description('A callback which triggers when the focused item changes').defaultValue(() => null),
30
- items: reactDesc.PropTypes.arrayOf(reactDesc.PropTypes.object).description('The array of items you want to render inside the left nav').defaultValue([])
30
+ items: reactDesc.PropTypes.arrayOf(reactDesc.PropTypes.object).description('The array of items you want to render inside the left nav').defaultValue([]),
31
+ disableDefaultSelection: reactDesc.PropTypes.bool.description('Whether you do not want to automatically select the first body item').defaultValue(false)
31
32
  };
32
33
 
33
34
  const LeftNavItemProps = () => null;
package/esm/configs/useLeftNavConfig.js CHANGED
@@ -49,7 +49,7 @@ const useLeftNavConfig = props => {
49
49
  React.useEffect(() => {
50
50
  onFocusChange(focusedItem);
51
51
  }, [focusedItem, onFocusChange]);
52
- useSelectFirstBodyItem(items, openedItem, props.selectedItem !== undefined ? props.selectedItem : selectedItem, setSelectedItem); // -----------------------------------------------------------------------------
52
+ useSelectFirstBodyItem(items, openedItem, props.selectedItem !== undefined ? props.selectedItem : selectedItem, setSelectedItem, props.disableDefaultSelection); // -----------------------------------------------------------------------------
53
53
  // ************************** ------------ **************************
54
54
  // * ITEMS MANAGEMENT *
55
55
  // ************************** ------------ **************************
package/esm/exported-related/ItemRenderer/index.js CHANGED
@@ -70,14 +70,14 @@ const ItemRenderer = props => {
70
70
 
71
71
  return /*#__PURE__*/jsxs(Fragment, {
72
72
  children: [/*#__PURE__*/_jsx(StyledItemWrapper, {
73
- shadowStyle: shadowStyle,
73
+ shadowStyle: shadowStyle(opened, item.type),
74
74
  "data-testid": "leftnav-item-wrapper"
75
75
  }, void 0, /*#__PURE__*/jsx(StyledItem, {
76
76
  ref: visibleItemsRefs.current[dsId],
77
77
  pt: paddingTop,
78
78
  pl: indent === undefined ? 'xxxs' : "".concat(indent, "px"),
79
79
  minHeight: minHeight,
80
- shadowStyle: shadowStyle,
80
+ shadowStyle: shadowStyle(opened, item.type),
81
81
  alignItems: "flex-start",
82
82
  cols: cols,
83
83
  onClick: !opened ? handleOnClick : () => null,
package/esm/exported-related/ItemRenderer/usePropsWithDefaults.js CHANGED
@@ -21,7 +21,8 @@ const itemDefaultProps = {
21
21
  ariaLive: 'off',
22
22
  ariaExpanded: undefined,
23
23
  ariaDescribedBy: undefined
24
- }; // Make use Item props with defaults
24
+ };
25
+ const itemWithoutShadows = ['ds-left-nav-item-header', 'ds-left-nav-item-link', 'ds-left-nav-item-submenu']; // Make use Item props with defaults
25
26
 
26
27
  const usePropsWithDefaults = props => {
27
28
  const propsWithDefault = useMemo(() => {
@@ -35,7 +36,7 @@ const usePropsWithDefaults = props => {
35
36
  minHeight: '48px',
36
37
  paddingTop: '12px',
37
38
  subitems: [],
38
- shadowStyle: () => 'box-shadow: inherit',
39
+ shadowStyle: (opened, type) => theme => "box-shadow: ".concat(opened || !itemWithoutShadows.includes(type) ? 'inset 4px 0 0 0 #52A6EC' : 'inset 4px 0 0 0 white'),
39
40
  hasBorderBottom: false,
40
41
  borderBottomMr: '0px'
41
42
  }, props), {}, {
package/esm/hooks/useSelectFirstBodyItem.js CHANGED
@@ -19,14 +19,14 @@ const isItemInsideTheTree = (item, itemID) => {
19
19
  return item.dsId === itemID || (item === null || item === void 0 ? void 0 : (_item$itemOpts = item.itemOpts) === null || _item$itemOpts === void 0 ? void 0 : (_item$itemOpts$items = _item$itemOpts.items) === null || _item$itemOpts$items === void 0 ? void 0 : _item$itemOpts$items.some(it => isItemInsideTheTree(it, itemID)));
20
20
  };
21
21
 
22
- const useSelectFirstBodyItem = (items, openedItem, selectedItem, setSelectedItem) => {
22
+ const useSelectFirstBodyItem = (items, openedItem, selectedItem, setSelectedItem, disableDefaultSelection) => {
23
23
  useEffect(() => {
24
- if (items && items.length && openedItem) {
24
+ if (!disableDefaultSelection && items && items.length && openedItem) {
25
25
  const index = items.findIndex(elem => isSelectableOutOfTheBox(elem) || isSelectableCustom(elem));
26
26
  const isItemInside = items.some(it => isItemInsideTheTree(it, selectedItem));
27
27
  if (isItemInside) setSelectedItem(selectedItem);else if (index !== -1) setSelectedItem(items[index].dsId);
28
28
  }
29
- }, [openedItem, setSelectedItem]);
29
+ }, [openedItem, setSelectedItem, disableDefaultSelection]);
30
30
  };
31
31
 
32
32
  export { useSelectFirstBodyItem };
package/esm/outOfTheBox/ItemHeader/index.js CHANGED
@@ -52,7 +52,7 @@ const ItemHeader = props => {
52
52
  const opened = openedItem === dsId;
53
53
  const ariaLabel = (_item$itemOpts$ariaLa = item.itemOpts.ariaLabel) !== null && _item$itemOpts$ariaLa !== void 0 ? _item$itemOpts$ariaLa : typeof label === 'string' ? label : 'menuitem';
54
54
  const isSelected = selectedItem === dsId || selectedParent === dsId;
55
- const shadowStyle = useCallback(theme => !openedItem ? notOpenedShadowStyle(isSelected)(theme) : "box-shadow: inherit", [isSelected, openedItem]);
55
+ const shadowStyle = useCallback(opened => theme => !opened ? notOpenedShadowStyle(isSelected)(theme) : "box-shadow: inset 4px 0 0 0 #52A6EC", [isSelected, openedItem]);
56
56
  return /*#__PURE__*/_jsx(ItemRenderer, {
57
57
  item: _objectSpread(_objectSpread({}, item), {}, {
58
58
  itemOpts: _objectSpread(_objectSpread({
package/esm/outOfTheBox/ItemLink/index.js CHANGED
@@ -43,7 +43,7 @@ const ItemLink = props => {
43
43
  }
44
44
  } = props;
45
45
  const isSelected = selectedItem === dsId || selectedParent === dsId;
46
- const shadowStyle = useCallback(theme => !openedItem ? notOpenedShadowStyle(isSelected)(theme) : "box-shadow: inherit", [isSelected, openedItem]);
46
+ const shadowStyle = useCallback(opened => theme => !opened ? notOpenedShadowStyle(isSelected)(theme) : "box-shadow: inset 4px 0 0 0 #52A6EC", [isSelected, openedItem]);
47
47
  return /*#__PURE__*/_jsx(ItemRenderer, {
48
48
  item: _objectSpread(_objectSpread({}, item), {}, {
49
49
  itemOpts: _objectSpread(_objectSpread({
package/esm/outOfTheBox/ItemSection/index.js CHANGED
@@ -26,7 +26,8 @@ const ItemSection = props => {
26
26
  label,
27
27
  LeftComponent,
28
28
  RightComponent,
29
- labelRightSection
29
+ labelRightSection,
30
+ labelDataTestId
30
31
  }
31
32
  },
32
33
  ctx,
@@ -51,7 +52,9 @@ const ItemSection = props => {
51
52
  }, void 0, LeftComponent ? /*#__PURE__*/_jsx(LeftComponent, {
52
53
  ctx: ctx,
53
54
  item: item
54
- }) : _div || (_div = /*#__PURE__*/_jsx("div", {})), /*#__PURE__*/_jsx(StyledLabel, {}, void 0, label), _StyledVerticalSepara || (_StyledVerticalSepara = /*#__PURE__*/_jsx(StyledVerticalSeparator, {})), /*#__PURE__*/_jsx(StyledRightLabel, {}, void 0, labelRightSection)), /*#__PURE__*/_jsx(Grid, {
55
+ }) : _div || (_div = /*#__PURE__*/_jsx("div", {})), /*#__PURE__*/_jsx(StyledLabel, {
56
+ "data-testid": labelDataTestId || 'leftnav-section-item-label'
57
+ }, void 0, label), _StyledVerticalSepara || (_StyledVerticalSepara = /*#__PURE__*/_jsx(StyledVerticalSeparator, {})), /*#__PURE__*/_jsx(StyledRightLabel, {}, void 0, labelRightSection)), /*#__PURE__*/_jsx(Grid, {
55
58
  ml: "auto",
56
59
  onFocus: e => {
57
60
  setFocusedItem(null);
package/esm/outOfTheBox/ItemSubmenu/index.js CHANGED
@@ -51,7 +51,7 @@ const ItemSubmenu = props => {
51
51
  } = props;
52
52
  const opened = openedItem === dsId;
53
53
  const isSelected = selectedItem === dsId;
54
- const shadowStyle = useCallback(theme => !openedItem ? notOpenedShadowStyle(isSelected || selectedParent === dsId)(theme) : "box-shadow: inherit", [dsId, isSelected, openedItem, selectedParent]);
54
+ const shadowStyle = useCallback(opened => theme => !opened ? notOpenedShadowStyle(isSelected || selectedParent === dsId)(theme) : "box-shadow: inset 4px 0 0 0 #52A6EC", [dsId, isSelected, openedItem, selectedParent]);
55
55
  const ariaLabel = (_item$itemOpts$ariaLa = item.itemOpts.ariaLabel) !== null && _item$itemOpts$ariaLa !== void 0 ? _item$itemOpts$ariaLa : typeof label === 'string' ? label : 'menuitem';
56
56
  return /*#__PURE__*/_jsx(ItemRenderer, {
57
57
  item: _objectSpread(_objectSpread({}, item), {}, {
@@ -106,7 +106,7 @@ const ItemSubmenu = props => {
106
106
  setFocusedItem(null);
107
107
  },
108
108
  onKeyDown: e => e.stopPropagation(),
109
- onClick: e => openedItem && e.stopPropagation(),
109
+ onClick: e => openedItem === dsId && e.stopPropagation(),
110
110
  "data-testid": "leftnav-right-component"
111
111
  }, void 0, RightComponent && /*#__PURE__*/_jsx(RightComponent, {
112
112
  ctx: ctx,
package/esm/parts/LeftNavContent/index.js CHANGED
@@ -19,7 +19,8 @@ const LeftNavInnerContent = () => {
19
19
  HeaderComponent,
20
20
  BodyHeaderComponent,
21
21
  openedItem,
22
- items
22
+ items,
23
+ withoutBodyShadow
23
24
  },
24
25
  selectedItem
25
26
  } = React.useContext(LeftNavContext);
@@ -35,7 +36,7 @@ const LeftNavInnerContent = () => {
35
36
  }, void 0, BodyHeaderComponent ? /*#__PURE__*/_jsx(OutOfTheBoxMapItem, {
36
37
  item: BodyHeaderComponent
37
38
  }) : null), /*#__PURE__*/_jsx(StyledLeftNavBodyItemsArea, {
38
- selected: openedItem !== null,
39
+ selected: !withoutBodyShadow && openedItem !== null,
39
40
  "data-testid": "leftnav-body-items-area",
40
41
  tabIndex: -1
41
42
  }, void 0, /*#__PURE__*/_jsx(LeftNavContentWithScrollbar, {}, void 0, items.map(item => /*#__PURE__*/_jsx(OutOfTheBoxMapItem, {
package/esm/prop-types.js CHANGED
@@ -23,7 +23,8 @@ const leftNavigationProps = {
23
23
  onFooterClose: PropTypes.func.description('The function to call when the left-nav is closed via the footer'),
24
24
  onSelectedChange: PropTypes.func.description('A callback which triggers when the selected item changes').defaultValue(() => null),
25
25
  onFocusChange: PropTypes.func.description('A callback which triggers when the focused item changes').defaultValue(() => null),
26
- items: PropTypes.arrayOf(PropTypes.object).description('The array of items you want to render inside the left nav').defaultValue([])
26
+ items: PropTypes.arrayOf(PropTypes.object).description('The array of items you want to render inside the left nav').defaultValue([]),
27
+ disableDefaultSelection: PropTypes.bool.description('Whether you do not want to automatically select the first body item').defaultValue(false)
27
28
  };
28
29
 
29
30
  const LeftNavItemProps = () => null;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-left-navigation",
3
- "version": "2.0.0-rc.8",
3
+ "version": "2.0.1",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Left Navigation",
6
6
  "module": "./esm/index.js",
@@ -233,16 +233,18 @@
233
233
  "generateSubmodules": true
234
234
  },
235
235
  "dependencies": {
236
- "@elliemae/ds-basic": "2.0.0-rc.8",
237
- "@elliemae/ds-grid": "2.0.0-rc.8",
238
- "@elliemae/ds-icons": "2.0.0-rc.8",
239
- "@elliemae/ds-system": "2.0.0-rc.8",
240
- "@elliemae/ds-truncated-tooltip-text": "2.0.0-rc.8",
236
+ "@elliemae/ds-circular-progress-indicator": "2.0.1",
237
+ "@elliemae/ds-grid": "2.0.1",
238
+ "@elliemae/ds-icons": "2.0.1",
239
+ "@elliemae/ds-system": "2.0.1",
240
+ "@elliemae/ds-truncated-tooltip-text": "2.0.1",
241
241
  "overlayscrollbars": "1.13.1",
242
242
  "prop-types": "~15.7.2",
243
243
  "react-desc": "~4.1.3"
244
244
  },
245
245
  "devDependencies": {
246
+ "@testing-library/react": "~12.1.2",
247
+ "@testing-library/user-event": "~13.5.0",
246
248
  "styled-components": "~5.3.3"
247
249
  },
248
250
  "peerDependencies": {
package/types/LeftNavigation.d.ts CHANGED
@@ -46,6 +46,9 @@ export declare const LeftNavigation: {
46
46
  items: {
47
47
  deprecated: import("react-desc").PropTypesDescValidator;
48
48
  };
49
+ disableDefaultSelection: {
50
+ deprecated: import("react-desc").PropTypesDescValidator;
51
+ };
49
52
  };
50
53
  defaultProps: LeftNavProps;
51
54
  };
package/types/hooks/useSelectFirstBodyItem.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  import React from 'react';
2
2
  import { GenericItemItemProps } from '../index.d';
3
- export declare const useSelectFirstBodyItem: (items: GenericItemItemProps[], openedItem: string, selectedItem: string, setSelectedItem: React.Dispatch<React.SetStateAction<string>>) => void;
3
+ export declare const useSelectFirstBodyItem: (items: GenericItemItemProps[], openedItem: string, selectedItem: string, setSelectedItem: React.Dispatch<React.SetStateAction<string>>, disableDefaultSelection: boolean) => void;
package/types/index.d.d.ts CHANGED
@@ -19,6 +19,8 @@ export interface LeftNavProps {
19
19
  loading: boolean;
20
20
  selectedItem?: string;
21
21
  selectedParent?: string;
22
+ disableDefaultSelection?: boolean;
23
+ withoutBodyShadow?: boolean;
22
24
  }
23
25
  export declare type OutOfTheBoxT = 'ds-left-nav-item-header' | 'ds-left-nav-item-link' | 'ds-left-nav-item-submenu' | 'ds-left-nav-item-controlled-drilldown' | 'ds-left-nav-item-uncontrolled-drilldown' | 'ds-left-nav-item-section' | 'ds-left-nav-item-separator' | 'ds-left-nav-item-text-label' | 'ds-left-nav-item-with-date';
24
26
  export interface itemOptsT {
package/types/prop-types.d.ts CHANGED
@@ -75,6 +75,9 @@ export declare const leftNavigationProps: {
75
75
  items: {
76
76
  deprecated: import("react-desc").PropTypesDescValidator;
77
77
  };
78
+ disableDefaultSelection: {
79
+ deprecated: import("react-desc").PropTypesDescValidator;
80
+ };
78
81
  };
79
82
  export declare const LeftNavItemPropsSchema: {
80
83
  (props?: unknown): JSX.Element;