@splunk/react-ui 5.0.0-beta.5 → 5.0.0-rc.2
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/ButtonSimple.js +92 -168
- package/{CHANGELOG.v5.mdx → CHANGELOG.v5.md} +43 -0
- package/Calendar.js +148 -151
- package/Card.js +139 -139
- package/Code.js +197 -167
- package/CollapsiblePanel.js +172 -164
- package/Color.js +584 -506
- package/ComboBox.js +51 -51
- package/ControlGroup.js +132 -127
- package/Date.js +137 -150
- package/Dropdown.js +97 -96
- package/DualListbox.js +468 -469
- package/FetchOptions.d.ts +2 -2
- package/FormRows.js +158 -157
- package/JSONTree.js +354 -360
- package/{MIGRATION.mdx → MIGRATION.md} +13 -43
- package/{MIGRATION.v5.mdx → MIGRATION.v5.md} +67 -1
- package/Markdown.js +3 -4
- package/Menu.js +194 -195
- package/Modal.js +18 -18
- package/ModalLayer.js +171 -217
- package/Multiselect.js +785 -778
- package/Number.js +103 -102
- package/Popover.js +48 -46
- package/RadioBar.js +144 -146
- package/Resize.js +149 -151
- package/ResultsMenu.js +112 -114
- package/Search.js +49 -49
- package/Select.js +455 -457
- package/Slider.js +328 -331
- package/Switch.js +251 -178
- package/TabBar.js +277 -280
- package/Table.js +1212 -1178
- package/Text.js +45 -46
- package/Tooltip.js +192 -189
- package/Tree.js +177 -188
- package/package.json +10 -9
- package/types/src/Code/Code.d.ts +1 -1
- package/types/src/Color/Color.d.ts +2 -2
- package/types/src/ControlGroup/ControlGroup.d.ts +1 -2
- package/types/src/Dropdown/Dropdown.d.ts +5 -2
- package/types/src/Layer/Layer.d.ts +2 -1
- package/types/src/Layer/index.d.ts +1 -0
- package/types/src/ModalLayer/ModalLayer.d.ts +16 -21
- package/types/src/Number/Number.d.ts +1 -1
- package/types/src/Popover/Popover.d.ts +5 -2
- package/types/src/Table/HeadCell.d.ts +6 -1
- package/types/src/Table/HeadInner.d.ts +3 -1
- package/types/src/Tooltip/Tooltip.d.ts +7 -7
- package/types/src/fixtures/useFetchOptions.d.ts +33 -0
- package/useRovingFocus.js +20 -23
- package/types/src/fixtures/FetchOptions.d.ts +0 -76
package/FetchOptions.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { default } from './types/src/
|
|
2
|
-
export * from './types/src/
|
|
1
|
+
export { default } from './types/src/useFetchOptions';
|
|
2
|
+
export * from './types/src/useFetchOptions';
|
package/FormRows.js
CHANGED
|
@@ -61,8 +61,8 @@
|
|
|
61
61
|
e.r(n);
|
|
62
62
|
// EXPORTS
|
|
63
63
|
e.d(n, {
|
|
64
|
-
Row: () => /* reexport */
|
|
65
|
-
default: () => /* reexport */
|
|
64
|
+
Row: () => /* reexport */ ne,
|
|
65
|
+
default: () => /* reexport */ ye
|
|
66
66
|
});
|
|
67
67
|
// CONCATENATED MODULE: external "react"
|
|
68
68
|
const r = require("react");
|
|
@@ -75,78 +75,76 @@
|
|
|
75
75
|
var l = e.n(i);
|
|
76
76
|
// CONCATENATED MODULE: external "@splunk/ui-utils/i18n"
|
|
77
77
|
const s = require("@splunk/ui-utils/i18n");
|
|
78
|
-
// CONCATENATED MODULE: external "@splunk/ui-utils/keyboard"
|
|
79
|
-
const u = require("@splunk/ui-utils/keyboard");
|
|
80
78
|
// CONCATENATED MODULE: ./src/FormRows/FormRowsContext.tsx
|
|
81
|
-
var
|
|
79
|
+
var u = (0, r.createContext)({
|
|
82
80
|
disabledRemoveButton: false,
|
|
83
81
|
sortable: true
|
|
84
82
|
});
|
|
85
|
-
|
|
86
|
-
/* harmony default export */ const
|
|
83
|
+
u.displayName = "FormRows";
|
|
84
|
+
/* harmony default export */ const d = u;
|
|
87
85
|
// CONCATENATED MODULE: external "@splunk/react-icons/TrashCanCross"
|
|
88
|
-
const
|
|
89
|
-
var
|
|
86
|
+
const c = require("@splunk/react-icons/TrashCanCross");
|
|
87
|
+
var f = e.n(c);
|
|
90
88
|
// CONCATENATED MODULE: external "styled-components"
|
|
91
|
-
const
|
|
92
|
-
var
|
|
89
|
+
const v = require("styled-components");
|
|
90
|
+
var m = e.n(v);
|
|
93
91
|
// CONCATENATED MODULE: external "@splunk/react-ui/Button"
|
|
94
|
-
const
|
|
95
|
-
var
|
|
92
|
+
const p = require("@splunk/react-ui/Button");
|
|
93
|
+
var b = e.n(p);
|
|
96
94
|
// CONCATENATED MODULE: external "@splunk/react-ui/ButtonSimple"
|
|
97
|
-
const
|
|
98
|
-
var
|
|
95
|
+
const g = require("@splunk/react-ui/ButtonSimple");
|
|
96
|
+
var y = e.n(g);
|
|
99
97
|
// CONCATENATED MODULE: external "@splunk/themes"
|
|
100
|
-
const
|
|
98
|
+
const h = require("@splunk/themes");
|
|
101
99
|
// CONCATENATED MODULE: ./src/FormRows/FormRowsStyles.ts
|
|
102
|
-
var
|
|
103
|
-
var
|
|
100
|
+
var w = (0, v.css)([ "width:", ";height:", ";" ], h.variables.inputHeight, h.variables.inputHeight);
|
|
101
|
+
var R = m()(y()).withConfig({
|
|
104
102
|
displayName: "FormRowsStyles__StyledDragButton",
|
|
105
103
|
componentId: "sc-1j4j7h3-0"
|
|
106
|
-
})([ "", ";grid-column:drag-handle;cursor:move;user-select:none;-webkit-user-drag:element;" ],
|
|
107
|
-
var
|
|
104
|
+
})([ "", ";grid-column:drag-handle;cursor:move;user-select:none;-webkit-user-drag:element;" ], w);
|
|
105
|
+
var S = m()(y()).withConfig({
|
|
108
106
|
displayName: "FormRowsStyles__StyledRemoveButton",
|
|
109
107
|
componentId: "sc-1j4j7h3-1"
|
|
110
|
-
})([ "", ";grid-column:remove-button;" ],
|
|
111
|
-
var
|
|
108
|
+
})([ "", ";grid-column:remove-button;" ], w);
|
|
109
|
+
var O = m().div.withConfig({
|
|
112
110
|
displayName: "FormRowsStyles__StyledDiv",
|
|
113
111
|
componentId: "sc-1j4j7h3-2"
|
|
114
|
-
})([ "", ";justify-content:start;&:has(", "):has(", "){grid-template-columns:[drag-handle] min-content [content] minmax(auto,1fr) [remove-button] min-content;}&:has(", "){grid-template-columns:[drag-handle] min-content [content] minmax(auto,1fr);}&:has(", "){grid-template-columns:[content] minmax(auto,1fr) [remove-button] min-content;}grid-template-columns:[content] minmax(auto,1fr);column-gap:", ";row-gap:", ";" ],
|
|
115
|
-
var
|
|
112
|
+
})([ "", ";justify-content:start;&:has(", "):has(", "){grid-template-columns:[drag-handle] min-content [content] minmax(auto,1fr) [remove-button] min-content;}&:has(", "){grid-template-columns:[drag-handle] min-content [content] minmax(auto,1fr);}&:has(", "){grid-template-columns:[content] minmax(auto,1fr) [remove-button] min-content;}grid-template-columns:[content] minmax(auto,1fr);column-gap:", ";row-gap:", ";" ], h.mixins.reset("grid"), R, S, R, S, h.variables.spacingSmall, h.variables.spacingXSmall);
|
|
113
|
+
var x = m().div.withConfig({
|
|
116
114
|
displayName: "FormRowsStyles__StyledHeader",
|
|
117
115
|
componentId: "sc-1j4j7h3-3"
|
|
118
|
-
})([ "", ";grid-column:content;" ],
|
|
116
|
+
})([ "", ";grid-column:content;" ], h.mixins.typography("largeBody", {
|
|
119
117
|
color: "active"
|
|
120
118
|
}));
|
|
121
|
-
var
|
|
122
|
-
var C =
|
|
119
|
+
var j = (0, v.css)([ "grid-column:content;width:min-content;margin-block-start:", ";" ], h.variables.spacingXSmall);
|
|
120
|
+
var C = m()(b()).withConfig({
|
|
123
121
|
displayName: "FormRowsStyles__StyledAddRowButton",
|
|
124
122
|
componentId: "sc-1j4j7h3-4"
|
|
125
|
-
})([ "", ";" ],
|
|
126
|
-
var
|
|
123
|
+
})([ "", ";" ], j);
|
|
124
|
+
var E = m().div.withConfig({
|
|
127
125
|
displayName: "FormRowsStyles__StyledMenuWrapper",
|
|
128
126
|
componentId: "sc-1j4j7h3-5"
|
|
129
|
-
})([ "", ";" ],
|
|
130
|
-
var q =
|
|
127
|
+
})([ "", ";" ], j);
|
|
128
|
+
var q = m().div.withConfig({
|
|
131
129
|
displayName: "FormRowsStyles__StyledInputWrapper",
|
|
132
130
|
componentId: "sc-1j4j7h3-6"
|
|
133
|
-
})([ "display:flex;gap:", ";" ],
|
|
134
|
-
var
|
|
131
|
+
})([ "display:flex;gap:", ";" ], h.variables.spacingXSmall);
|
|
132
|
+
var k = function e(n) {
|
|
135
133
|
return n ? "drag-handle" : "content";
|
|
136
134
|
};
|
|
137
|
-
/* Row includes drag handle, input, and remove button */ var
|
|
135
|
+
/* Row includes drag handle, input, and remove button */ var P = m().div.withConfig({
|
|
138
136
|
displayName: "FormRowsStyles__StyledRow",
|
|
139
137
|
componentId: "sc-1j4j7h3-7"
|
|
140
|
-
})([ "", ";grid-template-columns:subgrid;grid-column:", " / -1;padding:", " 0;border-radius:", ";&.sorting{z-index:calc(", " + 1);}&:focus{outline:0;}", "" ],
|
|
138
|
+
})([ "", ";grid-template-columns:subgrid;grid-column:", " / -1;padding:", " 0;border-radius:", ";&.sorting{z-index:calc(", " + 1);}&:focus{outline:0;}", "" ], h.mixins.reset("grid"), (function(e) {
|
|
141
139
|
var n = e.$sortable;
|
|
142
|
-
return
|
|
143
|
-
}),
|
|
140
|
+
return k(n);
|
|
141
|
+
}), h.variables.spacingXSmall, h.variables.borderRadius, h.variables.zindexPopover, (function(e) {
|
|
144
142
|
var n = e.$sortable;
|
|
145
|
-
return n && (0,
|
|
143
|
+
return n && (0, v.css)([ "&:has(", ":active,", ":focus){background:", ";}&:not(:has(", ")){padding-inline-end:", ";}" ], R, R, h.variables.interactiveColorOverlayDrag, S, h.variables.spacingXSmall);
|
|
146
144
|
}));
|
|
147
145
|
// CONCATENATED MODULE: ./src/FormRows/RowInternal.tsx
|
|
148
|
-
function
|
|
149
|
-
return
|
|
146
|
+
function I() {
|
|
147
|
+
return I = Object.assign ? Object.assign.bind() : function(e) {
|
|
150
148
|
for (var n = 1; n < arguments.length; n++) {
|
|
151
149
|
var r = arguments[n];
|
|
152
150
|
for (var t in r) {
|
|
@@ -154,11 +152,11 @@
|
|
|
154
152
|
}
|
|
155
153
|
}
|
|
156
154
|
return e;
|
|
157
|
-
},
|
|
155
|
+
}, I.apply(null, arguments);
|
|
158
156
|
}
|
|
159
|
-
function
|
|
157
|
+
function _(e, n) {
|
|
160
158
|
if (null == e) return {};
|
|
161
|
-
var r, t, o =
|
|
159
|
+
var r, t, o = D(e, n);
|
|
162
160
|
if (Object.getOwnPropertySymbols) {
|
|
163
161
|
var a = Object.getOwnPropertySymbols(e);
|
|
164
162
|
for (t = 0; t < a.length; t++) {
|
|
@@ -167,7 +165,7 @@
|
|
|
167
165
|
}
|
|
168
166
|
return o;
|
|
169
167
|
}
|
|
170
|
-
function
|
|
168
|
+
function D(e, n) {
|
|
171
169
|
if (null == e) return {};
|
|
172
170
|
var r = {};
|
|
173
171
|
for (var t in e) {
|
|
@@ -178,7 +176,7 @@
|
|
|
178
176
|
}
|
|
179
177
|
return r;
|
|
180
178
|
}
|
|
181
|
-
/** @public */ var
|
|
179
|
+
/** @public */ var A = {
|
|
182
180
|
children: a().node,
|
|
183
181
|
index: a().number,
|
|
184
182
|
onRequestRemove: a().func,
|
|
@@ -186,37 +184,38 @@
|
|
|
186
184
|
style: a().object,
|
|
187
185
|
value: a().node
|
|
188
186
|
};
|
|
189
|
-
var
|
|
190
|
-
|
|
191
|
-
var
|
|
192
|
-
var
|
|
187
|
+
var T = (0, s._)("Remove row");
|
|
188
|
+
var M = t().forwardRef((function(e, n) {
|
|
189
|
+
var o = e.children, a = e.index, i = e.onRequestRemove, l = e.renderDragHandle, s = _(e, [ "children", "index", "onRequestRemove", "renderDragHandle" ]);
|
|
190
|
+
var u = (0, r.useContext)(d), c = u.disabledRemoveButton, v = u.hasOnRequestAdd, m = u.sortable;
|
|
191
|
+
var p = (0, r.useCallback)((function(e) {
|
|
193
192
|
// FormRows remove functionality doesn't work without an index, but index is not a required prop. FormRows will throw an error
|
|
194
193
|
// when rows are sortable and/or removable and index is not provided.
|
|
195
194
|
i === null || i === void 0 ? void 0 : i(e, {
|
|
196
195
|
index: a !== null && a !== void 0 ? a : 0
|
|
197
196
|
});
|
|
198
197
|
}), [ i, a ]);
|
|
199
|
-
var
|
|
198
|
+
var b = i !== undefined;
|
|
200
199
|
(0, r.useEffect)((function() {
|
|
201
200
|
if (false) {}
|
|
202
201
|
if (false) {}
|
|
203
202
|
if (false) {}
|
|
204
|
-
}), [
|
|
203
|
+
}), [ v, b, m, a ]);
|
|
205
204
|
|
|
206
|
-
return t().createElement(
|
|
207
|
-
$sortable:
|
|
205
|
+
return t().createElement(P, I({
|
|
206
|
+
$sortable: m,
|
|
208
207
|
"data-test": "row",
|
|
209
208
|
ref: n
|
|
210
|
-
},
|
|
211
|
-
appearance: "
|
|
212
|
-
"aria-label":
|
|
209
|
+
}, s), l && l(), t().createElement(q, null, o), b && t().createElement(S, {
|
|
210
|
+
appearance: "subtle",
|
|
211
|
+
"aria-label": T,
|
|
213
212
|
"data-test": "remove",
|
|
214
|
-
disabled:
|
|
215
|
-
onClick:
|
|
216
|
-
}, t().createElement(
|
|
213
|
+
disabled: c,
|
|
214
|
+
onClick: p
|
|
215
|
+
}, t().createElement(f(), null)));
|
|
217
216
|
}));
|
|
218
|
-
|
|
219
|
-
/* harmony default export */ const
|
|
217
|
+
M.propTypes = A;
|
|
218
|
+
/* harmony default export */ const N = M;
|
|
220
219
|
// CONCATENATED MODULE: external "@dnd-kit/sortable"
|
|
221
220
|
const B = require("@dnd-kit/sortable");
|
|
222
221
|
// CONCATENATED MODULE: external "@dnd-kit/utilities"
|
|
@@ -277,13 +276,14 @@
|
|
|
277
276
|
}
|
|
278
277
|
return r;
|
|
279
278
|
}
|
|
280
|
-
/** @public */ var
|
|
279
|
+
/** @public */ var U = {
|
|
281
280
|
children: a().node,
|
|
282
281
|
index: a().number,
|
|
283
282
|
onRequestRemove: a().func,
|
|
284
283
|
value: a().node
|
|
285
284
|
};
|
|
286
|
-
var
|
|
285
|
+
var W = (0, s._)("Drag handle");
|
|
286
|
+
var V = t().forwardRef((function(e, n) {
|
|
287
287
|
var o = e.children, a = e.index, i = $(e, [ "children", "index" ]);
|
|
288
288
|
// @docs-props-type RowPropsBase
|
|
289
289
|
var l = (0, B.useSortable)({
|
|
@@ -291,46 +291,46 @@
|
|
|
291
291
|
// FormRows drag functionality doesn't work without an index, but index is not a required prop. FormRows will throw an error
|
|
292
292
|
// when rows are sortable and/or removable and index is not provided.
|
|
293
293
|
id: (a !== null && a !== void 0 ? a : 0) + 1
|
|
294
|
-
}),
|
|
295
|
-
var
|
|
296
|
-
transform: F.CSS.Transform.toString(
|
|
297
|
-
transition:
|
|
294
|
+
}), s = l.attributes, u = l.listeners, c = l.setActivatorNodeRef, f = l.setNodeRef, v = l.transform, m = l.transition;
|
|
295
|
+
var p = {
|
|
296
|
+
transform: F.CSS.Transform.toString(v),
|
|
297
|
+
transition: m
|
|
298
298
|
};
|
|
299
|
-
var
|
|
300
|
-
|
|
299
|
+
var b = function e(r) {
|
|
300
|
+
f(r);
|
|
301
301
|
L(n, r);
|
|
302
302
|
};
|
|
303
|
-
var
|
|
304
|
-
var
|
|
303
|
+
var g = (0, r.useContext)(d), y = g.onKeyDown;
|
|
304
|
+
var h = (0, r.useCallback)((function(e) {
|
|
305
305
|
// FormRows drag functionality doesn't work without an index, but index is not a required prop. FormRows will throw an error
|
|
306
306
|
// when rows are sortable and/or removable and index is not provided.
|
|
307
|
-
|
|
307
|
+
y === null || y === void 0 ? void 0 : y(e, {
|
|
308
308
|
index: a !== null && a !== void 0 ? a : 0
|
|
309
309
|
});
|
|
310
|
-
}), [
|
|
311
|
-
var
|
|
310
|
+
}), [ y, a ]);
|
|
311
|
+
var w = (0, r.useCallback)((function() {
|
|
312
312
|
|
|
313
|
-
return t().createElement(
|
|
314
|
-
appearance: "
|
|
315
|
-
"aria-label":
|
|
313
|
+
return t().createElement(R, K({
|
|
314
|
+
appearance: "subtle",
|
|
315
|
+
"aria-label": W,
|
|
316
316
|
"data-test": "drag-handle",
|
|
317
|
-
onKeyDown:
|
|
318
|
-
ref:
|
|
319
|
-
},
|
|
320
|
-
}), [
|
|
317
|
+
onKeyDown: h,
|
|
318
|
+
ref: c
|
|
319
|
+
}, u), t().createElement(X(), null));
|
|
320
|
+
}), [ h, u, c ]);
|
|
321
321
|
|
|
322
|
-
return t().createElement(
|
|
322
|
+
return t().createElement(N, K({
|
|
323
323
|
index: a,
|
|
324
|
-
ref:
|
|
325
|
-
renderDragHandle:
|
|
326
|
-
style:
|
|
327
|
-
}, i,
|
|
324
|
+
ref: b,
|
|
325
|
+
renderDragHandle: w,
|
|
326
|
+
style: p
|
|
327
|
+
}, i, s), o);
|
|
328
328
|
}));
|
|
329
|
-
|
|
330
|
-
/* harmony default export */ const
|
|
329
|
+
V.propTypes = U;
|
|
330
|
+
/* harmony default export */ const G = V;
|
|
331
331
|
// CONCATENATED MODULE: ./src/FormRows/Row.tsx
|
|
332
|
-
function
|
|
333
|
-
return
|
|
332
|
+
function J() {
|
|
333
|
+
return J = Object.assign ? Object.assign.bind() : function(e) {
|
|
334
334
|
for (var n = 1; n < arguments.length; n++) {
|
|
335
335
|
var r = arguments[n];
|
|
336
336
|
for (var t in r) {
|
|
@@ -338,11 +338,11 @@
|
|
|
338
338
|
}
|
|
339
339
|
}
|
|
340
340
|
return e;
|
|
341
|
-
},
|
|
341
|
+
}, J.apply(null, arguments);
|
|
342
342
|
}
|
|
343
|
-
function
|
|
343
|
+
function Q(e, n) {
|
|
344
344
|
if (null == e) return {};
|
|
345
|
-
var r, t, o =
|
|
345
|
+
var r, t, o = Y(e, n);
|
|
346
346
|
if (Object.getOwnPropertySymbols) {
|
|
347
347
|
var a = Object.getOwnPropertySymbols(e);
|
|
348
348
|
for (t = 0; t < a.length; t++) {
|
|
@@ -351,7 +351,7 @@
|
|
|
351
351
|
}
|
|
352
352
|
return o;
|
|
353
353
|
}
|
|
354
|
-
function
|
|
354
|
+
function Y(e, n) {
|
|
355
355
|
if (null == e) return {};
|
|
356
356
|
var r = {};
|
|
357
357
|
for (var t in e) {
|
|
@@ -362,41 +362,41 @@
|
|
|
362
362
|
}
|
|
363
363
|
return r;
|
|
364
364
|
}
|
|
365
|
-
/** @public */ var
|
|
365
|
+
/** @public */ var Z = {
|
|
366
366
|
children: a().node,
|
|
367
367
|
elementRef: a().oneOfType([ a().func, a().object ]),
|
|
368
368
|
index: a().number,
|
|
369
369
|
onRequestRemove: a().func,
|
|
370
370
|
value: a().node
|
|
371
371
|
};
|
|
372
|
-
function
|
|
373
|
-
var n = e.children, o = e.elementRef, a =
|
|
372
|
+
function ee(e) {
|
|
373
|
+
var n = e.children, o = e.elementRef, a = Q(e, [ "children", "elementRef" ]);
|
|
374
374
|
// @docs-props-type RowPropsBase
|
|
375
|
-
var i = (0, r.useContext)(
|
|
375
|
+
var i = (0, r.useContext)(d), l = i.sortable;
|
|
376
376
|
var s = (0, r.useMemo)((function() {
|
|
377
|
-
return l ?
|
|
377
|
+
return l ? G : N;
|
|
378
378
|
}), [ l ]);
|
|
379
379
|
|
|
380
|
-
return t().createElement(s,
|
|
380
|
+
return t().createElement(s, J({
|
|
381
381
|
ref: o
|
|
382
382
|
}, a), n);
|
|
383
383
|
}
|
|
384
|
-
|
|
385
|
-
/* harmony default export */ const
|
|
384
|
+
ee.propTypes = Z;
|
|
385
|
+
/* harmony default export */ const ne = ee;
|
|
386
386
|
// CONCATENATED MODULE: external "@dnd-kit/core"
|
|
387
|
-
const
|
|
387
|
+
const re = require("@dnd-kit/core");
|
|
388
388
|
// CONCATENATED MODULE: external "@splunk/ui-utils/format"
|
|
389
|
-
const
|
|
389
|
+
const te = require("@splunk/ui-utils/format");
|
|
390
390
|
// CONCATENATED MODULE: ./src/FormRows/SortableList.tsx
|
|
391
|
-
var
|
|
391
|
+
var oe = function e(n, r) {
|
|
392
392
|
return n.indexOf(r) + 1;
|
|
393
393
|
};
|
|
394
|
-
var
|
|
394
|
+
var ae = {
|
|
395
395
|
draggable: (0, s._)("To pick up a sortable row, press space or enter.\n Use the up and down arrow keys to update the position of the row.")
|
|
396
396
|
};
|
|
397
|
-
var
|
|
397
|
+
var ie = function e(n) {
|
|
398
398
|
var o = n.children, a = n.onSortEnd;
|
|
399
|
-
var i = (0,
|
|
399
|
+
var i = (0, re.useSensors)((0, re.useSensor)(re.PointerSensor), (0, re.useSensor)(re.MouseSensor));
|
|
400
400
|
var l = (0, r.useRef)(true);
|
|
401
401
|
var s = r.Children.toArray(o).filter(r.isValidElement);
|
|
402
402
|
var u = s.map((function(e) {
|
|
@@ -417,7 +417,7 @@
|
|
|
417
417
|
return {
|
|
418
418
|
onDragStart: function e(n) {
|
|
419
419
|
var r = n.active.id;
|
|
420
|
-
return (0,
|
|
420
|
+
return (0, te.sprintf)("Picked up sortable row in position %d of %d.", oe(u, r), u.length);
|
|
421
421
|
},
|
|
422
422
|
onDragOver: function e(n) {
|
|
423
423
|
var r = n.active, t = n.over;
|
|
@@ -428,39 +428,39 @@
|
|
|
428
428
|
l.current = false;
|
|
429
429
|
return undefined;
|
|
430
430
|
}
|
|
431
|
-
return t ? (0,
|
|
431
|
+
return t ? (0, te.sprintf)("Row moved from position %d to position %d of %d.", oe(u, r.id), oe(u, t.id), u.length) : undefined;
|
|
432
432
|
},
|
|
433
433
|
onDragEnd: function e(n) {
|
|
434
434
|
var r = n.over;
|
|
435
|
-
return r ? (0,
|
|
435
|
+
return r ? (0, te.sprintf)("Row dropped at position %d of %d.", oe(u, r.id), u.length) : undefined;
|
|
436
436
|
},
|
|
437
437
|
onDragCancel: function e(n) {
|
|
438
438
|
var r = n.active.id;
|
|
439
|
-
return (0,
|
|
439
|
+
return (0, te.sprintf)("Row returned to it's starting position of %d.", oe(u, r));
|
|
440
440
|
}
|
|
441
441
|
};
|
|
442
442
|
}), [ u ]);
|
|
443
443
|
var f = (0, r.useMemo)((function() {
|
|
444
444
|
return {
|
|
445
|
-
screenReaderInstructions:
|
|
445
|
+
screenReaderInstructions: ae,
|
|
446
446
|
announcements: c
|
|
447
447
|
};
|
|
448
448
|
}), [ c ]);
|
|
449
449
|
|
|
450
|
-
return t().createElement(
|
|
450
|
+
return t().createElement(re.DndContext, {
|
|
451
451
|
accessibility: f,
|
|
452
452
|
sensors: i,
|
|
453
|
-
collisionDetection:
|
|
453
|
+
collisionDetection: re.closestCenter,
|
|
454
454
|
onDragEnd: d
|
|
455
455
|
}, t().createElement(B.SortableContext, {
|
|
456
456
|
items: u,
|
|
457
457
|
strategy: B.verticalListSortingStrategy
|
|
458
458
|
}, s));
|
|
459
459
|
};
|
|
460
|
-
/* harmony default export */ const
|
|
460
|
+
/* harmony default export */ const le = ie;
|
|
461
461
|
// CONCATENATED MODULE: ./src/FormRows/FormRows.tsx
|
|
462
|
-
function
|
|
463
|
-
return
|
|
462
|
+
function se() {
|
|
463
|
+
return se = Object.assign ? Object.assign.bind() : function(e) {
|
|
464
464
|
for (var n = 1; n < arguments.length; n++) {
|
|
465
465
|
var r = arguments[n];
|
|
466
466
|
for (var t in r) {
|
|
@@ -468,11 +468,11 @@
|
|
|
468
468
|
}
|
|
469
469
|
}
|
|
470
470
|
return e;
|
|
471
|
-
},
|
|
471
|
+
}, se.apply(null, arguments);
|
|
472
472
|
}
|
|
473
|
-
function
|
|
473
|
+
function ue(e, n) {
|
|
474
474
|
if (null == e) return {};
|
|
475
|
-
var r, t, o =
|
|
475
|
+
var r, t, o = de(e, n);
|
|
476
476
|
if (Object.getOwnPropertySymbols) {
|
|
477
477
|
var a = Object.getOwnPropertySymbols(e);
|
|
478
478
|
for (t = 0; t < a.length; t++) {
|
|
@@ -481,7 +481,7 @@
|
|
|
481
481
|
}
|
|
482
482
|
return o;
|
|
483
483
|
}
|
|
484
|
-
function
|
|
484
|
+
function de(e, n) {
|
|
485
485
|
if (null == e) return {};
|
|
486
486
|
var r = {};
|
|
487
487
|
for (var t in e) {
|
|
@@ -492,7 +492,7 @@
|
|
|
492
492
|
}
|
|
493
493
|
return r;
|
|
494
494
|
}
|
|
495
|
-
/** @public */ var
|
|
495
|
+
/** @public */ var ce = {
|
|
496
496
|
addLabel: a().string,
|
|
497
497
|
children: a().node,
|
|
498
498
|
disabled: a().bool,
|
|
@@ -525,7 +525,7 @@
|
|
|
525
525
|
* @param element Row element to add.
|
|
526
526
|
* @param items Array of current FormRows to add to.
|
|
527
527
|
* @return New array of FormRows with new Row added.
|
|
528
|
-
*/ var
|
|
528
|
+
*/ var fe = function e(n, r) {
|
|
529
529
|
return r.concat(n);
|
|
530
530
|
};
|
|
531
531
|
/**
|
|
@@ -543,7 +543,7 @@
|
|
|
543
543
|
* @param toIndex New index to move row to.
|
|
544
544
|
* @param items Array of current FormRows.
|
|
545
545
|
* @return New array of FormRows arranged in new order.
|
|
546
|
-
*/ var
|
|
546
|
+
*/ var ve = function e(n, t, o) {
|
|
547
547
|
var a = o.filter((function(e, r) {
|
|
548
548
|
return r !== n;
|
|
549
549
|
}));
|
|
@@ -569,7 +569,7 @@
|
|
|
569
569
|
* @param index Index of Row to delete.
|
|
570
570
|
* @param items Array of current FormRows.
|
|
571
571
|
* @return New array of FormRows with Row of given index deleted.
|
|
572
|
-
*/ var
|
|
572
|
+
*/ var me = function e(n, t) {
|
|
573
573
|
return t.filter((function(e, r) {
|
|
574
574
|
return r !== n;
|
|
575
575
|
})).map((function(e, n) {
|
|
@@ -579,72 +579,73 @@
|
|
|
579
579
|
});
|
|
580
580
|
}));
|
|
581
581
|
};
|
|
582
|
-
var
|
|
583
|
-
var
|
|
584
|
-
function
|
|
585
|
-
var n = e.addLabel, o = n === void 0 ?
|
|
582
|
+
var pe = t().createElement(l(), null);
|
|
583
|
+
var be = (0, s._)("Add row");
|
|
584
|
+
function ge(e) {
|
|
585
|
+
var n = e.addLabel, o = n === void 0 ? be : n, a = e.children, i = e.disabled, l = e.elementRef, s = e.header, u = e.menu, c = e.onRequestAdd, f = e.onRequestMove, v = ue(e, [ "addLabel", "children", "disabled", "elementRef", "header", "menu", "onRequestAdd", "onRequestMove" ]);
|
|
586
586
|
// @docs-props-type FormRowsPropsBase
|
|
587
|
-
var
|
|
587
|
+
var m = (0, r.useCallback)((function(e, n) {
|
|
588
588
|
var r = n.index;
|
|
589
|
+
var o = e.key;
|
|
589
590
|
if (e.currentTarget !== e.target) {
|
|
590
591
|
return;
|
|
591
592
|
}
|
|
592
|
-
if (
|
|
593
|
+
if (o === "ArrowUp") {
|
|
593
594
|
e.preventDefault();
|
|
594
595
|
if (r > 0) {
|
|
595
|
-
|
|
596
|
+
f === null || f === void 0 ? void 0 : f({
|
|
596
597
|
fromIndex: r,
|
|
597
598
|
toIndex: r - 1
|
|
598
599
|
});
|
|
599
600
|
}
|
|
600
|
-
} else if (
|
|
601
|
+
} else if (o === "ArrowDown") {
|
|
601
602
|
e.preventDefault();
|
|
602
603
|
if (r < t().Children.toArray(a).length - 1) {
|
|
603
|
-
|
|
604
|
+
f === null || f === void 0 ? void 0 : f({
|
|
604
605
|
fromIndex: r,
|
|
605
606
|
toIndex: r + 1
|
|
606
607
|
});
|
|
607
608
|
}
|
|
608
609
|
}
|
|
609
|
-
}), [ a,
|
|
610
|
-
var
|
|
610
|
+
}), [ a, f ]);
|
|
611
|
+
var p = (0, r.useCallback)((function(e) {
|
|
611
612
|
var n = e.oldIndex, r = e.newIndex;
|
|
612
|
-
|
|
613
|
+
f === null || f === void 0 ? void 0 : f({
|
|
613
614
|
fromIndex: n,
|
|
614
615
|
toIndex: r
|
|
615
616
|
});
|
|
616
|
-
}), [
|
|
617
|
-
var
|
|
618
|
-
var
|
|
617
|
+
}), [ f ]);
|
|
618
|
+
var b = f !== undefined && !i;
|
|
619
|
+
var g = c !== undefined;
|
|
619
620
|
|
|
620
|
-
return t().createElement(
|
|
621
|
+
return t().createElement(O, se({
|
|
621
622
|
ref: l,
|
|
622
623
|
"data-test": "form-rows"
|
|
623
|
-
},
|
|
624
|
+
}, v), t().createElement(d.Provider, {
|
|
624
625
|
// eslint-disable-next-line react/jsx-no-constructed-context-values
|
|
625
626
|
value: {
|
|
626
627
|
disabledRemoveButton: i,
|
|
627
|
-
onKeyDown:
|
|
628
|
-
hasOnRequestAdd:
|
|
629
|
-
sortable:
|
|
628
|
+
onKeyDown: m,
|
|
629
|
+
hasOnRequestAdd: g,
|
|
630
|
+
sortable: b
|
|
630
631
|
}
|
|
631
|
-
}, s && t().createElement(
|
|
632
|
-
onSortEnd:
|
|
633
|
-
}, a),
|
|
632
|
+
}, s && t().createElement(x, null, s), t().createElement(le, {
|
|
633
|
+
onSortEnd: p
|
|
634
|
+
}, a), u && t().createElement(E, null, u) || g && t().createElement(C, {
|
|
634
635
|
disabled: i,
|
|
635
636
|
appearance: "secondary",
|
|
636
637
|
"data-test": "add-row",
|
|
637
|
-
icon:
|
|
638
|
+
icon: pe,
|
|
638
639
|
label: o,
|
|
639
|
-
onClick:
|
|
640
|
+
onClick: c
|
|
640
641
|
})));
|
|
641
642
|
}
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
/* harmony default export */ const
|
|
643
|
+
ge.propTypes = ce;
|
|
644
|
+
ge.Row = ne;
|
|
645
|
+
ge.addRow = fe;
|
|
646
|
+
ge.moveRow = ve;
|
|
647
|
+
ge.removeRow = me;
|
|
648
|
+
/* harmony default export */ const ye = ge;
|
|
648
649
|
// CONCATENATED MODULE: ./src/FormRows/index.ts
|
|
649
650
|
module.exports = n;
|
|
650
651
|
/******/})();
|