@apia/table 1.0.2 → 2.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Cell.js +52 -0
- package/dist/Cell.js.map +1 -0
- package/dist/FilterCell.js +68 -0
- package/dist/FilterCell.js.map +1 -0
- package/dist/Header.js +171 -0
- package/dist/Header.js.map +1 -0
- package/dist/HeaderCell.js +223 -0
- package/dist/HeaderCell.js.map +1 -0
- package/dist/KeyHandler.js +28 -0
- package/dist/KeyHandler.js.map +1 -0
- package/dist/ResponsiveTable.d.ts +8 -0
- package/dist/ResponsiveTable.d.ts.map +1 -0
- package/dist/ResponsiveTable.js +29 -0
- package/dist/ResponsiveTable.js.map +1 -0
- package/dist/ResponsiveTableContext.d.ts +8 -0
- package/dist/ResponsiveTableContext.d.ts.map +1 -0
- package/dist/ResponsiveTableContext.js +140 -0
- package/dist/ResponsiveTableContext.js.map +1 -0
- package/dist/Row.js +230 -0
- package/dist/Row.js.map +1 -0
- package/dist/SeparatorCell.js +20 -0
- package/dist/SeparatorCell.js.map +1 -0
- package/dist/StateCell.js +19 -0
- package/dist/StateCell.js.map +1 -0
- package/dist/filters/RangeFilter.js +61 -0
- package/dist/filters/RangeFilter.js.map +1 -0
- package/dist/index.d.ts +25 -628
- package/dist/index.js +25 -3273
- package/dist/index.js.map +1 -1
- package/dist/renderers/AccordionCell.d.ts +15 -0
- package/dist/renderers/AccordionCell.d.ts.map +1 -0
- package/dist/renderers/AccordionCell.js +23 -0
- package/dist/renderers/AccordionCell.js.map +1 -0
- package/dist/renderers/AccordionDocNameCellRenderer.d.ts +11 -0
- package/dist/renderers/AccordionDocNameCellRenderer.d.ts.map +1 -0
- package/dist/renderers/AccordionDocNameCellRenderer.js +39 -0
- package/dist/renderers/AccordionDocNameCellRenderer.js.map +1 -0
- package/dist/renderers/AccordionElement.d.ts +11 -0
- package/dist/renderers/AccordionElement.d.ts.map +1 -0
- package/dist/renderers/AccordionElement.js +115 -0
- package/dist/renderers/AccordionElement.js.map +1 -0
- package/dist/renderers/AccordionHTMLCellRenderer.d.ts +8 -0
- package/dist/renderers/AccordionHTMLCellRenderer.d.ts.map +1 -0
- package/dist/renderers/AccordionHTMLCellRenderer.js +37 -0
- package/dist/renderers/AccordionHTMLCellRenderer.js.map +1 -0
- package/dist/renderers/AccordionRenderer.d.ts +6 -0
- package/dist/renderers/AccordionRenderer.d.ts.map +1 -0
- package/dist/renderers/AccordionRenderer.js +76 -0
- package/dist/renderers/AccordionRenderer.js.map +1 -0
- package/dist/renderers/AdditionalColumnDefaultRenderer.d.ts +7 -0
- package/dist/renderers/AdditionalColumnDefaultRenderer.d.ts.map +1 -0
- package/dist/renderers/AdditionalColumnDefaultRenderer.js +31 -0
- package/dist/renderers/AdditionalColumnDefaultRenderer.js.map +1 -0
- package/dist/renderers/DefaultCellRenderer.d.ts +11 -0
- package/dist/renderers/DefaultCellRenderer.d.ts.map +1 -0
- package/dist/renderers/DefaultCellRenderer.js +49 -0
- package/dist/renderers/DefaultCellRenderer.js.map +1 -0
- package/dist/renderers/DefaultRowRenderer.d.ts +6 -0
- package/dist/renderers/DefaultRowRenderer.d.ts.map +1 -0
- package/dist/renderers/DefaultRowRenderer.js +26 -0
- package/dist/renderers/DefaultRowRenderer.js.map +1 -0
- package/dist/renderers/DocNameCellRenderer.d.ts +10 -0
- package/dist/renderers/DocNameCellRenderer.d.ts.map +1 -0
- package/dist/renderers/DocNameCellRenderer.js +43 -0
- package/dist/renderers/DocNameCellRenderer.js.map +1 -0
- package/dist/renderers/HTMLCellRenderer.d.ts +8 -0
- package/dist/renderers/HTMLCellRenderer.d.ts.map +1 -0
- package/dist/renderers/HTMLCellRenderer.js +29 -0
- package/dist/renderers/HTMLCellRenderer.js.map +1 -0
- package/dist/renderers/IsLoadingRenderer.d.ts +6 -0
- package/dist/renderers/IsLoadingRenderer.d.ts.map +1 -0
- package/dist/renderers/IsLoadingRenderer.js +9 -0
- package/dist/renderers/IsLoadingRenderer.js.map +1 -0
- package/dist/renderers/NoRegistersRenderer.d.ts +6 -0
- package/dist/renderers/NoRegistersRenderer.d.ts.map +1 -0
- package/dist/renderers/NoRegistersRenderer.js +11 -0
- package/dist/renderers/NoRegistersRenderer.js.map +1 -0
- package/dist/renderers/PriorityAccordionRenderer.d.ts +6 -0
- package/dist/renderers/PriorityAccordionRenderer.d.ts.map +1 -0
- package/dist/renderers/PriorityAccordionRenderer.js +36 -0
- package/dist/renderers/PriorityAccordionRenderer.js.map +1 -0
- package/dist/renderers/PriorityRenderer.d.ts +9 -0
- package/dist/renderers/PriorityRenderer.d.ts.map +1 -0
- package/dist/renderers/PriorityRenderer.js +46 -0
- package/dist/renderers/PriorityRenderer.js.map +1 -0
- package/dist/renderers/RowStatesRenderer.d.ts +9 -0
- package/dist/renderers/RowStatesRenderer.d.ts.map +1 -0
- package/dist/renderers/RowStatesRenderer.js +34 -0
- package/dist/renderers/RowStatesRenderer.js.map +1 -0
- package/dist/renderers/StatusAccordionRenderer.d.ts +6 -0
- package/dist/renderers/StatusAccordionRenderer.d.ts.map +1 -0
- package/dist/renderers/StatusAccordionRenderer.js +23 -0
- package/dist/renderers/StatusAccordionRenderer.js.map +1 -0
- package/dist/renderers/StatusRenderer.d.ts +9 -0
- package/dist/renderers/StatusRenderer.d.ts.map +1 -0
- package/dist/renderers/StatusRenderer.js +54 -0
- package/dist/renderers/StatusRenderer.js.map +1 -0
- package/dist/renderers/TableRenderer.d.ts +6 -0
- package/dist/renderers/TableRenderer.d.ts.map +1 -0
- package/dist/renderers/TableRenderer.js +50 -0
- package/dist/renderers/TableRenderer.js.map +1 -0
- package/dist/renderers/makeAccordionAsyncRenderer.d.ts +9 -0
- package/dist/renderers/makeAccordionAsyncRenderer.d.ts.map +1 -0
- package/dist/renderers/makeAccordionAsyncRenderer.js +35 -0
- package/dist/renderers/makeAccordionAsyncRenderer.js.map +1 -0
- package/dist/renderers/makeAsyncRenderer.d.ts +10 -0
- package/dist/renderers/makeAsyncRenderer.d.ts.map +1 -0
- package/dist/renderers/makeAsyncRenderer.js +47 -0
- package/dist/renderers/makeAsyncRenderer.js.map +1 -0
- package/dist/store/index.d.ts +72 -0
- package/dist/store/index.d.ts.map +1 -0
- package/dist/store/index.js +131 -0
- package/dist/store/index.js.map +1 -0
- package/dist/store/selection/getInitialState.js +22 -0
- package/dist/store/selection/getInitialState.js.map +1 -0
- package/dist/store/selection/getReduxActions.js +42 -0
- package/dist/store/selection/getReduxActions.js.map +1 -0
- package/dist/store/selection/handleKey.js +143 -0
- package/dist/store/selection/handleKey.js.map +1 -0
- package/dist/store/selection/makeKeyHandler.js +336 -0
- package/dist/store/selection/makeKeyHandler.js.map +1 -0
- package/dist/store/selection/setNewFocused.js +101 -0
- package/dist/store/selection/setNewFocused.js.map +1 -0
- package/dist/store/selection/types.d.ts +150 -0
- package/dist/store/selection/types.d.ts.map +1 -0
- package/dist/store/selection/useDomProps.js +181 -0
- package/dist/store/selection/useDomProps.js.map +1 -0
- package/dist/store/types.d.ts +19 -0
- package/dist/store/types.d.ts.map +1 -0
- package/dist/types.d.ts +315 -0
- package/dist/types.d.ts.map +1 -0
- package/dist/types.js +6 -0
- package/dist/types.js.map +1 -0
- package/package.json +22 -34
- package/LICENSE.md +0 -21
- package/README.md +0 -28
- package/cleanDist.json +0 -3
|
@@ -0,0 +1,72 @@
|
|
|
1
|
+
import * as _reduxjs_toolkit from '@reduxjs/toolkit';
|
|
2
|
+
import * as _apia_util from '@apia/util';
|
|
3
|
+
import * as immer_dist_internal from 'immer/dist/internal';
|
|
4
|
+
import { ISelectableState, IBasicColumn, IBasicFilter, TBasicRow, THandleKey, INewFocus } from './selection/types.js';
|
|
5
|
+
import * as react_redux from 'react-redux';
|
|
6
|
+
import * as _reduxjs_toolkit_dist_configureStore from '@reduxjs/toolkit/dist/configureStore';
|
|
7
|
+
import * as redux_thunk from 'redux-thunk';
|
|
8
|
+
import * as redux from 'redux';
|
|
9
|
+
import { TResponsiveTableSlice, TResponsiveTableAction, TResponsiveTableState } from './types.js';
|
|
10
|
+
import { TResponsiveTableRow } from '../types.js';
|
|
11
|
+
|
|
12
|
+
declare const responsiveTableStore: _reduxjs_toolkit_dist_configureStore.ToolkitStore<{
|
|
13
|
+
responsiveTableSlice: TResponsiveTableSlice;
|
|
14
|
+
}, redux.AnyAction, [redux_thunk.ThunkMiddleware<{
|
|
15
|
+
responsiveTableSlice: TResponsiveTableSlice;
|
|
16
|
+
}>]>;
|
|
17
|
+
declare const useResponsiveTable: <TSelected>(selector: (state: {
|
|
18
|
+
responsiveTableSlice: TResponsiveTableSlice;
|
|
19
|
+
}) => TSelected, equalityFn?: react_redux.EqualityFn<TSelected> | undefined) => TSelected;
|
|
20
|
+
declare const responsiveTableActions: _reduxjs_toolkit.CaseReducerActions<{
|
|
21
|
+
handleKey(state: immer_dist_internal.WritableDraft<Record<string, ISelectableState<IBasicColumn, IBasicFilter, string | TBasicRow>>>, { payload }: {
|
|
22
|
+
payload: THandleKey & {
|
|
23
|
+
id: string;
|
|
24
|
+
};
|
|
25
|
+
type: string;
|
|
26
|
+
}): void;
|
|
27
|
+
selectionStateUpdate(state: immer_dist_internal.WritableDraft<Record<string, ISelectableState<IBasicColumn, IBasicFilter, string | TBasicRow>>>, { payload: { id, ...payload } }: {
|
|
28
|
+
payload: Partial<ISelectableState<IBasicColumn, IBasicFilter, string | TBasicRow>> & {
|
|
29
|
+
id: string;
|
|
30
|
+
};
|
|
31
|
+
type: string;
|
|
32
|
+
}): void;
|
|
33
|
+
setNewFocused(state: immer_dist_internal.WritableDraft<Record<string, ISelectableState<IBasicColumn, IBasicFilter, string | TBasicRow>>>, { payload: { id, ...payload } }: {
|
|
34
|
+
payload: INewFocus & {
|
|
35
|
+
id: string;
|
|
36
|
+
};
|
|
37
|
+
type: string;
|
|
38
|
+
}): void;
|
|
39
|
+
updateByClick(state: immer_dist_internal.WritableDraft<Record<string, ISelectableState<IBasicColumn, IBasicFilter, string | TBasicRow>>>, { payload: { id, colIndex, rowIndex, ariaColIndex, ariaRowIndex, isFocused, ...payload }, }: {
|
|
40
|
+
payload: (_apia_util.TRequireOnlyOne<{
|
|
41
|
+
ariaRowIndex: number;
|
|
42
|
+
rowIndex: number;
|
|
43
|
+
}> & _apia_util.TRequireOnlyOne<{
|
|
44
|
+
ariaColIndex?: number | undefined;
|
|
45
|
+
colIndex: number;
|
|
46
|
+
}> & Pick<INewFocus, "isFocused" | "altKey" | "ctrlKey" | "shiftKey">) & {
|
|
47
|
+
id: string;
|
|
48
|
+
};
|
|
49
|
+
type: string;
|
|
50
|
+
}): void;
|
|
51
|
+
update(state: immer_dist_internal.WritableDraft<TResponsiveTableSlice>, { payload: { tableName, ...rest }, }: TResponsiveTableAction<Partial<TResponsiveTableState> & {
|
|
52
|
+
isFocused?: boolean;
|
|
53
|
+
}>): void;
|
|
54
|
+
addRows(state: immer_dist_internal.WritableDraft<TResponsiveTableSlice>, { payload }: TResponsiveTableAction<{
|
|
55
|
+
newRows: TResponsiveTableRow[];
|
|
56
|
+
}>): void;
|
|
57
|
+
deleteRows(state: immer_dist_internal.WritableDraft<TResponsiveTableSlice>, { payload }: TResponsiveTableAction<{
|
|
58
|
+
rowIndices: number[];
|
|
59
|
+
}>): void;
|
|
60
|
+
destroy(state: immer_dist_internal.WritableDraft<TResponsiveTableSlice>, { payload: { tableName } }: TResponsiveTableAction): void;
|
|
61
|
+
swapFocusedRow(state: immer_dist_internal.WritableDraft<TResponsiveTableSlice>, { payload: { newIndex, tableName }, }: {
|
|
62
|
+
payload: {
|
|
63
|
+
newIndex: number;
|
|
64
|
+
} & {
|
|
65
|
+
tableName: string;
|
|
66
|
+
};
|
|
67
|
+
type: string;
|
|
68
|
+
}): void;
|
|
69
|
+
}, "responsiveTableSlice">;
|
|
70
|
+
|
|
71
|
+
export { responsiveTableActions, responsiveTableStore, useResponsiveTable };
|
|
72
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
import { createSlice, injectReducers } from '@apia/store';
|
|
2
|
+
import { getInitialState as getInitialState$1 } from './selection/getInitialState.js';
|
|
3
|
+
import { setNewFocused } from './selection/setNewFocused.js';
|
|
4
|
+
import { shoutKeyhandlerLive } from './selection/makeKeyHandler.js';
|
|
5
|
+
import { getReduxActions } from './selection/getReduxActions.js';
|
|
6
|
+
|
|
7
|
+
function getInitialState() {
|
|
8
|
+
const newState = {
|
|
9
|
+
...getInitialState$1(),
|
|
10
|
+
allowSelection: true,
|
|
11
|
+
allowSorting: true,
|
|
12
|
+
filters: [],
|
|
13
|
+
isLoading: false,
|
|
14
|
+
isMultiple: true,
|
|
15
|
+
accordionIndexColumns: {},
|
|
16
|
+
expandedRows: []
|
|
17
|
+
};
|
|
18
|
+
return newState;
|
|
19
|
+
}
|
|
20
|
+
const responsiveTableSlice = createSlice({
|
|
21
|
+
name: "responsiveTableSlice",
|
|
22
|
+
initialState: {},
|
|
23
|
+
reducers: {
|
|
24
|
+
update(state, {
|
|
25
|
+
payload: { tableName, ...rest }
|
|
26
|
+
}) {
|
|
27
|
+
if (!state[tableName])
|
|
28
|
+
state[tableName] = getInitialState();
|
|
29
|
+
state[tableName] = { ...state[tableName], ...rest };
|
|
30
|
+
setNewFocused(state[tableName], {
|
|
31
|
+
altKey: false,
|
|
32
|
+
ctrlKey: false,
|
|
33
|
+
shiftKey: false,
|
|
34
|
+
shouldSelectNewFocused: rest.isFocused ?? state[tableName].isFocused
|
|
35
|
+
});
|
|
36
|
+
if (rest.columns) {
|
|
37
|
+
state[tableName].nonAdditionalColumnsCount = rest.columns.filter(
|
|
38
|
+
(current) => !current.showAsAdditional
|
|
39
|
+
).length;
|
|
40
|
+
}
|
|
41
|
+
if (rest.rows) {
|
|
42
|
+
state[tableName].statesColumns = Math.max(
|
|
43
|
+
state[tableName]?.reserveColumnsForStates ?? 0,
|
|
44
|
+
...state[tableName]?.rows?.map(
|
|
45
|
+
(current) => current.states?.length ?? 0
|
|
46
|
+
) ?? [0]
|
|
47
|
+
);
|
|
48
|
+
}
|
|
49
|
+
if (rest.filters) {
|
|
50
|
+
state[tableName].hasNonAdditionalFilters = rest.filters.filter(
|
|
51
|
+
(current) => !current.asAdditional && (rest.columns ?? state[tableName].columns)?.find(
|
|
52
|
+
(search) => search.name === current.column
|
|
53
|
+
)
|
|
54
|
+
).length > 0;
|
|
55
|
+
}
|
|
56
|
+
},
|
|
57
|
+
addRows(state, { payload }) {
|
|
58
|
+
if (!state[payload.tableName])
|
|
59
|
+
state[payload.tableName] = getInitialState();
|
|
60
|
+
state[payload.tableName].rows = state[payload.tableName].rows.concat(
|
|
61
|
+
...payload.newRows
|
|
62
|
+
);
|
|
63
|
+
setNewFocused(state[payload.tableName], {
|
|
64
|
+
altKey: false,
|
|
65
|
+
ctrlKey: false,
|
|
66
|
+
shiftKey: false,
|
|
67
|
+
shouldSelectNewFocused: true,
|
|
68
|
+
newFocusedRow: state[payload.tableName].rows.length
|
|
69
|
+
});
|
|
70
|
+
},
|
|
71
|
+
deleteRows(state, { payload }) {
|
|
72
|
+
const table = state[payload.tableName];
|
|
73
|
+
const minIndex = payload.rowIndices.reduce((min, current) => {
|
|
74
|
+
return current < min ? current : min;
|
|
75
|
+
}, Infinity);
|
|
76
|
+
table.rows = table.rows.filter(
|
|
77
|
+
(_, index) => !payload.rowIndices.includes(index)
|
|
78
|
+
);
|
|
79
|
+
setNewFocused(state[payload.tableName], {
|
|
80
|
+
altKey: false,
|
|
81
|
+
ctrlKey: false,
|
|
82
|
+
shiftKey: false,
|
|
83
|
+
shouldSelectNewFocused: true,
|
|
84
|
+
newFocusedRow: minIndex
|
|
85
|
+
});
|
|
86
|
+
state[payload.tableName].isFocused = false;
|
|
87
|
+
},
|
|
88
|
+
destroy(state, { payload: { tableName } }) {
|
|
89
|
+
delete state[tableName];
|
|
90
|
+
},
|
|
91
|
+
swapFocusedRow(state, {
|
|
92
|
+
payload: { newIndex, tableName }
|
|
93
|
+
}) {
|
|
94
|
+
const tableState = state[tableName];
|
|
95
|
+
const focusedIndex = tableState.focusedRow;
|
|
96
|
+
if (focusedIndex === void 0 || newIndex < 0 || newIndex >= tableState.rows.length)
|
|
97
|
+
return;
|
|
98
|
+
if (focusedIndex === newIndex) {
|
|
99
|
+
if (tableState.draggingRow === newIndex)
|
|
100
|
+
tableState.draggingRow = void 0;
|
|
101
|
+
else
|
|
102
|
+
tableState.draggingRow = newIndex;
|
|
103
|
+
return;
|
|
104
|
+
}
|
|
105
|
+
shoutKeyhandlerLive("whichIsTheNewIndex", { newIndex });
|
|
106
|
+
const isSelected = tableState.selectedRows.includes(focusedIndex);
|
|
107
|
+
if (isSelected) {
|
|
108
|
+
tableState.selectedRows = [
|
|
109
|
+
...tableState.selectedRows.filter(
|
|
110
|
+
(current) => current !== focusedIndex
|
|
111
|
+
),
|
|
112
|
+
newIndex
|
|
113
|
+
];
|
|
114
|
+
}
|
|
115
|
+
const aux = tableState.rows[newIndex];
|
|
116
|
+
tableState.rows[newIndex] = tableState.rows[focusedIndex];
|
|
117
|
+
tableState.rows[focusedIndex] = aux;
|
|
118
|
+
tableState.focusedRow = newIndex;
|
|
119
|
+
tableState.draggingRow = newIndex;
|
|
120
|
+
},
|
|
121
|
+
// Rows selection
|
|
122
|
+
...getReduxActions()
|
|
123
|
+
}
|
|
124
|
+
});
|
|
125
|
+
const { store: responsiveTableStore, useSelector: useResponsiveTable } = injectReducers({
|
|
126
|
+
responsiveTableSlice: responsiveTableSlice.reducer
|
|
127
|
+
});
|
|
128
|
+
const responsiveTableActions = responsiveTableSlice.actions;
|
|
129
|
+
|
|
130
|
+
export { responsiveTableActions, responsiveTableStore, useResponsiveTable };
|
|
131
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/store/index.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-dynamic-delete */\nimport { createSlice, injectReducers } from '@apia/store';\nimport {\n TResponsiveTableAction,\n TResponsiveTableIndexColumns,\n TResponsiveTableSlice,\n TResponsiveTableState,\n} from './types';\nimport { getInitialState as selectionGetInitialState } from './selection/getInitialState';\nimport { setNewFocused } from './selection/setNewFocused';\nimport { TResponsiveTableRow } from '../types';\nimport { shoutKeyhandlerLive } from './selection/makeKeyHandler';\nimport { getReduxActions } from './selection/getReduxActions';\n\nfunction getInitialState(): TResponsiveTableState {\n const newState: TResponsiveTableState = {\n ...selectionGetInitialState(),\n allowSelection: true,\n allowSorting: true,\n filters: [],\n isLoading: false,\n isMultiple: true,\n accordionIndexColumns: {} as TResponsiveTableIndexColumns,\n expandedRows: [],\n };\n\n return newState;\n}\n\nconst responsiveTableSlice = createSlice({\n name: 'responsiveTableSlice',\n initialState: {} as TResponsiveTableSlice,\n reducers: {\n update(\n state,\n {\n payload: { tableName, ...rest },\n }: TResponsiveTableAction<\n Partial<TResponsiveTableState> & { isFocused?: boolean }\n >,\n ) {\n if (!state[tableName]) state[tableName] = getInitialState();\n state[tableName] = { ...state[tableName], ...rest };\n setNewFocused(state[tableName], {\n altKey: false,\n ctrlKey: false,\n shiftKey: false,\n shouldSelectNewFocused: rest.isFocused ?? state[tableName].isFocused,\n });\n\n if (rest.columns) {\n state[tableName].nonAdditionalColumnsCount = rest.columns.filter(\n (current) => !current.showAsAdditional,\n ).length;\n }\n\n if (rest.rows) {\n state[tableName].statesColumns = Math.max(\n state[tableName]?.reserveColumnsForStates ?? 0,\n ...(state[tableName]?.rows?.map(\n (current) => current.states?.length ?? 0,\n ) ?? [0]),\n );\n }\n\n if (rest.filters) {\n state[tableName].hasNonAdditionalFilters =\n rest.filters.filter(\n (current) =>\n !current.asAdditional &&\n (rest.columns ?? state[tableName].columns)?.find(\n (search) => search.name === current.column,\n ),\n ).length > 0;\n }\n },\n addRows(\n state,\n { payload }: TResponsiveTableAction<{ newRows: TResponsiveTableRow[] }>,\n ) {\n if (!state[payload.tableName])\n state[payload.tableName] = getInitialState();\n state[payload.tableName].rows = state[payload.tableName].rows.concat(\n ...payload.newRows,\n );\n setNewFocused(state[payload.tableName], {\n altKey: false,\n ctrlKey: false,\n shiftKey: false,\n shouldSelectNewFocused: true,\n newFocusedRow: state[payload.tableName].rows.length,\n });\n },\n deleteRows(\n state,\n { payload }: TResponsiveTableAction<{ rowIndices: number[] }>,\n ) {\n const table = state[payload.tableName];\n const minIndex = payload.rowIndices.reduce((min, current) => {\n return current < min ? current : min;\n }, Infinity);\n table.rows = table.rows.filter(\n (_, index) => !payload.rowIndices.includes(index),\n );\n\n setNewFocused(state[payload.tableName], {\n altKey: false,\n ctrlKey: false,\n shiftKey: false,\n shouldSelectNewFocused: true,\n newFocusedRow: minIndex,\n });\n state[payload.tableName].isFocused = false;\n },\n destroy(state, { payload: { tableName } }: TResponsiveTableAction) {\n delete state[tableName];\n },\n swapFocusedRow(\n state,\n {\n payload: { newIndex, tableName },\n }: TResponsiveTableAction<{ newIndex: number }>,\n ) {\n const tableState = state[tableName];\n const focusedIndex = tableState.focusedRow;\n\n if (\n focusedIndex === undefined ||\n newIndex < 0 ||\n newIndex >= tableState.rows.length\n )\n return;\n\n if (focusedIndex === newIndex) {\n if (tableState.draggingRow === newIndex)\n tableState.draggingRow = undefined;\n else tableState.draggingRow = newIndex;\n return;\n }\n\n shoutKeyhandlerLive('whichIsTheNewIndex', { newIndex });\n\n const isSelected = tableState.selectedRows.includes(focusedIndex);\n\n if (isSelected) {\n tableState.selectedRows = [\n ...tableState.selectedRows.filter(\n (current) => current !== focusedIndex,\n ),\n newIndex,\n ];\n }\n\n const aux = tableState.rows[newIndex];\n tableState.rows[newIndex] = tableState.rows[focusedIndex];\n tableState.rows[focusedIndex] = aux;\n\n tableState.focusedRow = newIndex;\n tableState.draggingRow = newIndex;\n },\n\n // Rows selection\n ...getReduxActions(),\n },\n});\n\nexport const { store: responsiveTableStore, useSelector: useResponsiveTable } =\n injectReducers({\n responsiveTableSlice: responsiveTableSlice.reducer,\n });\n\nexport const responsiveTableActions = responsiveTableSlice.actions;\n"],"names":["selectionGetInitialState"],"mappings":"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"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
function getInitialState() {
|
|
2
|
+
return {
|
|
3
|
+
allowEdition: false,
|
|
4
|
+
allowSelection: true,
|
|
5
|
+
columns: [],
|
|
6
|
+
expandedRows: [],
|
|
7
|
+
isEditionMode: false,
|
|
8
|
+
isFocused: false,
|
|
9
|
+
filters: [],
|
|
10
|
+
focusedColumn: 0,
|
|
11
|
+
focusedRow: 0,
|
|
12
|
+
hasNonAdditionalFilters: false,
|
|
13
|
+
isMultiple: true,
|
|
14
|
+
nonAdditionalColumnsCount: 0,
|
|
15
|
+
rows: [],
|
|
16
|
+
selectedRows: [],
|
|
17
|
+
statesColumns: 0
|
|
18
|
+
};
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
export { getInitialState };
|
|
22
|
+
//# sourceMappingURL=getInitialState.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"getInitialState.js","sources":["../../../src/store/selection/getInitialState.ts"],"sourcesContent":["import { TApiaFilter } from '@apia/util';\nimport { ISelectableState, TBasicRow } from './types';\n\nexport function getInitialState<\n ColumnsType extends { name: string },\n RowsType extends TBasicRow | string,\n>(): ISelectableState<ColumnsType, TApiaFilter, RowsType> {\n return {\n allowEdition: false,\n allowSelection: true,\n columns: [],\n expandedRows: [],\n isEditionMode: false,\n isFocused: false,\n filters: [],\n focusedColumn: 0,\n focusedRow: 0,\n hasNonAdditionalFilters: false,\n isMultiple: true,\n nonAdditionalColumnsCount: 0,\n rows: [],\n selectedRows: [],\n statesColumns: 0,\n };\n}\n"],"names":[],"mappings":"AAGO,SAAS,eAG0C,GAAA;AACxD,EAAO,OAAA;AAAA,IACL,YAAc,EAAA,KAAA;AAAA,IACd,cAAgB,EAAA,IAAA;AAAA,IAChB,SAAS,EAAC;AAAA,IACV,cAAc,EAAC;AAAA,IACf,aAAe,EAAA,KAAA;AAAA,IACf,SAAW,EAAA,KAAA;AAAA,IACX,SAAS,EAAC;AAAA,IACV,aAAe,EAAA,CAAA;AAAA,IACf,UAAY,EAAA,CAAA;AAAA,IACZ,uBAAyB,EAAA,KAAA;AAAA,IACzB,UAAY,EAAA,IAAA;AAAA,IACZ,yBAA2B,EAAA,CAAA;AAAA,IAC3B,MAAM,EAAC;AAAA,IACP,cAAc,EAAC;AAAA,IACf,aAAe,EAAA,CAAA;AAAA,GACjB,CAAA;AACF;;;;"}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { handleKey } from './handleKey.js';
|
|
2
|
+
import { setNewFocused } from './setNewFocused.js';
|
|
3
|
+
|
|
4
|
+
function getReduxActions() {
|
|
5
|
+
return {
|
|
6
|
+
handleKey(state, { payload }) {
|
|
7
|
+
handleKey(state[payload.id], payload);
|
|
8
|
+
},
|
|
9
|
+
selectionStateUpdate(state, { payload: { id, ...payload } }) {
|
|
10
|
+
state[id] = { ...state[id], ...payload };
|
|
11
|
+
},
|
|
12
|
+
setNewFocused(state, { payload: { id, ...payload } }) {
|
|
13
|
+
setNewFocused(state[id], payload);
|
|
14
|
+
},
|
|
15
|
+
updateByClick(state, {
|
|
16
|
+
payload: {
|
|
17
|
+
id,
|
|
18
|
+
colIndex,
|
|
19
|
+
rowIndex,
|
|
20
|
+
ariaColIndex,
|
|
21
|
+
ariaRowIndex,
|
|
22
|
+
isFocused,
|
|
23
|
+
...payload
|
|
24
|
+
}
|
|
25
|
+
}) {
|
|
26
|
+
const hasFiltersRow = state[id].hasNonAdditionalFilters;
|
|
27
|
+
state[id].isEditionMode = false;
|
|
28
|
+
const newFocusedColumn = colIndex ?? ariaColIndex ?? 1;
|
|
29
|
+
const newFocusedRow = ariaRowIndex !== void 0 ? ariaRowIndex : (rowIndex ?? 0) - (1 + (hasFiltersRow ? 2 : 1));
|
|
30
|
+
setNewFocused(state[id], {
|
|
31
|
+
...payload,
|
|
32
|
+
newFocusedColumn,
|
|
33
|
+
newFocusedRow
|
|
34
|
+
});
|
|
35
|
+
if (isFocused !== void 0)
|
|
36
|
+
state[id].isFocused = isFocused;
|
|
37
|
+
}
|
|
38
|
+
};
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
export { getReduxActions };
|
|
42
|
+
//# sourceMappingURL=getReduxActions.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"getReduxActions.js","sources":["../../../src/store/selection/getReduxActions.ts"],"sourcesContent":["import type { Draft, PayloadAction } from '@apia/store';\nimport type { TRequireOnlyOne } from '@apia/util';\nimport { handleKey } from './handleKey';\nimport { setNewFocused } from './setNewFocused';\nimport { THandleKey, INewFocus, ISelectableState } from './types';\n\ntype TState = Draft<Record<string, ISelectableState>>;\n\nexport type TPayloadWithId<\n P = Record<string, unknown>,\n T extends string = string,\n M = never,\n E = never,\n> = PayloadAction<P & { id: string }, T, M, E>;\n\nexport type THandleKeyPayload = TPayloadWithId<THandleKey>;\nexport type TSelectionStateUpdatePayload = TPayloadWithId<\n Partial<ISelectableState>\n>;\nexport type TSetNewFocusedPayload = TPayloadWithId<INewFocus>;\nexport type TUpdateByClickPayload = TPayloadWithId<\n TRequireOnlyOne<{ ariaRowIndex: number; rowIndex: number }> &\n TRequireOnlyOne<{ ariaColIndex?: number; colIndex: number }> &\n Pick<INewFocus, 'altKey' | 'ctrlKey' | 'shiftKey' | 'isFocused'>\n>;\n\nexport function getReduxActions() {\n return {\n handleKey(state: TState, { payload }: THandleKeyPayload) {\n handleKey(state[payload.id], payload);\n },\n selectionStateUpdate(\n state: TState,\n { payload: { id, ...payload } }: TSelectionStateUpdatePayload,\n ) {\n state[id] = { ...state[id], ...payload };\n },\n setNewFocused(\n state: TState,\n { payload: { id, ...payload } }: TSetNewFocusedPayload,\n ) {\n setNewFocused(state[id], payload);\n },\n updateByClick(\n state: TState,\n {\n payload: {\n id,\n colIndex,\n rowIndex,\n ariaColIndex,\n ariaRowIndex,\n isFocused,\n ...payload\n },\n }: TUpdateByClickPayload,\n ) {\n const hasFiltersRow = state[id].hasNonAdditionalFilters;\n state[id].isEditionMode = false;\n\n const newFocusedColumn = colIndex ?? ariaColIndex ?? 1;\n const newFocusedRow =\n ariaRowIndex !== undefined\n ? ariaRowIndex\n : (rowIndex ?? 0) - (1 + (hasFiltersRow ? 2 : 1));\n\n setNewFocused(state[id], {\n ...payload,\n newFocusedColumn,\n newFocusedRow,\n });\n\n if (isFocused !== undefined) state[id].isFocused = isFocused;\n },\n };\n}\n"],"names":[],"mappings":";;;AA0BO,SAAS,eAAkB,GAAA;AAChC,EAAO,OAAA;AAAA,IACL,SAAU,CAAA,KAAA,EAAe,EAAE,OAAA,EAA8B,EAAA;AACvD,MAAA,SAAA,CAAU,KAAM,CAAA,OAAA,CAAQ,EAAE,CAAA,EAAG,OAAO,CAAA,CAAA;AAAA,KACtC;AAAA,IACA,oBAAA,CACE,OACA,EAAE,OAAA,EAAS,EAAE,EAAI,EAAA,GAAG,OAAQ,EAAA,EAC5B,EAAA;AACA,MAAM,KAAA,CAAA,EAAE,IAAI,EAAE,GAAG,MAAM,EAAE,CAAA,EAAG,GAAG,OAAQ,EAAA,CAAA;AAAA,KACzC;AAAA,IACA,aAAA,CACE,OACA,EAAE,OAAA,EAAS,EAAE,EAAI,EAAA,GAAG,OAAQ,EAAA,EAC5B,EAAA;AACA,MAAc,aAAA,CAAA,KAAA,CAAM,EAAE,CAAA,EAAG,OAAO,CAAA,CAAA;AAAA,KAClC;AAAA,IACA,cACE,KACA,EAAA;AAAA,MACE,OAAS,EAAA;AAAA,QACP,EAAA;AAAA,QACA,QAAA;AAAA,QACA,QAAA;AAAA,QACA,YAAA;AAAA,QACA,YAAA;AAAA,QACA,SAAA;AAAA,QACA,GAAG,OAAA;AAAA,OACL;AAAA,KAEF,EAAA;AACA,MAAM,MAAA,aAAA,GAAgB,KAAM,CAAA,EAAE,CAAE,CAAA,uBAAA,CAAA;AAChC,MAAM,KAAA,CAAA,EAAE,EAAE,aAAgB,GAAA,KAAA,CAAA;AAE1B,MAAM,MAAA,gBAAA,GAAmB,YAAY,YAAgB,IAAA,CAAA,CAAA;AACrD,MAAM,MAAA,aAAA,GACJ,iBAAiB,KACb,CAAA,GAAA,YAAA,GAAA,CACC,YAAY,CAAM,KAAA,CAAA,IAAK,gBAAgB,CAAI,GAAA,CAAA,CAAA,CAAA,CAAA;AAElD,MAAc,aAAA,CAAA,KAAA,CAAM,EAAE,CAAG,EAAA;AAAA,QACvB,GAAG,OAAA;AAAA,QACH,gBAAA;AAAA,QACA,aAAA;AAAA,OACD,CAAA,CAAA;AAED,MAAA,IAAI,SAAc,KAAA,KAAA,CAAA;AAAW,QAAM,KAAA,CAAA,EAAE,EAAE,SAAY,GAAA,SAAA,CAAA;AAAA,KACrD;AAAA,GACF,CAAA;AACF;;;;"}
|
|
@@ -0,0 +1,143 @@
|
|
|
1
|
+
import { setNewFocused } from './setNewFocused.js';
|
|
2
|
+
|
|
3
|
+
function willHandleKey(ev, state) {
|
|
4
|
+
const actualKey = ev.key.toLowerCase();
|
|
5
|
+
if (state.isEditionMode)
|
|
6
|
+
return false;
|
|
7
|
+
if (actualKey === " " && ev.ctrlKey)
|
|
8
|
+
return true;
|
|
9
|
+
if (actualKey === "a" && ev.ctrlKey)
|
|
10
|
+
return true;
|
|
11
|
+
if (actualKey === "m" && ev.ctrlKey)
|
|
12
|
+
return true;
|
|
13
|
+
if (state.draggingRow !== void 0) {
|
|
14
|
+
return ["Escape", "Enter"].includes(ev.key);
|
|
15
|
+
}
|
|
16
|
+
return [
|
|
17
|
+
"arrowup",
|
|
18
|
+
"arrowdown",
|
|
19
|
+
"arrowleft",
|
|
20
|
+
"arrowright",
|
|
21
|
+
"end",
|
|
22
|
+
"enter",
|
|
23
|
+
"home",
|
|
24
|
+
"pageup",
|
|
25
|
+
"pagedown"
|
|
26
|
+
].includes(ev.key.toLowerCase());
|
|
27
|
+
}
|
|
28
|
+
function handleKey(state, { ev }) {
|
|
29
|
+
const {
|
|
30
|
+
altKey: isAltPressed,
|
|
31
|
+
ctrlKey: isCtrlPressed,
|
|
32
|
+
key,
|
|
33
|
+
shiftKey: isShiftPressed
|
|
34
|
+
} = ev;
|
|
35
|
+
if (willHandleKey(ev, state))
|
|
36
|
+
ev.preventDefault();
|
|
37
|
+
const actualKey = key.toLowerCase();
|
|
38
|
+
const setFocus = ({
|
|
39
|
+
newFocusedColumn,
|
|
40
|
+
newFocusedRow,
|
|
41
|
+
...rest
|
|
42
|
+
}) => setNewFocused(state, {
|
|
43
|
+
altKey: isAltPressed,
|
|
44
|
+
ctrlKey: isCtrlPressed,
|
|
45
|
+
shiftKey: isShiftPressed,
|
|
46
|
+
newFocusedColumn,
|
|
47
|
+
newFocusedRow,
|
|
48
|
+
...rest
|
|
49
|
+
});
|
|
50
|
+
if (!state.isEditionMode) {
|
|
51
|
+
if (actualKey === "enter" && (state.allowEdition === true || state.focusedRow < 0))
|
|
52
|
+
state.isEditionMode = true;
|
|
53
|
+
else
|
|
54
|
+
switch (actualKey) {
|
|
55
|
+
case "arrowup": {
|
|
56
|
+
let sumRate = state.expandedRows.includes(state.focusedRow - 1) ? 0.6 : 1;
|
|
57
|
+
if (Math.round(state.focusedRow) - state.focusedRow !== 0)
|
|
58
|
+
sumRate = 0.5;
|
|
59
|
+
setFocus({
|
|
60
|
+
newFocusedRow: state.focusedRow - sumRate,
|
|
61
|
+
shouldSelectNewFocused: !isCtrlPressed
|
|
62
|
+
});
|
|
63
|
+
break;
|
|
64
|
+
}
|
|
65
|
+
case "arrowdown": {
|
|
66
|
+
let sumRate = state.expandedRows.includes(state.focusedRow) ? 0.6 : 1;
|
|
67
|
+
if (Math.round(state.focusedRow) - state.focusedRow !== 0)
|
|
68
|
+
sumRate = 0.5;
|
|
69
|
+
setFocus({
|
|
70
|
+
newFocusedRow: state.focusedRow + sumRate,
|
|
71
|
+
shouldSelectNewFocused: !isCtrlPressed
|
|
72
|
+
});
|
|
73
|
+
break;
|
|
74
|
+
}
|
|
75
|
+
case "arrowleft":
|
|
76
|
+
case "arrowright": {
|
|
77
|
+
setFocus({
|
|
78
|
+
newFocusedColumn: state.focusedColumn + (actualKey === "arrowleft" ? -1 : 1),
|
|
79
|
+
shouldSelectNewFocused: !isCtrlPressed
|
|
80
|
+
});
|
|
81
|
+
break;
|
|
82
|
+
}
|
|
83
|
+
case "home": {
|
|
84
|
+
if (isCtrlPressed)
|
|
85
|
+
setFocus({ newFocusedColumn: 0, newFocusedRow: 0, ctrlKey: false });
|
|
86
|
+
else
|
|
87
|
+
setFocus({ newFocusedColumn: 0 });
|
|
88
|
+
break;
|
|
89
|
+
}
|
|
90
|
+
case "end": {
|
|
91
|
+
if (isCtrlPressed)
|
|
92
|
+
setFocus({
|
|
93
|
+
newFocusedRow: Number.POSITIVE_INFINITY,
|
|
94
|
+
newFocusedColumn: Number.POSITIVE_INFINITY,
|
|
95
|
+
ctrlKey: false
|
|
96
|
+
});
|
|
97
|
+
else
|
|
98
|
+
setFocus({
|
|
99
|
+
newFocusedColumn: Number.POSITIVE_INFINITY
|
|
100
|
+
});
|
|
101
|
+
break;
|
|
102
|
+
}
|
|
103
|
+
case "pageup": {
|
|
104
|
+
setFocus({
|
|
105
|
+
newFocusedRow: state.focusedRow - 5,
|
|
106
|
+
shouldSelectNewFocused: !isCtrlPressed
|
|
107
|
+
});
|
|
108
|
+
break;
|
|
109
|
+
}
|
|
110
|
+
case "pagedown": {
|
|
111
|
+
setFocus({
|
|
112
|
+
newFocusedRow: state.focusedRow + 5,
|
|
113
|
+
shouldSelectNewFocused: !isCtrlPressed
|
|
114
|
+
});
|
|
115
|
+
break;
|
|
116
|
+
}
|
|
117
|
+
case " ": {
|
|
118
|
+
if (isCtrlPressed)
|
|
119
|
+
setFocus({
|
|
120
|
+
newFocusedRow: state.focusedRow
|
|
121
|
+
});
|
|
122
|
+
break;
|
|
123
|
+
}
|
|
124
|
+
case "a": {
|
|
125
|
+
if (isCtrlPressed && state.allowSelection)
|
|
126
|
+
state.selectedRows = state.rows.map((_, i) => i);
|
|
127
|
+
break;
|
|
128
|
+
}
|
|
129
|
+
}
|
|
130
|
+
} else
|
|
131
|
+
switch (actualKey) {
|
|
132
|
+
case "escape":
|
|
133
|
+
case "enter": {
|
|
134
|
+
if (state.isEditionMode)
|
|
135
|
+
state.isEditionMode = false;
|
|
136
|
+
ev.stopPropagation();
|
|
137
|
+
break;
|
|
138
|
+
}
|
|
139
|
+
}
|
|
140
|
+
}
|
|
141
|
+
|
|
142
|
+
export { handleKey, willHandleKey };
|
|
143
|
+
//# sourceMappingURL=handleKey.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"handleKey.js","sources":["../../../src/store/selection/handleKey.ts"],"sourcesContent":["import { Draft } from '@apia/store';\nimport React from 'react';\nimport { setNewFocused } from './setNewFocused';\nimport { THandleKey, INewFocus, ISelectableState } from './types';\n\n/**\n * Este método es de uso interno y normalmente\n * no será necesario fuera de este documento,\n * su utilidad es la de determinar si un evento\n * de teclado será controlado por el keyHandler.\n */\nexport function willHandleKey(\n ev: React.KeyboardEvent,\n state: ISelectableState,\n) {\n const actualKey = ev.key.toLowerCase();\n if (state.isEditionMode) return false;\n\n if (actualKey === ' ' && ev.ctrlKey) return true;\n if (actualKey === 'a' && ev.ctrlKey) return true;\n if (actualKey === 'm' && ev.ctrlKey) return true;\n if (state.draggingRow !== undefined) {\n return ['Escape', 'Enter'].includes(ev.key);\n }\n return [\n 'arrowup',\n 'arrowdown',\n 'arrowleft',\n 'arrowright',\n 'end',\n 'enter',\n 'home',\n 'pageup',\n 'pagedown',\n ].includes(ev.key.toLowerCase());\n}\n\n/**\n * Este método será llamado normalmente desde un action\n * de Redux. Su utilidad es la de evaluar qué tecla\n * se presionó y decidir qué alteración se debe producir\n * en base a eso.\n */\nexport function handleKey(state: Draft<ISelectableState>, { ev }: THandleKey) {\n const {\n altKey: isAltPressed,\n ctrlKey: isCtrlPressed,\n key,\n shiftKey: isShiftPressed,\n } = ev;\n if (willHandleKey(ev, state)) ev.preventDefault();\n const actualKey = key.toLowerCase();\n const setFocus = ({\n newFocusedColumn,\n newFocusedRow,\n ...rest\n }: Partial<INewFocus>) =>\n setNewFocused(state, {\n altKey: isAltPressed,\n ctrlKey: isCtrlPressed,\n shiftKey: isShiftPressed,\n newFocusedColumn,\n newFocusedRow,\n ...rest,\n });\n\n if (!state.isEditionMode) {\n if (\n actualKey === 'enter' &&\n (state.allowEdition === true || state.focusedRow < 0)\n )\n state.isEditionMode = true;\n else\n switch (actualKey) {\n case 'arrowup': {\n let sumRate = state.expandedRows.includes(state.focusedRow - 1)\n ? 0.6\n : 1;\n if (Math.round(state.focusedRow) - state.focusedRow !== 0)\n sumRate = 0.5;\n setFocus({\n newFocusedRow: state.focusedRow - sumRate,\n shouldSelectNewFocused: !isCtrlPressed,\n });\n break;\n }\n case 'arrowdown': {\n let sumRate = state.expandedRows.includes(state.focusedRow) ? 0.6 : 1;\n if (Math.round(state.focusedRow) - state.focusedRow !== 0)\n sumRate = 0.5;\n setFocus({\n newFocusedRow: state.focusedRow + sumRate,\n shouldSelectNewFocused: !isCtrlPressed,\n });\n break;\n }\n case 'arrowleft':\n case 'arrowright': {\n setFocus({\n newFocusedColumn:\n state.focusedColumn + (actualKey === 'arrowleft' ? -1 : 1),\n shouldSelectNewFocused: !isCtrlPressed,\n });\n break;\n }\n case 'home': {\n if (isCtrlPressed)\n setFocus({ newFocusedColumn: 0, newFocusedRow: 0, ctrlKey: false });\n else setFocus({ newFocusedColumn: 0 });\n break;\n }\n case 'end': {\n if (isCtrlPressed)\n setFocus({\n newFocusedRow: Number.POSITIVE_INFINITY,\n newFocusedColumn: Number.POSITIVE_INFINITY,\n ctrlKey: false,\n });\n else\n setFocus({\n newFocusedColumn: Number.POSITIVE_INFINITY,\n });\n break;\n }\n case 'pageup': {\n setFocus({\n newFocusedRow: state.focusedRow - 5,\n shouldSelectNewFocused: !isCtrlPressed,\n });\n break;\n }\n case 'pagedown': {\n setFocus({\n newFocusedRow: state.focusedRow + 5,\n shouldSelectNewFocused: !isCtrlPressed,\n });\n break;\n }\n case ' ': {\n if (isCtrlPressed)\n setFocus({\n newFocusedRow: state.focusedRow,\n });\n break;\n }\n case 'a': {\n if (isCtrlPressed && state.allowSelection)\n state.selectedRows = state.rows.map((_, i) => i);\n break;\n }\n default:\n break;\n }\n } else\n switch (actualKey) {\n case 'escape':\n case 'enter': {\n if (state.isEditionMode) state.isEditionMode = false;\n ev.stopPropagation();\n break;\n }\n default:\n break;\n }\n}\n"],"names":[],"mappings":"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"}
|