@elliemae/ds-left-navigation 2.2.0-next.3 → 2.3.0-alpha.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 (213) hide show
  1. package/cjs/LeftNavigation.js +49 -27
  2. package/cjs/LeftNavigation.js.map +7 -0
  3. package/cjs/LeftNavigationContext.js +44 -18
  4. package/cjs/LeftNavigationContext.js.map +7 -0
  5. package/cjs/common/getItemBackgroundStyle.js +47 -8
  6. package/cjs/common/getItemBackgroundStyle.js.map +7 -0
  7. package/cjs/common/getLeftBorderStyle.js +50 -8
  8. package/cjs/common/getLeftBorderStyle.js.map +7 -0
  9. package/cjs/common/getScrollbarStyle.js +55 -4
  10. package/cjs/common/getScrollbarStyle.js.map +7 -0
  11. package/cjs/common/index.js +30 -13
  12. package/cjs/common/index.js.map +7 -0
  13. package/cjs/configs/index.js +38 -10
  14. package/cjs/configs/index.js.map +7 -0
  15. package/cjs/configs/useLeftNavConfig.js +76 -76
  16. package/cjs/configs/useLeftNavConfig.js.map +7 -0
  17. package/cjs/configs/useLeftNavItems.js +66 -64
  18. package/cjs/configs/useLeftNavItems.js.map +7 -0
  19. package/cjs/configs/useLeftNavSmoothExpand.js +43 -25
  20. package/cjs/configs/useLeftNavSmoothExpand.js.map +7 -0
  21. package/cjs/exported-related/ChevronItem/index.js +42 -27
  22. package/cjs/exported-related/ChevronItem/index.js.map +7 -0
  23. package/cjs/exported-related/Icon/index.js +51 -34
  24. package/cjs/exported-related/Icon/index.js.map +7 -0
  25. package/cjs/exported-related/ItemRenderer/index.js +99 -94
  26. package/cjs/exported-related/ItemRenderer/index.js.map +7 -0
  27. package/cjs/exported-related/ItemRenderer/styled.js +83 -51
  28. package/cjs/exported-related/ItemRenderer/styled.js.map +7 -0
  29. package/cjs/exported-related/ItemRenderer/usePropsWithDefaults.js +57 -45
  30. package/cjs/exported-related/ItemRenderer/usePropsWithDefaults.js.map +7 -0
  31. package/cjs/exported-related/Notifications/index.js +81 -61
  32. package/cjs/exported-related/Notifications/index.js.map +7 -0
  33. package/cjs/exported-related/OpenWindowItem/index.js +49 -32
  34. package/cjs/exported-related/OpenWindowItem/index.js.map +7 -0
  35. package/cjs/exported-related/constants.js +53 -25
  36. package/cjs/exported-related/constants.js.map +7 -0
  37. package/cjs/exported-related/index.js +33 -23
  38. package/cjs/exported-related/index.js.map +7 -0
  39. package/cjs/hooks/index.js +30 -13
  40. package/cjs/hooks/index.js.map +7 -0
  41. package/cjs/hooks/useExpandableOnClickHandler.js +55 -26
  42. package/cjs/hooks/useExpandableOnClickHandler.js.map +7 -0
  43. package/cjs/hooks/useKeyboardNavigation.js +62 -54
  44. package/cjs/hooks/useKeyboardNavigation.js.map +7 -0
  45. package/cjs/hooks/useOpenableOnClickHandler.js +55 -26
  46. package/cjs/hooks/useOpenableOnClickHandler.js.map +7 -0
  47. package/cjs/hooks/useSelectFirstBodyItem.js +47 -34
  48. package/cjs/hooks/useSelectFirstBodyItem.js.map +7 -0
  49. package/cjs/index.d.js +27 -2
  50. package/cjs/index.d.js.map +7 -0
  51. package/cjs/index.js +41 -30
  52. package/cjs/index.js.map +7 -0
  53. package/cjs/outOfTheBox/ItemControlledDrilldown/index.js +97 -103
  54. package/cjs/outOfTheBox/ItemControlledDrilldown/index.js.map +7 -0
  55. package/cjs/outOfTheBox/ItemControlledDrilldown/styled.js +49 -27
  56. package/cjs/outOfTheBox/ItemControlledDrilldown/styled.js.map +7 -0
  57. package/cjs/outOfTheBox/ItemHeader/index.js +95 -93
  58. package/cjs/outOfTheBox/ItemHeader/index.js.map +7 -0
  59. package/cjs/outOfTheBox/ItemHeader/styled.js +49 -22
  60. package/cjs/outOfTheBox/ItemHeader/styled.js.map +7 -0
  61. package/cjs/outOfTheBox/ItemLink/index.js +75 -67
  62. package/cjs/outOfTheBox/ItemLink/index.js.map +7 -0
  63. package/cjs/outOfTheBox/ItemLink/styled.js +41 -17
  64. package/cjs/outOfTheBox/ItemLink/styled.js.map +7 -0
  65. package/cjs/outOfTheBox/ItemSection/index.js +59 -63
  66. package/cjs/outOfTheBox/ItemSection/index.js.map +7 -0
  67. package/cjs/outOfTheBox/ItemSection/styled.js +53 -23
  68. package/cjs/outOfTheBox/ItemSection/styled.js.map +7 -0
  69. package/cjs/outOfTheBox/ItemSeparator/index.js +56 -45
  70. package/cjs/outOfTheBox/ItemSeparator/index.js.map +7 -0
  71. package/cjs/outOfTheBox/ItemSubmenu/index.js +95 -92
  72. package/cjs/outOfTheBox/ItemSubmenu/index.js.map +7 -0
  73. package/cjs/outOfTheBox/ItemSubmenu/styled.js +49 -22
  74. package/cjs/outOfTheBox/ItemSubmenu/styled.js.map +7 -0
  75. package/cjs/outOfTheBox/ItemTextLabel/index.js +51 -52
  76. package/cjs/outOfTheBox/ItemTextLabel/index.js.map +7 -0
  77. package/cjs/outOfTheBox/ItemTextLabel/styled.js +43 -23
  78. package/cjs/outOfTheBox/ItemTextLabel/styled.js.map +7 -0
  79. package/cjs/outOfTheBox/ItemUncontrolledDrilldown/index.js +107 -113
  80. package/cjs/outOfTheBox/ItemUncontrolledDrilldown/index.js.map +7 -0
  81. package/cjs/outOfTheBox/ItemUncontrolledDrilldown/styled.js +49 -27
  82. package/cjs/outOfTheBox/ItemUncontrolledDrilldown/styled.js.map +7 -0
  83. package/cjs/outOfTheBox/ItemWithDate/index.js +59 -54
  84. package/cjs/outOfTheBox/ItemWithDate/index.js.map +7 -0
  85. package/cjs/outOfTheBox/ItemWithDate/styled.js +49 -27
  86. package/cjs/outOfTheBox/ItemWithDate/styled.js.map +7 -0
  87. package/cjs/outOfTheBox/index.js +65 -50
  88. package/cjs/outOfTheBox/index.js.map +7 -0
  89. package/cjs/parts/LeftNavContent/index.js +75 -71
  90. package/cjs/parts/LeftNavContent/index.js.map +7 -0
  91. package/cjs/parts/LeftNavContent/styled.js +110 -50
  92. package/cjs/parts/LeftNavContent/styled.js.map +7 -0
  93. package/cjs/parts/LeftNavContentWithScrollbar/index.js +89 -79
  94. package/cjs/parts/LeftNavContentWithScrollbar/index.js.map +7 -0
  95. package/cjs/parts/LeftNavFooterItem/index.js +97 -80
  96. package/cjs/parts/LeftNavFooterItem/index.js.map +7 -0
  97. package/cjs/parts/LeftNavFooterItem/styled.js +89 -34
  98. package/cjs/parts/LeftNavFooterItem/styled.js.map +7 -0
  99. package/cjs/parts/LeftNavLoading/index.js +51 -33
  100. package/cjs/parts/LeftNavLoading/index.js.map +7 -0
  101. package/cjs/parts/OutOfTheBoxMapItem.js +49 -46
  102. package/cjs/parts/OutOfTheBoxMapItem.js.map +7 -0
  103. package/cjs/prop-types.js +58 -39
  104. package/cjs/prop-types.js.map +7 -0
  105. package/esm/LeftNavigation.js +17 -15
  106. package/esm/LeftNavigation.js.map +7 -0
  107. package/esm/LeftNavigationContext.js +15 -11
  108. package/esm/LeftNavigationContext.js.map +7 -0
  109. package/esm/common/getItemBackgroundStyle.js +20 -6
  110. package/esm/common/getItemBackgroundStyle.js.map +7 -0
  111. package/esm/common/getLeftBorderStyle.js +23 -6
  112. package/esm/common/getLeftBorderStyle.js.map +7 -0
  113. package/esm/common/getScrollbarStyle.js +28 -2
  114. package/esm/common/getScrollbarStyle.js.map +7 -0
  115. package/esm/common/index.js +5 -3
  116. package/esm/common/index.js.map +7 -0
  117. package/esm/configs/index.js +9 -2
  118. package/esm/configs/index.js.map +7 -0
  119. package/esm/configs/useLeftNavConfig.js +47 -67
  120. package/esm/configs/useLeftNavConfig.js.map +7 -0
  121. package/esm/configs/useLeftNavItems.js +33 -55
  122. package/esm/configs/useLeftNavItems.js.map +7 -0
  123. package/esm/configs/useLeftNavSmoothExpand.js +14 -16
  124. package/esm/configs/useLeftNavSmoothExpand.js.map +7 -0
  125. package/esm/exported-related/ChevronItem/index.js +13 -18
  126. package/esm/exported-related/ChevronItem/index.js.map +7 -0
  127. package/esm/exported-related/Icon/index.js +21 -24
  128. package/esm/exported-related/Icon/index.js.map +7 -0
  129. package/esm/exported-related/ItemRenderer/index.js +65 -80
  130. package/esm/exported-related/ItemRenderer/index.js.map +7 -0
  131. package/esm/exported-related/ItemRenderer/styled.js +56 -42
  132. package/esm/exported-related/ItemRenderer/styled.js.map +7 -0
  133. package/esm/exported-related/ItemRenderer/usePropsWithDefaults.js +27 -36
  134. package/esm/exported-related/ItemRenderer/usePropsWithDefaults.js.map +7 -0
  135. package/esm/exported-related/Notifications/index.js +57 -50
  136. package/esm/exported-related/Notifications/index.js.map +7 -0
  137. package/esm/exported-related/OpenWindowItem/index.js +20 -22
  138. package/esm/exported-related/OpenWindowItem/index.js.map +7 -0
  139. package/esm/exported-related/constants.js +24 -17
  140. package/esm/exported-related/constants.js.map +7 -0
  141. package/esm/exported-related/index.js +8 -6
  142. package/esm/exported-related/index.js.map +7 -0
  143. package/esm/hooks/index.js +5 -3
  144. package/esm/hooks/index.js.map +7 -0
  145. package/esm/hooks/useExpandableOnClickHandler.js +26 -22
  146. package/esm/hooks/useExpandableOnClickHandler.js.map +7 -0
  147. package/esm/hooks/useKeyboardNavigation.js +30 -47
  148. package/esm/hooks/useKeyboardNavigation.js.map +7 -0
  149. package/esm/hooks/useOpenableOnClickHandler.js +26 -22
  150. package/esm/hooks/useOpenableOnClickHandler.js.map +7 -0
  151. package/esm/hooks/useSelectFirstBodyItem.js +18 -30
  152. package/esm/hooks/useSelectFirstBodyItem.js.map +7 -0
  153. package/esm/index.d.js +2 -1
  154. package/esm/index.d.js.map +7 -0
  155. package/esm/index.js +12 -8
  156. package/esm/index.js.map +7 -0
  157. package/esm/outOfTheBox/ItemControlledDrilldown/index.js +62 -87
  158. package/esm/outOfTheBox/ItemControlledDrilldown/index.js.map +7 -0
  159. package/esm/outOfTheBox/ItemControlledDrilldown/styled.js +20 -17
  160. package/esm/outOfTheBox/ItemControlledDrilldown/styled.js.map +7 -0
  161. package/esm/outOfTheBox/ItemHeader/index.js +65 -82
  162. package/esm/outOfTheBox/ItemHeader/index.js.map +7 -0
  163. package/esm/outOfTheBox/ItemHeader/styled.js +20 -12
  164. package/esm/outOfTheBox/ItemHeader/styled.js.map +7 -0
  165. package/esm/outOfTheBox/ItemLink/index.js +46 -57
  166. package/esm/outOfTheBox/ItemLink/index.js.map +7 -0
  167. package/esm/outOfTheBox/ItemLink/styled.js +12 -8
  168. package/esm/outOfTheBox/ItemLink/styled.js.map +7 -0
  169. package/esm/outOfTheBox/ItemSection/index.js +30 -53
  170. package/esm/outOfTheBox/ItemSection/index.js.map +7 -0
  171. package/esm/outOfTheBox/ItemSection/styled.js +24 -13
  172. package/esm/outOfTheBox/ItemSection/styled.js.map +7 -0
  173. package/esm/outOfTheBox/ItemSeparator/index.js +27 -35
  174. package/esm/outOfTheBox/ItemSeparator/index.js.map +7 -0
  175. package/esm/outOfTheBox/ItemSubmenu/index.js +65 -81
  176. package/esm/outOfTheBox/ItemSubmenu/index.js.map +7 -0
  177. package/esm/outOfTheBox/ItemSubmenu/styled.js +20 -12
  178. package/esm/outOfTheBox/ItemSubmenu/styled.js.map +7 -0
  179. package/esm/outOfTheBox/ItemTextLabel/index.js +22 -43
  180. package/esm/outOfTheBox/ItemTextLabel/index.js.map +7 -0
  181. package/esm/outOfTheBox/ItemTextLabel/styled.js +14 -14
  182. package/esm/outOfTheBox/ItemTextLabel/styled.js.map +7 -0
  183. package/esm/outOfTheBox/ItemUncontrolledDrilldown/index.js +70 -95
  184. package/esm/outOfTheBox/ItemUncontrolledDrilldown/index.js.map +7 -0
  185. package/esm/outOfTheBox/ItemUncontrolledDrilldown/styled.js +20 -17
  186. package/esm/outOfTheBox/ItemUncontrolledDrilldown/styled.js.map +7 -0
  187. package/esm/outOfTheBox/ItemWithDate/index.js +30 -44
  188. package/esm/outOfTheBox/ItemWithDate/index.js.map +7 -0
  189. package/esm/outOfTheBox/ItemWithDate/styled.js +20 -17
  190. package/esm/outOfTheBox/ItemWithDate/styled.js.map +7 -0
  191. package/esm/outOfTheBox/index.js +25 -34
  192. package/esm/outOfTheBox/index.js.map +7 -0
  193. package/esm/parts/LeftNavContent/index.js +54 -64
  194. package/esm/parts/LeftNavContent/index.js.map +7 -0
  195. package/esm/parts/LeftNavContent/styled.js +81 -36
  196. package/esm/parts/LeftNavContent/styled.js.map +7 -0
  197. package/esm/parts/LeftNavContentWithScrollbar/index.js +56 -64
  198. package/esm/parts/LeftNavContentWithScrollbar/index.js.map +7 -0
  199. package/esm/parts/LeftNavFooterItem/index.js +73 -68
  200. package/esm/parts/LeftNavFooterItem/index.js.map +7 -0
  201. package/esm/parts/LeftNavFooterItem/styled.js +63 -24
  202. package/esm/parts/LeftNavFooterItem/styled.js.map +7 -0
  203. package/esm/parts/LeftNavLoading/index.js +22 -22
  204. package/esm/parts/LeftNavLoading/index.js.map +7 -0
  205. package/esm/parts/OutOfTheBoxMapItem.js +19 -35
  206. package/esm/parts/OutOfTheBoxMapItem.js.map +7 -0
  207. package/esm/prop-types.js +26 -29
  208. package/esm/prop-types.js.map +7 -0
  209. package/package.json +6 -6
  210. package/types/LeftNavigationContext.d.ts +4 -4
  211. package/types/configs/useLeftNavSmoothExpand.d.ts +3 -3
  212. package/types/hooks/useSelectFirstBodyItem.d.ts +1 -1
  213. package/types/index.d.d.ts +2 -5
