@elliemae/ds-shared 2.2.1 → 2.3.0-alpha.4

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 (212) hide show
  1. package/cjs/Animations/BaseAnimation.js +55 -35
  2. package/cjs/Animations/BaseAnimation.js.map +7 -0
  3. package/cjs/Animations/Grow.js +54 -41
  4. package/cjs/Animations/Grow.js.map +7 -0
  5. package/cjs/Animations/GrowRight.js +63 -41
  6. package/cjs/Animations/GrowRight.js.map +7 -0
  7. package/cjs/Animations/GrowVertical.js +47 -7
  8. package/cjs/Animations/GrowVertical.js.map +7 -0
  9. package/cjs/CheckableGroup.js +67 -65
  10. package/cjs/CheckableGroup.js.map +7 -0
  11. package/cjs/DeferRenderAfterComputation.js +48 -24
  12. package/cjs/DeferRenderAfterComputation.js.map +7 -0
  13. package/cjs/FocusGroup/FocusGrid.js +108 -143
  14. package/cjs/FocusGroup/FocusGrid.js.map +7 -0
  15. package/cjs/FocusGroup/FocusGroup.js +88 -147
  16. package/cjs/FocusGroup/FocusGroup.js.map +7 -0
  17. package/cjs/FocusGroup/FocusGroupContext.js +38 -11
  18. package/cjs/FocusGroup/FocusGroupContext.js.map +7 -0
  19. package/cjs/FocusGroup/FocusGroupManager.js +56 -47
  20. package/cjs/FocusGroup/FocusGroupManager.js.map +7 -0
  21. package/cjs/FocusGroup/focusGroupManagerHoc.js +52 -42
  22. package/cjs/FocusGroup/focusGroupManagerHoc.js.map +7 -0
  23. package/cjs/FocusGroup/index.js +47 -21
  24. package/cjs/FocusGroup/index.js.map +7 -0
  25. package/cjs/FocusGroup/useFocusGroupItem.js +59 -51
  26. package/cjs/FocusGroup/useFocusGroupItem.js.map +7 -0
  27. package/cjs/FocusGroup/utils/getNextCellPosition.js +47 -27
  28. package/cjs/FocusGroup/utils/getNextCellPosition.js.map +7 -0
  29. package/cjs/GroupContext/Group.js +64 -73
  30. package/cjs/GroupContext/Group.js.map +7 -0
  31. package/cjs/GroupContext/GroupContext.js +36 -13
  32. package/cjs/GroupContext/GroupContext.js.map +7 -0
  33. package/cjs/GroupContext/GroupItem.js +39 -21
  34. package/cjs/GroupContext/GroupItem.js.map +7 -0
  35. package/cjs/GroupContext/index.js +39 -13
  36. package/cjs/GroupContext/index.js.map +7 -0
  37. package/cjs/ScrollSync/ScrollSync.js +60 -75
  38. package/cjs/ScrollSync/ScrollSync.js.map +7 -0
  39. package/cjs/ScrollSync/ScrollSyncPane.js +52 -60
  40. package/cjs/ScrollSync/ScrollSyncPane.js.map +7 -0
  41. package/cjs/ScrollSync/ScrollSyncProvider.js +103 -50
  42. package/cjs/ScrollSync/ScrollSyncProvider.js.map +7 -0
  43. package/cjs/ScrollSync/index.js +37 -11
  44. package/cjs/ScrollSync/index.js.map +7 -0
  45. package/cjs/ScrollSync/useScrollSync.js +38 -7
  46. package/cjs/ScrollSync/useScrollSync.js.map +7 -0
  47. package/cjs/constants.js +65 -46
  48. package/cjs/constants.js.map +7 -0
  49. package/cjs/createDataInstance/createInstancePlugin.js +41 -29
  50. package/cjs/createDataInstance/createInstancePlugin.js.map +7 -0
  51. package/cjs/createDataInstance/createInstanceRef.js +66 -71
  52. package/cjs/createDataInstance/createInstanceRef.js.map +7 -0
  53. package/cjs/createDataInstance/utils.js +76 -100
  54. package/cjs/createDataInstance/utils.js.map +7 -0
  55. package/cjs/defer-render-hoc/index.js +48 -41
  56. package/cjs/defer-render-hoc/index.js.map +7 -0
  57. package/cjs/dimsum.config.js +38 -6
  58. package/cjs/dimsum.config.js.map +7 -0
  59. package/cjs/index.js +40 -17
  60. package/cjs/index.js.map +7 -0
  61. package/cjs/prop-types.js +106 -49
  62. package/cjs/prop-types.js.map +7 -0
  63. package/cjs/react-spring/index.js +28 -14
  64. package/cjs/react-spring/index.js.map +7 -0
  65. package/cjs/react-spring/renderprops.js +28 -14
  66. package/cjs/react-spring/renderprops.js.map +7 -0
  67. package/cjs/toolbar/ToolbarProvider.js +82 -94
  68. package/cjs/toolbar/ToolbarProvider.js.map +7 -0
  69. package/cjs/useDataGrid/VolatileRowsListener.js +38 -13
  70. package/cjs/useDataGrid/VolatileRowsListener.js.map +7 -0
  71. package/cjs/useDataGrid/index.js +36 -7
  72. package/cjs/useDataGrid/index.js.map +7 -0
  73. package/cjs/useDataGrid/initColumnDefinition.js +105 -110
  74. package/cjs/useDataGrid/initColumnDefinition.js.map +7 -0
  75. package/cjs/useDataGrid/useDataGrid.js +122 -148
  76. package/cjs/useDataGrid/useDataGrid.js.map +7 -0
  77. package/cjs/useDataList/index.js +36 -7
  78. package/cjs/useDataList/index.js.map +7 -0
  79. package/cjs/useDataList/recordIterator.js +42 -18
  80. package/cjs/useDataList/recordIterator.js.map +7 -0
  81. package/cjs/useDataList/useDataList.js +74 -83
  82. package/cjs/useDataList/useDataList.js.map +7 -0
  83. package/cjs/utils.js +71 -80
  84. package/cjs/utils.js.map +7 -0
  85. package/cjs/virtualization/AutoHeightList.js +62 -54
  86. package/cjs/virtualization/AutoHeightList.js.map +7 -0
  87. package/cjs/virtualization/FluidHeightList.js +42 -48
  88. package/cjs/virtualization/FluidHeightList.js.map +7 -0
  89. package/cjs/virtualization/index.js +48 -20
  90. package/cjs/virtualization/index.js.map +7 -0
  91. package/esm/Animations/BaseAnimation.js +26 -29
  92. package/esm/Animations/BaseAnimation.js.map +7 -0
  93. package/esm/Animations/Grow.js +25 -35
  94. package/esm/Animations/Grow.js.map +7 -0
  95. package/esm/Animations/GrowRight.js +34 -35
  96. package/esm/Animations/GrowRight.js.map +7 -0
  97. package/esm/Animations/GrowVertical.js +29 -4
  98. package/esm/Animations/GrowVertical.js.map +7 -0
  99. package/esm/CheckableGroup.js +35 -52
  100. package/esm/CheckableGroup.js.map +7 -0
  101. package/esm/DeferRenderAfterComputation.js +16 -15
  102. package/esm/DeferRenderAfterComputation.js.map +7 -0
  103. package/esm/FocusGroup/FocusGrid.js +64 -117
  104. package/esm/FocusGroup/FocusGrid.js.map +7 -0
  105. package/esm/FocusGroup/FocusGroup.js +56 -137
  106. package/esm/FocusGroup/FocusGroup.js.map +7 -0
  107. package/esm/FocusGroup/FocusGroupContext.js +9 -5
  108. package/esm/FocusGroup/FocusGroupContext.js.map +7 -0
  109. package/esm/FocusGroup/FocusGroupManager.js +24 -38
  110. package/esm/FocusGroup/FocusGroupManager.js.map +7 -0
  111. package/esm/FocusGroup/focusGroupManagerHoc.js +24 -36
  112. package/esm/FocusGroup/focusGroupManagerHoc.js.map +7 -0
  113. package/esm/FocusGroup/index.js +18 -6
  114. package/esm/FocusGroup/index.js.map +7 -0
  115. package/esm/FocusGroup/useFocusGroupItem.js +28 -40
  116. package/esm/FocusGroup/useFocusGroupItem.js.map +7 -0
  117. package/esm/FocusGroup/utils/getNextCellPosition.js +18 -25
  118. package/esm/FocusGroup/utils/getNextCellPosition.js.map +7 -0
  119. package/esm/GroupContext/Group.js +34 -66
  120. package/esm/GroupContext/Group.js.map +7 -0
  121. package/esm/GroupContext/GroupContext.js +7 -5
  122. package/esm/GroupContext/GroupContext.js.map +7 -0
  123. package/esm/GroupContext/GroupItem.js +10 -15
  124. package/esm/GroupContext/GroupItem.js.map +7 -0
  125. package/esm/GroupContext/index.js +10 -3
  126. package/esm/GroupContext/index.js.map +7 -0
  127. package/esm/ScrollSync/ScrollSync.js +30 -64
  128. package/esm/ScrollSync/ScrollSync.js.map +7 -0
  129. package/esm/ScrollSync/ScrollSyncPane.js +22 -52
  130. package/esm/ScrollSync/ScrollSyncPane.js.map +7 -0
  131. package/esm/ScrollSync/ScrollSyncProvider.js +74 -42
  132. package/esm/ScrollSync/ScrollSyncProvider.js.map +7 -0
  133. package/esm/ScrollSync/index.js +8 -2
  134. package/esm/ScrollSync/index.js.map +7 -0
  135. package/esm/ScrollSync/useScrollSync.js +9 -5
  136. package/esm/ScrollSync/useScrollSync.js.map +7 -0
  137. package/esm/constants.js +37 -28
  138. package/esm/constants.js.map +7 -0
  139. package/esm/createDataInstance/createInstancePlugin.js +12 -23
  140. package/esm/createDataInstance/createInstancePlugin.js.map +7 -0
  141. package/esm/createDataInstance/createInstanceRef.js +36 -59
  142. package/esm/createDataInstance/createInstanceRef.js.map +7 -0
  143. package/esm/createDataInstance/utils.js +48 -85
  144. package/esm/createDataInstance/utils.js.map +7 -0
  145. package/esm/defer-render-hoc/index.js +17 -31
  146. package/esm/defer-render-hoc/index.js.map +7 -0
  147. package/esm/dimsum.config.js +9 -4
  148. package/esm/dimsum.config.js.map +7 -0
  149. package/esm/index.js +11 -5
  150. package/esm/index.js.map +7 -0
  151. package/esm/prop-types.js +75 -31
  152. package/esm/prop-types.js.map +7 -0
  153. package/esm/react-spring/index.js +3 -1
  154. package/esm/react-spring/index.js.map +7 -0
  155. package/esm/react-spring/renderprops.js +3 -1
  156. package/esm/react-spring/renderprops.js.map +7 -0
  157. package/esm/toolbar/ToolbarProvider.js +45 -74
  158. package/esm/toolbar/ToolbarProvider.js.map +7 -0
  159. package/esm/useDataGrid/VolatileRowsListener.js +9 -11
  160. package/esm/useDataGrid/VolatileRowsListener.js.map +7 -0
  161. package/esm/useDataGrid/index.js +7 -1
  162. package/esm/useDataGrid/index.js.map +7 -0
  163. package/esm/useDataGrid/initColumnDefinition.js +78 -94
  164. package/esm/useDataGrid/initColumnDefinition.js.map +7 -0
  165. package/esm/useDataGrid/useDataGrid.js +82 -99
  166. package/esm/useDataGrid/useDataGrid.js.map +7 -0
  167. package/esm/useDataList/index.js +7 -1
  168. package/esm/useDataList/index.js.map +7 -0
  169. package/esm/useDataList/recordIterator.js +13 -14
  170. package/esm/useDataList/recordIterator.js.map +7 -0
  171. package/esm/useDataList/useDataList.js +44 -67
  172. package/esm/useDataList/useDataList.js.map +7 -0
  173. package/esm/utils.js +42 -59
  174. package/esm/utils.js.map +7 -0
  175. package/esm/virtualization/AutoHeightList.js +28 -40
  176. package/esm/virtualization/AutoHeightList.js.map +7 -0
  177. package/esm/virtualization/FluidHeightList.js +14 -38
  178. package/esm/virtualization/FluidHeightList.js.map +7 -0
  179. package/esm/virtualization/index.js +19 -16
  180. package/esm/virtualization/index.js.map +7 -0
  181. package/package.json +3 -3
  182. package/types/Animations/BaseAnimation.d.ts +1 -0
  183. package/types/Animations/Grow.d.ts +1 -0
  184. package/types/Animations/GrowRight.d.ts +1 -0
  185. package/types/CheckableGroup.d.ts +1 -0
  186. package/types/DeferRenderAfterComputation.d.ts +3 -2
  187. package/types/FocusGroup/FocusGrid.d.ts +5 -3
  188. package/types/FocusGroup/FocusGroup.d.ts +3 -1
  189. package/types/FocusGroup/FocusGroupContext.d.ts +3 -2
  190. package/types/FocusGroup/FocusGroupManager.d.ts +3 -1
  191. package/types/FocusGroup/focusGroupManagerHoc.d.ts +3 -1
  192. package/types/FocusGroup/index.d.ts +6 -6
  193. package/types/FocusGroup/useFocusGroupItem.d.ts +3 -1
  194. package/types/FocusGroup/utils/getNextCellPosition.d.ts +3 -1
  195. package/types/GroupContext/Group.d.ts +1 -0
  196. package/types/GroupContext/GroupItem.d.ts +1 -0
  197. package/types/GroupContext/index.d.ts +3 -3
  198. package/types/ScrollSync/ScrollSync.d.ts +4 -2
  199. package/types/ScrollSync/ScrollSyncPane.d.ts +2 -2
  200. package/types/ScrollSync/index.d.ts +2 -2
  201. package/types/ScrollSync/useScrollSync.d.ts +6 -5
  202. package/types/createDataInstance/createInstancePlugin.d.ts +2 -1
  203. package/types/createDataInstance/createInstanceRef.d.ts +3 -1
  204. package/types/dimsum.config.d.ts +3 -2
  205. package/types/index.d.ts +2 -2
  206. package/types/toolbar/ToolbarProvider.d.ts +3 -8
  207. package/types/useDataGrid/VolatileRowsListener.d.ts +3 -1
  208. package/types/useDataGrid/index.d.ts +1 -1
  209. package/types/useDataGrid/initColumnDefinition.d.ts +2 -1
  210. package/types/useDataGrid/useDataGrid.d.ts +3 -2
  211. package/types/useDataList/index.d.ts +1 -1
  212. package/types/useDataList/useDataList.d.ts +3 -2
