@elliemae/ds-shared 1.57.1-rc.0 → 2.0.0-alpha.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cjs/Animations/BaseAnimation.js +25 -36
- package/cjs/Animations/Grow.js +31 -39
- package/cjs/Animations/GrowRight.js +31 -40
- package/cjs/Animations/GrowVertical.js +3 -2
- package/cjs/CheckableGroup.js +36 -50
- package/cjs/DeferRenderAfterComputation.js +12 -22
- package/cjs/FocusGroup/FocusGrid.js +94 -102
- package/cjs/FocusGroup/FocusGroup.js +215 -270
- package/cjs/FocusGroup/FocusGroupContext.js +1 -2
- package/cjs/FocusGroup/FocusGroupManager.js +88 -124
- package/cjs/FocusGroup/focusGroupManagerHoc.js +24 -29
- package/cjs/FocusGroup/index.js +14 -28
- package/cjs/FocusGroup/useFocusGroupItem.js +24 -27
- package/cjs/FocusGroup/utils/getNextCellPosition.js +14 -16
- package/cjs/GroupContext/Group.js +76 -104
- package/cjs/GroupContext/GroupContext.js +1 -2
- package/cjs/GroupContext/GroupItem.js +10 -11
- package/cjs/GroupContext/index.js +6 -15
- package/cjs/ScrollSync/ScrollSync.js +86 -112
- package/cjs/ScrollSync/ScrollSyncPane.js +49 -92
- package/cjs/ScrollSync/ScrollSyncProvider.js +32 -28
- package/cjs/ScrollSync/index.js +4 -14
- package/cjs/ScrollSync/useScrollSync.js +0 -1
- package/cjs/constants.js +43 -4
- package/cjs/createDataInstance/createInstancePlugin.js +6 -10
- package/cjs/createDataInstance/createInstanceRef.js +34 -42
- package/cjs/createDataInstance/utils.js +42 -76
- package/cjs/defer-render-hoc/index.js +19 -64
- package/cjs/dimsum.config.js +7 -0
- package/cjs/index.js +10 -21
- package/cjs/prop-types.js +59 -0
- package/cjs/react-spring/index.js +3 -6
- package/cjs/react-spring/renderprops.js +3 -6
- package/cjs/toolbar/ToolbarProvider.js +60 -81
- package/cjs/useDataGrid/VolatileRowsListener.js +13 -27
- package/cjs/useDataGrid/index.js +2 -17
- package/cjs/useDataGrid/initColumnDefinition.js +45 -53
- package/cjs/useDataGrid/useDataGrid.js +105 -152
- package/cjs/useDataList/index.js +2 -15
- package/cjs/useDataList/recordIterator.js +7 -11
- package/cjs/useDataList/useDataList.js +42 -63
- package/cjs/utils.js +39 -59
- package/cjs/virtualization/AutoHeightList.js +34 -27
- package/cjs/virtualization/FluidHeightList.js +23 -17
- package/cjs/virtualization/index.js +12 -18
- package/esm/Animations/BaseAnimation.js +24 -35
- package/esm/Animations/Grow.js +29 -37
- package/esm/Animations/GrowRight.js +29 -38
- package/esm/Animations/GrowVertical.js +3 -2
- package/esm/CheckableGroup.js +33 -46
- package/esm/DeferRenderAfterComputation.js +12 -21
- package/esm/FocusGroup/FocusGrid.js +86 -96
- package/esm/FocusGroup/FocusGroup.js +210 -263
- package/esm/FocusGroup/FocusGroupContext.js +0 -1
- package/esm/FocusGroup/FocusGroupManager.js +85 -115
- package/esm/FocusGroup/focusGroupManagerHoc.js +19 -23
- package/esm/FocusGroup/index.js +0 -14
- package/esm/FocusGroup/useFocusGroupItem.js +22 -25
- package/esm/FocusGroup/utils/getNextCellPosition.js +14 -16
- package/esm/GroupContext/Group.js +75 -96
- package/esm/GroupContext/GroupContext.js +1 -2
- package/esm/GroupContext/GroupItem.js +8 -9
- package/esm/GroupContext/index.js +0 -9
- package/esm/ScrollSync/ScrollSync.js +83 -104
- package/esm/ScrollSync/ScrollSyncPane.js +47 -83
- package/esm/ScrollSync/ScrollSyncProvider.js +31 -28
- package/esm/ScrollSync/index.js +0 -10
- package/esm/ScrollSync/useScrollSync.js +0 -1
- package/esm/constants.js +31 -5
- package/esm/createDataInstance/createInstancePlugin.js +5 -8
- package/esm/createDataInstance/createInstanceRef.js +29 -36
- package/esm/createDataInstance/utils.js +40 -74
- package/esm/defer-render-hoc/index.js +19 -57
- package/esm/dimsum.config.js +5 -0
- package/esm/index.js +0 -11
- package/esm/prop-types.js +43 -0
- package/esm/react-spring/index.js +1 -2
- package/esm/react-spring/renderprops.js +1 -2
- package/esm/toolbar/ToolbarProvider.js +55 -75
- package/esm/useDataGrid/VolatileRowsListener.js +12 -24
- package/esm/useDataGrid/index.js +0 -15
- package/esm/useDataGrid/initColumnDefinition.js +38 -45
- package/esm/useDataGrid/useDataGrid.js +85 -131
- package/esm/useDataList/index.js +0 -13
- package/esm/useDataList/recordIterator.js +7 -11
- package/esm/useDataList/useDataList.js +31 -51
- package/esm/utils.js +37 -57
- package/esm/virtualization/AutoHeightList.js +26 -19
- package/esm/virtualization/FluidHeightList.js +20 -14
- package/esm/virtualization/index.js +6 -12
- package/package.json +202 -13
- package/types/Animations/BaseAnimation.d.ts +12 -0
- package/types/Animations/Grow.d.ts +11 -0
- package/types/Animations/GrowRight.d.ts +11 -0
- package/types/Animations/GrowVertical.d.ts +1 -0
- package/types/CheckableGroup.d.ts +20 -0
- package/types/DeferRenderAfterComputation.d.ts +6 -0
- package/types/FocusGroup/FocusGrid.d.ts +10 -0
- package/types/FocusGroup/FocusGroup.d.ts +36 -0
- package/types/FocusGroup/FocusGroupContext.d.ts +3 -0
- package/types/FocusGroup/FocusGroupManager.d.ts +24 -0
- package/types/FocusGroup/focusGroupManagerHoc.d.ts +7 -0
- package/types/FocusGroup/index.d.ts +6 -0
- package/types/FocusGroup/useFocusGroupItem.d.ts +2 -0
- package/types/FocusGroup/utils/getNextCellPosition.d.ts +12 -0
- package/types/GroupContext/Group.d.ts +14 -0
- package/types/GroupContext/GroupContext.d.ts +2 -0
- package/types/GroupContext/GroupItem.d.ts +5 -0
- package/types/GroupContext/index.d.ts +3 -0
- package/types/ScrollSync/ScrollSync.d.ts +21 -0
- package/types/ScrollSync/ScrollSyncPane.d.ts +3 -0
- package/types/ScrollSync/ScrollSyncProvider.d.ts +12 -0
- package/types/ScrollSync/index.d.ts +2 -0
- package/types/ScrollSync/useScrollSync.d.ts +6 -0
- package/types/constants.d.ts +30 -0
- package/types/createDataInstance/createInstancePlugin.d.ts +1 -0
- package/types/createDataInstance/createInstanceRef.d.ts +12 -0
- package/types/createDataInstance/tests/createInstanceRef.test.d.ts +0 -0
- package/types/createDataInstance/utils.d.ts +9 -0
- package/types/dimsum.config.d.ts +4 -0
- package/types/index.d.ts +2 -0
- package/types/prop-types.d.ts +41 -0
- package/types/react-spring/index.d.ts +1 -0
- package/types/react-spring/renderprops.d.ts +1 -0
- package/types/toolbar/ToolbarProvider.d.ts +10 -0
- package/types/useDataGrid/VolatileRowsListener.d.ts +5 -0
- package/types/useDataGrid/index.d.ts +1 -0
- package/types/useDataGrid/initColumnDefinition.d.ts +4 -0
- package/types/useDataGrid/useDataGrid.d.ts +8 -0
- package/types/useDataList/index.d.ts +1 -0
- package/types/useDataList/recordIterator.d.ts +1 -0
- package/types/useDataList/useDataList.d.ts +13 -0
- package/types/utils.d.ts +22 -0
- package/types/virtualization/AutoHeightList.d.ts +2 -0
- package/types/virtualization/FluidHeightList.d.ts +2 -0
- package/types/virtualization/index.d.ts +9 -0
- package/Animations/BaseAnimation/package.json +0 -10
- package/Animations/Grow/package.json +0 -10
- package/Animations/GrowRight/package.json +0 -10
- package/Animations/GrowVertical/package.json +0 -10
- package/CheckableGroup/package.json +0 -10
- package/DeferRenderAfterComputation/package.json +0 -10
- package/FocusGroup/FocusGrid/package.json +0 -10
- package/FocusGroup/FocusGroup/package.json +0 -10
- package/FocusGroup/FocusGroupContext/package.json +0 -10
- package/FocusGroup/FocusGroupManager/package.json +0 -10
- package/FocusGroup/focusGroupManagerHoc/package.json +0 -10
- package/FocusGroup/package.json +0 -10
- package/FocusGroup/useFocusGroupItem/package.json +0 -10
- package/FocusGroup/utils/getNextCellPosition/package.json +0 -10
- package/GroupContext/Group/package.json +0 -10
- package/GroupContext/GroupContext/package.json +0 -10
- package/GroupContext/GroupItem/package.json +0 -10
- package/GroupContext/package.json +0 -10
- package/ScrollSync/ScrollSync/package.json +0 -10
- package/ScrollSync/ScrollSyncPane/package.json +0 -10
- package/ScrollSync/ScrollSyncProvider/package.json +0 -10
- package/ScrollSync/package.json +0 -10
- package/ScrollSync/useScrollSync/package.json +0 -10
- package/cjs/Animations/BaseAnimation.js.map +0 -1
- package/cjs/Animations/Grow.js.map +0 -1
- package/cjs/Animations/GrowRight.js.map +0 -1
- package/cjs/Animations/GrowVertical.js.map +0 -1
- package/cjs/CheckableGroup.js.map +0 -1
- package/cjs/DeferRenderAfterComputation.js.map +0 -1
- package/cjs/FocusGroup/FocusGrid.js.map +0 -1
- package/cjs/FocusGroup/FocusGroup.js.map +0 -1
- package/cjs/FocusGroup/FocusGroupContext.js.map +0 -1
- package/cjs/FocusGroup/FocusGroupManager.js.map +0 -1
- package/cjs/FocusGroup/focusGroupManagerHoc.js.map +0 -1
- package/cjs/FocusGroup/index.js.map +0 -1
- package/cjs/FocusGroup/useFocusGroupItem.js.map +0 -1
- package/cjs/FocusGroup/utils/getNextCellPosition.js.map +0 -1
- package/cjs/GroupContext/Group.js.map +0 -1
- package/cjs/GroupContext/GroupContext.js.map +0 -1
- package/cjs/GroupContext/GroupItem.js.map +0 -1
- package/cjs/GroupContext/index.js.map +0 -1
- package/cjs/ScrollSync/ScrollSync.js.map +0 -1
- package/cjs/ScrollSync/ScrollSyncPane.js.map +0 -1
- package/cjs/ScrollSync/ScrollSyncProvider.js.map +0 -1
- package/cjs/ScrollSync/index.js.map +0 -1
- package/cjs/ScrollSync/useScrollSync.js.map +0 -1
- package/cjs/constants.js.map +0 -1
- package/cjs/createDataInstance/createInstancePlugin.js.map +0 -1
- package/cjs/createDataInstance/createInstanceRef.js.map +0 -1
- package/cjs/createDataInstance/utils.js.map +0 -1
- package/cjs/defer-render-hoc/index.js.map +0 -1
- package/cjs/index.js.map +0 -1
- package/cjs/react-spring/index.js.map +0 -1
- package/cjs/react-spring/renderprops.js.map +0 -1
- package/cjs/toolbar/ToolbarProvider.js.map +0 -1
- package/cjs/useDataGrid/VolatileRowsListener.js.map +0 -1
- package/cjs/useDataGrid/index.js.map +0 -1
- package/cjs/useDataGrid/initColumnDefinition.js.map +0 -1
- package/cjs/useDataGrid/useDataGrid.js.map +0 -1
- package/cjs/useDataList/index.js.map +0 -1
- package/cjs/useDataList/recordIterator.js.map +0 -1
- package/cjs/useDataList/useDataList.js.map +0 -1
- package/cjs/utils.js.map +0 -1
- package/cjs/virtualization/AutoHeightList.js.map +0 -1
- package/cjs/virtualization/FluidHeightList.js.map +0 -1
- package/cjs/virtualization/index.js.map +0 -1
- package/constants/package.json +0 -10
- package/createDataInstance/createInstancePlugin/package.json +0 -10
- package/createDataInstance/createInstanceRef/package.json +0 -10
- package/createDataInstance/utils/package.json +0 -10
- package/defer-render-hoc/package.json +0 -10
- package/esm/Animations/BaseAnimation.js.map +0 -1
- package/esm/Animations/Grow.js.map +0 -1
- package/esm/Animations/GrowRight.js.map +0 -1
- package/esm/Animations/GrowVertical.js.map +0 -1
- package/esm/CheckableGroup.js.map +0 -1
- package/esm/DeferRenderAfterComputation.js.map +0 -1
- package/esm/FocusGroup/FocusGrid.js.map +0 -1
- package/esm/FocusGroup/FocusGroup.js.map +0 -1
- package/esm/FocusGroup/FocusGroupContext.js.map +0 -1
- package/esm/FocusGroup/FocusGroupManager.js.map +0 -1
- package/esm/FocusGroup/focusGroupManagerHoc.js.map +0 -1
- package/esm/FocusGroup/index.js.map +0 -1
- package/esm/FocusGroup/useFocusGroupItem.js.map +0 -1
- package/esm/FocusGroup/utils/getNextCellPosition.js.map +0 -1
- package/esm/GroupContext/Group.js.map +0 -1
- package/esm/GroupContext/GroupContext.js.map +0 -1
- package/esm/GroupContext/GroupItem.js.map +0 -1
- package/esm/GroupContext/index.js.map +0 -1
- package/esm/ScrollSync/ScrollSync.js.map +0 -1
- package/esm/ScrollSync/ScrollSyncPane.js.map +0 -1
- package/esm/ScrollSync/ScrollSyncProvider.js.map +0 -1
- package/esm/ScrollSync/index.js.map +0 -1
- package/esm/ScrollSync/useScrollSync.js.map +0 -1
- package/esm/constants.js.map +0 -1
- package/esm/createDataInstance/createInstancePlugin.js.map +0 -1
- package/esm/createDataInstance/createInstanceRef.js.map +0 -1
- package/esm/createDataInstance/utils.js.map +0 -1
- package/esm/defer-render-hoc/index.js.map +0 -1
- package/esm/index.js.map +0 -1
- package/esm/react-spring/index.js.map +0 -1
- package/esm/react-spring/renderprops.js.map +0 -1
- package/esm/toolbar/ToolbarProvider.js.map +0 -1
- package/esm/useDataGrid/VolatileRowsListener.js.map +0 -1
- package/esm/useDataGrid/index.js.map +0 -1
- package/esm/useDataGrid/initColumnDefinition.js.map +0 -1
- package/esm/useDataGrid/useDataGrid.js.map +0 -1
- package/esm/useDataList/index.js.map +0 -1
- package/esm/useDataList/recordIterator.js.map +0 -1
- package/esm/useDataList/useDataList.js.map +0 -1
- package/esm/utils.js.map +0 -1
- package/esm/virtualization/AutoHeightList.js.map +0 -1
- package/esm/virtualization/FluidHeightList.js.map +0 -1
- package/esm/virtualization/index.js.map +0 -1
- package/react-spring/package.json +0 -10
- package/react-spring/renderprops/package.json +0 -10
- package/toolbar/ToolbarProvider/package.json +0 -10
- package/useDataGrid/VolatileRowsListener/package.json +0 -10
- package/useDataGrid/initColumnDefinition/package.json +0 -10
- package/useDataGrid/package.json +0 -10
- package/useDataGrid/useDataGrid/package.json +0 -10
- package/useDataList/package.json +0 -10
- package/useDataList/recordIterator/package.json +0 -10
- package/useDataList/useDataList/package.json +0 -10
- package/utils/package.json +0 -10
- package/virtualization/AutoHeightList/package.json +0 -10
- package/virtualization/FluidHeightList/package.json +0 -10
- package/virtualization/package.json +0 -10
|
@@ -1,134 +1,105 @@
|
|
|
1
|
-
import
|
|
2
|
-
import _createClass from '@babel/runtime/helpers/esm/createClass';
|
|
3
|
-
import _assertThisInitialized from '@babel/runtime/helpers/esm/assertThisInitialized';
|
|
4
|
-
import _inherits from '@babel/runtime/helpers/esm/inherits';
|
|
5
|
-
import _possibleConstructorReturn from '@babel/runtime/helpers/esm/possibleConstructorReturn';
|
|
6
|
-
import _getPrototypeOf from '@babel/runtime/helpers/esm/getPrototypeOf';
|
|
1
|
+
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
7
2
|
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
8
|
-
import
|
|
9
|
-
import { isFunction } from '@elliemae/ds-utilities';
|
|
3
|
+
import { Component } from 'react';
|
|
4
|
+
import { isFunction } from '@elliemae/ds-utilities/utils';
|
|
10
5
|
import FocusGroup from './FocusGroup.js';
|
|
11
6
|
import FocusGroupContext from './FocusGroupContext.js';
|
|
12
|
-
import 'hotkeys-js';
|
|
13
7
|
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
8
|
+
const noop = () => null;
|
|
9
|
+
|
|
10
|
+
class FocusGroupProvider extends Component {
|
|
11
|
+
constructor(props) {
|
|
12
|
+
super(props);
|
|
13
|
+
|
|
14
|
+
_defineProperty(this, "activated", false);
|
|
15
|
+
|
|
16
|
+
this.focusGroup = new FocusGroup(props);
|
|
17
|
+
props.onFocusGroupSet(this);
|
|
18
|
+
this.actions = {
|
|
19
|
+
activate: this.activate.bind(this),
|
|
20
|
+
deactivate: this.deactivate.bind(this),
|
|
21
|
+
register: this.focusGroup.register,
|
|
22
|
+
unregister: this.unregister.bind(this),
|
|
23
|
+
focusFirst: this.focusGroup.focusFirst,
|
|
24
|
+
focusLast: this.focusGroup.focusLast,
|
|
25
|
+
focusItemByIndex: this.focusItemByIndex.bind(this),
|
|
26
|
+
focusItemByNode: this.focusItemByNode.bind(this),
|
|
27
|
+
focus: this.focusGroup.focusCurrent,
|
|
28
|
+
isGroupActive: this.focusGroup.isGroupActive,
|
|
29
|
+
focusNext: this.focusGroup.focusNext,
|
|
30
|
+
focusPrevious: this.focusGroup.focusPrevious
|
|
31
|
+
};
|
|
32
|
+
}
|
|
17
33
|
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
34
|
+
componentDidMount() {
|
|
35
|
+
const {
|
|
36
|
+
autoFocusOnMount
|
|
37
|
+
} = this.props;
|
|
38
|
+
this.activate();
|
|
21
39
|
|
|
22
|
-
|
|
23
|
-
|
|
40
|
+
if (autoFocusOnMount) {
|
|
41
|
+
setTimeout(() => {
|
|
42
|
+
this.actions.focusFirst();
|
|
43
|
+
}, 0);
|
|
44
|
+
}
|
|
45
|
+
}
|
|
24
46
|
|
|
25
|
-
|
|
47
|
+
componentWillUnmount() {
|
|
48
|
+
this.deactivate();
|
|
49
|
+
}
|
|
26
50
|
|
|
27
|
-
|
|
28
|
-
|
|
51
|
+
activate() {
|
|
52
|
+
const {
|
|
53
|
+
onActivate
|
|
54
|
+
} = this.props;
|
|
55
|
+
this.focusGroup.activate();
|
|
56
|
+
this.activated = true;
|
|
57
|
+
if (isFunction(onActivate)) onActivate();
|
|
58
|
+
}
|
|
29
59
|
|
|
30
|
-
|
|
60
|
+
deactivate() {
|
|
61
|
+
const {
|
|
62
|
+
onExitFocusGroup
|
|
63
|
+
} = this.props;
|
|
64
|
+
this.activated = false;
|
|
65
|
+
this.focusGroup.deactivate();
|
|
31
66
|
|
|
32
|
-
|
|
67
|
+
if (isFunction(onExitFocusGroup)) {
|
|
68
|
+
onExitFocusGroup();
|
|
69
|
+
}
|
|
70
|
+
}
|
|
33
71
|
|
|
34
|
-
|
|
72
|
+
register(item) {
|
|
73
|
+
this.focusGroup.register(item);
|
|
74
|
+
}
|
|
35
75
|
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
_this.actions = {
|
|
39
|
-
activate: _this.activate.bind(_assertThisInitialized(_this)),
|
|
40
|
-
deactivate: _this.deactivate.bind(_assertThisInitialized(_this)),
|
|
41
|
-
register: _this.focusGroup.register,
|
|
42
|
-
unregister: _this.unregister.bind(_assertThisInitialized(_this)),
|
|
43
|
-
focusFirst: _this.focusGroup.focusFirst,
|
|
44
|
-
focusLast: _this.focusGroup.focusLast,
|
|
45
|
-
focusItemByIndex: _this.focusItemByIndex.bind(_assertThisInitialized(_this)),
|
|
46
|
-
focusItemByNode: _this.focusItemByNode.bind(_assertThisInitialized(_this)),
|
|
47
|
-
focus: _this.focusGroup.focusCurrent,
|
|
48
|
-
isGroupActive: _this.focusGroup.isGroupActive,
|
|
49
|
-
focusNext: _this.focusGroup.focusNext,
|
|
50
|
-
focusPrevious: _this.focusGroup.focusPrevious
|
|
51
|
-
};
|
|
52
|
-
return _this;
|
|
76
|
+
unregister(item) {
|
|
77
|
+
this.focusGroup.unregister(item);
|
|
53
78
|
}
|
|
54
79
|
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
80
|
+
focusItemByIndex(index) {
|
|
81
|
+
if (!this.activated) this.activate();
|
|
82
|
+
setTimeout(() => {
|
|
83
|
+
this.focusGroup.focusByIndex(index);
|
|
84
|
+
}, 200);
|
|
85
|
+
}
|
|
59
86
|
|
|
60
|
-
|
|
61
|
-
|
|
87
|
+
focusItemByNode(node) {
|
|
88
|
+
if (!this.activated) this.activate();
|
|
89
|
+
const index = this.focusGroup.getItemIndexByNode(node);
|
|
90
|
+
this.focusItemByIndex(index);
|
|
91
|
+
}
|
|
62
92
|
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
value: function componentWillUnmount() {
|
|
72
|
-
this.deactivate();
|
|
73
|
-
}
|
|
74
|
-
}, {
|
|
75
|
-
key: "activate",
|
|
76
|
-
value: function activate() {
|
|
77
|
-
var onActivate = this.props.onActivate;
|
|
78
|
-
this.focusGroup.activate();
|
|
79
|
-
this.activated = true;
|
|
80
|
-
if (isFunction(onActivate)) onActivate();
|
|
81
|
-
}
|
|
82
|
-
}, {
|
|
83
|
-
key: "deactivate",
|
|
84
|
-
value: function deactivate() {
|
|
85
|
-
var onExitFocusGroup = this.props.onExitFocusGroup;
|
|
86
|
-
this.activated = false;
|
|
87
|
-
this.focusGroup.deactivate();
|
|
88
|
-
|
|
89
|
-
if (isFunction(onExitFocusGroup)) {
|
|
90
|
-
onExitFocusGroup();
|
|
91
|
-
}
|
|
92
|
-
}
|
|
93
|
-
}, {
|
|
94
|
-
key: "register",
|
|
95
|
-
value: function register(item) {
|
|
96
|
-
this.focusGroup.register(item);
|
|
97
|
-
}
|
|
98
|
-
}, {
|
|
99
|
-
key: "unregister",
|
|
100
|
-
value: function unregister(item) {
|
|
101
|
-
this.focusGroup.unregister(item);
|
|
102
|
-
}
|
|
103
|
-
}, {
|
|
104
|
-
key: "focusItemByIndex",
|
|
105
|
-
value: function focusItemByIndex(index) {
|
|
106
|
-
var _this3 = this;
|
|
107
|
-
|
|
108
|
-
if (!this.activated) this.activate();
|
|
109
|
-
setTimeout(function () {
|
|
110
|
-
_this3.focusGroup.focusByIndex(index);
|
|
111
|
-
}, 200);
|
|
112
|
-
}
|
|
113
|
-
}, {
|
|
114
|
-
key: "focusItemByNode",
|
|
115
|
-
value: function focusItemByNode(node) {
|
|
116
|
-
if (!this.activated) this.activate();
|
|
117
|
-
var index = this.focusGroup.getItemIndexByNode(node);
|
|
118
|
-
this.focusItemByIndex(index);
|
|
119
|
-
}
|
|
120
|
-
}, {
|
|
121
|
-
key: "render",
|
|
122
|
-
value: function render() {
|
|
123
|
-
var children = this.props.children;
|
|
124
|
-
return /*#__PURE__*/React.createElement(FocusGroupContext.Provider, {
|
|
125
|
-
value: this.actions
|
|
126
|
-
}, children);
|
|
127
|
-
}
|
|
128
|
-
}]);
|
|
93
|
+
render() {
|
|
94
|
+
const {
|
|
95
|
+
children
|
|
96
|
+
} = this.props;
|
|
97
|
+
return /*#__PURE__*/_jsx(FocusGroupContext.Provider, {
|
|
98
|
+
value: this.actions
|
|
99
|
+
}, void 0, children);
|
|
100
|
+
}
|
|
129
101
|
|
|
130
|
-
|
|
131
|
-
}(Component);
|
|
102
|
+
}
|
|
132
103
|
|
|
133
104
|
_defineProperty(FocusGroupProvider, "defaultProps", {
|
|
134
105
|
exitWhenNoPrevious: false,
|
|
@@ -142,4 +113,3 @@ _defineProperty(FocusGroupProvider, "defaultProps", {
|
|
|
142
113
|
});
|
|
143
114
|
|
|
144
115
|
export { FocusGroupProvider as default };
|
|
145
|
-
//# sourceMappingURL=FocusGroupManager.js.map
|
|
@@ -1,35 +1,31 @@
|
|
|
1
|
-
import
|
|
1
|
+
import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
2
2
|
import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
|
|
3
|
-
import
|
|
3
|
+
import 'react';
|
|
4
4
|
import FocusGroupProvider from './FocusGroupManager.js';
|
|
5
|
-
import '
|
|
6
|
-
import '@babel/runtime/helpers/esm/createClass';
|
|
7
|
-
import '@babel/runtime/helpers/esm/assertThisInitialized';
|
|
8
|
-
import '@babel/runtime/helpers/esm/inherits';
|
|
9
|
-
import '@babel/runtime/helpers/esm/possibleConstructorReturn';
|
|
10
|
-
import '@babel/runtime/helpers/esm/getPrototypeOf';
|
|
11
|
-
import '@babel/runtime/helpers/esm/defineProperty';
|
|
12
|
-
import '@elliemae/ds-utilities';
|
|
13
|
-
import './FocusGroup.js';
|
|
14
|
-
import 'hotkeys-js';
|
|
15
|
-
import './FocusGroupContext.js';
|
|
5
|
+
import { jsx } from 'react/jsx-runtime';
|
|
16
6
|
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
7
|
+
const _excluded = ["onExitFocusGroup", "onFocusPrevGroup", "focusKeyBindings"];
|
|
8
|
+
|
|
9
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
10
|
+
|
|
11
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
12
|
+
function FocusGroupHoc(WrappedComponent, options = {}) {
|
|
13
|
+
return _ref => {
|
|
14
|
+
let {
|
|
15
|
+
onExitFocusGroup,
|
|
16
|
+
onFocusPrevGroup,
|
|
17
|
+
focusKeyBindings
|
|
18
|
+
} = _ref,
|
|
24
19
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
25
20
|
|
|
26
|
-
return /*#__PURE__*/
|
|
21
|
+
return /*#__PURE__*/jsx(FocusGroupProvider, _objectSpread(_objectSpread({
|
|
27
22
|
keyBindings: focusKeyBindings,
|
|
28
23
|
onExitFocusGroup: onExitFocusGroup,
|
|
29
24
|
onFocusPrevGroup: onFocusPrevGroup
|
|
30
|
-
}, options),
|
|
25
|
+
}, options), {}, {
|
|
26
|
+
children: /*#__PURE__*/jsx(WrappedComponent, _objectSpread(_objectSpread({}, props), options))
|
|
27
|
+
}));
|
|
31
28
|
};
|
|
32
29
|
}
|
|
33
30
|
|
|
34
31
|
export { FocusGroupHoc as default };
|
|
35
|
-
//# sourceMappingURL=focusGroupManagerHoc.js.map
|
package/esm/FocusGroup/index.js
CHANGED
|
@@ -4,17 +4,3 @@ export { default as FocusGroupManager } from './FocusGroupManager.js';
|
|
|
4
4
|
export { default as useFocusGroupItem, useFocusGroupWithState } from './useFocusGroupItem.js';
|
|
5
5
|
export { default as focusGroupManagerHoc } from './focusGroupManagerHoc.js';
|
|
6
6
|
export { default as FocusGrid, FocusGridContext } from './FocusGrid.js';
|
|
7
|
-
import '@babel/runtime/helpers/esm/classCallCheck';
|
|
8
|
-
import '@babel/runtime/helpers/esm/createClass';
|
|
9
|
-
import '@babel/runtime/helpers/esm/defineProperty';
|
|
10
|
-
import '@elliemae/ds-utilities';
|
|
11
|
-
import 'hotkeys-js';
|
|
12
|
-
import 'react';
|
|
13
|
-
import '@babel/runtime/helpers/esm/assertThisInitialized';
|
|
14
|
-
import '@babel/runtime/helpers/esm/inherits';
|
|
15
|
-
import '@babel/runtime/helpers/esm/possibleConstructorReturn';
|
|
16
|
-
import '@babel/runtime/helpers/esm/getPrototypeOf';
|
|
17
|
-
import '@babel/runtime/helpers/esm/objectWithoutProperties';
|
|
18
|
-
import '@babel/runtime/helpers/esm/extends';
|
|
19
|
-
import './utils/getNextCellPosition.js';
|
|
20
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -2,20 +2,19 @@ import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutPr
|
|
|
2
2
|
import { useContext, useEffect } from 'react';
|
|
3
3
|
import FocusGroupContext from './FocusGroupContext.js';
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
function useFocusGroupItem() {
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
useEffect(function () {
|
|
5
|
+
const _excluded = ["register", "unregister"],
|
|
6
|
+
_excluded2 = ["register", "unregister"];
|
|
7
|
+
function useFocusGroupItem(ref = {}, props) {
|
|
8
|
+
const _ref = useContext(FocusGroupContext) || {},
|
|
9
|
+
{
|
|
10
|
+
register,
|
|
11
|
+
unregister
|
|
12
|
+
} = _ref,
|
|
13
|
+
otherActions = _objectWithoutProperties(_ref, _excluded);
|
|
14
|
+
|
|
15
|
+
useEffect(() => {
|
|
17
16
|
if (ref.current && register) register(ref.current, props);
|
|
18
|
-
return
|
|
17
|
+
return () => {
|
|
19
18
|
if (ref.current && unregister) unregister(ref.current);
|
|
20
19
|
};
|
|
21
20
|
}); // if the focus item is not wrapped with the focus provider then return null
|
|
@@ -23,18 +22,17 @@ function useFocusGroupItem() {
|
|
|
23
22
|
if (!register) return {};
|
|
24
23
|
return otherActions;
|
|
25
24
|
}
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
useEffect(function () {
|
|
25
|
+
const useFocusGroupWithState = (ref = {}, props) => {
|
|
26
|
+
const _ref2 = useContext(FocusGroupContext) || {},
|
|
27
|
+
{
|
|
28
|
+
register,
|
|
29
|
+
unregister
|
|
30
|
+
} = _ref2,
|
|
31
|
+
otherActions = _objectWithoutProperties(_ref2, _excluded2);
|
|
32
|
+
|
|
33
|
+
useEffect(() => {
|
|
36
34
|
if (ref && register) register(ref, props);
|
|
37
|
-
return
|
|
35
|
+
return () => {
|
|
38
36
|
if (ref && unregister) unregister(ref);
|
|
39
37
|
};
|
|
40
38
|
}, [ref]); // if the focus item is not wrapped with the focus provider then return null
|
|
@@ -44,4 +42,3 @@ var useFocusGroupWithState = function useFocusGroupWithState() {
|
|
|
44
42
|
};
|
|
45
43
|
|
|
46
44
|
export { useFocusGroupItem as default, useFocusGroupWithState };
|
|
47
|
-
//# sourceMappingURL=useFocusGroupItem.js.map
|
|
@@ -1,24 +1,23 @@
|
|
|
1
1
|
// eslint-disable-next-line max-statements
|
|
2
|
-
function getNextCellPosition(
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
var isLeftRight = directionX !== 0;
|
|
2
|
+
function getNextCellPosition({
|
|
3
|
+
grid,
|
|
4
|
+
currentRow = 0,
|
|
5
|
+
currentCell = 0,
|
|
6
|
+
directionY,
|
|
7
|
+
directionX,
|
|
8
|
+
shouldWrapCells,
|
|
9
|
+
shouldWrapRows
|
|
10
|
+
}) {
|
|
11
|
+
let nextRow = currentRow + directionY;
|
|
12
|
+
let nextCell = currentCell + directionX;
|
|
13
|
+
const rowCount = grid.length;
|
|
14
|
+
const isLeftRight = directionX !== 0;
|
|
16
15
|
|
|
17
16
|
if (!rowCount) {
|
|
18
17
|
return false;
|
|
19
18
|
}
|
|
20
19
|
|
|
21
|
-
|
|
20
|
+
const cellsLength = grid[0].length; // moving horizontally
|
|
22
21
|
|
|
23
22
|
if (shouldWrapCells && isLeftRight) {
|
|
24
23
|
// to left
|
|
@@ -56,4 +55,3 @@ function getNextCellPosition(_ref) {
|
|
|
56
55
|
}
|
|
57
56
|
|
|
58
57
|
export { getNextCellPosition as default };
|
|
59
|
-
//# sourceMappingURL=getNextCellPosition.js.map
|
|
@@ -1,38 +1,35 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import _inherits from '@babel/runtime/helpers/esm/inherits';
|
|
5
|
-
import _possibleConstructorReturn from '@babel/runtime/helpers/esm/possibleConstructorReturn';
|
|
6
|
-
import _getPrototypeOf from '@babel/runtime/helpers/esm/getPrototypeOf';
|
|
7
|
-
import React, { Component } from 'react';
|
|
8
|
-
import PropTypes from 'prop-types';
|
|
1
|
+
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
|
+
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
3
|
+
import { Component } from 'react';
|
|
9
4
|
import { GroupContext } from './GroupContext.js';
|
|
10
5
|
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
var target = e.target,
|
|
17
|
-
currentTarget = e.currentTarget;
|
|
6
|
+
const getValueItem = e => {
|
|
7
|
+
const {
|
|
8
|
+
target,
|
|
9
|
+
currentTarget
|
|
10
|
+
} = e;
|
|
18
11
|
|
|
19
12
|
if (target) {
|
|
20
|
-
|
|
13
|
+
const {
|
|
14
|
+
value
|
|
15
|
+
} = target;
|
|
21
16
|
return value;
|
|
22
17
|
}
|
|
23
18
|
|
|
24
19
|
if (currentTarget) {
|
|
25
|
-
|
|
26
|
-
|
|
20
|
+
const {
|
|
21
|
+
value
|
|
22
|
+
} = currentTarget;
|
|
23
|
+
return value;
|
|
27
24
|
}
|
|
28
25
|
|
|
29
26
|
return e;
|
|
30
27
|
};
|
|
31
28
|
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
29
|
+
const toggleItemValue = (array, e) => {
|
|
30
|
+
const newvalue = getValueItem(e);
|
|
31
|
+
const res = array;
|
|
32
|
+
const index = array.indexOf(newvalue);
|
|
36
33
|
|
|
37
34
|
if (index === -1) {
|
|
38
35
|
res.push(newvalue);
|
|
@@ -43,91 +40,73 @@ var toggleItemValue = function toggleItemValue(array, e) {
|
|
|
43
40
|
return res;
|
|
44
41
|
};
|
|
45
42
|
|
|
46
|
-
|
|
43
|
+
const {
|
|
44
|
+
Provider
|
|
45
|
+
} = GroupContext;
|
|
47
46
|
/** deprecated use CheckableGroup instead */
|
|
48
47
|
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
_this = _super.call(this, props);
|
|
60
|
-
var activeValue = props.activeValue,
|
|
61
|
-
disabled = props.disabled;
|
|
62
|
-
_this.state = {
|
|
63
|
-
activeValue: activeValue,
|
|
64
|
-
disabled: disabled,
|
|
48
|
+
class Group extends Component {
|
|
49
|
+
constructor(props) {
|
|
50
|
+
super(props);
|
|
51
|
+
const {
|
|
52
|
+
activeValue,
|
|
53
|
+
disabled
|
|
54
|
+
} = props;
|
|
55
|
+
this.state = {
|
|
56
|
+
activeValue,
|
|
57
|
+
disabled,
|
|
65
58
|
prevValue: null,
|
|
66
|
-
onChange:
|
|
59
|
+
onChange: this.handleChange.bind(this)
|
|
67
60
|
};
|
|
68
|
-
return _this;
|
|
69
61
|
}
|
|
70
62
|
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
}
|
|
98
|
-
}, {
|
|
99
|
-
key: "render",
|
|
100
|
-
value: function render() {
|
|
101
|
-
var children = this.props.children;
|
|
102
|
-
return /*#__PURE__*/React.createElement(Provider, {
|
|
103
|
-
value: this.state
|
|
104
|
-
}, children);
|
|
105
|
-
}
|
|
106
|
-
}], [{
|
|
107
|
-
key: "getDerivedStateFromProps",
|
|
108
|
-
value: function getDerivedStateFromProps(nextProps, _ref) {
|
|
109
|
-
var prevValue = _ref.prevValue;
|
|
110
|
-
if (nextProps.activeValue === prevValue) return null;
|
|
111
|
-
return {
|
|
112
|
-
activeValue: nextProps.activeValue,
|
|
113
|
-
prevValue: nextProps.activeValue
|
|
114
|
-
};
|
|
63
|
+
static getDerivedStateFromProps(nextProps, {
|
|
64
|
+
prevValue
|
|
65
|
+
}) {
|
|
66
|
+
if (nextProps.activeValue === prevValue) return null;
|
|
67
|
+
return {
|
|
68
|
+
activeValue: nextProps.activeValue,
|
|
69
|
+
prevValue: nextProps.activeValue
|
|
70
|
+
};
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
handleChange(e, ...rest) {
|
|
74
|
+
const {
|
|
75
|
+
multiple,
|
|
76
|
+
onChange
|
|
77
|
+
} = this.props;
|
|
78
|
+
const {
|
|
79
|
+
activeValue
|
|
80
|
+
} = this.state;
|
|
81
|
+
const value = getValueItem(e);
|
|
82
|
+
let newValue;
|
|
83
|
+
|
|
84
|
+
if (multiple) {
|
|
85
|
+
newValue = toggleItemValue(activeValue || [], value);
|
|
86
|
+
} else if (activeValue !== value) {
|
|
87
|
+
// default behaviour it will be toggle the active value
|
|
88
|
+
newValue = value;
|
|
115
89
|
}
|
|
116
|
-
}]);
|
|
117
90
|
|
|
118
|
-
|
|
119
|
-
|
|
91
|
+
this.setState({
|
|
92
|
+
activeValue: newValue
|
|
93
|
+
});
|
|
94
|
+
if (onChange) onChange(newValue, ...rest);
|
|
95
|
+
}
|
|
96
|
+
|
|
97
|
+
render() {
|
|
98
|
+
const {
|
|
99
|
+
children
|
|
100
|
+
} = this.props;
|
|
101
|
+
return /*#__PURE__*/_jsx(Provider, {
|
|
102
|
+
value: this.state
|
|
103
|
+
}, void 0, children);
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
}
|
|
120
107
|
|
|
121
108
|
Group.defaultProps = {
|
|
122
109
|
multiple: false
|
|
123
110
|
};
|
|
124
|
-
Group.propTypes = {
|
|
125
|
-
children: PropTypes.array,
|
|
126
|
-
multiple: PropTypes.bool,
|
|
127
|
-
onChange: PropTypes.func,
|
|
128
|
-
activeValue: PropTypes.oneOfType([PropTypes.array, PropTypes.number]),
|
|
129
|
-
disabled: PropTypes.bool
|
|
130
|
-
};
|
|
131
111
|
|
|
132
112
|
export { Group as default };
|
|
133
|
-
//# sourceMappingURL=Group.js.map
|
|
@@ -1,14 +1,13 @@
|
|
|
1
|
-
import
|
|
1
|
+
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
|
+
import 'react';
|
|
2
3
|
import { GroupContext } from './GroupContext.js';
|
|
3
4
|
|
|
4
|
-
|
|
5
|
+
const {
|
|
6
|
+
Consumer
|
|
7
|
+
} = GroupContext;
|
|
5
8
|
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
return render(context);
|
|
10
|
-
});
|
|
11
|
-
};
|
|
9
|
+
const GroupItem = ({
|
|
10
|
+
render
|
|
11
|
+
}) => /*#__PURE__*/_jsx(Consumer, {}, void 0, context => render(context));
|
|
12
12
|
|
|
13
13
|
export { GroupItem as default };
|
|
14
|
-
//# sourceMappingURL=GroupItem.js.map
|
|
@@ -1,12 +1,3 @@
|
|
|
1
1
|
export { default as Group } from './Group.js';
|
|
2
2
|
export { GroupContext } from './GroupContext.js';
|
|
3
3
|
export { default as GroupItem } from './GroupItem.js';
|
|
4
|
-
import '@babel/runtime/helpers/esm/classCallCheck';
|
|
5
|
-
import '@babel/runtime/helpers/esm/createClass';
|
|
6
|
-
import '@babel/runtime/helpers/esm/assertThisInitialized';
|
|
7
|
-
import '@babel/runtime/helpers/esm/inherits';
|
|
8
|
-
import '@babel/runtime/helpers/esm/possibleConstructorReturn';
|
|
9
|
-
import '@babel/runtime/helpers/esm/getPrototypeOf';
|
|
10
|
-
import 'react';
|
|
11
|
-
import 'prop-types';
|
|
12
|
-
//# sourceMappingURL=index.js.map
|