@@ -1,36 +1,53 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- require('core-js/modules/esnext.async-iterator.filter.js');
6
- require('core-js/modules/esnext.iterator.constructor.js');
7
- require('core-js/modules/esnext.iterator.filter.js');
8
- require('core-js/modules/esnext.async-iterator.for-each.js');
9
- require('core-js/modules/esnext.iterator.for-each.js');
10
- var _defineProperty = require('@babel/runtime/helpers/defineProperty');
11
- require('react');
12
- var styled = require('styled-components');
13
- var jsxRuntime = require('react/jsx-runtime');
14
-
15
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
16
-
17
- var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
18
- var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
19
-
20
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
21
-
22
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
23
-
24
- const AugmentedIcon = Icon => styled__default["default"](Icon).withConfig({
25
- componentId: "sc-1eek2uh-0"
26
- })(["cursor:pointer;outline:0;:focus,:active{outline:1px solid #1e79c2;}"]);
27
-
28
- const Icon = IconComponent => props => {
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __reExport = (target, module2, copyDefault, desc) => {
13
+ if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
+ for (let key of __getOwnPropNames(module2))
15
+ if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
+ __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
+ }
18
+ return target;
19
+ };
20
+ var __toESM = (module2, isNodeMode) => {
21
+ return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
+ };
23
+ var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
+ return (module2, temp) => {
25
+ return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
+ };
27
+ })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
+ var Icon_exports = {};
29
+ __export(Icon_exports, {
30
+ Icon: () => Icon
31
+ });
32
+ var React = __toESM(require("react"));
33
+ var import_react = __toESM(require("react"));
34
+ var import_styled_components = __toESM(require("styled-components"));
35
+ const AugmentedIcon = (Icon2) => (0, import_styled_components.default)(Icon2)`
36
+ cursor: pointer;
37
+
38
+ outline: 0;
39
+ :focus,
40
+ :active {
41
+ outline: 1px solid #1e79c2;
42
+ }
43
+ `;
44
+ const Icon = (IconComponent) => (props) => {
29
45
  const StyledComponent = AugmentedIcon(IconComponent);
30
- return /*#__PURE__*/jsxRuntime.jsx(StyledComponent, _objectSpread({
31
- color: ['brand-primary', 800],
32
- tabIndex: 0
33
- }, props));
46
+ return /* @__PURE__ */ import_react.default.createElement(StyledComponent, {
47
+ color: ["brand-primary", 800],
48
+ tabIndex: 0,
49
+ ...props
50
+ });
34
51
  };