@@ -1,47 +1,50 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var _jsx = require('@babel/runtime/helpers/jsx');
6
- var _defineProperty = require('@babel/runtime/helpers/defineProperty');
7
- require('core-js/modules/esnext.async-iterator.for-each.js');
8
- require('core-js/modules/esnext.iterator.constructor.js');
9
- require('core-js/modules/esnext.iterator.for-each.js');
10
- require('core-js/modules/esnext.async-iterator.filter.js');
11
- require('core-js/modules/esnext.iterator.filter.js');
12
- var React = require('react');
13
- var dsUtilities = require('@elliemae/ds-utilities');
14
- var getNextCellPosition = require('./utils/getNextCellPosition.js');
15
-
16
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
17
-
18
- var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
19
- var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
20
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
21
-
22
- 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; }
23
-
24
- 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; }
25
- const FocusGridContext = /*#__PURE__*/React.createContext();
26
- const {
27
- Provider
28
- } = FocusGridContext;
29
-
30
- const preventDefault = e => e.preventDefault();
31
-
32
- function registerHotKeysHooks(hotKeys, _ref) {
33
- let {
34
- focusedRow,
35
- focusedCell
36
- } = _ref;
37
- Object.keys(hotKeys).forEach(key => {
38
- const {
39
- handler,
40
- options
41
- } = hotKeys[key];
42
- dsUtilities.useHotkeys({
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 FocusGrid_exports = {};
29
+ __export(FocusGrid_exports, {
30
+ FocusGrid: () => FocusGridProvider,
31
+ FocusGridContext: () => FocusGridContext,
32
+ FocusGridProvider: () => FocusGridProvider,
33
+ default: () => FocusGrid_default
34
+ });
35
+ var React = __toESM(require("react"));
36
+ var import_react = __toESM(require("react"));
37
+ var import_ds_utilities = require("@elliemae/ds-utilities");
38
+ var import_getNextCellPosition = require("./utils/getNextCellPosition");
39
+ const FocusGridContext = (0, import_react.createContext)();
40
+ const { Provider } = FocusGridContext;
41
+ const preventDefault = (e) => e.preventDefault();
42
+ function registerHotKeysHooks(hotKeys, { focusedRow, focusedCell }) {
43
+ Object.keys(hotKeys).forEach((key) => {
44
+ const { handler, options } = hotKeys[key];
45
+ (0, import_ds_utilities.useHotkeys)({
43
46
  keys: key,
44
- handler: e => {
47
+ handler: (e) => {
45
48
  e.preventDefault();
46
49
  handler({
47
50
  rowIndex: focusedRow.current,
@@ -51,76 +54,59 @@ function registerHotKeysHooks(hotKeys, _ref) {
51
54
  options
52
55
  });
53
56
  });
54
- } // eslint-disable-next-line max-statements
55
-
56
-
57
- function FocusGridProvider(_ref2) {
58
- let {
59
- shouldWrapRows = false,
60
- shouldWrapCells = false,
61
- shouldRefocus = true,
62
- children,
63
- keyBindings,
64
- hotKeys
65
- } = _ref2;
66
- const focusedRow = React.useRef();
67
- const focusedCell = React.useRef();
68
- const grid = React.useRef([]);
69
- const containerRef = React.useRef(document);
70
- const child = React__default["default"].Children.only(children);
71
- const decoratedChild = /*#__PURE__*/React__default["default"].cloneElement(child, {
72
- innerRef: dsUtilities.mergeRefs(child.props.innerRef, containerRef)
57
+ }
58
+ const FocusGridProvider = ({
59
+ shouldWrapRows = false,
60
+ shouldWrapCells = false,
61
+ shouldRefocus = true,
62
+ children,
63
+ keyBindings,
64
+ hotKeys
65
+ }) => {
66
+ const focusedRow = (0, import_react.useRef)();
67
+ const focusedCell = (0, import_react.useRef)();
68
+ const grid = (0, import_react.useRef)([]);
69
+ const containerRef = (0, import_react.useRef)(document);
70
+ const child = import_react.default.Children.only(children);
71
+ const decoratedChild = import_react.default.cloneElement(child, {
72
+ innerRef: (0, import_ds_utilities.mergeRefs)(child.props.innerRef, containerRef)
73
73
  });
74
-
75
- const getNode = _ref3 => {
76
- let {
77
- rowIndex,
78
- cellIndex
79
- } = _ref3;
80
- return dsUtilities.get(grid.current, [rowIndex, cellIndex]);
81
- };
82
-
74
+ const getNode = ({ rowIndex, cellIndex }) => (0, import_ds_utilities.get)(grid.current, [rowIndex, cellIndex]);
83
75
  const register = (node, rowIndex, columnIndex) => {
84
- if (!node) return;
85
-
76
+ if (!node)
77
+ return;
86
78
  if (!Array.isArray(grid.current[rowIndex])) {
87
79
  grid.current[rowIndex] = [];
88
80
  }
89
-
90
81
  if (rowIndex === 0 && columnIndex === 0) {
91
- node.setAttribute('tabindex', 0);
82
+ node.setAttribute("tabindex", 0);
92
83
  } else {
93
- node.setAttribute('tabindex', -1);
84
+ node.setAttribute("tabindex", -1);
94
85
  }
95
-
96
86
  node.onfocus = () => {
97
87
  const prevNode = getNode({
98
88
  rowIndex: focusedRow.current,
99
89
  cellIndex: focusedCell.current
100
90
  });
101
- if (prevNode) prevNode.setAttribute('tabindex', -1);
102
- node.setAttribute('tabindex', 0);
91
+ if (prevNode)
92
+ prevNode.setAttribute("tabindex", -1);
93
+ node.setAttribute("tabindex", 0);
103
94
  focusedRow.current = rowIndex;
104
95
  focusedCell.current = columnIndex;
105
96
  };
106
-
107
97
  grid.current[rowIndex][columnIndex] = node;
108
98
  };
109
-
110
- React.useEffect(() => {
99
+ (0, import_react.useEffect)(() => {
111
100
  if (shouldRefocus) {
112
101
  const rowIndex = focusedRow.current;
113
102
  const cellIndex = focusedCell.current;
114
- const node = dsUtilities.get(grid.current, [rowIndex, cellIndex]);
115
- if (node) node.focus();
103
+ const node = (0, import_ds_utilities.get)(grid.current, [rowIndex, cellIndex]);
104
+ if (node)
105
+ node.focus();
116
106
  }
117
107
  });
118
-
119
108
  const focusNextCell = (directionY, directionX, position) => {
120
- const {
121
- rowIndex,
122
- cellIndex
123
- } = position || getNextCellPosition({
109
+ const { rowIndex, cellIndex } = position || (0, import_getNextCellPosition.getNextCellPosition)({
124
110
  grid: grid.current,
125
111
  currentCell: focusedCell.current,
126
112
  currentRow: focusedRow.current,
@@ -129,87 +115,66 @@ function FocusGridProvider(_ref2) {
129
115
  shouldWrapCells,
130
116
  shouldWrapRows
131
117
  });
132
- const node = getNode({
133
- rowIndex,
134
- cellIndex
135
- }); // can focus
136
-
118
+ const node = getNode({ rowIndex, cellIndex });
137
119
  if (node) {
138
120
  node.focus();
139
121
  focusedRow.current = rowIndex;
140
122
  focusedCell.current = cellIndex;
141
123
  }
142
124
  };
143
-
144
- registerHotKeysHooks(hotKeys, {
145
- focusedCell,
146
- focusedRow
147
- });
148
-
149
- const defaultKeyBindings = _objectSpread({
150
- ArrowUp: dsUtilities.runAll(preventDefault, () => focusNextCell(-1, 0)),
151
- ArrowRight: dsUtilities.runAll(preventDefault, () => focusNextCell(0, 1)),
152
- ArrowDown: dsUtilities.runAll(preventDefault, () => focusNextCell(1, 0)),
153
- ArrowLeft: dsUtilities.runAll(preventDefault, () => focusNextCell(0, -1)),
154
- Home: dsUtilities.runAll(preventDefault, e => {
125
+ registerHotKeysHooks(hotKeys, { focusedCell, focusedRow });
126
+ const defaultKeyBindings = {
127
+ ArrowUp: (0, import_ds_utilities.runAll)(preventDefault, () => focusNextCell(-1, 0)),
128
+ ArrowRight: (0, import_ds_utilities.runAll)(preventDefault, () => focusNextCell(0, 1)),
129
+ ArrowDown: (0, import_ds_utilities.runAll)(preventDefault, () => focusNextCell(1, 0)),
130
+ ArrowLeft: (0, import_ds_utilities.runAll)(preventDefault, () => focusNextCell(0, -1)),
131
+ Home: (0, import_ds_utilities.runAll)(preventDefault, (e) => {
155
132
  let rowIndex = focusedRow.current;
156
-
157
133
  if (e.ctrlKey) {
158
134
  rowIndex = 0;
159
135
  }
160
-
161
- focusNextCell(0, 0, {
162
- rowIndex,
163
- cellIndex: 0
164
- });
136
+ focusNextCell(0, 0, { rowIndex, cellIndex: 0 });
165
137
  }),
166
- End: dsUtilities.runAll(preventDefault, e => {
138
+ End: (0, import_ds_utilities.runAll)(preventDefault, (e) => {
167
139
  let rowIndex = focusedRow.current;
168
-
169
140
  if (e.ctrlKey) {
170
141
  rowIndex = grid.current.length - 1;
171
142
  }
172
-
173
- focusNextCell(0, 0, {
174
- rowIndex,
175
- cellIndex: grid.current[0].length - 1
176
- });
177
- })
178
- }, keyBindings);
179
-
180
- const nextKeyBindings = dsUtilities.isFunction(keyBindings) ? keyBindings({
143
+ focusNextCell(0, 0, { rowIndex, cellIndex: grid.current[0].length - 1 });
144
+ }),
145
+ ...keyBindings
146
+ };
147
+ const nextKeyBindings = (0, import_ds_utilities.isFunction)(keyBindings) ? keyBindings({
181
148
  defaultBindings: defaultKeyBindings,
182
149
  rowIndex: focusedRow.current,
183
150
  cellIndex: focusedCell.current
184
- }) : _objectSpread(_objectSpread({}, defaultKeyBindings), keyBindings);
185
-
186
- const onKeyDown = e => {
187
- if (e.target.tagName.toLowerCase() === 'input') return;
151
+ }) : { ...defaultKeyBindings, ...keyBindings };
152
+ const onKeyDown = (e) => {
153
+ if (e.target.tagName.toLowerCase() === "input")
154
+ return;
188
155
  const action = nextKeyBindings[e.key];
189
- if (dsUtilities.isFunction(action)) action(e);
156
+ if ((0, import_ds_utilities.isFunction)(action))
157
+ action(e);
190
158
  };
191
-
192
- const activate = container => {
193
- container.addEventListener('keydown', onKeyDown, true);
159
+ const activate = (container) => {
160
+ container.addEventListener("keydown", onKeyDown, true);
194
161
  };
195
-
196
- const deactivate = container => {
197
- container.removeEventListener('keydown', onKeyDown, true);
162
+ const deactivate = (container) => {
163
+ container.removeEventListener("keydown", onKeyDown, true);
198
164
  };
199
-
200
- React.useEffect(() => {
165
+ (0, import_react.useEffect)(() => {
201
166
  activate(containerRef.current);
202
167
  return () => {
203
168
  deactivate(containerRef.current);
204
169
  };
205
170
  }, []);
206
- const valueProvider = React.useMemo(() => ({
171
+ const valueProvider = (0, import_react.useMemo)(() => ({
207
172
  register
208
173
  }), []);
209
- return /*#__PURE__*/_jsx__default["default"](Provider, {
174
+ return /* @__PURE__ */ import_react.default.createElement(Provider, {
210
175
  value: valueProvider
211
- }, void 0, decoratedChild);
212
- }
213
-
214
- exports.FocusGridContext = FocusGridContext;
215
- exports["default"] = FocusGridProvider;
176
+ }, decoratedChild);
177
+ };
178
+ var FocusGrid_default = FocusGridProvider;
179
+ module.exports = __toCommonJS(FocusGrid_exports);
180
+ //# sourceMappingURL=FocusGrid.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../src/FocusGroup/FocusGrid.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["import React, { createContext, useEffect, useMemo, useRef } from 'react';\nimport { isFunction, runAll, get, useHotkeys, mergeRefs } from '@elliemae/ds-utilities';\nimport { getNextCellPosition } from './utils/getNextCellPosition';\n\nconst FocusGridContext = createContext();\nconst { Provider } = FocusGridContext;\n\nconst preventDefault = e => e.preventDefault();\n\nfunction registerHotKeysHooks(hotKeys, { focusedRow, focusedCell }) {\n Object.keys(hotKeys).forEach(key => {\n const { handler, options } = hotKeys[key];\n useHotkeys({\n keys: key,\n handler: e => {\n e.preventDefault();\n handler({\n rowIndex: focusedRow.current,\n cellIndex: focusedCell.current,\n });\n },\n options,\n });\n });\n}\n\n// eslint-disable-next-line max-statements\nconst FocusGridProvider = ({\n shouldWrapRows = false,\n shouldWrapCells = false,\n shouldRefocus = true,\n children,\n keyBindings,\n hotKeys,\n}) => {\n const focusedRow = useRef();\n const focusedCell = useRef();\n const grid = useRef([]);\n const containerRef = useRef(document);\n const child = React.Children.only(children);\n const decoratedChild = React.cloneElement(child, {\n innerRef: mergeRefs(child.props.innerRef, containerRef),\n });\n\n const getNode = ({ rowIndex, cellIndex }) =>\n get(grid.current, [rowIndex, cellIndex]);\n\n const register = (node, rowIndex, columnIndex) => {\n if (!node) return;\n if (!Array.isArray(grid.current[rowIndex])) {\n grid.current[rowIndex] = [];\n }\n\n if (rowIndex === 0 && columnIndex === 0) {\n node.setAttribute('tabindex', 0);\n } else {\n node.setAttribute('tabindex', -1);\n }\n\n node.onfocus = () => {\n const prevNode = getNode({\n rowIndex: focusedRow.current,\n cellIndex: focusedCell.current,\n });\n\n if (prevNode) prevNode.setAttribute('tabindex', -1);\n\n node.setAttribute('tabindex', 0);\n focusedRow.current = rowIndex;\n focusedCell.current = columnIndex;\n };\n grid.current[rowIndex][columnIndex] = node;\n };\n\n useEffect(() => {\n if (shouldRefocus) {\n const rowIndex = focusedRow.current;\n const cellIndex = focusedCell.current;\n\n const node = get(grid.current, [rowIndex, cellIndex]);\n if (node) node.focus();\n }\n });\n\n const focusNextCell = (directionY, directionX, position) => {\n const { rowIndex, cellIndex } =\n position ||\n getNextCellPosition({\n grid: grid.current,\n currentCell: focusedCell.current,\n currentRow: focusedRow.current,\n directionX,\n directionY,\n shouldWrapCells,\n shouldWrapRows,\n });\n\n const node = getNode({ rowIndex, cellIndex });\n\n // can focus\n if (node) {\n node.focus();\n focusedRow.current = rowIndex;\n focusedCell.current = cellIndex;\n }\n };\n\n registerHotKeysHooks(hotKeys, { focusedCell, focusedRow });\n\n const defaultKeyBindings = {\n ArrowUp: runAll(preventDefault, () => focusNextCell(-1, 0)),\n ArrowRight: runAll(preventDefault, () => focusNextCell(0, 1)),\n ArrowDown: runAll(preventDefault, () => focusNextCell(1, 0)),\n ArrowLeft: runAll(preventDefault, () => focusNextCell(0, -1)),\n Home: runAll(preventDefault, e => {\n let rowIndex = focusedRow.current;\n if (e.ctrlKey) {\n rowIndex = 0;\n }\n focusNextCell(0, 0, { rowIndex, cellIndex: 0 });\n }),\n End: runAll(preventDefault, e => {\n let rowIndex = focusedRow.current;\n if (e.ctrlKey) {\n rowIndex = grid.current.length - 1;\n }\n focusNextCell(0, 0, { rowIndex, cellIndex: grid.current[0].length - 1 });\n }),\n ...keyBindings,\n };\n const nextKeyBindings = isFunction(keyBindings)\n ? keyBindings({\n defaultBindings: defaultKeyBindings,\n rowIndex: focusedRow.current,\n cellIndex: focusedCell.current,\n })\n : { ...defaultKeyBindings, ...keyBindings };\n\n const onKeyDown = e => {\n if (e.target.tagName.toLowerCase() === 'input') return;\n const action = nextKeyBindings[e.key];\n if (isFunction(action)) action(e);\n };\n\n const activate = container => {\n container.addEventListener('keydown', onKeyDown, true);\n };\n\n const deactivate = container => {\n container.removeEventListener('keydown', onKeyDown, true);\n };\n\n useEffect(() => {\n activate(containerRef.current);\n return () => {\n deactivate(containerRef.current);\n };\n }, []);\n\n const valueProvider = useMemo(\n () => ({\n register,\n }),\n [],\n );\n\n return <Provider value={valueProvider}>{decoratedChild}</Provider>;\n};\n\nexport { FocusGridProvider, FocusGridProvider as FocusGrid, FocusGridContext };\nexport default FocusGridProvider;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": "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",
6
+ "names": []
7
+ }