@splunk/react-ui 4.21.0 → 4.22.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/Accordion.js +425 -325
- package/Anchor.js +147 -117
- package/Animation.js +142 -94
- package/AnimationToggle.js +197 -193
- package/Box.js +145 -118
- package/Breadcrumbs.js +288 -206
- package/Button.js +488 -465
- package/ButtonGroup.js +160 -128
- package/ButtonSimple.js +543 -462
- package/CHANGELOG.md +24 -3
- package/Calendar.js +1111 -1001
- package/Card.js +771 -598
- package/CardLayout.js +205 -147
- package/Chip.js +509 -488
- package/Clickable.js +414 -352
- package/CloseButton.js +165 -142
- package/Code.js +1807 -2084
- package/CollapsiblePanel.js +586 -519
- package/Color.js +1068 -1068
- package/ColumnLayout.js +402 -363
- package/ComboBox.js +903 -794
- package/Concertina.js +997 -802
- package/ControlGroup.js +687 -594
- package/Date.js +567 -547
- package/DefinitionList.js +308 -234
- package/Divider.js +149 -118
- package/Dropdown.js +459 -416
- package/DualListbox.js +1479 -1541
- package/EventListener.js +94 -97
- package/File.js +1051 -969
- package/FormRows.js +883 -696
- package/Heading.js +216 -193
- package/Image.js +446 -402
- package/JSONTree.js +690 -551
- package/Layer.js +437 -410
- package/Link.js +336 -255
- package/List.js +213 -161
- package/Markdown.js +509 -487
- package/Menu.js +1104 -1056
- package/Message.js +475 -441
- package/MessageBar.js +387 -373
- package/Modal.js +810 -634
- package/ModalLayer.js +326 -243
- package/Monogram.js +308 -276
- package/Multiselect.js +3564 -3364
- package/Number.js +729 -687
- package/Paginator.js +510 -449
- package/Paragraph.js +145 -112
- package/Popover.js +1459 -1432
- package/Progress.js +301 -246
- package/RadioBar.js +634 -527
- package/RadioList.js +483 -444
- package/Resize.js +530 -489
- package/ResultsMenu.js +479 -455
- package/ScreenReaderContent.js +142 -111
- package/Scroll.js +595 -456
- package/ScrollContainerContext.js +197 -206
- package/Search.js +756 -650
- package/Select.js +2446 -2345
- package/SidePanel.js +390 -284
- package/Slider.js +680 -676
- package/SlidingPanels.js +639 -503
- package/SplitButton.js +464 -367
- package/StaticContent.js +161 -133
- package/StepBar.js +386 -358
- package/Switch.js +710 -640
- package/TabBar.js +741 -680
- package/TabLayout.js +406 -322
- package/Table.js +4974 -4616
- package/Text.js +1170 -1138
- package/TextArea.js +1102 -1090
- package/Tooltip.js +624 -581
- package/TransitionOpen.js +489 -422
- package/Typography.js +176 -153
- package/WaitSpinner.js +230 -206
- package/package.json +7 -7
- package/types/src/Color/Color.d.ts +0 -1
- package/types/src/JSONTree/JSONTreeContext.d.ts +7 -0
- package/types/src/JSONTree/TreeNode.d.ts +5 -0
- package/types/src/RadioBar/RadioBar.d.ts +1 -0
- package/types/src/ResultsMenu/ResultsMenu.d.ts +0 -2
- package/types/src/Select/docs/examples/Icons.d.ts +1 -9
- package/types/src/Slider/Slider.d.ts +1 -0
- package/types/src/TabBar/Tab.d.ts +10 -1
- package/types/src/TabBar/TabBar.d.ts +4 -2
- package/types/src/Table/Head.d.ts +7 -3
- package/types/src/Table/Table.d.ts +3 -2
- package/types/src/Table/TableContext.d.ts +2 -0
- package/useForceUpdate.js +112 -82
- package/useKeyPress.js +74 -71
- package/usePrevious.js +65 -65
- package/useRovingFocus.js +122 -138
package/SlidingPanels.js
CHANGED
|
@@ -1,529 +1,665 @@
|
|
|
1
|
-
/******/ (() => {
|
|
2
|
-
|
|
3
|
-
/******/
|
|
4
|
-
/******/
|
|
5
|
-
/******/
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
/******/
|
|
9
|
-
/******/
|
|
10
|
-
/******/
|
|
11
|
-
/******/
|
|
12
|
-
/******/
|
|
13
|
-
/******/
|
|
14
|
-
/******/
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
/******/
|
|
20
|
-
/******/
|
|
21
|
-
/******/
|
|
22
|
-
/******/
|
|
23
|
-
/******/
|
|
24
|
-
/******/
|
|
25
|
-
/******/
|
|
26
|
-
/******/
|
|
27
|
-
/******/
|
|
28
|
-
/******/
|
|
29
|
-
/******/
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
/******/
|
|
34
|
-
/******/
|
|
35
|
-
/******/
|
|
36
|
-
/******/
|
|
37
|
-
/******/
|
|
38
|
-
/******/
|
|
39
|
-
/******/
|
|
40
|
-
/******/
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
/******/
|
|
44
|
-
/******/
|
|
45
|
-
/******/
|
|
46
|
-
/******/
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
const
|
|
69
|
-
var
|
|
70
|
-
|
|
71
|
-
const
|
|
72
|
-
var
|
|
73
|
-
|
|
74
|
-
const
|
|
75
|
-
var
|
|
76
|
-
|
|
77
|
-
const
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
1
|
+
/******/ (() => {
|
|
2
|
+
// webpackBootstrap
|
|
3
|
+
/******/ "use strict";
|
|
4
|
+
/******/ // The require scope
|
|
5
|
+
/******/ var e = {};
|
|
6
|
+
/******/
|
|
7
|
+
/************************************************************************/
|
|
8
|
+
/******/ /* webpack/runtime/compat get default export */
|
|
9
|
+
/******/ (() => {
|
|
10
|
+
/******/ // getDefaultExport function for compatibility with non-harmony modules
|
|
11
|
+
/******/ e.n = t => {
|
|
12
|
+
/******/ var n = t && t.__esModule ?
|
|
13
|
+
/******/ () => t["default"]
|
|
14
|
+
/******/ : () => t
|
|
15
|
+
/******/;
|
|
16
|
+
e.d(n, {
|
|
17
|
+
a: n
|
|
18
|
+
});
|
|
19
|
+
/******/ return n;
|
|
20
|
+
/******/ };
|
|
21
|
+
/******/ })();
|
|
22
|
+
/******/
|
|
23
|
+
/******/ /* webpack/runtime/define property getters */
|
|
24
|
+
/******/ (() => {
|
|
25
|
+
/******/ // define getter functions for harmony exports
|
|
26
|
+
/******/ e.d = (t, n) => {
|
|
27
|
+
/******/ for (var r in n) {
|
|
28
|
+
/******/ if (e.o(n, r) && !e.o(t, r)) {
|
|
29
|
+
/******/ Object.defineProperty(t, r, {
|
|
30
|
+
enumerable: true,
|
|
31
|
+
get: n[r]
|
|
32
|
+
});
|
|
33
|
+
/******/ }
|
|
34
|
+
/******/ }
|
|
35
|
+
/******/ };
|
|
36
|
+
/******/ })();
|
|
37
|
+
/******/
|
|
38
|
+
/******/ /* webpack/runtime/hasOwnProperty shorthand */
|
|
39
|
+
/******/ (() => {
|
|
40
|
+
/******/ e.o = (e, t) => Object.prototype.hasOwnProperty.call(e, t)
|
|
41
|
+
/******/;
|
|
42
|
+
})();
|
|
43
|
+
/******/
|
|
44
|
+
/******/ /* webpack/runtime/make namespace object */
|
|
45
|
+
/******/ (() => {
|
|
46
|
+
/******/ // define __esModule on exports
|
|
47
|
+
/******/ e.r = e => {
|
|
48
|
+
/******/ if (typeof Symbol !== "undefined" && Symbol.toStringTag) {
|
|
49
|
+
/******/ Object.defineProperty(e, Symbol.toStringTag, {
|
|
50
|
+
value: "Module"
|
|
51
|
+
});
|
|
52
|
+
/******/ }
|
|
53
|
+
/******/ Object.defineProperty(e, "__esModule", {
|
|
54
|
+
value: true
|
|
55
|
+
});
|
|
56
|
+
/******/ };
|
|
57
|
+
/******/ })();
|
|
58
|
+
/******/
|
|
59
|
+
/************************************************************************/ var t = {};
|
|
60
|
+
// ESM COMPAT FLAG
|
|
61
|
+
e.r(t);
|
|
62
|
+
// EXPORTS
|
|
63
|
+
e.d(t, {
|
|
64
|
+
Panel: () => /* reexport */ W,
|
|
65
|
+
default: () => /* reexport */ ie
|
|
66
|
+
});
|
|
67
|
+
// CONCATENATED MODULE: external "react"
|
|
68
|
+
const n = require("react");
|
|
69
|
+
var r = e.n(n);
|
|
70
|
+
// CONCATENATED MODULE: external "prop-types"
|
|
71
|
+
const o = require("prop-types");
|
|
72
|
+
var i = e.n(o);
|
|
73
|
+
// CONCATENATED MODULE: external "lodash/filter"
|
|
74
|
+
const a = require("lodash/filter");
|
|
75
|
+
var l = e.n(a);
|
|
76
|
+
// CONCATENATED MODULE: external "lodash/keys"
|
|
77
|
+
const u = require("lodash/keys");
|
|
78
|
+
var c = e.n(u);
|
|
79
|
+
// CONCATENATED MODULE: external "lodash/omit"
|
|
80
|
+
const s = require("lodash/omit");
|
|
81
|
+
var f = e.n(s);
|
|
82
|
+
// CONCATENATED MODULE: external "lodash/values"
|
|
83
|
+
const p = require("lodash/values");
|
|
84
|
+
var d = e.n(p);
|
|
85
|
+
// CONCATENATED MODULE: external "react-spring"
|
|
86
|
+
const y = require("react-spring");
|
|
87
|
+
// CONCATENATED MODULE: external "@splunk/react-ui/Animation"
|
|
88
|
+
const v = require("@splunk/react-ui/Animation");
|
|
89
|
+
// CONCATENATED MODULE: external "styled-components"
|
|
90
|
+
const m = require("styled-components");
|
|
91
|
+
var h = e.n(m);
|
|
92
|
+
// CONCATENATED MODULE: external "@splunk/react-ui/Box"
|
|
93
|
+
const b = require("@splunk/react-ui/Box");
|
|
94
|
+
var g = e.n(b);
|
|
95
|
+
// CONCATENATED MODULE: external "@splunk/themes"
|
|
96
|
+
const O = require("@splunk/themes");
|
|
97
|
+
// CONCATENATED MODULE: ./src/SlidingPanels/SlidingPanelsStyles.ts
|
|
98
|
+
var P = h()((0, y.animated)(g())).withConfig({
|
|
99
|
+
displayName: "SlidingPanelsStyles__StyledBox",
|
|
100
|
+
componentId: "su6isq-0"
|
|
101
|
+
})([ "overflow:hidden;position:relative;" ]);
|
|
102
|
+
var w = h()(y.animated.div).withConfig({
|
|
103
|
+
displayName: "SlidingPanelsStyles__Styled",
|
|
104
|
+
componentId: "su6isq-1"
|
|
105
|
+
})([ "", ";", ";" ], O.mixins.reset("block"), O.mixins.clearfix());
|
|
106
|
+
// CONCATENATED MODULE: ./src/utils/updateReactRef.ts
|
|
107
|
+
/**
|
|
104
108
|
* Updates a React ref. Callback refs and object refs (from `createRef` and `useRef`) are supported.
|
|
105
109
|
*
|
|
106
110
|
* @param ref - The React callback or object ref. Can be `null` or `undefined`.
|
|
107
111
|
* @param current - The new value of the ref.
|
|
108
112
|
*/
|
|
109
|
-
function
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
113
|
+
function j(e, t) {
|
|
114
|
+
if (e) {
|
|
115
|
+
if (typeof e === "function") {
|
|
116
|
+
e(t);
|
|
117
|
+
} else {
|
|
118
|
+
// the public signature of this util uses React.Ref<T> to mirror the way React types refs.
|
|
119
|
+
// the intention here is to signal "we will take care of setting 'current', not you".
|
|
120
|
+
e.current = t;
|
|
121
|
+
// eslint-disable-line no-param-reassign
|
|
122
|
+
}
|
|
123
|
+
}
|
|
124
|
+
}
|
|
125
|
+
// CONCATENATED MODULE: ./src/SlidingPanels/Panel.tsx
|
|
126
|
+
function S(e) {
|
|
127
|
+
"@babel/helpers - typeof";
|
|
128
|
+
if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
|
|
129
|
+
S = function e(t) {
|
|
130
|
+
return typeof t;
|
|
131
|
+
};
|
|
132
|
+
} else {
|
|
133
|
+
S = function e(t) {
|
|
134
|
+
return t && typeof Symbol === "function" && t.constructor === Symbol && t !== Symbol.prototype ? "symbol" : typeof t;
|
|
135
|
+
};
|
|
136
|
+
}
|
|
137
|
+
return S(e);
|
|
138
|
+
}
|
|
139
|
+
function I() {
|
|
140
|
+
I = Object.assign || function(e) {
|
|
141
|
+
for (var t = 1; t < arguments.length; t++) {
|
|
142
|
+
var n = arguments[t];
|
|
143
|
+
for (var r in n) {
|
|
144
|
+
if (Object.prototype.hasOwnProperty.call(n, r)) {
|
|
145
|
+
e[r] = n[r];
|
|
146
|
+
}
|
|
147
|
+
}
|
|
148
|
+
}
|
|
149
|
+
return e;
|
|
150
|
+
};
|
|
151
|
+
return I.apply(this, arguments);
|
|
152
|
+
}
|
|
153
|
+
function _(e, t) {
|
|
154
|
+
if (!(e instanceof t)) {
|
|
155
|
+
throw new TypeError("Cannot call a class as a function");
|
|
156
|
+
}
|
|
157
|
+
}
|
|
158
|
+
function E(e, t) {
|
|
159
|
+
for (var n = 0; n < t.length; n++) {
|
|
160
|
+
var r = t[n];
|
|
161
|
+
r.enumerable = r.enumerable || false;
|
|
162
|
+
r.configurable = true;
|
|
163
|
+
if ("value" in r) r.writable = true;
|
|
164
|
+
Object.defineProperty(e, r.key, r);
|
|
165
|
+
}
|
|
166
|
+
}
|
|
167
|
+
function R(e, t, n) {
|
|
168
|
+
if (t) E(e.prototype, t);
|
|
169
|
+
if (n) E(e, n);
|
|
170
|
+
return e;
|
|
171
|
+
}
|
|
172
|
+
function k(e, t) {
|
|
173
|
+
if (typeof t !== "function" && t !== null) {
|
|
174
|
+
throw new TypeError("Super expression must either be null or a function");
|
|
175
|
+
}
|
|
176
|
+
e.prototype = Object.create(t && t.prototype, {
|
|
177
|
+
constructor: {
|
|
178
|
+
value: e,
|
|
179
|
+
writable: true,
|
|
180
|
+
configurable: true
|
|
181
|
+
}
|
|
182
|
+
});
|
|
183
|
+
if (t) q(e, t);
|
|
184
|
+
}
|
|
185
|
+
function q(e, t) {
|
|
186
|
+
q = Object.setPrototypeOf || function e(t, n) {
|
|
187
|
+
t.__proto__ = n;
|
|
188
|
+
return t;
|
|
189
|
+
};
|
|
190
|
+
return q(e, t);
|
|
117
191
|
}
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
function
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
function
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
function
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
192
|
+
function A(e) {
|
|
193
|
+
var t = x();
|
|
194
|
+
return function n() {
|
|
195
|
+
var r = M(e), o;
|
|
196
|
+
if (t) {
|
|
197
|
+
var i = M(this).constructor;
|
|
198
|
+
o = Reflect.construct(r, arguments, i);
|
|
199
|
+
} else {
|
|
200
|
+
o = r.apply(this, arguments);
|
|
201
|
+
}
|
|
202
|
+
return C(this, o);
|
|
203
|
+
};
|
|
204
|
+
}
|
|
205
|
+
function C(e, t) {
|
|
206
|
+
if (t && (S(t) === "object" || typeof t === "function")) {
|
|
207
|
+
return t;
|
|
208
|
+
}
|
|
209
|
+
return T(e);
|
|
210
|
+
}
|
|
211
|
+
function T(e) {
|
|
212
|
+
if (e === void 0) {
|
|
213
|
+
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
|
|
214
|
+
}
|
|
215
|
+
return e;
|
|
216
|
+
}
|
|
217
|
+
function x() {
|
|
218
|
+
if (typeof Reflect === "undefined" || !Reflect.construct) return false;
|
|
219
|
+
if (Reflect.construct.sham) return false;
|
|
220
|
+
if (typeof Proxy === "function") return true;
|
|
221
|
+
try {
|
|
222
|
+
Date.prototype.toString.call(Reflect.construct(Date, [], (function() {})));
|
|
223
|
+
return true;
|
|
224
|
+
} catch (e) {
|
|
225
|
+
return false;
|
|
226
|
+
}
|
|
227
|
+
}
|
|
228
|
+
function M(e) {
|
|
229
|
+
M = Object.setPrototypeOf ? Object.getPrototypeOf : function e(t) {
|
|
230
|
+
return t.__proto__ || Object.getPrototypeOf(t);
|
|
231
|
+
};
|
|
232
|
+
return M(e);
|
|
233
|
+
}
|
|
234
|
+
function D(e, t, n) {
|
|
235
|
+
if (t in e) {
|
|
236
|
+
Object.defineProperty(e, t, {
|
|
237
|
+
value: n,
|
|
238
|
+
enumerable: true,
|
|
239
|
+
configurable: true,
|
|
240
|
+
writable: true
|
|
241
|
+
});
|
|
242
|
+
} else {
|
|
243
|
+
e[t] = n;
|
|
244
|
+
}
|
|
245
|
+
return e;
|
|
246
|
+
}
|
|
247
|
+
var U = {
|
|
248
|
+
elementRef: i().oneOfType([ i().func, i().object ]),
|
|
249
|
+
panelId: i().any.isRequired,
|
|
250
|
+
/**
|
|
160
251
|
* @private.
|
|
161
252
|
* Used internally, func passed in from outer place is overwritten
|
|
162
253
|
* by SlidingPanels during rendering
|
|
163
254
|
*/
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
/**
|
|
255
|
+
onMount: i().func,
|
|
256
|
+
/**
|
|
167
257
|
* @private.
|
|
168
258
|
* Used internally, func passed in from outer place is overwritten
|
|
169
259
|
* by SlidingPanels during rendering
|
|
170
260
|
*/
|
|
171
|
-
|
|
172
|
-
};
|
|
173
|
-
var
|
|
174
|
-
|
|
175
|
-
/**
|
|
261
|
+
onUnmount: i().func
|
|
262
|
+
};
|
|
263
|
+
var N = {};
|
|
264
|
+
/**
|
|
176
265
|
* Container for arbitrary content.
|
|
177
|
-
*/
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
266
|
+
*/ var L = function(e) {
|
|
267
|
+
k(n, e);
|
|
268
|
+
var t = A(n);
|
|
269
|
+
function n() {
|
|
270
|
+
var e;
|
|
271
|
+
_(this, n);
|
|
272
|
+
for (var r = arguments.length, o = new Array(r), i = 0; i < r; i++) {
|
|
273
|
+
o[i] = arguments[i];
|
|
274
|
+
}
|
|
275
|
+
e = t.call.apply(t, [ this ].concat(o));
|
|
276
|
+
D(T(e), "el", null);
|
|
277
|
+
D(T(e), "handleMount", (function(t) {
|
|
278
|
+
e.el = t;
|
|
279
|
+
j(e.props.elementRef, t);
|
|
280
|
+
}));
|
|
281
|
+
return e;
|
|
282
|
+
}
|
|
283
|
+
R(n, [ {
|
|
284
|
+
key: "componentDidMount",
|
|
285
|
+
value: function e() {
|
|
286
|
+
var t, n;
|
|
287
|
+
(t = (n = this.props).onMount) === null || t === void 0 ? void 0 : t.call(n, this);
|
|
288
|
+
}
|
|
289
|
+
}, {
|
|
290
|
+
key: "componentWillUnmount",
|
|
291
|
+
value: function e() {
|
|
292
|
+
var t, n;
|
|
293
|
+
(t = (n = this.props).onUnmount) === null || t === void 0 ? void 0 : t.call(n, this);
|
|
294
|
+
}
|
|
295
|
+
}, {
|
|
296
|
+
key: "getHeight",
|
|
297
|
+
value: function e() {
|
|
298
|
+
var t;
|
|
299
|
+
return (t = this.el) === null || t === void 0 ? void 0 : t.clientHeight;
|
|
300
|
+
}
|
|
301
|
+
}, {
|
|
302
|
+
key: "getWidth",
|
|
303
|
+
value: function e() {
|
|
304
|
+
var t;
|
|
305
|
+
return (t = this.el) === null || t === void 0 ? void 0 : t.clientWidth;
|
|
306
|
+
}
|
|
307
|
+
}, {
|
|
308
|
+
key: "render",
|
|
309
|
+
value: function e() {
|
|
310
|
+
var t = this.props.panelId;
|
|
311
|
+
|
|
312
|
+
return r().createElement(w, I({
|
|
313
|
+
"data-test": "panel",
|
|
314
|
+
"data-test-panel-id": t
|
|
315
|
+
}, f()(this.props, c()(n.propTypes)), {
|
|
316
|
+
ref: this.handleMount
|
|
317
|
+
}));
|
|
318
|
+
}
|
|
319
|
+
} ]);
|
|
320
|
+
return n;
|
|
321
|
+
}(n.Component);
|
|
322
|
+
D(L, "propTypes", U);
|
|
323
|
+
D(L, "defaultProps", N);
|
|
324
|
+
/* harmony default export */ const W = L;
|
|
325
|
+
// CONCATENATED MODULE: ./src/SlidingPanels/SlidingPanels.tsx
|
|
326
|
+
function X(e) {
|
|
327
|
+
"@babel/helpers - typeof";
|
|
328
|
+
if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
|
|
329
|
+
X = function e(t) {
|
|
330
|
+
return typeof t;
|
|
331
|
+
};
|
|
332
|
+
} else {
|
|
333
|
+
X = function e(t) {
|
|
334
|
+
return t && typeof Symbol === "function" && t.constructor === Symbol && t !== Symbol.prototype ? "symbol" : typeof t;
|
|
335
|
+
};
|
|
336
|
+
}
|
|
337
|
+
return X(e);
|
|
190
338
|
}
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
_createClass(Panel, [{
|
|
205
|
-
key: "componentDidMount",
|
|
206
|
-
value: function componentDidMount() {
|
|
207
|
-
var _this$props$onMount, _this$props;
|
|
208
|
-
|
|
209
|
-
(_this$props$onMount = (_this$props = this.props).onMount) === null || _this$props$onMount === void 0 ? void 0 : _this$props$onMount.call(_this$props, this);
|
|
339
|
+
function H() {
|
|
340
|
+
H = Object.assign || function(e) {
|
|
341
|
+
for (var t = 1; t < arguments.length; t++) {
|
|
342
|
+
var n = arguments[t];
|
|
343
|
+
for (var r in n) {
|
|
344
|
+
if (Object.prototype.hasOwnProperty.call(n, r)) {
|
|
345
|
+
e[r] = n[r];
|
|
346
|
+
}
|
|
347
|
+
}
|
|
348
|
+
}
|
|
349
|
+
return e;
|
|
350
|
+
};
|
|
351
|
+
return H.apply(this, arguments);
|
|
210
352
|
}
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
353
|
+
function B(e, t) {
|
|
354
|
+
var n = Object.keys(e);
|
|
355
|
+
if (Object.getOwnPropertySymbols) {
|
|
356
|
+
var r = Object.getOwnPropertySymbols(e);
|
|
357
|
+
if (t) r = r.filter((function(t) {
|
|
358
|
+
return Object.getOwnPropertyDescriptor(e, t).enumerable;
|
|
359
|
+
}));
|
|
360
|
+
n.push.apply(n, r);
|
|
361
|
+
}
|
|
362
|
+
return n;
|
|
217
363
|
}
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
364
|
+
function V(e) {
|
|
365
|
+
for (var t = 1; t < arguments.length; t++) {
|
|
366
|
+
var n = arguments[t] != null ? arguments[t] : {};
|
|
367
|
+
if (t % 2) {
|
|
368
|
+
B(Object(n), true).forEach((function(t) {
|
|
369
|
+
te(e, t, n[t]);
|
|
370
|
+
}));
|
|
371
|
+
} else if (Object.getOwnPropertyDescriptors) {
|
|
372
|
+
Object.defineProperties(e, Object.getOwnPropertyDescriptors(n));
|
|
373
|
+
} else {
|
|
374
|
+
B(Object(n)).forEach((function(t) {
|
|
375
|
+
Object.defineProperty(e, t, Object.getOwnPropertyDescriptor(n, t));
|
|
376
|
+
}));
|
|
377
|
+
}
|
|
378
|
+
}
|
|
379
|
+
return e;
|
|
224
380
|
}
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
return (_this$el2 = this.el) === null || _this$el2 === void 0 ? void 0 : _this$el2.clientWidth;
|
|
381
|
+
function F(e, t) {
|
|
382
|
+
if (!(e instanceof t)) {
|
|
383
|
+
throw new TypeError("Cannot call a class as a function");
|
|
384
|
+
}
|
|
231
385
|
}
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
ref: this.handleMount
|
|
241
|
-
}));
|
|
386
|
+
function z(e, t) {
|
|
387
|
+
for (var n = 0; n < t.length; n++) {
|
|
388
|
+
var r = t[n];
|
|
389
|
+
r.enumerable = r.enumerable || false;
|
|
390
|
+
r.configurable = true;
|
|
391
|
+
if ("value" in r) r.writable = true;
|
|
392
|
+
Object.defineProperty(e, r.key, r);
|
|
393
|
+
}
|
|
242
394
|
}
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
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; }
|
|
259
|
-
|
|
260
|
-
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) { SlidingPanels_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; }
|
|
261
|
-
|
|
262
|
-
function SlidingPanels_classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
263
|
-
|
|
264
|
-
function SlidingPanels_defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
|
265
|
-
|
|
266
|
-
function SlidingPanels_createClass(Constructor, protoProps, staticProps) { if (protoProps) SlidingPanels_defineProperties(Constructor.prototype, protoProps); if (staticProps) SlidingPanels_defineProperties(Constructor, staticProps); return Constructor; }
|
|
267
|
-
|
|
268
|
-
function SlidingPanels_inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) SlidingPanels_setPrototypeOf(subClass, superClass); }
|
|
269
|
-
|
|
270
|
-
function SlidingPanels_setPrototypeOf(o, p) { SlidingPanels_setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return SlidingPanels_setPrototypeOf(o, p); }
|
|
271
|
-
|
|
272
|
-
function SlidingPanels_createSuper(Derived) { var hasNativeReflectConstruct = SlidingPanels_isNativeReflectConstruct(); return function _createSuperInternal() { var Super = SlidingPanels_getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = SlidingPanels_getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return SlidingPanels_possibleConstructorReturn(this, result); }; }
|
|
273
|
-
|
|
274
|
-
function SlidingPanels_possibleConstructorReturn(self, call) { if (call && (SlidingPanels_typeof(call) === "object" || typeof call === "function")) { return call; } return SlidingPanels_assertThisInitialized(self); }
|
|
275
|
-
|
|
276
|
-
function SlidingPanels_assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
|
277
|
-
|
|
278
|
-
function SlidingPanels_isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
|
|
279
|
-
|
|
280
|
-
function SlidingPanels_getPrototypeOf(o) { SlidingPanels_getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return SlidingPanels_getPrototypeOf(o); }
|
|
281
|
-
|
|
282
|
-
function SlidingPanels_defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
var SlidingPanels_propTypes = {
|
|
295
|
-
activePanelId: (external_prop_types_default()).any.isRequired,
|
|
296
|
-
children: (external_prop_types_default()).node,
|
|
297
|
-
elementRef: external_prop_types_default().oneOfType([(external_prop_types_default()).func, (external_prop_types_default()).object]),
|
|
298
|
-
innerClassName: (external_prop_types_default()).string,
|
|
299
|
-
innerStyle: (external_prop_types_default()).object,
|
|
300
|
-
onAnimationEnd: (external_prop_types_default()).func,
|
|
301
|
-
outerClassName: (external_prop_types_default()).string,
|
|
302
|
-
outerStyle: (external_prop_types_default()).object,
|
|
303
|
-
transition: external_prop_types_default().oneOf(['forward', 'backward'])
|
|
304
|
-
};
|
|
305
|
-
var SlidingPanels_defaultProps = {
|
|
306
|
-
transition: 'forward'
|
|
307
|
-
};
|
|
308
|
-
|
|
309
|
-
var SlidingPanels = /*#__PURE__*/function (_Component) {
|
|
310
|
-
SlidingPanels_inherits(SlidingPanels, _Component);
|
|
311
|
-
|
|
312
|
-
var _super = SlidingPanels_createSuper(SlidingPanels);
|
|
313
|
-
|
|
314
|
-
// @docs-props-type SlidingPanelsPropsBase
|
|
315
|
-
function SlidingPanels(props) {
|
|
316
|
-
var _this;
|
|
317
|
-
|
|
318
|
-
SlidingPanels_classCallCheck(this, SlidingPanels);
|
|
319
|
-
|
|
320
|
-
_this = _super.call(this, props);
|
|
321
|
-
|
|
322
|
-
SlidingPanels_defineProperty(SlidingPanels_assertThisInitialized(_this), "panelInstances", {});
|
|
323
|
-
|
|
324
|
-
SlidingPanels_defineProperty(SlidingPanels_assertThisInitialized(_this), "allowAnimationUpdates", true);
|
|
325
|
-
|
|
326
|
-
SlidingPanels_defineProperty(SlidingPanels_assertThisInitialized(_this), "willEnter", function () {
|
|
327
|
-
return {
|
|
328
|
-
translateX: 0
|
|
329
|
-
};
|
|
330
|
-
});
|
|
331
|
-
|
|
332
|
-
SlidingPanels_defineProperty(SlidingPanels_assertThisInitialized(_this), "willLeave", function (animating) {
|
|
333
|
-
return animating ? {
|
|
334
|
-
translateX: -1,
|
|
335
|
-
position: 'absolute',
|
|
336
|
-
left: 0,
|
|
337
|
-
top: 0
|
|
338
|
-
} : {
|
|
339
|
-
translateX: -1
|
|
340
|
-
};
|
|
341
|
-
});
|
|
342
|
-
|
|
343
|
-
SlidingPanels_defineProperty(SlidingPanels_assertThisInitialized(_this), "handlePanelMount", function (panel) {
|
|
344
|
-
_this.panelInstances[panel.props.panelId] = panel;
|
|
345
|
-
|
|
346
|
-
if (panel.props.panelId === _this.props.activePanelId) {
|
|
347
|
-
_this.setState({
|
|
348
|
-
activePanel: panel,
|
|
349
|
-
panelLoading: false
|
|
350
|
-
});
|
|
351
|
-
}
|
|
352
|
-
});
|
|
353
|
-
|
|
354
|
-
SlidingPanels_defineProperty(SlidingPanels_assertThisInitialized(_this), "handlePanelUnmount", function (panel) {
|
|
355
|
-
delete _this.panelInstances[panel.props.panelId];
|
|
356
|
-
});
|
|
357
|
-
|
|
358
|
-
SlidingPanels_defineProperty(SlidingPanels_assertThisInitialized(_this), "handleAnimationEnd", function () {
|
|
359
|
-
var _this$props$onAnimati, _this$props;
|
|
360
|
-
|
|
361
|
-
if (_this.allowAnimationUpdates) {
|
|
362
|
-
_this.setState({
|
|
363
|
-
animating: false
|
|
395
|
+
function G(e, t, n) {
|
|
396
|
+
if (t) z(e.prototype, t);
|
|
397
|
+
if (n) z(e, n);
|
|
398
|
+
return e;
|
|
399
|
+
}
|
|
400
|
+
function J(e, t) {
|
|
401
|
+
if (typeof t !== "function" && t !== null) {
|
|
402
|
+
throw new TypeError("Super expression must either be null or a function");
|
|
403
|
+
}
|
|
404
|
+
e.prototype = Object.create(t && t.prototype, {
|
|
405
|
+
constructor: {
|
|
406
|
+
value: e,
|
|
407
|
+
writable: true,
|
|
408
|
+
configurable: true
|
|
409
|
+
}
|
|
364
410
|
});
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
if (false) {}
|
|
416
|
-
|
|
417
|
-
var transitionStyle = animating ? {
|
|
418
|
-
translateX: 1
|
|
419
|
-
} : {};
|
|
420
|
-
var currentPanelsArr = filter_default()(values_default()(_this.panelInstances), function (panel) {
|
|
421
|
-
return !!panel;
|
|
422
|
-
});
|
|
423
|
-
var maxWidth = currentPanelsArr.map(function (panel) {
|
|
424
|
-
var _p$getWidth;
|
|
425
|
-
|
|
426
|
-
var p = _this.panelInstances[panel.props.panelId];
|
|
427
|
-
return p ? (_p$getWidth = p.getWidth()) !== null && _p$getWidth !== void 0 ? _p$getWidth : 0 : 0;
|
|
428
|
-
}).reduce(function (max, current) {
|
|
429
|
-
return Math.max(max, current);
|
|
430
|
-
}, 0);
|
|
431
|
-
return /*#__PURE__*/external_react_default().createElement(StyledBox, SlidingPanels_extends({
|
|
432
|
-
className: outerClassName,
|
|
433
|
-
"data-test-active-panel-id": activePanelId,
|
|
434
|
-
"data-test": "sliding-panels",
|
|
435
|
-
elementRef: elementRef,
|
|
436
|
-
style: style
|
|
437
|
-
}, omit_default()(_this.props, keys_default()(SlidingPanels.propTypes))), /*#__PURE__*/external_react_default().createElement(Animation_namespaceObject.Transition, {
|
|
438
|
-
from: transitionStyle,
|
|
439
|
-
enter: _this.willEnter(),
|
|
440
|
-
leave: _this.willLeave(animating),
|
|
441
|
-
items: activePanelId
|
|
442
|
-
}, // eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
443
|
-
function (styles, item) {
|
|
444
|
-
return /*#__PURE__*/external_react_default().createElement(external_react_spring_namespaceObject.animated.div, {
|
|
445
|
-
style: innerStyle,
|
|
446
|
-
className: innerClassName
|
|
447
|
-
}, _this.renderPanel(styles, item, maxWidth));
|
|
448
|
-
}));
|
|
449
|
-
});
|
|
450
|
-
|
|
451
|
-
_this.state = {
|
|
452
|
-
animating: false,
|
|
453
|
-
panelLoading: false,
|
|
454
|
-
prevActivePanelId: _this.props.activePanelId,
|
|
455
|
-
// eslint-disable-line react/no-unused-state
|
|
456
|
-
slidingId: 0 // eslint-disable-line react/no-unused-state
|
|
457
|
-
|
|
458
|
-
};
|
|
459
|
-
return _this;
|
|
460
|
-
}
|
|
461
|
-
|
|
462
|
-
SlidingPanels_createClass(SlidingPanels, [{
|
|
463
|
-
key: "componentWillUnmount",
|
|
464
|
-
value: function componentWillUnmount() {
|
|
465
|
-
this.allowAnimationUpdates = false;
|
|
411
|
+
if (t) K(e, t);
|
|
412
|
+
}
|
|
413
|
+
function K(e, t) {
|
|
414
|
+
K = Object.setPrototypeOf || function e(t, n) {
|
|
415
|
+
t.__proto__ = n;
|
|
416
|
+
return t;
|
|
417
|
+
};
|
|
418
|
+
return K(e, t);
|
|
419
|
+
}
|
|
420
|
+
function Q(e) {
|
|
421
|
+
var t = $();
|
|
422
|
+
return function n() {
|
|
423
|
+
var r = ee(e), o;
|
|
424
|
+
if (t) {
|
|
425
|
+
var i = ee(this).constructor;
|
|
426
|
+
o = Reflect.construct(r, arguments, i);
|
|
427
|
+
} else {
|
|
428
|
+
o = r.apply(this, arguments);
|
|
429
|
+
}
|
|
430
|
+
return Y(this, o);
|
|
431
|
+
};
|
|
432
|
+
}
|
|
433
|
+
function Y(e, t) {
|
|
434
|
+
if (t && (X(t) === "object" || typeof t === "function")) {
|
|
435
|
+
return t;
|
|
436
|
+
}
|
|
437
|
+
return Z(e);
|
|
438
|
+
}
|
|
439
|
+
function Z(e) {
|
|
440
|
+
if (e === void 0) {
|
|
441
|
+
throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
|
|
442
|
+
}
|
|
443
|
+
return e;
|
|
444
|
+
}
|
|
445
|
+
function $() {
|
|
446
|
+
if (typeof Reflect === "undefined" || !Reflect.construct) return false;
|
|
447
|
+
if (Reflect.construct.sham) return false;
|
|
448
|
+
if (typeof Proxy === "function") return true;
|
|
449
|
+
try {
|
|
450
|
+
Date.prototype.toString.call(Reflect.construct(Date, [], (function() {})));
|
|
451
|
+
return true;
|
|
452
|
+
} catch (e) {
|
|
453
|
+
return false;
|
|
454
|
+
}
|
|
455
|
+
}
|
|
456
|
+
function ee(e) {
|
|
457
|
+
ee = Object.setPrototypeOf ? Object.getPrototypeOf : function e(t) {
|
|
458
|
+
return t.__proto__ || Object.getPrototypeOf(t);
|
|
459
|
+
};
|
|
460
|
+
return ee(e);
|
|
466
461
|
}
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
// we only set the style when panelLoading is true (immediate prop prevents animation if true).
|
|
478
|
-
|
|
479
|
-
var style = {
|
|
480
|
-
width: width,
|
|
481
|
-
height: height
|
|
482
|
-
};
|
|
483
|
-
return /*#__PURE__*/external_react_default().createElement(Animation_namespaceObject.Spring, {
|
|
484
|
-
to: style,
|
|
485
|
-
onRest: this.handleAnimationEnd,
|
|
486
|
-
immediate: panelLoading,
|
|
487
|
-
config: {
|
|
488
|
-
precision: 1
|
|
462
|
+
function te(e, t, n) {
|
|
463
|
+
if (t in e) {
|
|
464
|
+
Object.defineProperty(e, t, {
|
|
465
|
+
value: n,
|
|
466
|
+
enumerable: true,
|
|
467
|
+
configurable: true,
|
|
468
|
+
writable: true
|
|
469
|
+
});
|
|
470
|
+
} else {
|
|
471
|
+
e[t] = n;
|
|
489
472
|
}
|
|
490
|
-
|
|
491
|
-
/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
|
|
492
|
-
this.renderOuterContainer);
|
|
473
|
+
return e;
|
|
493
474
|
}
|
|
494
|
-
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
SlidingPanels_defineProperty(SlidingPanels, "getDerivedStateFromProps", function (props, state) {
|
|
506
|
-
if (props.activePanelId !== state.prevActivePanelId) {
|
|
507
|
-
// instead of using panelId, assign each sliding event an id and
|
|
508
|
-
// use it as the key to make sure new panelA will transit as expected if
|
|
509
|
-
// old panelA has not fully left yet
|
|
510
|
-
return {
|
|
511
|
-
animating: true,
|
|
512
|
-
panelLoading: true,
|
|
513
|
-
prevActivePanelId: props.activePanelId,
|
|
514
|
-
slidingId: state.slidingId + 1
|
|
475
|
+
var ne = {
|
|
476
|
+
activePanelId: i().any.isRequired,
|
|
477
|
+
children: i().node,
|
|
478
|
+
elementRef: i().oneOfType([ i().func, i().object ]),
|
|
479
|
+
innerClassName: i().string,
|
|
480
|
+
innerStyle: i().object,
|
|
481
|
+
onAnimationEnd: i().func,
|
|
482
|
+
outerClassName: i().string,
|
|
483
|
+
outerStyle: i().object,
|
|
484
|
+
transition: i().oneOf([ "forward", "backward" ])
|
|
515
485
|
};
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
521
|
-
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
486
|
+
var re = {
|
|
487
|
+
transition: "forward"
|
|
488
|
+
};
|
|
489
|
+
var oe = function(e) {
|
|
490
|
+
J(o, e);
|
|
491
|
+
var t = Q(o);
|
|
492
|
+
// @docs-props-type SlidingPanelsPropsBase
|
|
493
|
+
function o(e) {
|
|
494
|
+
var i;
|
|
495
|
+
F(this, o);
|
|
496
|
+
i = t.call(this, e);
|
|
497
|
+
te(Z(i), "panelInstances", {});
|
|
498
|
+
te(Z(i), "allowAnimationUpdates", true);
|
|
499
|
+
te(Z(i), "willEnter", (function() {
|
|
500
|
+
return {
|
|
501
|
+
translateX: 0
|
|
502
|
+
};
|
|
503
|
+
}));
|
|
504
|
+
te(Z(i), "willLeave", (function(e) {
|
|
505
|
+
return e ? {
|
|
506
|
+
translateX: -1,
|
|
507
|
+
position: "absolute",
|
|
508
|
+
left: 0,
|
|
509
|
+
top: 0
|
|
510
|
+
} : {
|
|
511
|
+
translateX: -1
|
|
512
|
+
};
|
|
513
|
+
}));
|
|
514
|
+
te(Z(i), "handlePanelMount", (function(e) {
|
|
515
|
+
i.panelInstances[e.props.panelId] = e;
|
|
516
|
+
if (e.props.panelId === i.props.activePanelId) {
|
|
517
|
+
i.setState({
|
|
518
|
+
activePanel: e,
|
|
519
|
+
panelLoading: false
|
|
520
|
+
});
|
|
521
|
+
}
|
|
522
|
+
}));
|
|
523
|
+
te(Z(i), "handlePanelUnmount", (function(e) {
|
|
524
|
+
delete i.panelInstances[e.props.panelId];
|
|
525
|
+
}));
|
|
526
|
+
te(Z(i), "handleAnimationEnd", (function() {
|
|
527
|
+
var e, t;
|
|
528
|
+
if (i.allowAnimationUpdates) {
|
|
529
|
+
i.setState({
|
|
530
|
+
animating: false
|
|
531
|
+
});
|
|
532
|
+
}
|
|
533
|
+
(e = (t = i.props).onAnimationEnd) === null || e === void 0 ? void 0 : e.call(t);
|
|
534
|
+
}));
|
|
535
|
+
te(Z(i), "renderPanel", (function(e, t, o) {
|
|
536
|
+
var a;
|
|
537
|
+
var l = i.props, u = l.children, c = l.transition;
|
|
538
|
+
var s = n.Children.toArray(u).filter(n.isValidElement).find((function(e) {
|
|
539
|
+
return e.props.panelId === t;
|
|
540
|
+
}));
|
|
541
|
+
// TODO: Fix Interplation<string | number> can't be cast to string
|
|
542
|
+
var f = (a = e.translateX) === null || a === void 0 ? void 0 : a.to((function(e) {
|
|
543
|
+
return "translateX(".concat(e * o * (c === "forward" ? 1 : -1), "px)");
|
|
544
|
+
}));
|
|
545
|
+
var p = s ? r().createElement(y.animated.div, {
|
|
546
|
+
style: e
|
|
547
|
+
}, (0, n.cloneElement)(s, {
|
|
548
|
+
style: V(V({}, s.props.style), {}, {
|
|
549
|
+
transform: f
|
|
550
|
+
}),
|
|
551
|
+
onMount: i.handlePanelMount,
|
|
552
|
+
onUnmount: i.handlePanelUnmount
|
|
553
|
+
})) : null;
|
|
554
|
+
return p;
|
|
555
|
+
}));
|
|
556
|
+
te(Z(i), "renderOuterContainer", (function(e) {
|
|
557
|
+
var t = i.props, a = t.activePanelId, u = t.children, s = t.elementRef, p = t.outerClassName, m = t.outerStyle, h = t.innerClassName, b = t.innerStyle;
|
|
558
|
+
var g = i.state.animating;
|
|
559
|
+
var O = V(V({}, m), g ? {
|
|
560
|
+
width: e.width,
|
|
561
|
+
height: e.height
|
|
562
|
+
} : {});
|
|
563
|
+
var w = n.Children.toArray(u).filter(n.isValidElement).find((function(e) {
|
|
564
|
+
return e.props.panelId === a;
|
|
565
|
+
}));
|
|
566
|
+
if (false) {}
|
|
567
|
+
var j = g ? {
|
|
568
|
+
translateX: 1
|
|
569
|
+
} : {};
|
|
570
|
+
var S = l()(d()(i.panelInstances), (function(e) {
|
|
571
|
+
return !!e;
|
|
572
|
+
}));
|
|
573
|
+
var I = S.map((function(e) {
|
|
574
|
+
var t;
|
|
575
|
+
var n = i.panelInstances[e.props.panelId];
|
|
576
|
+
return n ? (t = n.getWidth()) !== null && t !== void 0 ? t : 0 : 0;
|
|
577
|
+
})).reduce((function(e, t) {
|
|
578
|
+
return Math.max(e, t);
|
|
579
|
+
}), 0);
|
|
580
|
+
|
|
581
|
+
return r().createElement(P, H({
|
|
582
|
+
className: p,
|
|
583
|
+
"data-test-active-panel-id": a,
|
|
584
|
+
"data-test": "sliding-panels",
|
|
585
|
+
elementRef: s,
|
|
586
|
+
style: O
|
|
587
|
+
}, f()(i.props, c()(o.propTypes))), r().createElement(v.Transition, {
|
|
588
|
+
from: j,
|
|
589
|
+
enter: i.willEnter(),
|
|
590
|
+
leave: i.willLeave(g),
|
|
591
|
+
items: a
|
|
592
|
+
}, (// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
593
|
+
function(e, t) {
|
|
594
|
+
|
|
595
|
+
return r().createElement(y.animated.div, {
|
|
596
|
+
style: b,
|
|
597
|
+
className: h
|
|
598
|
+
}, i.renderPanel(e, t, I));
|
|
599
|
+
})));
|
|
600
|
+
}));
|
|
601
|
+
i.state = {
|
|
602
|
+
animating: false,
|
|
603
|
+
panelLoading: false,
|
|
604
|
+
prevActivePanelId: i.props.activePanelId,
|
|
605
|
+
// eslint-disable-line react/no-unused-state
|
|
606
|
+
slidingId: 0
|
|
607
|
+
};
|
|
608
|
+
return i;
|
|
609
|
+
}
|
|
610
|
+
G(o, [ {
|
|
611
|
+
key: "componentWillUnmount",
|
|
612
|
+
value: function e() {
|
|
613
|
+
this.allowAnimationUpdates = false;
|
|
614
|
+
}
|
|
615
|
+
}, {
|
|
616
|
+
key: "render",
|
|
617
|
+
value: function e() {
|
|
618
|
+
var t = this.state, n = t.activePanel, o = t.panelLoading;
|
|
619
|
+
var i = n ? n.getWidth() : 0;
|
|
620
|
+
var a = n ? n.getHeight() : 0;
|
|
621
|
+
// When a new panel is loading, the activePanel is about to be removed. The height and/or
|
|
622
|
+
// width of that panel may have changed since the last render. To ensure that the next
|
|
623
|
+
// panel animates from the current height and width (rather than the previously loaded one),
|
|
624
|
+
// we only set the style when panelLoading is true (immediate prop prevents animation if true).
|
|
625
|
+
var l = {
|
|
626
|
+
width: i,
|
|
627
|
+
height: a
|
|
628
|
+
};
|
|
629
|
+
|
|
630
|
+
return r().createElement(v.Spring, {
|
|
631
|
+
to: l,
|
|
632
|
+
onRest: this.handleAnimationEnd,
|
|
633
|
+
immediate: o,
|
|
634
|
+
config: {
|
|
635
|
+
precision: 1
|
|
636
|
+
}
|
|
637
|
+
},
|
|
638
|
+
/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
|
|
639
|
+
this.renderOuterContainer);
|
|
640
|
+
}
|
|
641
|
+
} ]);
|
|
642
|
+
return o;
|
|
643
|
+
}(n.Component);
|
|
644
|
+
te(oe, "propTypes", ne);
|
|
645
|
+
te(oe, "defaultProps", re);
|
|
646
|
+
te(oe, "Panel", W);
|
|
647
|
+
te(oe, "getDerivedStateFromProps", (function(e, t) {
|
|
648
|
+
if (e.activePanelId !== t.prevActivePanelId) {
|
|
649
|
+
// instead of using panelId, assign each sliding event an id and
|
|
650
|
+
// use it as the key to make sure new panelA will transit as expected if
|
|
651
|
+
// old panelA has not fully left yet
|
|
652
|
+
return {
|
|
653
|
+
animating: true,
|
|
654
|
+
panelLoading: true,
|
|
655
|
+
prevActivePanelId: e.activePanelId,
|
|
656
|
+
slidingId: t.slidingId + 1
|
|
657
|
+
};
|
|
658
|
+
}
|
|
659
|
+
// Return null to indicate no change to state
|
|
660
|
+
return null;
|
|
661
|
+
}));
|
|
662
|
+
/* harmony default export */ const ie = oe;
|
|
663
|
+
// CONCATENATED MODULE: ./src/SlidingPanels/index.ts
|
|
664
|
+
module.exports = t;
|
|
665
|
+
/******/})();
|