35
-
36
- exports.Icon = Icon;
52
+ module.exports = __toCommonJS(Icon_exports);
53
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../src/exported-related/Icon/index.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["import React from 'react';\nimport styled from 'styled-components';\n\nconst AugmentedIcon = (\n Icon: React.ComponentType<{ color: unknown; tabIndex: number }>,\n) => styled(Icon)`\n cursor: pointer;\n\n outline: 0;\n :focus,\n :active {\n outline: 1px solid #1e79c2;\n }\n`;\n\nexport const Icon = (\n IconComponent: React.ComponentType<{ color: unknown; tabIndex: number }>,\n) => (props: unknown): JSX.Element => {\n const StyledComponent = AugmentedIcon(IconComponent);\n return (\n <StyledComponent color={['brand-primary', 800]} tabIndex={0} {...props} />\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,+BAAmB;AAEnB,MAAM,gBAAgB,CACpB,UACG,sCAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUL,MAAM,OAAO,CAClB,kBACG,CAAC,UAAgC;AACpC,QAAM,kBAAkB,cAAc;AACtC,SACE,mDAAC,iBAAD;AAAA,IAAiB,OAAO,CAAC,iBAAiB;AAAA,IAAM,UAAU;AAAA,OAAO;AAAA;AAAA;",
6
+ "names": []
7
+ }
@@ -1,37 +1,48 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var _jsx = require('@babel/runtime/helpers/jsx');
6
- var React = require('react');
7
- var Grid = require('@elliemae/ds-grid');
8
- var styled = require('./styled.js');
9
- var LeftNavigationContext = require('../../LeftNavigationContext.js');
10
- var usePropsWithDefaults = require('./usePropsWithDefaults.js');
11
- var useKeyboardNavigation = require('../../hooks/useKeyboardNavigation.js');
12
- var jsxRuntime = require('react/jsx-runtime');
13
-
14
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
15
-
16
- var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
17
- var Grid__default = /*#__PURE__*/_interopDefaultLegacy(Grid);
18
-
19
- const ItemRenderer = props => {
20
- const propsWithDefault = usePropsWithDefaults.usePropsWithDefaults(props);
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __reExport = (target, module2, copyDefault, desc) => {
13
+ if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
+ for (let key of __getOwnPropNames(module2))
15
+ if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
+ __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
+ }
18
+ return target;
19
+ };
20
+ var __toESM = (module2, isNodeMode) => {
21
+ return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
+ };
23
+ var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
+ return (module2, temp) => {
25
+ return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
+ };
27
+ })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
+ var ItemRenderer_exports = {};
29
+ __export(ItemRenderer_exports, {
30
+ ItemRenderer: () => ItemRenderer
31
+ });
32
+ var React = __toESM(require("react"));
33
+ var import_react = __toESM(require("react"));
34
+ var import_ds_grid = __toESM(require("@elliemae/ds-grid"));
35
+ var import_styled = require("./styled");
36
+ var import_LeftNavigationContext = require("../../LeftNavigationContext");
37
+ var import_usePropsWithDefaults = require("./usePropsWithDefaults");
38
+ var import_hooks = require("../../hooks");
39
+ const ItemRenderer = (props) => {
40
+ const propsWithDefault = (0, import_usePropsWithDefaults.usePropsWithDefaults)(props);
21
41
  const {
22
42
  item,
23
43
  item: {
24
44
  dsId,
25
- itemOpts: {
26
- selectable,
27
- focuseable,
28
- indent,
29
- ariaLabel,
30
- ariaRole,
31
- ariaLive,
32
- ariaExpanded,
33
- ariaDescribedBy
34
- },
45
+ itemOpts: { selectable, focuseable, indent, ariaLabel, ariaRole, ariaLive, ariaExpanded, ariaDescribedBy },
35
46
  CollapsedComponent
36
47
  },
37
48
  subitems,
@@ -43,12 +54,9 @@ const ItemRenderer = props => {
43
54
  borderBottomMr,
44
55
  children
45
56
  } = propsWithDefault;
46
- const ctx = React.useContext(LeftNavigationContext.LeftNavContext);
57
+ const ctx = (0, import_react.useContext)(import_LeftNavigationContext.LeftNavContext);
47
58
  const {
48
- leftNavProps: {
49
- onItemClick,
50
- openedItem
51
- },
59
+ leftNavProps: { onItemClick, openedItem },
52
60
  expandedForAnimation,
53
61
  selectedParent,
54
62
  selectedItem,
@@ -57,72 +65,69 @@ const ItemRenderer = props => {
57
65
  visibleItemsRefs
58
66
  } = ctx;
59
67
  const opened = dsId === openedItem;
60
- const handleOnClick = React.useCallback(e => {
61
- if (onClick) onClick(); // used by uncontrolled drilldowns
62
-
68
+ const handleOnClick = (0, import_react.useCallback)((e) => {
69
+ if (onClick)
70
+ onClick();
63
71
  onItemClick(item, e);
64
- if (selectable) setSelectedItem(item.dsId);
72
+ if (selectable)
73
+ setSelectedItem(item.dsId);
65
74
  }, [onItemClick, item, setSelectedItem, selectable, onClick]);
66
- const handleFocus = React.useCallback(() => {
67
- if (focuseable) setFocusedItem(dsId);
75
+ const handleFocus = (0, import_react.useCallback)(() => {
76
+ if (focuseable)
77
+ setFocusedItem(dsId);
68
78
  }, [dsId, setFocusedItem, focuseable]);
69
- const onKeyDown = useKeyboardNavigation.useKeyboardNavigation({
79
+ const onKeyDown = (0, import_hooks.useKeyboardNavigation)({
70
80
  item,
71
81
  onClick: handleOnClick
72
82
  });
73
- const cols = React.useMemo(() => expandedForAnimation ? ['auto', '1fr', 'auto'] : ['38px'], [expandedForAnimation]);
74
- const isSelected = React.useMemo(() => selectedItem === dsId, [selectedItem, dsId]);
75
-
83
+ const cols = (0, import_react.useMemo)(() => expandedForAnimation ? ["auto", "1fr", "auto"] : ["38px"], [expandedForAnimation]);
84
+ const isSelected = (0, import_react.useMemo)(() => selectedItem === dsId, [selectedItem, dsId]);
76
85
  if (!expandedForAnimation && !CollapsedComponent) {
77
86
  return null;
78
87
  }
79
-
80
- return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
81
- children: [/*#__PURE__*/_jsx__default["default"](styled.StyledItemWrapper, {
82
- shadowStyle: shadowStyle(opened, item.type),
83
- "data-testid": "leftnav-item-wrapper"
84
- }, void 0, /*#__PURE__*/jsxRuntime.jsx(styled.StyledItem, {
85
- ref: visibleItemsRefs.current[dsId],
86
- pt: paddingTop,
87
- pl: indent === undefined ? 'xxxs' : "".concat(indent, "px"),
88
- minHeight: minHeight,
89
- shadowStyle: shadowStyle(opened, item.type),
90
- alignItems: "flex-start",
91
- cols: cols,
92
- onClick: !opened ? handleOnClick : () => null,
93
- onKeyDown: onKeyDown,
94
- selectable: selectable,
95
- selected: isSelected,
96
- selectedParent: selectedParent === dsId,
97
- opened: opened,
98
- onFocus: handleFocus,
99
- "data-testid": "leftnav-item-container",
100
- tabIndex: focuseable ? 0 : -1,
101
- "aria-describedby": ariaDescribedBy,
102
- "aria-expanded": ariaExpanded,
103
- role: ariaRole,
104
- "data-selected": isSelected,
105
- "data-selectedparent": selectedParent === dsId,
106
- "aria-label": ariaLabel,
107
- "aria-hidden": !focuseable,
108
- "aria-live": ariaLive,
109
- children: !expandedForAnimation ? /*#__PURE__*/_jsx__default["default"](Grid__default["default"], {
110
- "data-testid": "leftnav-leftcomponent",
111
- justifyContent: "center"
112
- }, void 0, /*#__PURE__*/_jsx__default["default"](CollapsedComponent, {
113
- item: item,
114
- ctx: ctx
115
- })) : children
116
- }), hasBorderBottom && /*#__PURE__*/_jsx__default["default"]("div", {
117
- style: {
118
- marginLeft: opened ? '16px' : '0px',
119
- marginRight: borderBottomMr,
120
- height: '1px',
121
- width: "calc(100% - ".concat(borderBottomMr, " - ").concat(opened ? '16px' : '0px', ")"),
122
- backgroundColor: '#E0E3E8'
123
- }
124
- })), subitems]
125
- });
88
+ return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_styled.StyledItemWrapper, {
89
+ shadowStyle: shadowStyle(opened, item.type),
90
+ "data-testid": "leftnav-item-wrapper"
91
+ }, /* @__PURE__ */ import_react.default.createElement(import_styled.StyledItem, {
92
+ ref: visibleItemsRefs.current[dsId],
93
+ pt: paddingTop,
94
+ pl: indent === void 0 ? "xxxs" : `${indent}px`,
95
+ minHeight,
96
+ shadowStyle: shadowStyle(opened, item.type),
97
+ alignItems: "flex-start",
98
+ cols,
99
+ onClick: !opened ? handleOnClick : () => null,
100
+ onKeyDown,
101
+ selectable,
102
+ selected: isSelected,
103
+ selectedParent: selectedParent === dsId,
104
+ opened,
105
+ onFocus: handleFocus,
106
+ "data-testid": "leftnav-item-container",
107
+ tabIndex: focuseable ? 0 : -1,
108
+ "aria-describedby": ariaDescribedBy,
109
+ "aria-expanded": ariaExpanded,
110
+ role: ariaRole,
111
+ "data-selected": isSelected,
112
+ "data-selectedparent": selectedParent === dsId,
113
+ "aria-label": ariaLabel,
114
+ "aria-hidden": !focuseable,
115
+ "aria-live": ariaLive
116
+ }, !expandedForAnimation ? /* @__PURE__ */ import_react.default.createElement(import_ds_grid.default, {
117
+ "data-testid": "leftnav-leftcomponent",
118
+ justifyContent: "center"
119
+ }, /* @__PURE__ */ import_react.default.createElement(CollapsedComponent, {
120
+ item,
121
+ ctx
122
+ })) : children), hasBorderBottom && /* @__PURE__ */ import_react.default.createElement("div", {
123
+ style: {
124
+ marginLeft: opened ? "16px" : "0px",
125
+ marginRight: borderBottomMr,
126
+ height: "1px",
127
+ width: `calc(100% - ${borderBottomMr} - ${opened ? "16px" : "0px"})`,
128
+ backgroundColor: "#E0E3E8"
129
+ }
130
+ })), subitems);
126
131
  };
127
-
128
- exports.ItemRenderer = ItemRenderer;
132
+ module.exports = __toCommonJS(ItemRenderer_exports);
133
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../src/exported-related/ItemRenderer/index.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["/* eslint-disable complexity */\n/* eslint-disable max-lines */\nimport React, { useContext, useMemo, useCallback } from 'react';\nimport Grid from '@elliemae/ds-grid';\nimport { StyledItemWrapper, StyledItem } from './styled';\n\nimport { ItemRendererT } from '../../index.d';\nimport { LeftNavContext } from '../../LeftNavigationContext';\nimport { usePropsWithDefaults } from './usePropsWithDefaults';\nimport { useKeyboardNavigation } from '../../hooks';\n\nexport const ItemRenderer = (props: ItemRendererT): JSX.Element => {\n const propsWithDefault = usePropsWithDefaults(props);\n const {\n item,\n item: {\n dsId,\n itemOpts: { selectable, focuseable, indent, ariaLabel, ariaRole, ariaLive, ariaExpanded, ariaDescribedBy },\n CollapsedComponent,\n },\n subitems,\n minHeight,\n paddingTop,\n onClick,\n shadowStyle,\n hasBorderBottom,\n borderBottomMr,\n children,\n } = propsWithDefault;\n\n const ctx = useContext(LeftNavContext);\n const {\n leftNavProps: { onItemClick, openedItem },\n expandedForAnimation,\n selectedParent,\n selectedItem,\n setSelectedItem,\n setFocusedItem,\n visibleItemsRefs,\n } = ctx;\n\n const opened = dsId === openedItem;\n\n const handleOnClick = useCallback(\n (e) => {\n if (onClick) onClick(); // used by uncontrolled drilldowns\n onItemClick(item, e);\n if (selectable) setSelectedItem(item.dsId);\n },\n [onItemClick, item, setSelectedItem, selectable, onClick],\n );\n\n const handleFocus = useCallback(() => {\n if (focuseable) setFocusedItem(dsId);\n }, [dsId, setFocusedItem, focuseable]);\n\n const onKeyDown = useKeyboardNavigation({\n item,\n onClick: handleOnClick,\n });\n\n const cols = useMemo(() => (expandedForAnimation ? ['auto', '1fr', 'auto'] : ['38px']), [expandedForAnimation]);\n const isSelected = useMemo(() => selectedItem === dsId, [selectedItem, dsId]);\n\n if (!expandedForAnimation && !CollapsedComponent) {\n return null;\n }\n\n return (\n <>\n <StyledItemWrapper shadowStyle={shadowStyle(opened, item.type)} data-testid=\"leftnav-item-wrapper\">\n <StyledItem\n ref={visibleItemsRefs.current[dsId]}\n pt={paddingTop}\n pl={indent === undefined ? 'xxxs' : `${indent}px`}\n minHeight={minHeight}\n shadowStyle={shadowStyle(opened, item.type)}\n alignItems=\"flex-start\"\n cols={cols}\n onClick={!opened ? handleOnClick : () => null}\n onKeyDown={onKeyDown}\n selectable={selectable}\n selected={isSelected}\n selectedParent={selectedParent === dsId}\n opened={opened}\n onFocus={handleFocus}\n data-testid=\"leftnav-item-container\"\n tabIndex={focuseable ? 0 : -1}\n aria-describedby={ariaDescribedBy}\n aria-expanded={ariaExpanded}\n role={ariaRole}\n data-selected={isSelected}\n data-selectedparent={selectedParent === dsId}\n aria-label={ariaLabel}\n aria-hidden={!focuseable}\n aria-live={ariaLive}\n >\n {!expandedForAnimation ? (\n <Grid data-testid=\"leftnav-leftcomponent\" justifyContent=\"center\">\n <CollapsedComponent item={item} ctx={ctx} />\n </Grid>\n ) : (\n children\n )}\n </StyledItem>\n {hasBorderBottom && (\n <div\n style={{\n marginLeft: opened ? '16px' : '0px',\n marginRight: borderBottomMr,\n height: '1px',\n width: `calc(100% - ${borderBottomMr} - ${opened ? '16px' : '0px'})`,\n backgroundColor: '#E0E3E8',\n }}\n />\n )}\n </StyledItemWrapper>\n {subitems}\n </>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,mBAAwD;AACxD,qBAAiB;AACjB,oBAA8C;AAG9C,mCAA+B;AAC/B,kCAAqC;AACrC,mBAAsC;AAE/B,MAAM,eAAe,CAAC,UAAsC;AACjE,QAAM,mBAAmB,sDAAqB;AAC9C,QAAM;AAAA,IACJ;AAAA,IACA,MAAM;AAAA,MACJ;AAAA,MACA,UAAU,EAAE,YAAY,YAAY,QAAQ,WAAW,UAAU,UAAU,cAAc;AAAA,MACzF;AAAA;AAAA,IAEF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MACE;AAEJ,QAAM,MAAM,6BAAW;AACvB,QAAM;AAAA,IACJ,cAAc,EAAE,aAAa;AAAA,IAC7B;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MACE;AAEJ,QAAM,SAAS,SAAS;AAExB,QAAM,gBAAgB,8BACpB,CAAC,MAAM;AACL,QAAI;AAAS;AACb,gBAAY,MAAM;AAClB,QAAI;AAAY,sBAAgB,KAAK;AAAA,KAEvC,CAAC,aAAa,MAAM,iBAAiB,YAAY;AAGnD,QAAM,cAAc,8BAAY,MAAM;AACpC,QAAI;AAAY,qBAAe;AAAA,KAC9B,CAAC,MAAM,gBAAgB;AAE1B,QAAM,YAAY,wCAAsB;AAAA,IACtC;AAAA,IACA,SAAS;AAAA;AAGX,QAAM,OAAO,0BAAQ,MAAO,uBAAuB,CAAC,QAAQ,OAAO,UAAU,CAAC,SAAU,CAAC;AACzF,QAAM,aAAa,0BAAQ,MAAM,iBAAiB,MAAM,CAAC,cAAc;AAEvE,MAAI,CAAC,wBAAwB,CAAC,oBAAoB;AAChD,WAAO;AAAA;AAGT,SACE,wFACE,mDAAC,iCAAD;AAAA,IAAmB,aAAa,YAAY,QAAQ,KAAK;AAAA,IAAO,eAAY;AAAA,KAC1E,mDAAC,0BAAD;AAAA,IACE,KAAK,iBAAiB,QAAQ;AAAA,IAC9B,IAAI;AAAA,IACJ,IAAI,WAAW,SAAY,SAAS,GAAG;AAAA,IACvC;AAAA,IACA,aAAa,YAAY,QAAQ,KAAK;AAAA,IACtC,YAAW;AAAA,IACX;AAAA,IACA,SAAS,CAAC,SAAS,gBAAgB,MAAM;AAAA,IACzC;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV,gBAAgB,mBAAmB;AAAA,IACnC;AAAA,IACA,SAAS;AAAA,IACT,eAAY;AAAA,IACZ,UAAU,aAAa,IAAI;AAAA,IAC3B,oBAAkB;AAAA,IAClB,iBAAe;AAAA,IACf,MAAM;AAAA,IACN,iBAAe;AAAA,IACf,uBAAqB,mBAAmB;AAAA,IACxC,cAAY;AAAA,IACZ,eAAa,CAAC;AAAA,IACd,aAAW;AAAA,KAEV,CAAC,uBACA,mDAAC,wBAAD;AAAA,IAAM,eAAY;AAAA,IAAwB,gBAAe;AAAA,KACvD,mDAAC,oBAAD;AAAA,IAAoB;AAAA,IAAY;AAAA,QAGlC,WAGH,mBACC,mDAAC,OAAD;AAAA,IACE,OAAO;AAAA,MACL,YAAY,SAAS,SAAS;AAAA,MAC9B,aAAa;AAAA,MACb,QAAQ;AAAA,MACR,OAAO,eAAe,oBAAoB,SAAS,SAAS;AAAA,MAC5D,iBAAiB;AAAA;AAAA,OAKxB;AAAA;",
6
+ "names": []
7
+ }
@@ -1,58 +1,90 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var Grid = require('@elliemae/ds-grid');
6
- var styled = require('styled-components');
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __reExport = (target, module2, copyDefault, desc) => {
13
+ if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
+ for (let key of __getOwnPropNames(module2))
15
+ if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
+ __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
+ }
18
+ return target;
19
+ };
20
+ var __toESM = (module2, isNodeMode) => {
21
+ return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
+ };
23
+ var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
+ return (module2, temp) => {
25
+ return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
+ };
27
+ })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
+ var styled_exports = {};
29
+ __export(styled_exports, {
30
+ StyledItem: () => StyledItem,
31
+ StyledItemWrapper: () => StyledItemWrapper,
32
+ borderOutside: () => borderOutside
33
+ });
34
+ var React = __toESM(require("react"));
35
+ var import_ds_grid = __toESM(require("@elliemae/ds-grid"));
36
+ var import_styled_components = __toESM(require("styled-components"));
37
+ const borderOutside = (color, weight = 2) => `&:before {
38
+ content: '';
39
+ position: absolute;
40
+ top: 0;
41
+ left: 0;
42
+ right: 0;
43
+ bottom: 0;
44
+ border: ${weight}px solid ${color};
45
+ pointer-events: none;
46
+ }`;
47
+ const StyledItemWrapper = (0, import_styled_components.default)(import_ds_grid.default)`
48
+ position: relative;
49
+ ${(props) => props.shadowStyle(props.theme)}
50
+ `;
51
+ const getItemBackground = ({ selectable, opened, selected, theme }) => {
52
+ if (!selectable)
53
+ return "white";
54
+ if (selected && !opened)
55
+ return theme.colors.brand[200];
56
+ return theme.colors.neutral["000"];
57
+ };
58
+ const getItemHoverBackground = ({ selectable, opened, selected, theme }) => {
59
+ if (!selectable)
60
+ return "white";
61
+ if (selected && !opened)
62
+ return theme.colors.brand[200];
63
+ return theme.colors.brand["200"];
64
+ };
65
+ const StyledItem = (0, import_styled_components.default)(import_ds_grid.default)`
66
+ cursor: ${(props) => props.selectable && !props.opened ? "pointer" : "auto"};
67
+ min-height: ${(props) => props.minHeight};
7
68
 
8
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
69
+ background: ${getItemBackground};
9
70
 
10
- var Grid__default = /*#__PURE__*/_interopDefaultLegacy(Grid);
11
- var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
71
+ ${(props) => props.selected && !props.opened ? borderOutside(props.theme.colors.brand[500], 1) : ""}
12
72
 
13
- /* eslint-disable indent */
14
- const borderOutside = function (color) {
15
- let weight = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 2;
16
- return "&:before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n border: ".concat(weight, "px solid ").concat(color, ";\n pointer-events: none;\n}");
17
- };
18
- const StyledItemWrapper = /*#__PURE__*/styled__default["default"](Grid__default["default"]).withConfig({
19
- componentId: "sc-11wzgfh-0"
20
- })(["position:relative;", ""], props => props.shadowStyle(props.theme));
73
+ :hover {
74
+ background: ${getItemHoverBackground};
75
+ }
21
76
 
22
- const getItemBackground = _ref => {
23
- let {
24
- selectable,
25
- opened,
26
- selected,
27
- theme
28
- } = _ref;
29
- if (!selectable) return 'white';
30
- if (selected && !opened) return theme.colors.brand[200];
31
- return theme.colors.neutral['000'];
32
- };
77
+ :active {
78
+ background: ${({ selectable, theme }) => selectable ? theme.colors.brand[200] : "white"};
79
+ }
33
80
 
34
- const getItemHoverBackground = _ref2 => {
35
- let {
36
- selectable,
37
- opened,
38
- selected,
39
- theme
40
- } = _ref2;
41
- if (!selectable) return 'white';
42
- if (selected && !opened) return theme.colors.brand[200];
43
- return theme.colors.brand['200'];
44
- };
81
+ ${(props) => props.shadowStyle(props.theme)};
45
82
 
46
- const StyledItem = /*#__PURE__*/styled__default["default"](Grid__default["default"]).withConfig({
47
- componentId: "sc-11wzgfh-1"
48
- })(["cursor:", ";min-height:", ";background:", ";", ":hover{background:", ";}:active{background:", ";}", ";outline:none;", ""], props => props.selectable && !props.opened ? 'pointer' : 'auto', props => props.minHeight, getItemBackground, props => props.selected && !props.opened ? borderOutside(props.theme.colors.brand[500], 1) : '', getItemHoverBackground, _ref3 => {
49
- let {
50
- selectable,
51
- theme
52
- } = _ref3;
53
- return selectable ? theme.colors.brand[200] : 'white';
54
- }, props => props.shadowStyle(props.theme), props => props.tabIndex !== -1 ? ":focus {\n ".concat(borderOutside(props.theme.colors.brand[700]), "\n }") : '');
83
+ outline: none;
55
84
 
56
- exports.StyledItem = StyledItem;
57
- exports.StyledItemWrapper = StyledItemWrapper;
58
- exports.borderOutside = borderOutside;
85
+ ${(props) => props.tabIndex !== -1 ? `:focus {
86
+ ${borderOutside(props.theme.colors.brand[700])}
87
+ }` : ""}
88
+ `;
89
+ module.exports = __toCommonJS(styled_exports);
90
+ //# sourceMappingURL=styled.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../src/exported-related/ItemRenderer/styled.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["/* eslint-disable indent */\n/* eslint-disable @typescript-eslint/no-explicit-any */\nimport Grid from '@elliemae/ds-grid';\nimport styled from 'styled-components';\n\ninterface ItemProps {\n selected: boolean;\n selectable: boolean;\n opened: boolean;\n theme: any;\n shadowStyle: (theme: any) => string;\n}\n\nexport const borderOutside = (color, weight = 2): string => `&:before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n border: ${weight}px solid ${color};\n pointer-events: none;\n}`;\n\nexport const StyledItemWrapper = styled(Grid)<{\n shadowStyle: (theme: any) => string;\n}>`\n position: relative;\n ${(props) => props.shadowStyle(props.theme)}\n`;\n\nconst getItemBackground = ({ selectable, opened, selected, theme }: ItemProps) => {\n if (!selectable) return 'white';\n if (selected && !opened) return theme.colors.brand[200];\n return theme.colors.neutral['000'];\n};\n\nconst getItemHoverBackground = ({ selectable, opened, selected, theme }: ItemProps) => {\n if (!selectable) return 'white';\n if (selected && !opened) return theme.colors.brand[200];\n return theme.colors.brand['200'];\n};\n\nexport const StyledItem = styled(Grid)<{ minHeight: string } & ItemProps>`\n cursor: ${(props) => (props.selectable && !props.opened ? 'pointer' : 'auto')};\n min-height: ${(props) => props.minHeight};\n\n background: ${getItemBackground};\n\n ${(props) => (props.selected && !props.opened ? borderOutside(props.theme.colors.brand[500], 1) : '')}\n\n :hover {\n background: ${getItemHoverBackground};\n }\n\n :active {\n background: ${({ selectable, theme }) => (selectable ? theme.colors.brand[200] : 'white')};\n }\n\n ${(props) => props.shadowStyle(props.theme)};\n\n outline: none;\n\n ${(props) =>\n props.tabIndex !== -1\n ? `:focus {\n ${borderOutside(props.theme.colors.brand[700])}\n }`\n : ''}\n`;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,qBAAiB;AACjB,+BAAmB;AAUZ,MAAM,gBAAgB,CAAC,OAAO,SAAS,MAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAOhD,kBAAkB;AAAA;AAAA;AAIvB,MAAM,oBAAoB,sCAAO;AAAA;AAAA,IAIpC,CAAC,UAAU,MAAM,YAAY,MAAM;AAAA;AAGvC,MAAM,oBAAoB,CAAC,EAAE,YAAY,QAAQ,UAAU,YAAuB;AAChF,MAAI,CAAC;AAAY,WAAO;AACxB,MAAI,YAAY,CAAC;AAAQ,WAAO,MAAM,OAAO,MAAM;AACnD,SAAO,MAAM,OAAO,QAAQ;AAAA;AAG9B,MAAM,yBAAyB,CAAC,EAAE,YAAY,QAAQ,UAAU,YAAuB;AACrF,MAAI,CAAC;AAAY,WAAO;AACxB,MAAI,YAAY,CAAC;AAAQ,WAAO,MAAM,OAAO,MAAM;AACnD,SAAO,MAAM,OAAO,MAAM;AAAA;AAGrB,MAAM,aAAa,sCAAO;AAAA,YACrB,CAAC,UAAW,MAAM,cAAc,CAAC,MAAM,SAAS,YAAY;AAAA,gBACxD,CAAC,UAAU,MAAM;AAAA;AAAA,gBAEjB;AAAA;AAAA,IAEZ,CAAC,UAAW,MAAM,YAAY,CAAC,MAAM,SAAS,cAAc,MAAM,MAAM,OAAO,MAAM,MAAM,KAAK;AAAA;AAAA;AAAA,kBAGlF;AAAA;AAAA;AAAA;AAAA,kBAIA,CAAC,EAAE,YAAY,YAAa,aAAa,MAAM,OAAO,MAAM,OAAO;AAAA;AAAA;AAAA,IAGjF,CAAC,UAAU,MAAM,YAAY,MAAM;AAAA;AAAA;AAAA;AAAA,IAInC,CAAC,UACD,MAAM,aAAa,KACf;AAAA,MACF,cAAc,MAAM,MAAM,OAAO,MAAM;AAAA,aAErC;AAAA;",
6
+ "names": []
7
+ }
@@ -1,57 +1,69 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- require('core-js/modules/esnext.async-iterator.filter.js');
6
- require('core-js/modules/esnext.iterator.constructor.js');
7
- require('core-js/modules/esnext.iterator.filter.js');
8
- require('core-js/modules/esnext.async-iterator.for-each.js');
9
- require('core-js/modules/esnext.iterator.for-each.js');
10
- var _defineProperty = require('@babel/runtime/helpers/defineProperty');
11
- var React = require('react');
12
-
13
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
14
-
15
- var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
16
-
17
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
18
-
19
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __reExport = (target, module2, copyDefault, desc) => {
13
+ if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
+ for (let key of __getOwnPropNames(module2))
15
+ if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
+ __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
+ }
18
+ return target;
19
+ };
20
+ var __toESM = (module2, isNodeMode) => {
21
+ return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
+ };
23
+ var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
+ return (module2, temp) => {
25
+ return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
+ };
27
+ })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
+ var usePropsWithDefaults_exports = {};
29
+ __export(usePropsWithDefaults_exports, {
30
+ usePropsWithDefaults: () => usePropsWithDefaults
31
+ });
32
+ var React = __toESM(require("react"));
33
+ var import_react = require("react");
20
34
  const itemDefaultProps = {
21
- label: '',
22
- labelOverflow: 'truncate',
35
+ label: "",
36
+ labelOverflow: "truncate",
23
37
  selectable: true,
24
38
  focuseable: true,
25
39
  openable: false,
26
40
  closable: false,
27
- ariaLabel: '',
28
- ariaRole: 'menuitem',
29
- ariaLive: 'off',
30
- ariaExpanded: undefined,
31
- ariaDescribedBy: undefined
41
+ ariaLabel: "",
42
+ ariaRole: "menuitem",
43
+ ariaLive: "off",
44
+ ariaExpanded: void 0,
45
+ ariaDescribedBy: void 0
32
46
  };
33
- const itemWithoutShadows = ['ds-left-nav-item-header', 'ds-left-nav-item-link', 'ds-left-nav-item-submenu']; // Make use Item props with defaults
34
-
35
- const usePropsWithDefaults = props => {
36
- const propsWithDefault = React.useMemo(() => {
37
- const itemWithDefaults = _objectSpread(_objectSpread({
38
- CollapsedComponent: () => null
39
- }, props.item), {}, {
40
- itemOpts: _objectSpread(_objectSpread({}, itemDefaultProps), props.item.itemOpts)
41
- });
42
-
43
- return _objectSpread(_objectSpread({
44
- minHeight: '48px',
45
- paddingTop: '12px',
47
+ const itemWithoutShadows = ["ds-left-nav-item-header", "ds-left-nav-item-link", "ds-left-nav-item-submenu"];
48
+ const usePropsWithDefaults = (props) => {
49
+ const propsWithDefault = (0, import_react.useMemo)(() => {
50
+ const itemWithDefaults = {
51
+ CollapsedComponent: () => null,
52
+ ...props.item,
53
+ itemOpts: { ...itemDefaultProps, ...props.item.itemOpts }
54
+ };
55
+ return {
56
+ minHeight: "48px",
57
+ paddingTop: "12px",
46
58
  subitems: [],
47
- shadowStyle: (opened, type) => theme => "box-shadow: ".concat(opened || !itemWithoutShadows.includes(type) ? 'inset 4px 0 0 0 #52A6EC' : 'inset 4px 0 0 0 white'),
59
+ shadowStyle: (opened, type) => (theme) => `box-shadow: ${opened || !itemWithoutShadows.includes(type) ? "inset 4px 0 0 0 #52A6EC" : "inset 4px 0 0 0 white"}`,
48
60
  hasBorderBottom: false,
49
- borderBottomMr: '0px'
50
- }, props), {}, {
61
+ borderBottomMr: "0px",
62
+ ...props,
51
63
  item: itemWithDefaults
52
- });
64
+ };
53
65
  }, [props]);
54
66
  return propsWithDefault;
55
67
  };
56
-
57
- exports.usePropsWithDefaults = usePropsWithDefaults;
68
+ module.exports = __toCommonJS(usePropsWithDefaults_exports);
69
+ //# sourceMappingURL=usePropsWithDefaults.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../src/exported-related/ItemRenderer/usePropsWithDefaults.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["import { useMemo } from 'react';\nimport { itemOptsT, ItemRendererT } from '../../index.d';\n\nconst itemDefaultProps: itemOptsT = {\n label: '',\n labelOverflow: 'truncate',\n selectable: true,\n focuseable: true,\n openable: false,\n closable: false,\n ariaLabel: '',\n ariaRole: 'menuitem',\n ariaLive: 'off',\n ariaExpanded: undefined,\n ariaDescribedBy: undefined,\n};\n\nconst itemWithoutShadows = ['ds-left-nav-item-header', 'ds-left-nav-item-link', 'ds-left-nav-item-submenu'];\n\n// Make use Item props with defaults\nexport const usePropsWithDefaults = (props: ItemRendererT): ItemRendererT => {\n const propsWithDefault = useMemo(() => {\n const itemWithDefaults = {\n CollapsedComponent: () => null,\n ...props.item,\n itemOpts: { ...itemDefaultProps, ...props.item.itemOpts },\n };\n return {\n minHeight: '48px',\n paddingTop: '12px',\n subitems: [],\n shadowStyle: (opened: boolean, type: string) => (theme: any) =>\n `box-shadow: ${\n opened || !itemWithoutShadows.includes(type) ? 'inset 4px 0 0 0 #52A6EC' : 'inset 4px 0 0 0 white'\n }`,\n hasBorderBottom: false,\n borderBottomMr: '0px',\n ...props,\n item: itemWithDefaults,\n };\n }, [props]);\n\n return propsWithDefault;\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAwB;AAGxB,MAAM,mBAA8B;AAAA,EAClC,OAAO;AAAA,EACP,eAAe;AAAA,EACf,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,UAAU;AAAA,EACV,WAAW;AAAA,EACX,UAAU;AAAA,EACV,UAAU;AAAA,EACV,cAAc;AAAA,EACd,iBAAiB;AAAA;AAGnB,MAAM,qBAAqB,CAAC,2BAA2B,yBAAyB;AAGzE,MAAM,uBAAuB,CAAC,UAAwC;AAC3E,QAAM,mBAAmB,0BAAQ,MAAM;AACrC,UAAM,mBAAmB;AAAA,MACvB,oBAAoB,MAAM;AAAA,SACvB,MAAM;AAAA,MACT,UAAU,KAAK,qBAAqB,MAAM,KAAK;AAAA;AAEjD,WAAO;AAAA,MACL,WAAW;AAAA,MACX,YAAY;AAAA,MACZ,UAAU;AAAA,MACV,aAAa,CAAC,QAAiB,SAAiB,CAAC,UAC/C,eACE,UAAU,CAAC,mBAAmB,SAAS,QAAQ,4BAA4B;AAAA,MAE/E,iBAAiB;AAAA,MACjB,gBAAgB;AAAA,SACb;AAAA,MACH,MAAM;AAAA;AAAA,KAEP,CAAC;AAEJ,SAAO;AAAA;",
6
+ "names": []
7
+ }