@cniot/android-pda-components 0.1.2 → 0.1.3
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/build/assets/{index.83ea7ea1.js → index.5b9ffba3.js} +22 -22
- package/build/assets/index.cd5db7bf.css +1 -0
- package/build/assets/vendor.1a748dfd.js +38 -0
- package/build/index.html +3 -3
- package/change.md +8 -2
- package/doc/index.jsx +3 -3
- package/es/index.cjs.js +2 -2
- package/es/index.es.js +205 -3306
- package/es/style.css +1 -1
- package/package.json +1 -2
- package/build/assets/index.3dc86daa.css +0 -1
- package/build/assets/vendor.0fcd5cc7.js +0 -38
package/es/index.es.js
CHANGED
|
@@ -30,9 +30,7 @@ var __publicField = (obj, key, value) => {
|
|
|
30
30
|
__defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
31
31
|
return value;
|
|
32
32
|
};
|
|
33
|
-
import
|
|
34
|
-
import React__default, { useState, useEffect, useRef, cloneElement, useCallback, forwardRef, useContext, useMemo } from "react";
|
|
35
|
-
import { unstable_batchedUpdates } from "react-dom";
|
|
33
|
+
import React, { useState, useEffect, useRef, cloneElement, useCallback } from "react";
|
|
36
34
|
var global = "";
|
|
37
35
|
var _classnames_2_3_1_classnames = { exports: {} };
|
|
38
36
|
/*!
|
|
@@ -93,25 +91,25 @@ function getTypeClass$1(type) {
|
|
|
93
91
|
function Overlay(props) {
|
|
94
92
|
const { verticalPosition = "center", visible = true, closable = false, onClosed = () => {
|
|
95
93
|
} } = props;
|
|
96
|
-
const [hidden,
|
|
94
|
+
const [hidden, setHidden] = useState(!visible);
|
|
97
95
|
const option = {};
|
|
98
96
|
if (closable) {
|
|
99
97
|
option.onClick = (e) => {
|
|
100
|
-
|
|
98
|
+
setHidden(true);
|
|
101
99
|
onClosed();
|
|
102
100
|
};
|
|
103
101
|
}
|
|
104
102
|
useEffect(() => {
|
|
105
|
-
|
|
103
|
+
setHidden(!visible);
|
|
106
104
|
}, [visible]);
|
|
107
|
-
return !hidden ? /* @__PURE__ */
|
|
105
|
+
return !hidden ? /* @__PURE__ */ React.createElement("div", __spreadValues({
|
|
108
106
|
className: getTypeClass$1(verticalPosition)
|
|
109
107
|
}, option), props.children) : null;
|
|
110
108
|
}
|
|
111
109
|
var index$l = "";
|
|
112
110
|
const blankFunc$5 = () => {
|
|
113
111
|
};
|
|
114
|
-
class PdaTitle extends
|
|
112
|
+
class PdaTitle extends React.Component {
|
|
115
113
|
constructor(props) {
|
|
116
114
|
super(props);
|
|
117
115
|
__publicField(this, "state", {
|
|
@@ -121,28 +119,28 @@ class PdaTitle extends React__default.Component {
|
|
|
121
119
|
render() {
|
|
122
120
|
const { className, goBack = true, goBackHandle = blankFunc$5, icon = "scan", title = "\u4EFB\u52A1", menuList = null } = this.props;
|
|
123
121
|
const { showMenu } = this.state;
|
|
124
|
-
return /* @__PURE__ */
|
|
122
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
125
123
|
className: classNames({ [className]: true, "pda-header": true })
|
|
126
|
-
}, /* @__PURE__ */
|
|
124
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
127
125
|
className: "header-click-area",
|
|
128
126
|
onClick: goBack ? goBackHandle : blankFunc$5
|
|
129
|
-
}, goBack && /* @__PURE__ */
|
|
127
|
+
}, goBack && /* @__PURE__ */ React.createElement("div", {
|
|
130
128
|
className: "pda-goback"
|
|
131
|
-
}), icon && /* @__PURE__ */
|
|
129
|
+
}), icon && /* @__PURE__ */ React.createElement("div", {
|
|
132
130
|
className: classNames({ "pda-header-icon": true, ["pda-header-icon-" + icon]: true })
|
|
133
|
-
})), /* @__PURE__ */
|
|
131
|
+
})), /* @__PURE__ */ React.createElement("p", {
|
|
134
132
|
className: classNames({ "pda-title-text": true })
|
|
135
|
-
}, title), menuList ? /* @__PURE__ */
|
|
133
|
+
}, title), menuList ? /* @__PURE__ */ React.createElement("div", {
|
|
136
134
|
className: "pda-header-more",
|
|
137
135
|
onClick: (e) => {
|
|
138
136
|
this.setState({ showMenu: true });
|
|
139
137
|
}
|
|
140
|
-
}) : null, /* @__PURE__ */
|
|
138
|
+
}) : null, /* @__PURE__ */ React.createElement(Overlay, {
|
|
141
139
|
visible: showMenu,
|
|
142
140
|
verticalPosition: "bottom",
|
|
143
141
|
closable: true,
|
|
144
142
|
onClosed: (e) => this.setState({ showMenu: false })
|
|
145
|
-
}, /* @__PURE__ */
|
|
143
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
146
144
|
className: "pda-menus"
|
|
147
145
|
}, menuList)));
|
|
148
146
|
}
|
|
@@ -150,13 +148,13 @@ class PdaTitle extends React__default.Component {
|
|
|
150
148
|
var index$k = "";
|
|
151
149
|
function Button(props) {
|
|
152
150
|
const { type = "default", onClick, className = "" } = props;
|
|
153
|
-
return /* @__PURE__ */
|
|
151
|
+
return /* @__PURE__ */ React.createElement("button", {
|
|
154
152
|
className: `pda-button pda-button-${type} ${className}`,
|
|
155
153
|
onClick
|
|
156
154
|
}, props.children);
|
|
157
155
|
}
|
|
158
156
|
function ButtonGroup(props) {
|
|
159
|
-
return /* @__PURE__ */
|
|
157
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
160
158
|
className: "button-group"
|
|
161
159
|
}, props.children);
|
|
162
160
|
}
|
|
@@ -166,102 +164,102 @@ const empty$2 = () => {
|
|
|
166
164
|
};
|
|
167
165
|
function index$i(props) {
|
|
168
166
|
const { onBack, icon, title, menus = [], onClickMenuItem = empty$2, cancelMenuText } = props;
|
|
169
|
-
const [showMenus, setShowMenus] =
|
|
170
|
-
return /* @__PURE__ */
|
|
167
|
+
const [showMenus, setShowMenus] = React.useState(false);
|
|
168
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
171
169
|
className: "pda-header"
|
|
172
|
-
}, /* @__PURE__ */
|
|
170
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
173
171
|
className: "header-click-area"
|
|
174
|
-
}, onBack ? /* @__PURE__ */
|
|
172
|
+
}, onBack ? /* @__PURE__ */ React.createElement("div", {
|
|
175
173
|
className: "pda-goback",
|
|
176
174
|
onClick: () => onBack("back")
|
|
177
|
-
}) : null, icon && /* @__PURE__ */
|
|
175
|
+
}) : null, icon && /* @__PURE__ */ React.createElement("div", {
|
|
178
176
|
className: `pda-header-icon pda-header-icon-${icon}`
|
|
179
|
-
})), /* @__PURE__ */
|
|
177
|
+
})), /* @__PURE__ */ React.createElement("div", {
|
|
180
178
|
className: "pda-title-text"
|
|
181
|
-
}, title), menus && menus.length ? /* @__PURE__ */
|
|
179
|
+
}, title), menus && menus.length ? /* @__PURE__ */ React.createElement("div", {
|
|
182
180
|
className: "pda-header-more",
|
|
183
181
|
onClick: () => setShowMenus(true)
|
|
184
|
-
}) : null, /* @__PURE__ */
|
|
182
|
+
}) : null, /* @__PURE__ */ React.createElement(Overlay, {
|
|
185
183
|
visible: showMenus,
|
|
186
184
|
verticalPosition: "bottom",
|
|
187
185
|
closable: false,
|
|
188
186
|
onClosed: () => setShowMenus(false)
|
|
189
|
-
}, /* @__PURE__ */
|
|
187
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
190
188
|
className: "pda-menus"
|
|
191
189
|
}, menus.map((item, index2) => {
|
|
192
|
-
return /* @__PURE__ */
|
|
190
|
+
return /* @__PURE__ */ React.createElement(Button, {
|
|
193
191
|
onClick: () => {
|
|
194
192
|
setShowMenus(false);
|
|
195
193
|
onClickMenuItem(item);
|
|
196
194
|
},
|
|
197
195
|
key: item.key || index2
|
|
198
196
|
}, item.label);
|
|
199
|
-
}), cancelMenuText ? /* @__PURE__ */
|
|
197
|
+
}), cancelMenuText ? /* @__PURE__ */ React.createElement("div", {
|
|
200
198
|
style: { marginTop: 20 }
|
|
201
|
-
}, /* @__PURE__ */
|
|
199
|
+
}, /* @__PURE__ */ React.createElement(Button, {
|
|
202
200
|
onClick: () => setShowMenus(false)
|
|
203
201
|
}, cancelMenuText)) : null)));
|
|
204
202
|
}
|
|
205
203
|
var index$h = "";
|
|
206
|
-
class PdaInfoCard$2 extends
|
|
204
|
+
class PdaInfoCard$2 extends React.Component {
|
|
207
205
|
constructor(props) {
|
|
208
206
|
super(props);
|
|
209
207
|
}
|
|
210
208
|
render() {
|
|
211
209
|
const { className = "", title, highlightInfo, subTitle, subHighlightInfo, subHighlightSubInfo, infoImage, tagText, highlightInfoCN, highlightSubInfo, percentage, highlightSubInfoCN, boldInfo, infoList = [], style = {}, theme = "light" } = this.props;
|
|
212
|
-
return /* @__PURE__ */
|
|
210
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
213
211
|
className: classNames({ [className]: true, "pda-info-card": true, "pda-info-card-dark": theme === "dark" }),
|
|
214
212
|
style
|
|
215
|
-
}, /* @__PURE__ */
|
|
213
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
216
214
|
className: "pda-info-card-title-section"
|
|
217
|
-
}, /* @__PURE__ */
|
|
215
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
218
216
|
className: "pda-info-card-title"
|
|
219
|
-
}, title), tagText ? /* @__PURE__ */
|
|
217
|
+
}, title), tagText ? /* @__PURE__ */ React.createElement("div", {
|
|
220
218
|
className: "pda-info-card-tag"
|
|
221
|
-
}, /* @__PURE__ */
|
|
219
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
222
220
|
className: "pda-info-card-tag-text"
|
|
223
|
-
}, tagText)) : null), /* @__PURE__ */
|
|
221
|
+
}, tagText)) : null), /* @__PURE__ */ React.createElement("div", {
|
|
224
222
|
className: "pda-info-card-highlight-section"
|
|
225
|
-
}, /* @__PURE__ */
|
|
223
|
+
}, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("div", {
|
|
226
224
|
className: "pda-info-card-highlight"
|
|
227
|
-
}, /* @__PURE__ */
|
|
225
|
+
}, /* @__PURE__ */ React.createElement("span", {
|
|
228
226
|
className: "pda-info-card-highlight1"
|
|
229
|
-
}, highlightInfo), /* @__PURE__ */
|
|
227
|
+
}, highlightInfo), /* @__PURE__ */ React.createElement("span", {
|
|
230
228
|
className: "pda-info-card-highlight1CN"
|
|
231
|
-
}, highlightInfoCN), /* @__PURE__ */
|
|
229
|
+
}, highlightInfoCN), /* @__PURE__ */ React.createElement("span", {
|
|
232
230
|
className: "pda-info-card-highlight2"
|
|
233
|
-
}, highlightSubInfo), /* @__PURE__ */
|
|
231
|
+
}, highlightSubInfo), /* @__PURE__ */ React.createElement("span", {
|
|
234
232
|
className: "pda-info-card-highlight2CN"
|
|
235
|
-
}, highlightSubInfoCN)), subTitle ? /* @__PURE__ */
|
|
233
|
+
}, highlightSubInfoCN)), subTitle ? /* @__PURE__ */ React.createElement("div", {
|
|
236
234
|
className: "pda-info-card-title"
|
|
237
|
-
}, subTitle) : null, subHighlightInfo ? /* @__PURE__ */
|
|
235
|
+
}, subTitle) : null, subHighlightInfo ? /* @__PURE__ */ React.createElement("div", {
|
|
238
236
|
className: "pda-info-card-highlight"
|
|
239
|
-
}, /* @__PURE__ */
|
|
237
|
+
}, /* @__PURE__ */ React.createElement("span", {
|
|
240
238
|
className: "pda-info-card-highlight1"
|
|
241
|
-
}, subHighlightInfo), /* @__PURE__ */
|
|
239
|
+
}, subHighlightInfo), /* @__PURE__ */ React.createElement("span", {
|
|
242
240
|
className: "pda-info-card-highlight2"
|
|
243
|
-
}, subHighlightSubInfo)) : null), infoImage ? /* @__PURE__ */
|
|
241
|
+
}, subHighlightSubInfo)) : null), infoImage ? /* @__PURE__ */ React.createElement("img", {
|
|
244
242
|
src: infoImage,
|
|
245
243
|
width: 150,
|
|
246
244
|
height: 150
|
|
247
|
-
}) : null), percentage !== void 0 ? /* @__PURE__ */
|
|
245
|
+
}) : null), percentage !== void 0 ? /* @__PURE__ */ React.createElement("div", {
|
|
248
246
|
className: "pda-info-card-progress"
|
|
249
|
-
}, /* @__PURE__ */
|
|
247
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
250
248
|
className: "pda-info-card-progress-inside",
|
|
251
249
|
style: { width: `${percentage * 100}%` }
|
|
252
|
-
})) : null, /* @__PURE__ */
|
|
250
|
+
})) : null, /* @__PURE__ */ React.createElement("div", {
|
|
253
251
|
className: "pda-info-card-bold"
|
|
254
252
|
}, boldInfo), infoList.map((item, index2) => {
|
|
255
|
-
return /* @__PURE__ */
|
|
253
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
256
254
|
key: index2,
|
|
257
255
|
className: "pda-info-card-list"
|
|
258
|
-
}, /* @__PURE__ */
|
|
256
|
+
}, /* @__PURE__ */ React.createElement("span", null, item.label || ""), "\xA0\xA0", /* @__PURE__ */ React.createElement("span", null, item.content || ""));
|
|
259
257
|
}));
|
|
260
258
|
}
|
|
261
259
|
}
|
|
262
260
|
PdaInfoCard$2.IMAGE_1 = "https://img.alicdn.com/imgextra/i2/O1CN01qYuxip1ME9zhdL9XG_!!6000000001402-2-tps-150-150.png";
|
|
263
261
|
var index$g = "";
|
|
264
|
-
class PdaListItem extends
|
|
262
|
+
class PdaListItem extends React.Component {
|
|
265
263
|
constructor(props) {
|
|
266
264
|
super(props);
|
|
267
265
|
}
|
|
@@ -270,38 +268,38 @@ class PdaListItem extends React__default.Component {
|
|
|
270
268
|
}, onHeightLightClick = () => {
|
|
271
269
|
}, onIconClick = () => {
|
|
272
270
|
}, highlightText, highlightSubText, stateTextList = [], stateList = [], subInfoList = [], style = {}, icon } = this.props;
|
|
273
|
-
return /* @__PURE__ */
|
|
271
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
274
272
|
className: classNames({ [className]: true, "pda-list-item": true }),
|
|
275
273
|
style,
|
|
276
274
|
onClick
|
|
277
|
-
}, /* @__PURE__ */
|
|
275
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
278
276
|
className: "pda-listitem-header"
|
|
279
|
-
}, header), /* @__PURE__ */
|
|
277
|
+
}, header), /* @__PURE__ */ React.createElement("div", {
|
|
280
278
|
onClick: onHeightLightClick,
|
|
281
279
|
className: "pda-listitem-highlight"
|
|
282
|
-
}, /* @__PURE__ */
|
|
280
|
+
}, /* @__PURE__ */ React.createElement("div", null, highlightText), /* @__PURE__ */ React.createElement("div", null, highlightSubText)), /* @__PURE__ */ React.createElement("div", {
|
|
283
281
|
className: "pda-listitem-state-text"
|
|
284
282
|
}, stateTextList.map((item, index2) => {
|
|
285
|
-
return /* @__PURE__ */
|
|
283
|
+
return /* @__PURE__ */ React.createElement("span", {
|
|
286
284
|
key: index2
|
|
287
285
|
}, item.label || "", "\uFF5C");
|
|
288
|
-
})), /* @__PURE__ */
|
|
286
|
+
})), /* @__PURE__ */ React.createElement("div", {
|
|
289
287
|
className: "pda-listitem-state-block"
|
|
290
288
|
}, stateList.map((item, index2) => {
|
|
291
289
|
const type = item && item.type ? item.type : "default";
|
|
292
|
-
return /* @__PURE__ */
|
|
290
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
293
291
|
key: index2,
|
|
294
292
|
className: type
|
|
295
293
|
}, item.label || "");
|
|
296
294
|
})), subInfoList.map((item, index2) => {
|
|
297
|
-
return /* @__PURE__ */
|
|
295
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
298
296
|
key: index2,
|
|
299
297
|
className: "pda-listitem-subinfo"
|
|
300
|
-
}, /* @__PURE__ */
|
|
301
|
-
}), icon ? /* @__PURE__ */
|
|
298
|
+
}, /* @__PURE__ */ React.createElement("span", null, item.label || ""), "\xA0\xA0", /* @__PURE__ */ React.createElement("span", null, item.content || ""));
|
|
299
|
+
}), icon ? /* @__PURE__ */ React.createElement("div", {
|
|
302
300
|
onClick: onIconClick,
|
|
303
301
|
className: "pda-listitem-icon"
|
|
304
|
-
}, /* @__PURE__ */
|
|
302
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
305
303
|
className: classNames({ "listitem-icon-container": true, ["listitem-icon-" + icon]: true })
|
|
306
304
|
})) : null);
|
|
307
305
|
}
|
|
@@ -311,25 +309,25 @@ function empty$1() {
|
|
|
311
309
|
}
|
|
312
310
|
function Confirm$1(props) {
|
|
313
311
|
const { title = "title", message = null, subMessage = [], okText = "okText", cancelText = null, onClick = empty$1, type = "primary" } = props;
|
|
314
|
-
return /* @__PURE__ */
|
|
312
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
315
313
|
className: classNames({ "confirm-wrap": true, ["confirm-" + type]: true })
|
|
316
|
-
}, /* @__PURE__ */
|
|
314
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
317
315
|
className: "confirm-title"
|
|
318
|
-
}, title), message ? /* @__PURE__ */
|
|
316
|
+
}, title), message ? /* @__PURE__ */ React.createElement("div", {
|
|
319
317
|
className: "confirm-message"
|
|
320
|
-
}, message) : null, subMessage.length ? /* @__PURE__ */
|
|
318
|
+
}, message) : null, subMessage.length ? /* @__PURE__ */ React.createElement("div", {
|
|
321
319
|
className: "confirm-sub-message"
|
|
322
320
|
}, subMessage.map((item, index2) => {
|
|
323
|
-
return /* @__PURE__ */
|
|
321
|
+
return /* @__PURE__ */ React.createElement("p", {
|
|
324
322
|
key: index2,
|
|
325
323
|
className: "pda-listitem-subinfo"
|
|
326
|
-
}, /* @__PURE__ */
|
|
327
|
-
})) : null, /* @__PURE__ */
|
|
324
|
+
}, /* @__PURE__ */ React.createElement("span", null, item.label || ""), ":\xA0", /* @__PURE__ */ React.createElement("span", null, item.content || ""));
|
|
325
|
+
})) : null, /* @__PURE__ */ React.createElement("div", {
|
|
328
326
|
className: "confirm-btns"
|
|
329
|
-
}, cancelText ? /* @__PURE__ */
|
|
327
|
+
}, cancelText ? /* @__PURE__ */ React.createElement(Button, {
|
|
330
328
|
className: "confirm-cancel-button",
|
|
331
329
|
onClick: () => onClick(false)
|
|
332
|
-
}, cancelText) : null, /* @__PURE__ */
|
|
330
|
+
}, cancelText) : null, /* @__PURE__ */ React.createElement(Button, {
|
|
333
331
|
type: "primary",
|
|
334
332
|
onClick: () => onClick(true)
|
|
335
333
|
}, okText)));
|
|
@@ -344,29 +342,29 @@ function getTypeClass(type) {
|
|
|
344
342
|
}
|
|
345
343
|
function Confirm(props) {
|
|
346
344
|
const { title = "title", message = "message", type = "success", duration = null } = props;
|
|
347
|
-
const [hidden,
|
|
345
|
+
const [hidden, setHidden] = useState(false);
|
|
348
346
|
if (duration) {
|
|
349
347
|
setTimeout(() => {
|
|
350
|
-
|
|
348
|
+
setHidden(true);
|
|
351
349
|
}, duration);
|
|
352
350
|
}
|
|
353
|
-
return !hidden ? /* @__PURE__ */
|
|
351
|
+
return !hidden ? /* @__PURE__ */ React.createElement("div", {
|
|
354
352
|
className: getTypeClass(type)
|
|
355
|
-
}, /* @__PURE__ */
|
|
353
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
356
354
|
className: "toast-title"
|
|
357
|
-
}, title), /* @__PURE__ */
|
|
355
|
+
}, title), /* @__PURE__ */ React.createElement("div", {
|
|
358
356
|
className: "toast-message"
|
|
359
357
|
}, message)) : null;
|
|
360
358
|
}
|
|
361
359
|
function Alert(props) {
|
|
362
360
|
const { service, data = {} } = props;
|
|
363
361
|
const { title = "title", message = "message", okText = "okText", cancelText = "" } = data;
|
|
364
|
-
const onClickCallback =
|
|
362
|
+
const onClickCallback = React.useCallback(function() {
|
|
365
363
|
service.onNext(true);
|
|
366
364
|
}, [service]);
|
|
367
|
-
return /* @__PURE__ */
|
|
365
|
+
return /* @__PURE__ */ React.createElement(Overlay, {
|
|
368
366
|
verticalPosition: "bottom"
|
|
369
|
-
}, /* @__PURE__ */
|
|
367
|
+
}, /* @__PURE__ */ React.createElement(Confirm$1, {
|
|
370
368
|
title,
|
|
371
369
|
message,
|
|
372
370
|
okText,
|
|
@@ -376,10 +374,10 @@ function Alert(props) {
|
|
|
376
374
|
}
|
|
377
375
|
function Start(props) {
|
|
378
376
|
const { action, appManager, service } = props;
|
|
379
|
-
const onReStart =
|
|
377
|
+
const onReStart = React.useCallback(function() {
|
|
380
378
|
service.onStart(appManager.config.appId);
|
|
381
379
|
});
|
|
382
|
-
return /* @__PURE__ */
|
|
380
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
383
381
|
style: {
|
|
384
382
|
display: "flex",
|
|
385
383
|
flexDirection: "column",
|
|
@@ -388,20 +386,20 @@ function Start(props) {
|
|
|
388
386
|
width: "100vw",
|
|
389
387
|
height: "100vh"
|
|
390
388
|
}
|
|
391
|
-
}, /* @__PURE__ */
|
|
389
|
+
}, /* @__PURE__ */ React.createElement(Button, {
|
|
392
390
|
type: "primary",
|
|
393
391
|
onClick: onReStart
|
|
394
|
-
}, "\u5F00\u59CB\u4F5C\u4E1A"), /* @__PURE__ */
|
|
392
|
+
}, "\u5F00\u59CB\u4F5C\u4E1A"), /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement("div", null, appManager.config.appId), /* @__PURE__ */ React.createElement("div", null, appManager.config.groupId));
|
|
395
393
|
}
|
|
396
394
|
function confirm(props) {
|
|
397
395
|
const { service, data = {} } = props;
|
|
398
396
|
const { title = "title", message, subMessage = [], okText = "okText", cancelText = "" } = data;
|
|
399
|
-
const onClickCallback =
|
|
397
|
+
const onClickCallback = React.useCallback(function(isConfirm) {
|
|
400
398
|
service.onNext(isConfirm);
|
|
401
399
|
}, [service]);
|
|
402
|
-
return /* @__PURE__ */
|
|
400
|
+
return /* @__PURE__ */ React.createElement(Overlay, {
|
|
403
401
|
verticalPosition: "bottom"
|
|
404
|
-
}, /* @__PURE__ */
|
|
402
|
+
}, /* @__PURE__ */ React.createElement(Confirm$1, {
|
|
405
403
|
title,
|
|
406
404
|
message,
|
|
407
405
|
subMessage,
|
|
@@ -411,17 +409,17 @@ function confirm(props) {
|
|
|
411
409
|
}));
|
|
412
410
|
}
|
|
413
411
|
function Prompt(props) {
|
|
414
|
-
return /* @__PURE__ */
|
|
412
|
+
return /* @__PURE__ */ React.createElement("div", null, "\u9875\u9762\u4E0D\u5B58\u5728");
|
|
415
413
|
}
|
|
416
414
|
function toast(props) {
|
|
417
415
|
const { data = {}, service } = props;
|
|
418
416
|
const { title, level, message, duration = null } = data;
|
|
419
|
-
const [hidden,
|
|
420
|
-
|
|
417
|
+
const [hidden, setHidden] = useState(false);
|
|
418
|
+
React.useEffect(() => {
|
|
421
419
|
let timeout = null;
|
|
422
420
|
if (duration) {
|
|
423
421
|
setTimeout(() => {
|
|
424
|
-
|
|
422
|
+
setHidden(true);
|
|
425
423
|
service.onNext("");
|
|
426
424
|
}, duration);
|
|
427
425
|
}
|
|
@@ -429,13 +427,15 @@ function toast(props) {
|
|
|
429
427
|
clearTimeout(timeout);
|
|
430
428
|
};
|
|
431
429
|
}, []);
|
|
432
|
-
return !hidden ? /* @__PURE__ */
|
|
430
|
+
return !hidden ? /* @__PURE__ */ React.createElement(Overlay, {
|
|
433
431
|
verticalPosition: "bottom"
|
|
434
|
-
}, /* @__PURE__ */
|
|
432
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
433
|
+
style: { width: "90%" }
|
|
434
|
+
}, /* @__PURE__ */ React.createElement(Confirm, {
|
|
435
435
|
type: level,
|
|
436
436
|
title,
|
|
437
437
|
message: splitMessage(message)
|
|
438
|
-
})) : null;
|
|
438
|
+
}))) : null;
|
|
439
439
|
}
|
|
440
440
|
function splitMessage(message) {
|
|
441
441
|
var msg = String(message).split("by Error:");
|
|
@@ -443,14 +443,14 @@ function splitMessage(message) {
|
|
|
443
443
|
}
|
|
444
444
|
var index$d = "";
|
|
445
445
|
function NotFound(props) {
|
|
446
|
-
return /* @__PURE__ */
|
|
446
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
447
447
|
style: { padding: "20%" }
|
|
448
|
-
}, /* @__PURE__ */
|
|
448
|
+
}, /* @__PURE__ */ React.createElement("h1", null, "404 ", /* @__PURE__ */ React.createElement("small", {
|
|
449
449
|
style: { fontSize: "60%" }
|
|
450
|
-
}, "Not found")), /* @__PURE__ */
|
|
450
|
+
}, "Not found")), /* @__PURE__ */ React.createElement("div", null, props.action.getPage()));
|
|
451
451
|
}
|
|
452
|
-
function _extends
|
|
453
|
-
_extends
|
|
452
|
+
function _extends() {
|
|
453
|
+
_extends = Object.assign || function(target) {
|
|
454
454
|
for (var i = 1; i < arguments.length; i++) {
|
|
455
455
|
var source = arguments[i];
|
|
456
456
|
for (var key in source) {
|
|
@@ -461,7 +461,7 @@ function _extends$3() {
|
|
|
461
461
|
}
|
|
462
462
|
return target;
|
|
463
463
|
};
|
|
464
|
-
return _extends
|
|
464
|
+
return _extends.apply(this, arguments);
|
|
465
465
|
}
|
|
466
466
|
var r, B = r || (r = {});
|
|
467
467
|
B.Pop = "POP";
|
|
@@ -542,7 +542,7 @@ function createHashHistory(b) {
|
|
|
542
542
|
}
|
|
543
543
|
function z(a, e) {
|
|
544
544
|
e === void 0 && (e = null);
|
|
545
|
-
return C(_extends
|
|
545
|
+
return C(_extends({ pathname: d.pathname, hash: "", search: "" }, typeof a === "string" ? J(a) : a, { state: e, key: H() }));
|
|
546
546
|
}
|
|
547
547
|
function A(a) {
|
|
548
548
|
v = a;
|
|
@@ -589,7 +589,7 @@ function createHashHistory(b) {
|
|
|
589
589
|
var v = r.Pop;
|
|
590
590
|
b = h();
|
|
591
591
|
var q = b[0], d = b[1], f = F(), c = F();
|
|
592
|
-
q == null && (q = 0, u.replaceState(_extends
|
|
592
|
+
q == null && (q = 0, u.replaceState(_extends({}, u.state, { idx: q }), ""));
|
|
593
593
|
return {
|
|
594
594
|
get action() {
|
|
595
595
|
return v;
|
|
@@ -624,7 +624,7 @@ var index$c = "";
|
|
|
624
624
|
function Debug(props) {
|
|
625
625
|
const { appManager } = props;
|
|
626
626
|
const pages = Array.from(appManager.pageManager.keys()).reverse();
|
|
627
|
-
|
|
627
|
+
React.useEffect(function() {
|
|
628
628
|
const history = createHashHistory();
|
|
629
629
|
const unListen = history.listen(({ action, location }) => {
|
|
630
630
|
const pathname = location.pathname;
|
|
@@ -632,18 +632,18 @@ function Debug(props) {
|
|
|
632
632
|
});
|
|
633
633
|
return unListen;
|
|
634
634
|
}, []);
|
|
635
|
-
return /* @__PURE__ */
|
|
635
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
636
636
|
className: "local-debug-side"
|
|
637
|
-
}, /* @__PURE__ */
|
|
637
|
+
}, /* @__PURE__ */ React.createElement("ul", null, pages.map((pathname) => /* @__PURE__ */ React.createElement("li", {
|
|
638
638
|
key: pathname
|
|
639
|
-
}, /* @__PURE__ */
|
|
639
|
+
}, /* @__PURE__ */ React.createElement("a", {
|
|
640
640
|
href: `#${pathname}`
|
|
641
641
|
}, pathname)))));
|
|
642
642
|
}
|
|
643
643
|
function Loading$1(props) {
|
|
644
|
-
const [showLoading, setShowLoading] =
|
|
644
|
+
const [showLoading, setShowLoading] = React.useState(false);
|
|
645
645
|
const edgeService = props.edgeService;
|
|
646
|
-
|
|
646
|
+
React.useEffect(function() {
|
|
647
647
|
let currentLoading = false;
|
|
648
648
|
const throttleSetShowLoading = function(loading) {
|
|
649
649
|
currentLoading = loading;
|
|
@@ -666,7 +666,7 @@ function Loading$1(props) {
|
|
|
666
666
|
edgeService.off("IO_STATUS", throttleSetShowLoading);
|
|
667
667
|
};
|
|
668
668
|
}, [edgeService]);
|
|
669
|
-
return showLoading ? /* @__PURE__ */
|
|
669
|
+
return showLoading ? /* @__PURE__ */ React.createElement("div", {
|
|
670
670
|
style: { position: "absolute", left: 0, top: 0, zIndex: 100 }
|
|
671
671
|
}, "LOADING...") : null;
|
|
672
672
|
}
|
|
@@ -688,13 +688,13 @@ function Presentation(props) {
|
|
|
688
688
|
subText = "",
|
|
689
689
|
transparent
|
|
690
690
|
} = props;
|
|
691
|
-
return /* @__PURE__ */
|
|
691
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
692
692
|
className: transparent ? "presentation-card transparent" : "presentation-card"
|
|
693
|
-
}, /* @__PURE__ */
|
|
693
|
+
}, /* @__PURE__ */ React.createElement("img", {
|
|
694
694
|
src: image
|
|
695
|
-
}), text ? /* @__PURE__ */
|
|
695
|
+
}), text ? /* @__PURE__ */ React.createElement("div", {
|
|
696
696
|
className: "text"
|
|
697
|
-
}, text) : null, subText ? /* @__PURE__ */
|
|
697
|
+
}, text) : null, subText ? /* @__PURE__ */ React.createElement("div", {
|
|
698
698
|
className: "sub-text"
|
|
699
699
|
}, subText) : null);
|
|
700
700
|
}
|
|
@@ -707,10 +707,10 @@ function empty() {
|
|
|
707
707
|
}
|
|
708
708
|
function List(props) {
|
|
709
709
|
const { dataSource = [], onClickItem, onItemClick = empty } = props;
|
|
710
|
-
return /* @__PURE__ */
|
|
710
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
711
711
|
className: "android-pda-list"
|
|
712
712
|
}, dataSource.map((item, index2) => {
|
|
713
|
-
return /* @__PURE__ */
|
|
713
|
+
return /* @__PURE__ */ React.createElement(DefaultItem, {
|
|
714
714
|
key: item.key || index2,
|
|
715
715
|
dataSource: item,
|
|
716
716
|
onClick: onClickItem || onItemClick
|
|
@@ -726,24 +726,24 @@ function DefaultItem(props) {
|
|
|
726
726
|
};
|
|
727
727
|
const { title, subTitle, extra, tags = [], tabIndex } = dataSource;
|
|
728
728
|
const { onClick } = props;
|
|
729
|
-
return /* @__PURE__ */
|
|
729
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
730
730
|
className: "default-item",
|
|
731
731
|
onClick: () => {
|
|
732
732
|
onClick(props.dataSource);
|
|
733
733
|
},
|
|
734
734
|
tabIndex
|
|
735
|
-
}, /* @__PURE__ */
|
|
735
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
736
736
|
className: "text"
|
|
737
|
-
}, /* @__PURE__ */
|
|
737
|
+
}, /* @__PURE__ */ React.createElement("div", null, title), /* @__PURE__ */ React.createElement("div", {
|
|
738
738
|
className: "sub-text"
|
|
739
|
-
}, subTitle), /* @__PURE__ */
|
|
739
|
+
}, subTitle), /* @__PURE__ */ React.createElement("div", {
|
|
740
740
|
className: "sub-tags"
|
|
741
741
|
}, tags.map((text) => {
|
|
742
|
-
return /* @__PURE__ */
|
|
742
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
743
743
|
className: "sub-tag-item",
|
|
744
744
|
key: text
|
|
745
745
|
}, text);
|
|
746
|
-
}))), /* @__PURE__ */
|
|
746
|
+
}))), /* @__PURE__ */ React.createElement("div", {
|
|
747
747
|
className: "extra"
|
|
748
748
|
}, extra));
|
|
749
749
|
}
|
|
@@ -751,7 +751,7 @@ List.Item = DefaultItem;
|
|
|
751
751
|
var index$8 = "";
|
|
752
752
|
const blankFunc$4 = () => {
|
|
753
753
|
};
|
|
754
|
-
class BaseLayoutContainer extends
|
|
754
|
+
class BaseLayoutContainer extends React.Component {
|
|
755
755
|
constructor(props) {
|
|
756
756
|
super(props);
|
|
757
757
|
this.state = {};
|
|
@@ -801,21 +801,21 @@ class BaseLayoutContainer extends React__default.Component {
|
|
|
801
801
|
render() {
|
|
802
802
|
const props = this.props;
|
|
803
803
|
const { style = {}, header, footer } = this.props;
|
|
804
|
-
return /* @__PURE__ */
|
|
804
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
805
805
|
className: classNames({ "baselayout-wrapper": true }),
|
|
806
806
|
style
|
|
807
|
-
}, header && /* @__PURE__ */
|
|
807
|
+
}, header && /* @__PURE__ */ React.createElement("div", {
|
|
808
808
|
className: classNames({ "baselayout-header": true })
|
|
809
|
-
}, header), /* @__PURE__ */
|
|
809
|
+
}, header), /* @__PURE__ */ React.createElement("div", {
|
|
810
810
|
className: classNames({ "baselayout-container": true })
|
|
811
|
-
}, props.children), footer && /* @__PURE__ */
|
|
811
|
+
}, props.children), footer && /* @__PURE__ */ React.createElement("div", {
|
|
812
812
|
className: classNames({ "baselayout-footer": true })
|
|
813
813
|
}, footer));
|
|
814
814
|
}
|
|
815
815
|
}
|
|
816
816
|
const blankFunc$3 = () => {
|
|
817
817
|
};
|
|
818
|
-
class RfidOnce$1 extends
|
|
818
|
+
class RfidOnce$1 extends React.Component {
|
|
819
819
|
constructor(props) {
|
|
820
820
|
super(props);
|
|
821
821
|
this._rfidBeginScan = false;
|
|
@@ -882,12 +882,12 @@ class RfidOnce$1 extends React__default.Component {
|
|
|
882
882
|
render() {
|
|
883
883
|
const props = this.props;
|
|
884
884
|
const _a = props, { onRfidOnce = blankFunc$3 } = _a, opts = __objRest(_a, ["onRfidOnce"]);
|
|
885
|
-
return /* @__PURE__ */
|
|
885
|
+
return /* @__PURE__ */ React.createElement(BaseLayoutContainer, __spreadValues({}, opts));
|
|
886
886
|
}
|
|
887
887
|
}
|
|
888
888
|
const blankFunc$2 = () => {
|
|
889
889
|
};
|
|
890
|
-
class RfidOnce extends
|
|
890
|
+
class RfidOnce extends React.Component {
|
|
891
891
|
constructor(props) {
|
|
892
892
|
super(props);
|
|
893
893
|
this._rfidBeginScan = false;
|
|
@@ -963,7 +963,7 @@ class RfidOnce extends React__default.Component {
|
|
|
963
963
|
render() {
|
|
964
964
|
const props = this.props;
|
|
965
965
|
const _a = props, { onRfidScan = blankFunc$2, autoRfidScan } = _a, opts = __objRest(_a, ["onRfidScan", "autoRfidScan"]);
|
|
966
|
-
return /* @__PURE__ */
|
|
966
|
+
return /* @__PURE__ */ React.createElement(BaseLayoutContainer, __spreadValues({}, opts));
|
|
967
967
|
}
|
|
968
968
|
}
|
|
969
969
|
__publicField(RfidOnce, "defaultProps", {
|
|
@@ -971,7 +971,7 @@ __publicField(RfidOnce, "defaultProps", {
|
|
|
971
971
|
});
|
|
972
972
|
const blankFunc$1 = () => {
|
|
973
973
|
};
|
|
974
|
-
class BarcodeScan extends
|
|
974
|
+
class BarcodeScan extends React.Component {
|
|
975
975
|
constructor(props) {
|
|
976
976
|
super(props);
|
|
977
977
|
this._barcodeBeginScan = false;
|
|
@@ -1017,10 +1017,10 @@ class BarcodeScan extends React__default.Component {
|
|
|
1017
1017
|
render() {
|
|
1018
1018
|
const props = this.props;
|
|
1019
1019
|
const _a = props, { onBarcodeScan = blankFunc$1 } = _a, opts = __objRest(_a, ["onBarcodeScan"]);
|
|
1020
|
-
return /* @__PURE__ */
|
|
1020
|
+
return /* @__PURE__ */ React.createElement(BaseLayoutContainer, __spreadValues({}, opts));
|
|
1021
1021
|
}
|
|
1022
1022
|
}
|
|
1023
|
-
class BaseLayout extends
|
|
1023
|
+
class BaseLayout extends React.Component {
|
|
1024
1024
|
constructor(props) {
|
|
1025
1025
|
super(props);
|
|
1026
1026
|
}
|
|
@@ -1028,15 +1028,15 @@ class BaseLayout extends React__default.Component {
|
|
|
1028
1028
|
const props = this.props;
|
|
1029
1029
|
const { onBarcodeScan, onRfidOnce, onRfidBoxOnce, onRfidPalletOnce, onRfidScan, onRfidBoxScan, onRfidPalletScan } = props;
|
|
1030
1030
|
if (onRfidOnce || onRfidBoxOnce || onRfidPalletOnce) {
|
|
1031
|
-
return /* @__PURE__ */
|
|
1031
|
+
return /* @__PURE__ */ React.createElement(RfidOnce$1, __spreadValues({}, props));
|
|
1032
1032
|
}
|
|
1033
1033
|
if (onRfidScan || onRfidBoxScan || onRfidPalletScan) {
|
|
1034
|
-
return /* @__PURE__ */
|
|
1034
|
+
return /* @__PURE__ */ React.createElement(RfidOnce, __spreadValues({}, props));
|
|
1035
1035
|
}
|
|
1036
1036
|
if (onBarcodeScan) {
|
|
1037
|
-
return /* @__PURE__ */
|
|
1037
|
+
return /* @__PURE__ */ React.createElement(BarcodeScan, __spreadValues({}, props));
|
|
1038
1038
|
}
|
|
1039
|
-
return /* @__PURE__ */
|
|
1039
|
+
return /* @__PURE__ */ React.createElement(BaseLayoutContainer, __spreadValues({}, props));
|
|
1040
1040
|
}
|
|
1041
1041
|
}
|
|
1042
1042
|
var index$7 = "";
|
|
@@ -1061,22 +1061,22 @@ function WakeKeyborard(props) {
|
|
|
1061
1061
|
document.removeEventListener("keyup", handleKeyUp);
|
|
1062
1062
|
};
|
|
1063
1063
|
}, []);
|
|
1064
|
-
return /* @__PURE__ */
|
|
1064
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
1065
1065
|
className: "wakekeyborard"
|
|
1066
|
-
}, inputVisible ? /* @__PURE__ */
|
|
1066
|
+
}, inputVisible ? /* @__PURE__ */ React.createElement("div", {
|
|
1067
1067
|
className: "wakekeyborard-overlay"
|
|
1068
|
-
}, /* @__PURE__ */
|
|
1068
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
1069
1069
|
className: "wakekeyborard-inputbox"
|
|
1070
|
-
}, /* @__PURE__ */
|
|
1070
|
+
}, /* @__PURE__ */ React.createElement("input", {
|
|
1071
1071
|
ref: inputRef,
|
|
1072
1072
|
type: "tel"
|
|
1073
|
-
}), /* @__PURE__ */
|
|
1073
|
+
}), /* @__PURE__ */ React.createElement(Button, {
|
|
1074
1074
|
type: "primary",
|
|
1075
1075
|
onClick: (e) => {
|
|
1076
1076
|
onClick(inputRef.current.value);
|
|
1077
1077
|
setInputVisible(!inputVisible);
|
|
1078
1078
|
}
|
|
1079
|
-
}, "\u67E5\u8BE2"))) : null, !inputVisible ? /* @__PURE__ */
|
|
1079
|
+
}, "\u67E5\u8BE2"))) : null, !inputVisible ? /* @__PURE__ */ React.createElement("div", {
|
|
1080
1080
|
className: "wakekeyborard-icon",
|
|
1081
1081
|
onClick: (e) => {
|
|
1082
1082
|
setInputVisible(!inputVisible);
|
|
@@ -1089,42 +1089,42 @@ function WakeKeyborard(props) {
|
|
|
1089
1089
|
}
|
|
1090
1090
|
var index$6 = "";
|
|
1091
1091
|
var index$5 = "";
|
|
1092
|
-
class PdaInfoCard$1 extends
|
|
1092
|
+
class PdaInfoCard$1 extends React.Component {
|
|
1093
1093
|
constructor(props) {
|
|
1094
1094
|
super(props);
|
|
1095
1095
|
}
|
|
1096
1096
|
render() {
|
|
1097
1097
|
const { className, title, isActive, infoList = [], style = {}, index: index2, isLast } = this.props;
|
|
1098
|
-
return /* @__PURE__ */
|
|
1098
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
1099
1099
|
className: classNames({ [className]: true, "pda-step-card": true }),
|
|
1100
1100
|
style
|
|
1101
|
-
}, /* @__PURE__ */
|
|
1101
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
1102
1102
|
className: "pda-step-indictor"
|
|
1103
|
-
}, /* @__PURE__ */
|
|
1103
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
1104
1104
|
className: classNames({ "pda-step-indictor-top": true, "pda-step-indictor-top-hidden": index2 === 0 })
|
|
1105
|
-
}), /* @__PURE__ */
|
|
1105
|
+
}), /* @__PURE__ */ React.createElement("div", {
|
|
1106
1106
|
className: classNames({ "pda-step-indictor-center": true, "pda-step-indictor-center-active": isActive })
|
|
1107
|
-
}), /* @__PURE__ */
|
|
1107
|
+
}), /* @__PURE__ */ React.createElement("div", {
|
|
1108
1108
|
className: classNames({ "pda-step-indictor-bottom": true, "pda-step-indictor-bottom-hidden": isLast })
|
|
1109
|
-
})), /* @__PURE__ */
|
|
1109
|
+
})), /* @__PURE__ */ React.createElement("div", {
|
|
1110
1110
|
className: classNames({ "pda-step": true, "pda-step-dark": !isActive })
|
|
1111
|
-
}, /* @__PURE__ */
|
|
1111
|
+
}, /* @__PURE__ */ React.createElement("p", {
|
|
1112
1112
|
className: "pda-step-title"
|
|
1113
1113
|
}, title), infoList.map((item, index22) => {
|
|
1114
|
-
return /* @__PURE__ */
|
|
1114
|
+
return /* @__PURE__ */ React.createElement("p", {
|
|
1115
1115
|
key: index22,
|
|
1116
1116
|
className: "pda-step-list"
|
|
1117
|
-
}, /* @__PURE__ */
|
|
1117
|
+
}, /* @__PURE__ */ React.createElement("span", null, item.label || ""), "\xA0\xA0", /* @__PURE__ */ React.createElement("span", null, item.content || ""));
|
|
1118
1118
|
})));
|
|
1119
1119
|
}
|
|
1120
1120
|
}
|
|
1121
|
-
class PdaInfoCard extends
|
|
1121
|
+
class PdaInfoCard extends React.Component {
|
|
1122
1122
|
constructor(props) {
|
|
1123
1123
|
super(props);
|
|
1124
1124
|
}
|
|
1125
1125
|
render() {
|
|
1126
1126
|
const { className, style = {}, theme = "light", current = 0, children } = this.props;
|
|
1127
|
-
return /* @__PURE__ */
|
|
1127
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
1128
1128
|
className: classNames({ [className]: true }),
|
|
1129
1129
|
style
|
|
1130
1130
|
}, (children || []).map((child, index2) => {
|
|
@@ -1143,43 +1143,43 @@ class PdaInfoCard extends React__default.Component {
|
|
|
1143
1143
|
}
|
|
1144
1144
|
__publicField(PdaInfoCard, "Step", PdaInfoCard$1);
|
|
1145
1145
|
var index$4 = "";
|
|
1146
|
-
class PdaFinishCard extends
|
|
1146
|
+
class PdaFinishCard extends React.Component {
|
|
1147
1147
|
constructor(props) {
|
|
1148
1148
|
super(props);
|
|
1149
1149
|
}
|
|
1150
1150
|
render() {
|
|
1151
1151
|
const { className, title, infoList = [], isError = false, buttonMultiLines = false, style = {}, onClick = () => {
|
|
1152
1152
|
}, okText = "\u8FD4\u56DE\u9996\u9875", cancelText = null } = this.props;
|
|
1153
|
-
const footer = /* @__PURE__ */
|
|
1153
|
+
const footer = /* @__PURE__ */ React.createElement(Button.Group, null, cancelText ? /* @__PURE__ */ React.createElement(Button, {
|
|
1154
1154
|
style: buttonMultiLines ? { height: "auto", lineHeight: "50px" } : {},
|
|
1155
1155
|
type: "dark",
|
|
1156
1156
|
onClick: () => onClick(false)
|
|
1157
|
-
}, cancelText) : null, /* @__PURE__ */
|
|
1157
|
+
}, cancelText) : null, /* @__PURE__ */ React.createElement(Button, {
|
|
1158
1158
|
type: "primary",
|
|
1159
1159
|
style: buttonMultiLines ? { height: "auto", lineHeight: "normal" } : {},
|
|
1160
1160
|
onClick: () => onClick(true)
|
|
1161
1161
|
}, okText));
|
|
1162
|
-
return /* @__PURE__ */
|
|
1162
|
+
return /* @__PURE__ */ React.createElement(BaseLayout, {
|
|
1163
1163
|
footer
|
|
1164
|
-
}, /* @__PURE__ */
|
|
1164
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
1165
1165
|
className: "pda-finish-card-top"
|
|
1166
|
-
}, /* @__PURE__ */
|
|
1166
|
+
}, /* @__PURE__ */ React.createElement("img", {
|
|
1167
1167
|
className: "pda-finish-card-img",
|
|
1168
1168
|
src: isError ? PdaFinishCard.ERROR_SUCCESS : PdaFinishCard.SUCCESS
|
|
1169
|
-
}), /* @__PURE__ */
|
|
1169
|
+
}), /* @__PURE__ */ React.createElement("p", {
|
|
1170
1170
|
className: "pda-finish-card-title"
|
|
1171
1171
|
}, title), infoList.map((item, index2) => {
|
|
1172
|
-
return /* @__PURE__ */
|
|
1172
|
+
return /* @__PURE__ */ React.createElement("p", {
|
|
1173
1173
|
key: index2,
|
|
1174
1174
|
className: "pda-finish-card-list"
|
|
1175
|
-
}, /* @__PURE__ */
|
|
1175
|
+
}, /* @__PURE__ */ React.createElement("span", null, item.label || ""), /* @__PURE__ */ React.createElement("span", null, item.content || ""));
|
|
1176
1176
|
})));
|
|
1177
1177
|
}
|
|
1178
1178
|
}
|
|
1179
1179
|
PdaFinishCard.SUCCESS = "https://img.alicdn.com/imgextra/i2/O1CN01yYwwSx1uNV0M1gHlQ_!!6000000006025-1-tps-630-436.gif";
|
|
1180
1180
|
PdaFinishCard.ERROR_SUCCESS = "https://img.alicdn.com/imgextra/i3/O1CN01p5Oc5t1VMFWtBomQc_!!6000000002638-1-tps-600-456.gif";
|
|
1181
1181
|
var index$3 = "";
|
|
1182
|
-
class PdaDistanceCard extends
|
|
1182
|
+
class PdaDistanceCard extends React.Component {
|
|
1183
1183
|
constructor(props) {
|
|
1184
1184
|
super(props);
|
|
1185
1185
|
}
|
|
@@ -1187,54 +1187,54 @@ class PdaDistanceCard extends React__default.Component {
|
|
|
1187
1187
|
const { className, title, infoText, percentage = 0, style = {} } = this.props;
|
|
1188
1188
|
const distanceImg = "https://img.alicdn.com/imgextra/i3/O1CN01EFksWL1DBZCu0H1JH_!!6000000000178-2-tps-21-30.png";
|
|
1189
1189
|
const indictorImg = "https://img.alicdn.com/imgextra/i1/O1CN01YEhCSg1aObe8UZq7K_!!6000000003320-2-tps-379-17.png";
|
|
1190
|
-
return /* @__PURE__ */
|
|
1190
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
1191
1191
|
className: classNames({ [className]: true, "pda-distance-card": true }),
|
|
1192
1192
|
style
|
|
1193
|
-
}, /* @__PURE__ */
|
|
1193
|
+
}, /* @__PURE__ */ React.createElement("p", {
|
|
1194
1194
|
className: "pda-distance-card-highlight"
|
|
1195
|
-
}, /* @__PURE__ */
|
|
1195
|
+
}, /* @__PURE__ */ React.createElement("span", {
|
|
1196
1196
|
className: "pda-distance-card-highlight1"
|
|
1197
|
-
}, title)), /* @__PURE__ */
|
|
1197
|
+
}, title)), /* @__PURE__ */ React.createElement("div", {
|
|
1198
1198
|
className: "pda-distance-indictor"
|
|
1199
|
-
}, /* @__PURE__ */
|
|
1199
|
+
}, /* @__PURE__ */ React.createElement("img", {
|
|
1200
1200
|
src: distanceImg,
|
|
1201
1201
|
width: 20,
|
|
1202
1202
|
height: 29
|
|
1203
|
-
}), /* @__PURE__ */
|
|
1203
|
+
}), /* @__PURE__ */ React.createElement("p", null, infoText)), /* @__PURE__ */ React.createElement("div", {
|
|
1204
1204
|
className: "pda-distance-card-progress"
|
|
1205
|
-
}, /* @__PURE__ */
|
|
1205
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
1206
1206
|
className: "pda-distance-card-progress-inside",
|
|
1207
1207
|
style: { width: `${percentage * 100}%` }
|
|
1208
|
-
}), /* @__PURE__ */
|
|
1208
|
+
}), /* @__PURE__ */ React.createElement("img", {
|
|
1209
1209
|
className: "pda-distance-card-progress-indictor",
|
|
1210
1210
|
src: indictorImg
|
|
1211
|
-
})), /* @__PURE__ */
|
|
1211
|
+
})), /* @__PURE__ */ React.createElement("div", {
|
|
1212
1212
|
className: "pda-distance-label"
|
|
1213
|
-
}, /* @__PURE__ */
|
|
1213
|
+
}, /* @__PURE__ */ React.createElement("p", null, "\u8FDC"), /* @__PURE__ */ React.createElement("p", null, "\u8FD1")));
|
|
1214
1214
|
}
|
|
1215
1215
|
}
|
|
1216
1216
|
var index$2 = "";
|
|
1217
1217
|
function SubCard(props) {
|
|
1218
1218
|
const { title, context, name, tag, attrs = [], style } = props;
|
|
1219
|
-
return /* @__PURE__ */
|
|
1219
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
1220
1220
|
className: "android-sub-card",
|
|
1221
1221
|
style
|
|
1222
|
-
}, /* @__PURE__ */
|
|
1222
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
1223
1223
|
className: "android-sub-card-title-section"
|
|
1224
|
-
}, /* @__PURE__ */
|
|
1224
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
1225
1225
|
className: "android-sub-card-title"
|
|
1226
|
-
}, title), tag ? /* @__PURE__ */
|
|
1226
|
+
}, title), tag ? /* @__PURE__ */ React.createElement("div", {
|
|
1227
1227
|
className: "android-sub-card-tag"
|
|
1228
|
-
}, /* @__PURE__ */
|
|
1228
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
1229
1229
|
className: tag.type
|
|
1230
|
-
}, tag.label || "")) : null), /* @__PURE__ */
|
|
1230
|
+
}, tag.label || "")) : null), /* @__PURE__ */ React.createElement("div", {
|
|
1231
1231
|
className: "android-sub-card-context"
|
|
1232
|
-
}, context), name ? /* @__PURE__ */
|
|
1232
|
+
}, context), name ? /* @__PURE__ */ React.createElement("div", {
|
|
1233
1233
|
className: "android-sub-card-name"
|
|
1234
|
-
}, name) : null, /* @__PURE__ */
|
|
1234
|
+
}, name) : null, /* @__PURE__ */ React.createElement("div", {
|
|
1235
1235
|
className: "android-sub-card-attrs"
|
|
1236
1236
|
}, attrs.map((text) => {
|
|
1237
|
-
return /* @__PURE__ */
|
|
1237
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
1238
1238
|
key: text
|
|
1239
1239
|
}, text);
|
|
1240
1240
|
})));
|
|
@@ -1466,26 +1466,26 @@ function getScrollParent(el, root) {
|
|
|
1466
1466
|
return root;
|
|
1467
1467
|
}
|
|
1468
1468
|
function Loading(props) {
|
|
1469
|
-
return /* @__PURE__ */
|
|
1469
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
1470
1470
|
style: {
|
|
1471
1471
|
color: props.color || "#999"
|
|
1472
1472
|
}
|
|
1473
|
-
}, /* @__PURE__ */
|
|
1473
|
+
}, /* @__PURE__ */ React.createElement("svg", {
|
|
1474
1474
|
height: "1em",
|
|
1475
1475
|
viewBox: "0 0 100 40",
|
|
1476
1476
|
style: { verticalAlign: "-0.125em" }
|
|
1477
|
-
}, /* @__PURE__ */
|
|
1477
|
+
}, /* @__PURE__ */ React.createElement("g", {
|
|
1478
1478
|
stroke: "none",
|
|
1479
1479
|
strokeWidth: "1",
|
|
1480
1480
|
fill: "none",
|
|
1481
1481
|
fillRule: "evenodd"
|
|
1482
|
-
}, /* @__PURE__ */
|
|
1482
|
+
}, /* @__PURE__ */ React.createElement("g", {
|
|
1483
1483
|
transform: "translate(-100.000000, -71.000000)"
|
|
1484
|
-
}, /* @__PURE__ */
|
|
1484
|
+
}, /* @__PURE__ */ React.createElement("g", {
|
|
1485
1485
|
transform: "translate(95.000000, 71.000000)"
|
|
1486
|
-
}, /* @__PURE__ */
|
|
1486
|
+
}, /* @__PURE__ */ React.createElement("g", {
|
|
1487
1487
|
transform: "translate(5.000000, 0.000000)"
|
|
1488
|
-
}, [0, 1, 2].map((i) => /* @__PURE__ */
|
|
1488
|
+
}, [0, 1, 2].map((i) => /* @__PURE__ */ React.createElement("rect", {
|
|
1489
1489
|
key: i,
|
|
1490
1490
|
fill: "currentColor",
|
|
1491
1491
|
x: 20 + i * 26,
|
|
@@ -1493,7 +1493,7 @@ function Loading(props) {
|
|
|
1493
1493
|
width: "8",
|
|
1494
1494
|
height: "8",
|
|
1495
1495
|
rx: "2"
|
|
1496
|
-
}, /* @__PURE__ */
|
|
1496
|
+
}, /* @__PURE__ */ React.createElement("animate", {
|
|
1497
1497
|
attributeName: "y",
|
|
1498
1498
|
from: "16",
|
|
1499
1499
|
to: "16",
|
|
@@ -1547,3127 +1547,25 @@ function InfiniteScroll(props) {
|
|
|
1547
1547
|
parent.removeEventListener("scroll", onScroll);
|
|
1548
1548
|
};
|
|
1549
1549
|
}, []);
|
|
1550
|
-
return /* @__PURE__ */
|
|
1550
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
1551
1551
|
className: classNames({ [className]: true, "pda-infinite-scroll": true }),
|
|
1552
1552
|
style,
|
|
1553
1553
|
ref: elementRef
|
|
1554
|
-
}, hasMore ? /* @__PURE__ */
|
|
1554
|
+
}, hasMore ? /* @__PURE__ */ React.createElement("div", {
|
|
1555
1555
|
className: "pda-infinite-scroll-view"
|
|
1556
|
-
}, /* @__PURE__ */
|
|
1556
|
+
}, /* @__PURE__ */ React.createElement("span", null, "\u52A0\u8F7D\u4E2D"), /* @__PURE__ */ React.createElement(Loading, null)) : /* @__PURE__ */ React.createElement("div", {
|
|
1557
1557
|
className: "pda-infinite-scroll-view"
|
|
1558
|
-
}, /* @__PURE__ */
|
|
1558
|
+
}, /* @__PURE__ */ React.createElement("span", null, "\u6CA1\u6709\u66F4\u591A\u4E86~")));
|
|
1559
1559
|
}
|
|
1560
1560
|
var index = "";
|
|
1561
|
-
let updateQueue = makeQueue();
|
|
1562
|
-
const raf = (fn) => schedule(fn, updateQueue);
|
|
1563
|
-
let writeQueue = makeQueue();
|
|
1564
|
-
raf.write = (fn) => schedule(fn, writeQueue);
|
|
1565
|
-
let onStartQueue = makeQueue();
|
|
1566
|
-
raf.onStart = (fn) => schedule(fn, onStartQueue);
|
|
1567
|
-
let onFrameQueue = makeQueue();
|
|
1568
|
-
raf.onFrame = (fn) => schedule(fn, onFrameQueue);
|
|
1569
|
-
let onFinishQueue = makeQueue();
|
|
1570
|
-
raf.onFinish = (fn) => schedule(fn, onFinishQueue);
|
|
1571
|
-
let timeouts = [];
|
|
1572
|
-
raf.setTimeout = (handler, ms) => {
|
|
1573
|
-
let time = raf.now() + ms;
|
|
1574
|
-
let cancel = () => {
|
|
1575
|
-
let i = timeouts.findIndex((t) => t.cancel == cancel);
|
|
1576
|
-
if (~i)
|
|
1577
|
-
timeouts.splice(i, 1);
|
|
1578
|
-
__raf.count -= ~i ? 1 : 0;
|
|
1579
|
-
};
|
|
1580
|
-
let timeout = {
|
|
1581
|
-
time,
|
|
1582
|
-
handler,
|
|
1583
|
-
cancel
|
|
1584
|
-
};
|
|
1585
|
-
timeouts.splice(findTimeout(time), 0, timeout);
|
|
1586
|
-
__raf.count += 1;
|
|
1587
|
-
start();
|
|
1588
|
-
return timeout;
|
|
1589
|
-
};
|
|
1590
|
-
let findTimeout = (time) => ~(~timeouts.findIndex((t) => t.time > time) || ~timeouts.length);
|
|
1591
|
-
raf.cancel = (fn) => {
|
|
1592
|
-
updateQueue.delete(fn);
|
|
1593
|
-
writeQueue.delete(fn);
|
|
1594
|
-
};
|
|
1595
|
-
raf.sync = (fn) => {
|
|
1596
|
-
sync = true;
|
|
1597
|
-
raf.batchedUpdates(fn);
|
|
1598
|
-
sync = false;
|
|
1599
|
-
};
|
|
1600
|
-
raf.throttle = (fn) => {
|
|
1601
|
-
let lastArgs;
|
|
1602
|
-
function queuedFn() {
|
|
1603
|
-
try {
|
|
1604
|
-
fn(...lastArgs);
|
|
1605
|
-
} finally {
|
|
1606
|
-
lastArgs = null;
|
|
1607
|
-
}
|
|
1608
|
-
}
|
|
1609
|
-
function throttled(...args) {
|
|
1610
|
-
lastArgs = args;
|
|
1611
|
-
raf.onStart(queuedFn);
|
|
1612
|
-
}
|
|
1613
|
-
throttled.handler = fn;
|
|
1614
|
-
throttled.cancel = () => {
|
|
1615
|
-
onStartQueue.delete(queuedFn);
|
|
1616
|
-
lastArgs = null;
|
|
1617
|
-
};
|
|
1618
|
-
return throttled;
|
|
1619
|
-
};
|
|
1620
|
-
let nativeRaf = typeof window != "undefined" ? window.requestAnimationFrame : () => {
|
|
1621
|
-
};
|
|
1622
|
-
raf.use = (impl) => nativeRaf = impl;
|
|
1623
|
-
raf.now = typeof performance != "undefined" ? () => performance.now() : Date.now;
|
|
1624
|
-
raf.batchedUpdates = (fn) => fn();
|
|
1625
|
-
raf.catch = console.error;
|
|
1626
|
-
raf.frameLoop = "always";
|
|
1627
|
-
raf.advance = () => {
|
|
1628
|
-
if (raf.frameLoop !== "demand") {
|
|
1629
|
-
console.warn("Cannot call the manual advancement of rafz whilst frameLoop is not set as demand");
|
|
1630
|
-
} else {
|
|
1631
|
-
update();
|
|
1632
|
-
}
|
|
1633
|
-
};
|
|
1634
|
-
let ts = -1;
|
|
1635
|
-
let sync = false;
|
|
1636
|
-
function schedule(fn, queue) {
|
|
1637
|
-
if (sync) {
|
|
1638
|
-
queue.delete(fn);
|
|
1639
|
-
fn(0);
|
|
1640
|
-
} else {
|
|
1641
|
-
queue.add(fn);
|
|
1642
|
-
start();
|
|
1643
|
-
}
|
|
1644
|
-
}
|
|
1645
|
-
function start() {
|
|
1646
|
-
if (ts < 0) {
|
|
1647
|
-
ts = 0;
|
|
1648
|
-
if (raf.frameLoop !== "demand") {
|
|
1649
|
-
nativeRaf(loop);
|
|
1650
|
-
}
|
|
1651
|
-
}
|
|
1652
|
-
}
|
|
1653
|
-
function loop() {
|
|
1654
|
-
if (~ts) {
|
|
1655
|
-
nativeRaf(loop);
|
|
1656
|
-
raf.batchedUpdates(update);
|
|
1657
|
-
}
|
|
1658
|
-
}
|
|
1659
|
-
function update() {
|
|
1660
|
-
let prevTs = ts;
|
|
1661
|
-
ts = raf.now();
|
|
1662
|
-
let count = findTimeout(ts);
|
|
1663
|
-
if (count) {
|
|
1664
|
-
eachSafely(timeouts.splice(0, count), (t) => t.handler());
|
|
1665
|
-
__raf.count -= count;
|
|
1666
|
-
}
|
|
1667
|
-
onStartQueue.flush();
|
|
1668
|
-
updateQueue.flush(prevTs ? Math.min(64, ts - prevTs) : 16.667);
|
|
1669
|
-
onFrameQueue.flush();
|
|
1670
|
-
writeQueue.flush();
|
|
1671
|
-
onFinishQueue.flush();
|
|
1672
|
-
}
|
|
1673
|
-
function makeQueue() {
|
|
1674
|
-
let next = new Set();
|
|
1675
|
-
let current = next;
|
|
1676
|
-
return {
|
|
1677
|
-
add(fn) {
|
|
1678
|
-
__raf.count += current == next && !next.has(fn) ? 1 : 0;
|
|
1679
|
-
next.add(fn);
|
|
1680
|
-
},
|
|
1681
|
-
delete(fn) {
|
|
1682
|
-
__raf.count -= current == next && next.has(fn) ? 1 : 0;
|
|
1683
|
-
return next.delete(fn);
|
|
1684
|
-
},
|
|
1685
|
-
flush(arg) {
|
|
1686
|
-
if (current.size) {
|
|
1687
|
-
next = new Set();
|
|
1688
|
-
__raf.count -= current.size;
|
|
1689
|
-
eachSafely(current, (fn) => fn(arg) && next.add(fn));
|
|
1690
|
-
__raf.count += next.size;
|
|
1691
|
-
current = next;
|
|
1692
|
-
}
|
|
1693
|
-
}
|
|
1694
|
-
};
|
|
1695
|
-
}
|
|
1696
|
-
function eachSafely(values, each2) {
|
|
1697
|
-
values.forEach((value) => {
|
|
1698
|
-
try {
|
|
1699
|
-
each2(value);
|
|
1700
|
-
} catch (e) {
|
|
1701
|
-
raf.catch(e);
|
|
1702
|
-
}
|
|
1703
|
-
});
|
|
1704
|
-
}
|
|
1705
|
-
const __raf = {
|
|
1706
|
-
count: 0,
|
|
1707
|
-
clear() {
|
|
1708
|
-
ts = -1;
|
|
1709
|
-
timeouts = [];
|
|
1710
|
-
onStartQueue = makeQueue();
|
|
1711
|
-
updateQueue = makeQueue();
|
|
1712
|
-
onFrameQueue = makeQueue();
|
|
1713
|
-
writeQueue = makeQueue();
|
|
1714
|
-
onFinishQueue = makeQueue();
|
|
1715
|
-
__raf.count = 0;
|
|
1716
|
-
}
|
|
1717
|
-
};
|
|
1718
|
-
function noop() {
|
|
1719
|
-
}
|
|
1720
|
-
const defineHidden = (obj, key, value) => Object.defineProperty(obj, key, {
|
|
1721
|
-
value,
|
|
1722
|
-
writable: true,
|
|
1723
|
-
configurable: true
|
|
1724
|
-
});
|
|
1725
|
-
const is = {
|
|
1726
|
-
arr: Array.isArray,
|
|
1727
|
-
obj: (a) => !!a && a.constructor.name === "Object",
|
|
1728
|
-
fun: (a) => typeof a === "function",
|
|
1729
|
-
str: (a) => typeof a === "string",
|
|
1730
|
-
num: (a) => typeof a === "number",
|
|
1731
|
-
und: (a) => a === void 0
|
|
1732
|
-
};
|
|
1733
|
-
function isEqual(a, b) {
|
|
1734
|
-
if (is.arr(a)) {
|
|
1735
|
-
if (!is.arr(b) || a.length !== b.length)
|
|
1736
|
-
return false;
|
|
1737
|
-
for (let i = 0; i < a.length; i++) {
|
|
1738
|
-
if (a[i] !== b[i])
|
|
1739
|
-
return false;
|
|
1740
|
-
}
|
|
1741
|
-
return true;
|
|
1742
|
-
}
|
|
1743
|
-
return a === b;
|
|
1744
|
-
}
|
|
1745
|
-
const each = (obj, fn) => obj.forEach(fn);
|
|
1746
|
-
function eachProp(obj, fn, ctx2) {
|
|
1747
|
-
if (is.arr(obj)) {
|
|
1748
|
-
for (let i = 0; i < obj.length; i++) {
|
|
1749
|
-
fn.call(ctx2, obj[i], `${i}`);
|
|
1750
|
-
}
|
|
1751
|
-
return;
|
|
1752
|
-
}
|
|
1753
|
-
for (const key in obj) {
|
|
1754
|
-
if (obj.hasOwnProperty(key)) {
|
|
1755
|
-
fn.call(ctx2, obj[key], key);
|
|
1756
|
-
}
|
|
1757
|
-
}
|
|
1758
|
-
}
|
|
1759
|
-
const toArray = (a) => is.und(a) ? [] : is.arr(a) ? a : [a];
|
|
1760
|
-
function flush(queue, iterator) {
|
|
1761
|
-
if (queue.size) {
|
|
1762
|
-
const items = Array.from(queue);
|
|
1763
|
-
queue.clear();
|
|
1764
|
-
each(items, iterator);
|
|
1765
|
-
}
|
|
1766
|
-
}
|
|
1767
|
-
const flushCalls = (queue, ...args) => flush(queue, (fn) => fn(...args));
|
|
1768
|
-
let createStringInterpolator$1;
|
|
1769
|
-
let to;
|
|
1770
|
-
let colors$1 = null;
|
|
1771
|
-
let skipAnimation = false;
|
|
1772
|
-
let willAdvance = noop;
|
|
1773
|
-
const assign = (globals2) => {
|
|
1774
|
-
if (globals2.to)
|
|
1775
|
-
to = globals2.to;
|
|
1776
|
-
if (globals2.now)
|
|
1777
|
-
raf.now = globals2.now;
|
|
1778
|
-
if (globals2.colors !== void 0)
|
|
1779
|
-
colors$1 = globals2.colors;
|
|
1780
|
-
if (globals2.skipAnimation != null)
|
|
1781
|
-
skipAnimation = globals2.skipAnimation;
|
|
1782
|
-
if (globals2.createStringInterpolator)
|
|
1783
|
-
createStringInterpolator$1 = globals2.createStringInterpolator;
|
|
1784
|
-
if (globals2.requestAnimationFrame)
|
|
1785
|
-
raf.use(globals2.requestAnimationFrame);
|
|
1786
|
-
if (globals2.batchedUpdates)
|
|
1787
|
-
raf.batchedUpdates = globals2.batchedUpdates;
|
|
1788
|
-
if (globals2.willAdvance)
|
|
1789
|
-
willAdvance = globals2.willAdvance;
|
|
1790
|
-
if (globals2.frameLoop)
|
|
1791
|
-
raf.frameLoop = globals2.frameLoop;
|
|
1792
|
-
};
|
|
1793
|
-
var globals = /* @__PURE__ */ Object.freeze({
|
|
1794
|
-
__proto__: null,
|
|
1795
|
-
get createStringInterpolator() {
|
|
1796
|
-
return createStringInterpolator$1;
|
|
1797
|
-
},
|
|
1798
|
-
get to() {
|
|
1799
|
-
return to;
|
|
1800
|
-
},
|
|
1801
|
-
get colors() {
|
|
1802
|
-
return colors$1;
|
|
1803
|
-
},
|
|
1804
|
-
get skipAnimation() {
|
|
1805
|
-
return skipAnimation;
|
|
1806
|
-
},
|
|
1807
|
-
get willAdvance() {
|
|
1808
|
-
return willAdvance;
|
|
1809
|
-
},
|
|
1810
|
-
assign
|
|
1811
|
-
});
|
|
1812
|
-
const startQueue = new Set();
|
|
1813
|
-
let currentFrame = [];
|
|
1814
|
-
let prevFrame = [];
|
|
1815
|
-
let priority = 0;
|
|
1816
|
-
const frameLoop = {
|
|
1817
|
-
get idle() {
|
|
1818
|
-
return !startQueue.size && !currentFrame.length;
|
|
1819
|
-
},
|
|
1820
|
-
start(animation) {
|
|
1821
|
-
if (priority > animation.priority) {
|
|
1822
|
-
startQueue.add(animation);
|
|
1823
|
-
raf.onStart(flushStartQueue);
|
|
1824
|
-
} else {
|
|
1825
|
-
startSafely(animation);
|
|
1826
|
-
raf(advance);
|
|
1827
|
-
}
|
|
1828
|
-
},
|
|
1829
|
-
advance,
|
|
1830
|
-
sort(animation) {
|
|
1831
|
-
if (priority) {
|
|
1832
|
-
raf.onFrame(() => frameLoop.sort(animation));
|
|
1833
|
-
} else {
|
|
1834
|
-
const prevIndex = currentFrame.indexOf(animation);
|
|
1835
|
-
if (~prevIndex) {
|
|
1836
|
-
currentFrame.splice(prevIndex, 1);
|
|
1837
|
-
startUnsafely(animation);
|
|
1838
|
-
}
|
|
1839
|
-
}
|
|
1840
|
-
},
|
|
1841
|
-
clear() {
|
|
1842
|
-
currentFrame = [];
|
|
1843
|
-
startQueue.clear();
|
|
1844
|
-
}
|
|
1845
|
-
};
|
|
1846
|
-
function flushStartQueue() {
|
|
1847
|
-
startQueue.forEach(startSafely);
|
|
1848
|
-
startQueue.clear();
|
|
1849
|
-
raf(advance);
|
|
1850
|
-
}
|
|
1851
|
-
function startSafely(animation) {
|
|
1852
|
-
if (!currentFrame.includes(animation))
|
|
1853
|
-
startUnsafely(animation);
|
|
1854
|
-
}
|
|
1855
|
-
function startUnsafely(animation) {
|
|
1856
|
-
currentFrame.splice(findIndex(currentFrame, (other) => other.priority > animation.priority), 0, animation);
|
|
1857
|
-
}
|
|
1858
|
-
function advance(dt) {
|
|
1859
|
-
const nextFrame = prevFrame;
|
|
1860
|
-
for (let i = 0; i < currentFrame.length; i++) {
|
|
1861
|
-
const animation = currentFrame[i];
|
|
1862
|
-
priority = animation.priority;
|
|
1863
|
-
if (!animation.idle) {
|
|
1864
|
-
willAdvance(animation);
|
|
1865
|
-
animation.advance(dt);
|
|
1866
|
-
if (!animation.idle) {
|
|
1867
|
-
nextFrame.push(animation);
|
|
1868
|
-
}
|
|
1869
|
-
}
|
|
1870
|
-
}
|
|
1871
|
-
priority = 0;
|
|
1872
|
-
prevFrame = currentFrame;
|
|
1873
|
-
prevFrame.length = 0;
|
|
1874
|
-
currentFrame = nextFrame;
|
|
1875
|
-
return currentFrame.length > 0;
|
|
1876
|
-
}
|
|
1877
|
-
function findIndex(arr, test) {
|
|
1878
|
-
const index2 = arr.findIndex(test);
|
|
1879
|
-
return index2 < 0 ? arr.length : index2;
|
|
1880
|
-
}
|
|
1881
|
-
const colors = {
|
|
1882
|
-
transparent: 0,
|
|
1883
|
-
aliceblue: 4042850303,
|
|
1884
|
-
antiquewhite: 4209760255,
|
|
1885
|
-
aqua: 16777215,
|
|
1886
|
-
aquamarine: 2147472639,
|
|
1887
|
-
azure: 4043309055,
|
|
1888
|
-
beige: 4126530815,
|
|
1889
|
-
bisque: 4293182719,
|
|
1890
|
-
black: 255,
|
|
1891
|
-
blanchedalmond: 4293643775,
|
|
1892
|
-
blue: 65535,
|
|
1893
|
-
blueviolet: 2318131967,
|
|
1894
|
-
brown: 2771004159,
|
|
1895
|
-
burlywood: 3736635391,
|
|
1896
|
-
burntsienna: 3934150143,
|
|
1897
|
-
cadetblue: 1604231423,
|
|
1898
|
-
chartreuse: 2147418367,
|
|
1899
|
-
chocolate: 3530104575,
|
|
1900
|
-
coral: 4286533887,
|
|
1901
|
-
cornflowerblue: 1687547391,
|
|
1902
|
-
cornsilk: 4294499583,
|
|
1903
|
-
crimson: 3692313855,
|
|
1904
|
-
cyan: 16777215,
|
|
1905
|
-
darkblue: 35839,
|
|
1906
|
-
darkcyan: 9145343,
|
|
1907
|
-
darkgoldenrod: 3095792639,
|
|
1908
|
-
darkgray: 2846468607,
|
|
1909
|
-
darkgreen: 6553855,
|
|
1910
|
-
darkgrey: 2846468607,
|
|
1911
|
-
darkkhaki: 3182914559,
|
|
1912
|
-
darkmagenta: 2332068863,
|
|
1913
|
-
darkolivegreen: 1433087999,
|
|
1914
|
-
darkorange: 4287365375,
|
|
1915
|
-
darkorchid: 2570243327,
|
|
1916
|
-
darkred: 2332033279,
|
|
1917
|
-
darksalmon: 3918953215,
|
|
1918
|
-
darkseagreen: 2411499519,
|
|
1919
|
-
darkslateblue: 1211993087,
|
|
1920
|
-
darkslategray: 793726975,
|
|
1921
|
-
darkslategrey: 793726975,
|
|
1922
|
-
darkturquoise: 13554175,
|
|
1923
|
-
darkviolet: 2483082239,
|
|
1924
|
-
deeppink: 4279538687,
|
|
1925
|
-
deepskyblue: 12582911,
|
|
1926
|
-
dimgray: 1768516095,
|
|
1927
|
-
dimgrey: 1768516095,
|
|
1928
|
-
dodgerblue: 512819199,
|
|
1929
|
-
firebrick: 2988581631,
|
|
1930
|
-
floralwhite: 4294635775,
|
|
1931
|
-
forestgreen: 579543807,
|
|
1932
|
-
fuchsia: 4278255615,
|
|
1933
|
-
gainsboro: 3705462015,
|
|
1934
|
-
ghostwhite: 4177068031,
|
|
1935
|
-
gold: 4292280575,
|
|
1936
|
-
goldenrod: 3668254975,
|
|
1937
|
-
gray: 2155905279,
|
|
1938
|
-
green: 8388863,
|
|
1939
|
-
greenyellow: 2919182335,
|
|
1940
|
-
grey: 2155905279,
|
|
1941
|
-
honeydew: 4043305215,
|
|
1942
|
-
hotpink: 4285117695,
|
|
1943
|
-
indianred: 3445382399,
|
|
1944
|
-
indigo: 1258324735,
|
|
1945
|
-
ivory: 4294963455,
|
|
1946
|
-
khaki: 4041641215,
|
|
1947
|
-
lavender: 3873897215,
|
|
1948
|
-
lavenderblush: 4293981695,
|
|
1949
|
-
lawngreen: 2096890111,
|
|
1950
|
-
lemonchiffon: 4294626815,
|
|
1951
|
-
lightblue: 2916673279,
|
|
1952
|
-
lightcoral: 4034953471,
|
|
1953
|
-
lightcyan: 3774873599,
|
|
1954
|
-
lightgoldenrodyellow: 4210742015,
|
|
1955
|
-
lightgray: 3553874943,
|
|
1956
|
-
lightgreen: 2431553791,
|
|
1957
|
-
lightgrey: 3553874943,
|
|
1958
|
-
lightpink: 4290167295,
|
|
1959
|
-
lightsalmon: 4288707327,
|
|
1960
|
-
lightseagreen: 548580095,
|
|
1961
|
-
lightskyblue: 2278488831,
|
|
1962
|
-
lightslategray: 2005441023,
|
|
1963
|
-
lightslategrey: 2005441023,
|
|
1964
|
-
lightsteelblue: 2965692159,
|
|
1965
|
-
lightyellow: 4294959359,
|
|
1966
|
-
lime: 16711935,
|
|
1967
|
-
limegreen: 852308735,
|
|
1968
|
-
linen: 4210091775,
|
|
1969
|
-
magenta: 4278255615,
|
|
1970
|
-
maroon: 2147483903,
|
|
1971
|
-
mediumaquamarine: 1724754687,
|
|
1972
|
-
mediumblue: 52735,
|
|
1973
|
-
mediumorchid: 3126187007,
|
|
1974
|
-
mediumpurple: 2473647103,
|
|
1975
|
-
mediumseagreen: 1018393087,
|
|
1976
|
-
mediumslateblue: 2070474495,
|
|
1977
|
-
mediumspringgreen: 16423679,
|
|
1978
|
-
mediumturquoise: 1221709055,
|
|
1979
|
-
mediumvioletred: 3340076543,
|
|
1980
|
-
midnightblue: 421097727,
|
|
1981
|
-
mintcream: 4127193855,
|
|
1982
|
-
mistyrose: 4293190143,
|
|
1983
|
-
moccasin: 4293178879,
|
|
1984
|
-
navajowhite: 4292783615,
|
|
1985
|
-
navy: 33023,
|
|
1986
|
-
oldlace: 4260751103,
|
|
1987
|
-
olive: 2155872511,
|
|
1988
|
-
olivedrab: 1804477439,
|
|
1989
|
-
orange: 4289003775,
|
|
1990
|
-
orangered: 4282712319,
|
|
1991
|
-
orchid: 3664828159,
|
|
1992
|
-
palegoldenrod: 4008225535,
|
|
1993
|
-
palegreen: 2566625535,
|
|
1994
|
-
paleturquoise: 2951671551,
|
|
1995
|
-
palevioletred: 3681588223,
|
|
1996
|
-
papayawhip: 4293907967,
|
|
1997
|
-
peachpuff: 4292524543,
|
|
1998
|
-
peru: 3448061951,
|
|
1999
|
-
pink: 4290825215,
|
|
2000
|
-
plum: 3718307327,
|
|
2001
|
-
powderblue: 2967529215,
|
|
2002
|
-
purple: 2147516671,
|
|
2003
|
-
rebeccapurple: 1714657791,
|
|
2004
|
-
red: 4278190335,
|
|
2005
|
-
rosybrown: 3163525119,
|
|
2006
|
-
royalblue: 1097458175,
|
|
2007
|
-
saddlebrown: 2336560127,
|
|
2008
|
-
salmon: 4202722047,
|
|
2009
|
-
sandybrown: 4104413439,
|
|
2010
|
-
seagreen: 780883967,
|
|
2011
|
-
seashell: 4294307583,
|
|
2012
|
-
sienna: 2689740287,
|
|
2013
|
-
silver: 3233857791,
|
|
2014
|
-
skyblue: 2278484991,
|
|
2015
|
-
slateblue: 1784335871,
|
|
2016
|
-
slategray: 1887473919,
|
|
2017
|
-
slategrey: 1887473919,
|
|
2018
|
-
snow: 4294638335,
|
|
2019
|
-
springgreen: 16744447,
|
|
2020
|
-
steelblue: 1182971135,
|
|
2021
|
-
tan: 3535047935,
|
|
2022
|
-
teal: 8421631,
|
|
2023
|
-
thistle: 3636451583,
|
|
2024
|
-
tomato: 4284696575,
|
|
2025
|
-
turquoise: 1088475391,
|
|
2026
|
-
violet: 4001558271,
|
|
2027
|
-
wheat: 4125012991,
|
|
2028
|
-
white: 4294967295,
|
|
2029
|
-
whitesmoke: 4126537215,
|
|
2030
|
-
yellow: 4294902015,
|
|
2031
|
-
yellowgreen: 2597139199
|
|
2032
|
-
};
|
|
2033
|
-
const NUMBER = "[-+]?\\d*\\.?\\d+";
|
|
2034
|
-
const PERCENTAGE = NUMBER + "%";
|
|
2035
|
-
function call(...parts) {
|
|
2036
|
-
return "\\(\\s*(" + parts.join(")\\s*,\\s*(") + ")\\s*\\)";
|
|
2037
|
-
}
|
|
2038
|
-
const rgb = new RegExp("rgb" + call(NUMBER, NUMBER, NUMBER));
|
|
2039
|
-
const rgba = new RegExp("rgba" + call(NUMBER, NUMBER, NUMBER, NUMBER));
|
|
2040
|
-
const hsl = new RegExp("hsl" + call(NUMBER, PERCENTAGE, PERCENTAGE));
|
|
2041
|
-
const hsla = new RegExp("hsla" + call(NUMBER, PERCENTAGE, PERCENTAGE, NUMBER));
|
|
2042
|
-
const hex3 = /^#([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/;
|
|
2043
|
-
const hex4 = /^#([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/;
|
|
2044
|
-
const hex6 = /^#([0-9a-fA-F]{6})$/;
|
|
2045
|
-
const hex8 = /^#([0-9a-fA-F]{8})$/;
|
|
2046
|
-
function normalizeColor(color) {
|
|
2047
|
-
let match;
|
|
2048
|
-
if (typeof color === "number") {
|
|
2049
|
-
return color >>> 0 === color && color >= 0 && color <= 4294967295 ? color : null;
|
|
2050
|
-
}
|
|
2051
|
-
if (match = hex6.exec(color))
|
|
2052
|
-
return parseInt(match[1] + "ff", 16) >>> 0;
|
|
2053
|
-
if (colors$1 && colors$1[color] !== void 0) {
|
|
2054
|
-
return colors$1[color];
|
|
2055
|
-
}
|
|
2056
|
-
if (match = rgb.exec(color)) {
|
|
2057
|
-
return (parse255(match[1]) << 24 | parse255(match[2]) << 16 | parse255(match[3]) << 8 | 255) >>> 0;
|
|
2058
|
-
}
|
|
2059
|
-
if (match = rgba.exec(color)) {
|
|
2060
|
-
return (parse255(match[1]) << 24 | parse255(match[2]) << 16 | parse255(match[3]) << 8 | parse1(match[4])) >>> 0;
|
|
2061
|
-
}
|
|
2062
|
-
if (match = hex3.exec(color)) {
|
|
2063
|
-
return parseInt(match[1] + match[1] + match[2] + match[2] + match[3] + match[3] + "ff", 16) >>> 0;
|
|
2064
|
-
}
|
|
2065
|
-
if (match = hex8.exec(color))
|
|
2066
|
-
return parseInt(match[1], 16) >>> 0;
|
|
2067
|
-
if (match = hex4.exec(color)) {
|
|
2068
|
-
return parseInt(match[1] + match[1] + match[2] + match[2] + match[3] + match[3] + match[4] + match[4], 16) >>> 0;
|
|
2069
|
-
}
|
|
2070
|
-
if (match = hsl.exec(color)) {
|
|
2071
|
-
return (hslToRgb(parse360(match[1]), parsePercentage(match[2]), parsePercentage(match[3])) | 255) >>> 0;
|
|
2072
|
-
}
|
|
2073
|
-
if (match = hsla.exec(color)) {
|
|
2074
|
-
return (hslToRgb(parse360(match[1]), parsePercentage(match[2]), parsePercentage(match[3])) | parse1(match[4])) >>> 0;
|
|
2075
|
-
}
|
|
2076
|
-
return null;
|
|
2077
|
-
}
|
|
2078
|
-
function hue2rgb(p, q, t) {
|
|
2079
|
-
if (t < 0)
|
|
2080
|
-
t += 1;
|
|
2081
|
-
if (t > 1)
|
|
2082
|
-
t -= 1;
|
|
2083
|
-
if (t < 1 / 6)
|
|
2084
|
-
return p + (q - p) * 6 * t;
|
|
2085
|
-
if (t < 1 / 2)
|
|
2086
|
-
return q;
|
|
2087
|
-
if (t < 2 / 3)
|
|
2088
|
-
return p + (q - p) * (2 / 3 - t) * 6;
|
|
2089
|
-
return p;
|
|
2090
|
-
}
|
|
2091
|
-
function hslToRgb(h, s, l) {
|
|
2092
|
-
const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
|
|
2093
|
-
const p = 2 * l - q;
|
|
2094
|
-
const r2 = hue2rgb(p, q, h + 1 / 3);
|
|
2095
|
-
const g = hue2rgb(p, q, h);
|
|
2096
|
-
const b = hue2rgb(p, q, h - 1 / 3);
|
|
2097
|
-
return Math.round(r2 * 255) << 24 | Math.round(g * 255) << 16 | Math.round(b * 255) << 8;
|
|
2098
|
-
}
|
|
2099
|
-
function parse255(str) {
|
|
2100
|
-
const int = parseInt(str, 10);
|
|
2101
|
-
if (int < 0)
|
|
2102
|
-
return 0;
|
|
2103
|
-
if (int > 255)
|
|
2104
|
-
return 255;
|
|
2105
|
-
return int;
|
|
2106
|
-
}
|
|
2107
|
-
function parse360(str) {
|
|
2108
|
-
const int = parseFloat(str);
|
|
2109
|
-
return (int % 360 + 360) % 360 / 360;
|
|
2110
|
-
}
|
|
2111
|
-
function parse1(str) {
|
|
2112
|
-
const num = parseFloat(str);
|
|
2113
|
-
if (num < 0)
|
|
2114
|
-
return 0;
|
|
2115
|
-
if (num > 1)
|
|
2116
|
-
return 255;
|
|
2117
|
-
return Math.round(num * 255);
|
|
2118
|
-
}
|
|
2119
|
-
function parsePercentage(str) {
|
|
2120
|
-
const int = parseFloat(str);
|
|
2121
|
-
if (int < 0)
|
|
2122
|
-
return 0;
|
|
2123
|
-
if (int > 100)
|
|
2124
|
-
return 1;
|
|
2125
|
-
return int / 100;
|
|
2126
|
-
}
|
|
2127
|
-
function colorToRgba(input) {
|
|
2128
|
-
let int32Color = normalizeColor(input);
|
|
2129
|
-
if (int32Color === null)
|
|
2130
|
-
return input;
|
|
2131
|
-
int32Color = int32Color || 0;
|
|
2132
|
-
let r2 = (int32Color & 4278190080) >>> 24;
|
|
2133
|
-
let g = (int32Color & 16711680) >>> 16;
|
|
2134
|
-
let b = (int32Color & 65280) >>> 8;
|
|
2135
|
-
let a = (int32Color & 255) / 255;
|
|
2136
|
-
return `rgba(${r2}, ${g}, ${b}, ${a})`;
|
|
2137
|
-
}
|
|
2138
|
-
const createInterpolator = (range, output, extrapolate) => {
|
|
2139
|
-
if (is.fun(range)) {
|
|
2140
|
-
return range;
|
|
2141
|
-
}
|
|
2142
|
-
if (is.arr(range)) {
|
|
2143
|
-
return createInterpolator({
|
|
2144
|
-
range,
|
|
2145
|
-
output,
|
|
2146
|
-
extrapolate
|
|
2147
|
-
});
|
|
2148
|
-
}
|
|
2149
|
-
if (is.str(range.output[0])) {
|
|
2150
|
-
return createStringInterpolator$1(range);
|
|
2151
|
-
}
|
|
2152
|
-
const config2 = range;
|
|
2153
|
-
const outputRange = config2.output;
|
|
2154
|
-
const inputRange = config2.range || [0, 1];
|
|
2155
|
-
const extrapolateLeft = config2.extrapolateLeft || config2.extrapolate || "extend";
|
|
2156
|
-
const extrapolateRight = config2.extrapolateRight || config2.extrapolate || "extend";
|
|
2157
|
-
const easing = config2.easing || ((t) => t);
|
|
2158
|
-
return (input) => {
|
|
2159
|
-
const range2 = findRange(input, inputRange);
|
|
2160
|
-
return interpolate(input, inputRange[range2], inputRange[range2 + 1], outputRange[range2], outputRange[range2 + 1], easing, extrapolateLeft, extrapolateRight, config2.map);
|
|
2161
|
-
};
|
|
2162
|
-
};
|
|
2163
|
-
function interpolate(input, inputMin, inputMax, outputMin, outputMax, easing, extrapolateLeft, extrapolateRight, map) {
|
|
2164
|
-
let result = map ? map(input) : input;
|
|
2165
|
-
if (result < inputMin) {
|
|
2166
|
-
if (extrapolateLeft === "identity")
|
|
2167
|
-
return result;
|
|
2168
|
-
else if (extrapolateLeft === "clamp")
|
|
2169
|
-
result = inputMin;
|
|
2170
|
-
}
|
|
2171
|
-
if (result > inputMax) {
|
|
2172
|
-
if (extrapolateRight === "identity")
|
|
2173
|
-
return result;
|
|
2174
|
-
else if (extrapolateRight === "clamp")
|
|
2175
|
-
result = inputMax;
|
|
2176
|
-
}
|
|
2177
|
-
if (outputMin === outputMax)
|
|
2178
|
-
return outputMin;
|
|
2179
|
-
if (inputMin === inputMax)
|
|
2180
|
-
return input <= inputMin ? outputMin : outputMax;
|
|
2181
|
-
if (inputMin === -Infinity)
|
|
2182
|
-
result = -result;
|
|
2183
|
-
else if (inputMax === Infinity)
|
|
2184
|
-
result = result - inputMin;
|
|
2185
|
-
else
|
|
2186
|
-
result = (result - inputMin) / (inputMax - inputMin);
|
|
2187
|
-
result = easing(result);
|
|
2188
|
-
if (outputMin === -Infinity)
|
|
2189
|
-
result = -result;
|
|
2190
|
-
else if (outputMax === Infinity)
|
|
2191
|
-
result = result + outputMin;
|
|
2192
|
-
else
|
|
2193
|
-
result = result * (outputMax - outputMin) + outputMin;
|
|
2194
|
-
return result;
|
|
2195
|
-
}
|
|
2196
|
-
function findRange(input, inputRange) {
|
|
2197
|
-
for (var i = 1; i < inputRange.length - 1; ++i)
|
|
2198
|
-
if (inputRange[i] >= input)
|
|
2199
|
-
break;
|
|
2200
|
-
return i - 1;
|
|
2201
|
-
}
|
|
2202
|
-
function _extends$2() {
|
|
2203
|
-
_extends$2 = Object.assign || function(target) {
|
|
2204
|
-
for (var i = 1; i < arguments.length; i++) {
|
|
2205
|
-
var source = arguments[i];
|
|
2206
|
-
for (var key in source) {
|
|
2207
|
-
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
2208
|
-
target[key] = source[key];
|
|
2209
|
-
}
|
|
2210
|
-
}
|
|
2211
|
-
}
|
|
2212
|
-
return target;
|
|
2213
|
-
};
|
|
2214
|
-
return _extends$2.apply(this, arguments);
|
|
2215
|
-
}
|
|
2216
|
-
const $get = Symbol.for("FluidValue.get");
|
|
2217
|
-
const $observers = Symbol.for("FluidValue.observers");
|
|
2218
|
-
const hasFluidValue = (arg) => Boolean(arg && arg[$get]);
|
|
2219
|
-
const getFluidValue = (arg) => arg && arg[$get] ? arg[$get]() : arg;
|
|
2220
|
-
const getFluidObservers = (target) => target[$observers] || null;
|
|
2221
|
-
function callFluidObserver(observer, event) {
|
|
2222
|
-
if (observer.eventObserved) {
|
|
2223
|
-
observer.eventObserved(event);
|
|
2224
|
-
} else {
|
|
2225
|
-
observer(event);
|
|
2226
|
-
}
|
|
2227
|
-
}
|
|
2228
|
-
function callFluidObservers(target, event) {
|
|
2229
|
-
let observers = target[$observers];
|
|
2230
|
-
if (observers) {
|
|
2231
|
-
observers.forEach((observer) => {
|
|
2232
|
-
callFluidObserver(observer, event);
|
|
2233
|
-
});
|
|
2234
|
-
}
|
|
2235
|
-
}
|
|
2236
|
-
class FluidValue {
|
|
2237
|
-
constructor(get) {
|
|
2238
|
-
this[$get] = void 0;
|
|
2239
|
-
this[$observers] = void 0;
|
|
2240
|
-
if (!get && !(get = this.get)) {
|
|
2241
|
-
throw Error("Unknown getter");
|
|
2242
|
-
}
|
|
2243
|
-
setFluidGetter(this, get);
|
|
2244
|
-
}
|
|
2245
|
-
}
|
|
2246
|
-
const setFluidGetter = (target, get) => setHidden(target, $get, get);
|
|
2247
|
-
function addFluidObserver(target, observer) {
|
|
2248
|
-
if (target[$get]) {
|
|
2249
|
-
let observers = target[$observers];
|
|
2250
|
-
if (!observers) {
|
|
2251
|
-
setHidden(target, $observers, observers = new Set());
|
|
2252
|
-
}
|
|
2253
|
-
if (!observers.has(observer)) {
|
|
2254
|
-
observers.add(observer);
|
|
2255
|
-
if (target.observerAdded) {
|
|
2256
|
-
target.observerAdded(observers.size, observer);
|
|
2257
|
-
}
|
|
2258
|
-
}
|
|
2259
|
-
}
|
|
2260
|
-
return observer;
|
|
2261
|
-
}
|
|
2262
|
-
function removeFluidObserver(target, observer) {
|
|
2263
|
-
let observers = target[$observers];
|
|
2264
|
-
if (observers && observers.has(observer)) {
|
|
2265
|
-
const count = observers.size - 1;
|
|
2266
|
-
if (count) {
|
|
2267
|
-
observers.delete(observer);
|
|
2268
|
-
} else {
|
|
2269
|
-
target[$observers] = null;
|
|
2270
|
-
}
|
|
2271
|
-
if (target.observerRemoved) {
|
|
2272
|
-
target.observerRemoved(count, observer);
|
|
2273
|
-
}
|
|
2274
|
-
}
|
|
2275
|
-
}
|
|
2276
|
-
const setHidden = (target, key, value) => Object.defineProperty(target, key, {
|
|
2277
|
-
value,
|
|
2278
|
-
writable: true,
|
|
2279
|
-
configurable: true
|
|
2280
|
-
});
|
|
2281
|
-
const numberRegex = /[+\-]?(?:0|[1-9]\d*)(?:\.\d*)?(?:[eE][+\-]?\d+)?/g;
|
|
2282
|
-
const colorRegex = /(#(?:[0-9a-f]{2}){2,4}|(#[0-9a-f]{3})|(rgb|hsl)a?\((-?\d+%?[,\s]+){2,3}\s*[\d\.]+%?\))/gi;
|
|
2283
|
-
const unitRegex = new RegExp(`(${numberRegex.source})(%|[a-z]+)`, "i");
|
|
2284
|
-
let namedColorRegex;
|
|
2285
|
-
const rgbaRegex = /rgba\(([0-9\.-]+), ([0-9\.-]+), ([0-9\.-]+), ([0-9\.-]+)\)/gi;
|
|
2286
|
-
const rgbaRound = (_, p1, p2, p3, p4) => `rgba(${Math.round(p1)}, ${Math.round(p2)}, ${Math.round(p3)}, ${p4})`;
|
|
2287
|
-
const createStringInterpolator = (config2) => {
|
|
2288
|
-
if (!namedColorRegex)
|
|
2289
|
-
namedColorRegex = colors$1 ? new RegExp(`(${Object.keys(colors$1).join("|")})(?!\\w)`, "g") : /^\b$/;
|
|
2290
|
-
const output = config2.output.map((value) => getFluidValue(value).replace(colorRegex, colorToRgba).replace(namedColorRegex, colorToRgba));
|
|
2291
|
-
const keyframes = output.map((value) => value.match(numberRegex).map(Number));
|
|
2292
|
-
const outputRanges = keyframes[0].map((_, i) => keyframes.map((values) => {
|
|
2293
|
-
if (!(i in values)) {
|
|
2294
|
-
throw Error('The arity of each "output" value must be equal');
|
|
2295
|
-
}
|
|
2296
|
-
return values[i];
|
|
2297
|
-
}));
|
|
2298
|
-
const interpolators = outputRanges.map((output2) => createInterpolator(_extends$2({}, config2, {
|
|
2299
|
-
output: output2
|
|
2300
|
-
})));
|
|
2301
|
-
return (input) => {
|
|
2302
|
-
var _output$find;
|
|
2303
|
-
const missingUnit = !unitRegex.test(output[0]) && ((_output$find = output.find((value) => unitRegex.test(value))) == null ? void 0 : _output$find.replace(numberRegex, ""));
|
|
2304
|
-
let i = 0;
|
|
2305
|
-
return output[0].replace(numberRegex, () => `${interpolators[i++](input)}${missingUnit || ""}`).replace(rgbaRegex, rgbaRound);
|
|
2306
|
-
};
|
|
2307
|
-
};
|
|
2308
|
-
const prefix = "react-spring: ";
|
|
2309
|
-
const once = (fn) => {
|
|
2310
|
-
const func = fn;
|
|
2311
|
-
let called = false;
|
|
2312
|
-
if (typeof func != "function") {
|
|
2313
|
-
throw new TypeError(`${prefix}once requires a function parameter`);
|
|
2314
|
-
}
|
|
2315
|
-
return (...args) => {
|
|
2316
|
-
if (!called) {
|
|
2317
|
-
func(...args);
|
|
2318
|
-
called = true;
|
|
2319
|
-
}
|
|
2320
|
-
};
|
|
2321
|
-
};
|
|
2322
|
-
const warnInterpolate = once(console.warn);
|
|
2323
|
-
function deprecateInterpolate() {
|
|
2324
|
-
warnInterpolate(`${prefix}The "interpolate" function is deprecated in v9 (use "to" instead)`);
|
|
2325
|
-
}
|
|
2326
|
-
const warnDirectCall = once(console.warn);
|
|
2327
|
-
function deprecateDirectCall() {
|
|
2328
|
-
warnDirectCall(`${prefix}Directly calling start instead of using the api object is deprecated in v9 (use ".start" instead), this will be removed in later 0.X.0 versions`);
|
|
2329
|
-
}
|
|
2330
|
-
function isAnimatedString(value) {
|
|
2331
|
-
return is.str(value) && (value[0] == "#" || /\d/.test(value) || value in (colors$1 || {}));
|
|
2332
|
-
}
|
|
2333
|
-
const useOnce = (effect) => useEffect(effect, emptyDeps);
|
|
2334
|
-
const emptyDeps = [];
|
|
2335
|
-
function useForceUpdate() {
|
|
2336
|
-
const update2 = useState()[1];
|
|
2337
|
-
const mounted = useState(makeMountedRef)[0];
|
|
2338
|
-
useOnce(mounted.unmount);
|
|
2339
|
-
return () => {
|
|
2340
|
-
if (mounted.current) {
|
|
2341
|
-
update2({});
|
|
2342
|
-
}
|
|
2343
|
-
};
|
|
2344
|
-
}
|
|
2345
|
-
function makeMountedRef() {
|
|
2346
|
-
const mounted = {
|
|
2347
|
-
current: true,
|
|
2348
|
-
unmount: () => () => {
|
|
2349
|
-
mounted.current = false;
|
|
2350
|
-
}
|
|
2351
|
-
};
|
|
2352
|
-
return mounted;
|
|
2353
|
-
}
|
|
2354
|
-
function useMemoOne(getResult, inputs) {
|
|
2355
|
-
const [initial] = useState(() => ({
|
|
2356
|
-
inputs,
|
|
2357
|
-
result: getResult()
|
|
2358
|
-
}));
|
|
2359
|
-
const committed = useRef();
|
|
2360
|
-
const prevCache = committed.current;
|
|
2361
|
-
let cache = prevCache;
|
|
2362
|
-
if (cache) {
|
|
2363
|
-
const useCache = Boolean(inputs && cache.inputs && areInputsEqual(inputs, cache.inputs));
|
|
2364
|
-
if (!useCache) {
|
|
2365
|
-
cache = {
|
|
2366
|
-
inputs,
|
|
2367
|
-
result: getResult()
|
|
2368
|
-
};
|
|
2369
|
-
}
|
|
2370
|
-
} else {
|
|
2371
|
-
cache = initial;
|
|
2372
|
-
}
|
|
2373
|
-
useEffect(() => {
|
|
2374
|
-
committed.current = cache;
|
|
2375
|
-
if (prevCache == initial) {
|
|
2376
|
-
initial.inputs = initial.result = void 0;
|
|
2377
|
-
}
|
|
2378
|
-
}, [cache]);
|
|
2379
|
-
return cache.result;
|
|
2380
|
-
}
|
|
2381
|
-
function areInputsEqual(next, prev) {
|
|
2382
|
-
if (next.length !== prev.length) {
|
|
2383
|
-
return false;
|
|
2384
|
-
}
|
|
2385
|
-
for (let i = 0; i < next.length; i++) {
|
|
2386
|
-
if (next[i] !== prev[i]) {
|
|
2387
|
-
return false;
|
|
2388
|
-
}
|
|
2389
|
-
}
|
|
2390
|
-
return true;
|
|
2391
|
-
}
|
|
2392
|
-
function usePrev(value) {
|
|
2393
|
-
const prevRef = useRef();
|
|
2394
|
-
useEffect(() => {
|
|
2395
|
-
prevRef.current = value;
|
|
2396
|
-
});
|
|
2397
|
-
return prevRef.current;
|
|
2398
|
-
}
|
|
2399
|
-
const useLayoutEffect = typeof window !== "undefined" && window.document && window.document.createElement ? React.useLayoutEffect : React.useEffect;
|
|
2400
|
-
const $node = Symbol.for("Animated:node");
|
|
2401
|
-
const isAnimated = (value) => !!value && value[$node] === value;
|
|
2402
|
-
const getAnimated = (owner) => owner && owner[$node];
|
|
2403
|
-
const setAnimated = (owner, node) => defineHidden(owner, $node, node);
|
|
2404
|
-
const getPayload = (owner) => owner && owner[$node] && owner[$node].getPayload();
|
|
2405
|
-
class Animated {
|
|
2406
|
-
constructor() {
|
|
2407
|
-
this.payload = void 0;
|
|
2408
|
-
setAnimated(this, this);
|
|
2409
|
-
}
|
|
2410
|
-
getPayload() {
|
|
2411
|
-
return this.payload || [];
|
|
2412
|
-
}
|
|
2413
|
-
}
|
|
2414
|
-
class AnimatedValue extends Animated {
|
|
2415
|
-
constructor(_value) {
|
|
2416
|
-
super();
|
|
2417
|
-
this.done = true;
|
|
2418
|
-
this.elapsedTime = void 0;
|
|
2419
|
-
this.lastPosition = void 0;
|
|
2420
|
-
this.lastVelocity = void 0;
|
|
2421
|
-
this.v0 = void 0;
|
|
2422
|
-
this.durationProgress = 0;
|
|
2423
|
-
this._value = _value;
|
|
2424
|
-
if (is.num(this._value)) {
|
|
2425
|
-
this.lastPosition = this._value;
|
|
2426
|
-
}
|
|
2427
|
-
}
|
|
2428
|
-
static create(value) {
|
|
2429
|
-
return new AnimatedValue(value);
|
|
2430
|
-
}
|
|
2431
|
-
getPayload() {
|
|
2432
|
-
return [this];
|
|
2433
|
-
}
|
|
2434
|
-
getValue() {
|
|
2435
|
-
return this._value;
|
|
2436
|
-
}
|
|
2437
|
-
setValue(value, step) {
|
|
2438
|
-
if (is.num(value)) {
|
|
2439
|
-
this.lastPosition = value;
|
|
2440
|
-
if (step) {
|
|
2441
|
-
value = Math.round(value / step) * step;
|
|
2442
|
-
if (this.done) {
|
|
2443
|
-
this.lastPosition = value;
|
|
2444
|
-
}
|
|
2445
|
-
}
|
|
2446
|
-
}
|
|
2447
|
-
if (this._value === value) {
|
|
2448
|
-
return false;
|
|
2449
|
-
}
|
|
2450
|
-
this._value = value;
|
|
2451
|
-
return true;
|
|
2452
|
-
}
|
|
2453
|
-
reset() {
|
|
2454
|
-
const {
|
|
2455
|
-
done
|
|
2456
|
-
} = this;
|
|
2457
|
-
this.done = false;
|
|
2458
|
-
if (is.num(this._value)) {
|
|
2459
|
-
this.elapsedTime = 0;
|
|
2460
|
-
this.durationProgress = 0;
|
|
2461
|
-
this.lastPosition = this._value;
|
|
2462
|
-
if (done)
|
|
2463
|
-
this.lastVelocity = null;
|
|
2464
|
-
this.v0 = null;
|
|
2465
|
-
}
|
|
2466
|
-
}
|
|
2467
|
-
}
|
|
2468
|
-
class AnimatedString extends AnimatedValue {
|
|
2469
|
-
constructor(value) {
|
|
2470
|
-
super(0);
|
|
2471
|
-
this._string = null;
|
|
2472
|
-
this._toString = void 0;
|
|
2473
|
-
this._toString = createInterpolator({
|
|
2474
|
-
output: [value, value]
|
|
2475
|
-
});
|
|
2476
|
-
}
|
|
2477
|
-
static create(value) {
|
|
2478
|
-
return new AnimatedString(value);
|
|
2479
|
-
}
|
|
2480
|
-
getValue() {
|
|
2481
|
-
let value = this._string;
|
|
2482
|
-
return value == null ? this._string = this._toString(this._value) : value;
|
|
2483
|
-
}
|
|
2484
|
-
setValue(value) {
|
|
2485
|
-
if (is.str(value)) {
|
|
2486
|
-
if (value == this._string) {
|
|
2487
|
-
return false;
|
|
2488
|
-
}
|
|
2489
|
-
this._string = value;
|
|
2490
|
-
this._value = 1;
|
|
2491
|
-
} else if (super.setValue(value)) {
|
|
2492
|
-
this._string = null;
|
|
2493
|
-
} else {
|
|
2494
|
-
return false;
|
|
2495
|
-
}
|
|
2496
|
-
return true;
|
|
2497
|
-
}
|
|
2498
|
-
reset(goal) {
|
|
2499
|
-
if (goal) {
|
|
2500
|
-
this._toString = createInterpolator({
|
|
2501
|
-
output: [this.getValue(), goal]
|
|
2502
|
-
});
|
|
2503
|
-
}
|
|
2504
|
-
this._value = 0;
|
|
2505
|
-
super.reset();
|
|
2506
|
-
}
|
|
2507
|
-
}
|
|
2508
|
-
const TreeContext = {
|
|
2509
|
-
dependencies: null
|
|
2510
|
-
};
|
|
2511
|
-
class AnimatedObject extends Animated {
|
|
2512
|
-
constructor(source) {
|
|
2513
|
-
super();
|
|
2514
|
-
this.source = source;
|
|
2515
|
-
this.setValue(source);
|
|
2516
|
-
}
|
|
2517
|
-
getValue(animated2) {
|
|
2518
|
-
const values = {};
|
|
2519
|
-
eachProp(this.source, (source, key) => {
|
|
2520
|
-
if (isAnimated(source)) {
|
|
2521
|
-
values[key] = source.getValue(animated2);
|
|
2522
|
-
} else if (hasFluidValue(source)) {
|
|
2523
|
-
values[key] = getFluidValue(source);
|
|
2524
|
-
} else if (!animated2) {
|
|
2525
|
-
values[key] = source;
|
|
2526
|
-
}
|
|
2527
|
-
});
|
|
2528
|
-
return values;
|
|
2529
|
-
}
|
|
2530
|
-
setValue(source) {
|
|
2531
|
-
this.source = source;
|
|
2532
|
-
this.payload = this._makePayload(source);
|
|
2533
|
-
}
|
|
2534
|
-
reset() {
|
|
2535
|
-
if (this.payload) {
|
|
2536
|
-
each(this.payload, (node) => node.reset());
|
|
2537
|
-
}
|
|
2538
|
-
}
|
|
2539
|
-
_makePayload(source) {
|
|
2540
|
-
if (source) {
|
|
2541
|
-
const payload = new Set();
|
|
2542
|
-
eachProp(source, this._addToPayload, payload);
|
|
2543
|
-
return Array.from(payload);
|
|
2544
|
-
}
|
|
2545
|
-
}
|
|
2546
|
-
_addToPayload(source) {
|
|
2547
|
-
if (TreeContext.dependencies && hasFluidValue(source)) {
|
|
2548
|
-
TreeContext.dependencies.add(source);
|
|
2549
|
-
}
|
|
2550
|
-
const payload = getPayload(source);
|
|
2551
|
-
if (payload) {
|
|
2552
|
-
each(payload, (node) => this.add(node));
|
|
2553
|
-
}
|
|
2554
|
-
}
|
|
2555
|
-
}
|
|
2556
|
-
class AnimatedArray extends AnimatedObject {
|
|
2557
|
-
constructor(source) {
|
|
2558
|
-
super(source);
|
|
2559
|
-
}
|
|
2560
|
-
static create(source) {
|
|
2561
|
-
return new AnimatedArray(source);
|
|
2562
|
-
}
|
|
2563
|
-
getValue() {
|
|
2564
|
-
return this.source.map((node) => node.getValue());
|
|
2565
|
-
}
|
|
2566
|
-
setValue(source) {
|
|
2567
|
-
const payload = this.getPayload();
|
|
2568
|
-
if (source.length == payload.length) {
|
|
2569
|
-
return payload.map((node, i) => node.setValue(source[i])).some(Boolean);
|
|
2570
|
-
}
|
|
2571
|
-
super.setValue(source.map(makeAnimated));
|
|
2572
|
-
return true;
|
|
2573
|
-
}
|
|
2574
|
-
}
|
|
2575
|
-
function makeAnimated(value) {
|
|
2576
|
-
const nodeType = isAnimatedString(value) ? AnimatedString : AnimatedValue;
|
|
2577
|
-
return nodeType.create(value);
|
|
2578
|
-
}
|
|
2579
|
-
function getAnimatedType(value) {
|
|
2580
|
-
const parentNode = getAnimated(value);
|
|
2581
|
-
return parentNode ? parentNode.constructor : is.arr(value) ? AnimatedArray : isAnimatedString(value) ? AnimatedString : AnimatedValue;
|
|
2582
|
-
}
|
|
2583
|
-
function _extends$1() {
|
|
2584
|
-
_extends$1 = Object.assign || function(target) {
|
|
2585
|
-
for (var i = 1; i < arguments.length; i++) {
|
|
2586
|
-
var source = arguments[i];
|
|
2587
|
-
for (var key in source) {
|
|
2588
|
-
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
2589
|
-
target[key] = source[key];
|
|
2590
|
-
}
|
|
2591
|
-
}
|
|
2592
|
-
}
|
|
2593
|
-
return target;
|
|
2594
|
-
};
|
|
2595
|
-
return _extends$1.apply(this, arguments);
|
|
2596
|
-
}
|
|
2597
|
-
const withAnimated = (Component, host2) => {
|
|
2598
|
-
const hasInstance = !is.fun(Component) || Component.prototype && Component.prototype.isReactComponent;
|
|
2599
|
-
return forwardRef((givenProps, givenRef) => {
|
|
2600
|
-
const instanceRef = useRef(null);
|
|
2601
|
-
const ref = hasInstance && useCallback((value) => {
|
|
2602
|
-
instanceRef.current = updateRef(givenRef, value);
|
|
2603
|
-
}, [givenRef]);
|
|
2604
|
-
const [props, deps] = getAnimatedState(givenProps, host2);
|
|
2605
|
-
const forceUpdate = useForceUpdate();
|
|
2606
|
-
const callback = () => {
|
|
2607
|
-
const instance = instanceRef.current;
|
|
2608
|
-
if (hasInstance && !instance) {
|
|
2609
|
-
return;
|
|
2610
|
-
}
|
|
2611
|
-
const didUpdate = instance ? host2.applyAnimatedValues(instance, props.getValue(true)) : false;
|
|
2612
|
-
if (didUpdate === false) {
|
|
2613
|
-
forceUpdate();
|
|
2614
|
-
}
|
|
2615
|
-
};
|
|
2616
|
-
const observer = new PropsObserver(callback, deps);
|
|
2617
|
-
const observerRef = useRef();
|
|
2618
|
-
useLayoutEffect(() => {
|
|
2619
|
-
const lastObserver = observerRef.current;
|
|
2620
|
-
observerRef.current = observer;
|
|
2621
|
-
each(deps, (dep) => addFluidObserver(dep, observer));
|
|
2622
|
-
if (lastObserver) {
|
|
2623
|
-
each(lastObserver.deps, (dep) => removeFluidObserver(dep, lastObserver));
|
|
2624
|
-
raf.cancel(lastObserver.update);
|
|
2625
|
-
}
|
|
2626
|
-
});
|
|
2627
|
-
useEffect(callback, []);
|
|
2628
|
-
useOnce(() => () => {
|
|
2629
|
-
const observer2 = observerRef.current;
|
|
2630
|
-
each(observer2.deps, (dep) => removeFluidObserver(dep, observer2));
|
|
2631
|
-
});
|
|
2632
|
-
const usedProps = host2.getComponentProps(props.getValue());
|
|
2633
|
-
return React.createElement(Component, _extends$1({}, usedProps, {
|
|
2634
|
-
ref
|
|
2635
|
-
}));
|
|
2636
|
-
});
|
|
2637
|
-
};
|
|
2638
|
-
class PropsObserver {
|
|
2639
|
-
constructor(update2, deps) {
|
|
2640
|
-
this.update = update2;
|
|
2641
|
-
this.deps = deps;
|
|
2642
|
-
}
|
|
2643
|
-
eventObserved(event) {
|
|
2644
|
-
if (event.type == "change") {
|
|
2645
|
-
raf.write(this.update);
|
|
2646
|
-
}
|
|
2647
|
-
}
|
|
2648
|
-
}
|
|
2649
|
-
function getAnimatedState(props, host2) {
|
|
2650
|
-
const dependencies = new Set();
|
|
2651
|
-
TreeContext.dependencies = dependencies;
|
|
2652
|
-
if (props.style)
|
|
2653
|
-
props = _extends$1({}, props, {
|
|
2654
|
-
style: host2.createAnimatedStyle(props.style)
|
|
2655
|
-
});
|
|
2656
|
-
props = new AnimatedObject(props);
|
|
2657
|
-
TreeContext.dependencies = null;
|
|
2658
|
-
return [props, dependencies];
|
|
2659
|
-
}
|
|
2660
|
-
function updateRef(ref, value) {
|
|
2661
|
-
if (ref) {
|
|
2662
|
-
if (is.fun(ref))
|
|
2663
|
-
ref(value);
|
|
2664
|
-
else
|
|
2665
|
-
ref.current = value;
|
|
2666
|
-
}
|
|
2667
|
-
return value;
|
|
2668
|
-
}
|
|
2669
|
-
const cacheKey = Symbol.for("AnimatedComponent");
|
|
2670
|
-
const createHost = (components, {
|
|
2671
|
-
applyAnimatedValues: _applyAnimatedValues = () => false,
|
|
2672
|
-
createAnimatedStyle: _createAnimatedStyle = (style) => new AnimatedObject(style),
|
|
2673
|
-
getComponentProps: _getComponentProps = (props) => props
|
|
2674
|
-
} = {}) => {
|
|
2675
|
-
const hostConfig = {
|
|
2676
|
-
applyAnimatedValues: _applyAnimatedValues,
|
|
2677
|
-
createAnimatedStyle: _createAnimatedStyle,
|
|
2678
|
-
getComponentProps: _getComponentProps
|
|
2679
|
-
};
|
|
2680
|
-
const animated2 = (Component) => {
|
|
2681
|
-
const displayName = getDisplayName(Component) || "Anonymous";
|
|
2682
|
-
if (is.str(Component)) {
|
|
2683
|
-
Component = animated2[Component] || (animated2[Component] = withAnimated(Component, hostConfig));
|
|
2684
|
-
} else {
|
|
2685
|
-
Component = Component[cacheKey] || (Component[cacheKey] = withAnimated(Component, hostConfig));
|
|
2686
|
-
}
|
|
2687
|
-
Component.displayName = `Animated(${displayName})`;
|
|
2688
|
-
return Component;
|
|
2689
|
-
};
|
|
2690
|
-
eachProp(components, (Component, key) => {
|
|
2691
|
-
if (is.arr(components)) {
|
|
2692
|
-
key = getDisplayName(Component);
|
|
2693
|
-
}
|
|
2694
|
-
animated2[key] = animated2(Component);
|
|
2695
|
-
});
|
|
2696
|
-
return {
|
|
2697
|
-
animated: animated2
|
|
2698
|
-
};
|
|
2699
|
-
};
|
|
2700
|
-
const getDisplayName = (arg) => is.str(arg) ? arg : arg && is.str(arg.displayName) ? arg.displayName : is.fun(arg) && arg.name || null;
|
|
2701
|
-
function _extends() {
|
|
2702
|
-
_extends = Object.assign || function(target) {
|
|
2703
|
-
for (var i = 1; i < arguments.length; i++) {
|
|
2704
|
-
var source = arguments[i];
|
|
2705
|
-
for (var key in source) {
|
|
2706
|
-
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
2707
|
-
target[key] = source[key];
|
|
2708
|
-
}
|
|
2709
|
-
}
|
|
2710
|
-
}
|
|
2711
|
-
return target;
|
|
2712
|
-
};
|
|
2713
|
-
return _extends.apply(this, arguments);
|
|
2714
|
-
}
|
|
2715
|
-
function callProp(value, ...args) {
|
|
2716
|
-
return is.fun(value) ? value(...args) : value;
|
|
2717
|
-
}
|
|
2718
|
-
const matchProp = (value, key) => value === true || !!(key && value && (is.fun(value) ? value(key) : toArray(value).includes(key)));
|
|
2719
|
-
const resolveProp = (prop, key) => is.obj(prop) ? key && prop[key] : prop;
|
|
2720
|
-
const getDefaultProp = (props, key) => props.default === true ? props[key] : props.default ? props.default[key] : void 0;
|
|
2721
|
-
const noopTransform = (value) => value;
|
|
2722
|
-
const getDefaultProps = (props, transform = noopTransform) => {
|
|
2723
|
-
let keys = DEFAULT_PROPS;
|
|
2724
|
-
if (props.default && props.default !== true) {
|
|
2725
|
-
props = props.default;
|
|
2726
|
-
keys = Object.keys(props);
|
|
2727
|
-
}
|
|
2728
|
-
const defaults2 = {};
|
|
2729
|
-
for (const key of keys) {
|
|
2730
|
-
const value = transform(props[key], key);
|
|
2731
|
-
if (!is.und(value)) {
|
|
2732
|
-
defaults2[key] = value;
|
|
2733
|
-
}
|
|
2734
|
-
}
|
|
2735
|
-
return defaults2;
|
|
2736
|
-
};
|
|
2737
|
-
const DEFAULT_PROPS = ["config", "onProps", "onStart", "onChange", "onPause", "onResume", "onRest"];
|
|
2738
|
-
const RESERVED_PROPS = {
|
|
2739
|
-
config: 1,
|
|
2740
|
-
from: 1,
|
|
2741
|
-
to: 1,
|
|
2742
|
-
ref: 1,
|
|
2743
|
-
loop: 1,
|
|
2744
|
-
reset: 1,
|
|
2745
|
-
pause: 1,
|
|
2746
|
-
cancel: 1,
|
|
2747
|
-
reverse: 1,
|
|
2748
|
-
immediate: 1,
|
|
2749
|
-
default: 1,
|
|
2750
|
-
delay: 1,
|
|
2751
|
-
onProps: 1,
|
|
2752
|
-
onStart: 1,
|
|
2753
|
-
onChange: 1,
|
|
2754
|
-
onPause: 1,
|
|
2755
|
-
onResume: 1,
|
|
2756
|
-
onRest: 1,
|
|
2757
|
-
onResolve: 1,
|
|
2758
|
-
items: 1,
|
|
2759
|
-
trail: 1,
|
|
2760
|
-
sort: 1,
|
|
2761
|
-
expires: 1,
|
|
2762
|
-
initial: 1,
|
|
2763
|
-
enter: 1,
|
|
2764
|
-
update: 1,
|
|
2765
|
-
leave: 1,
|
|
2766
|
-
children: 1,
|
|
2767
|
-
onDestroyed: 1,
|
|
2768
|
-
keys: 1,
|
|
2769
|
-
callId: 1,
|
|
2770
|
-
parentId: 1
|
|
2771
|
-
};
|
|
2772
|
-
function getForwardProps(props) {
|
|
2773
|
-
const forward = {};
|
|
2774
|
-
let count = 0;
|
|
2775
|
-
eachProp(props, (value, prop) => {
|
|
2776
|
-
if (!RESERVED_PROPS[prop]) {
|
|
2777
|
-
forward[prop] = value;
|
|
2778
|
-
count++;
|
|
2779
|
-
}
|
|
2780
|
-
});
|
|
2781
|
-
if (count) {
|
|
2782
|
-
return forward;
|
|
2783
|
-
}
|
|
2784
|
-
}
|
|
2785
|
-
function inferTo(props) {
|
|
2786
|
-
const to2 = getForwardProps(props);
|
|
2787
|
-
if (to2) {
|
|
2788
|
-
const out = {
|
|
2789
|
-
to: to2
|
|
2790
|
-
};
|
|
2791
|
-
eachProp(props, (val, key) => key in to2 || (out[key] = val));
|
|
2792
|
-
return out;
|
|
2793
|
-
}
|
|
2794
|
-
return _extends({}, props);
|
|
2795
|
-
}
|
|
2796
|
-
function computeGoal(value) {
|
|
2797
|
-
value = getFluidValue(value);
|
|
2798
|
-
return is.arr(value) ? value.map(computeGoal) : isAnimatedString(value) ? globals.createStringInterpolator({
|
|
2799
|
-
range: [0, 1],
|
|
2800
|
-
output: [value, value]
|
|
2801
|
-
})(1) : value;
|
|
2802
|
-
}
|
|
2803
|
-
function hasProps(props) {
|
|
2804
|
-
for (const _ in props)
|
|
2805
|
-
return true;
|
|
2806
|
-
return false;
|
|
2807
|
-
}
|
|
2808
|
-
function isAsyncTo(to2) {
|
|
2809
|
-
return is.fun(to2) || is.arr(to2) && is.obj(to2[0]);
|
|
2810
|
-
}
|
|
2811
|
-
function detachRefs(ctrl, ref) {
|
|
2812
|
-
var _ctrl$ref;
|
|
2813
|
-
(_ctrl$ref = ctrl.ref) == null ? void 0 : _ctrl$ref.delete(ctrl);
|
|
2814
|
-
ref == null ? void 0 : ref.delete(ctrl);
|
|
2815
|
-
}
|
|
2816
|
-
function replaceRef(ctrl, ref) {
|
|
2817
|
-
if (ref && ctrl.ref !== ref) {
|
|
2818
|
-
var _ctrl$ref2;
|
|
2819
|
-
(_ctrl$ref2 = ctrl.ref) == null ? void 0 : _ctrl$ref2.delete(ctrl);
|
|
2820
|
-
ref.add(ctrl);
|
|
2821
|
-
ctrl.ref = ref;
|
|
2822
|
-
}
|
|
2823
|
-
}
|
|
2824
|
-
const config = {
|
|
2825
|
-
default: {
|
|
2826
|
-
tension: 170,
|
|
2827
|
-
friction: 26
|
|
2828
|
-
},
|
|
2829
|
-
gentle: {
|
|
2830
|
-
tension: 120,
|
|
2831
|
-
friction: 14
|
|
2832
|
-
},
|
|
2833
|
-
wobbly: {
|
|
2834
|
-
tension: 180,
|
|
2835
|
-
friction: 12
|
|
2836
|
-
},
|
|
2837
|
-
stiff: {
|
|
2838
|
-
tension: 210,
|
|
2839
|
-
friction: 20
|
|
2840
|
-
},
|
|
2841
|
-
slow: {
|
|
2842
|
-
tension: 280,
|
|
2843
|
-
friction: 60
|
|
2844
|
-
},
|
|
2845
|
-
molasses: {
|
|
2846
|
-
tension: 280,
|
|
2847
|
-
friction: 120
|
|
2848
|
-
}
|
|
2849
|
-
};
|
|
2850
|
-
const linear = (t) => t;
|
|
2851
|
-
const defaults = _extends({}, config.default, {
|
|
2852
|
-
mass: 1,
|
|
2853
|
-
damping: 1,
|
|
2854
|
-
easing: linear,
|
|
2855
|
-
clamp: false
|
|
2856
|
-
});
|
|
2857
|
-
class AnimationConfig {
|
|
2858
|
-
constructor() {
|
|
2859
|
-
this.tension = void 0;
|
|
2860
|
-
this.friction = void 0;
|
|
2861
|
-
this.frequency = void 0;
|
|
2862
|
-
this.damping = void 0;
|
|
2863
|
-
this.mass = void 0;
|
|
2864
|
-
this.velocity = 0;
|
|
2865
|
-
this.restVelocity = void 0;
|
|
2866
|
-
this.precision = void 0;
|
|
2867
|
-
this.progress = void 0;
|
|
2868
|
-
this.duration = void 0;
|
|
2869
|
-
this.easing = void 0;
|
|
2870
|
-
this.clamp = void 0;
|
|
2871
|
-
this.bounce = void 0;
|
|
2872
|
-
this.decay = void 0;
|
|
2873
|
-
this.round = void 0;
|
|
2874
|
-
Object.assign(this, defaults);
|
|
2875
|
-
}
|
|
2876
|
-
}
|
|
2877
|
-
function mergeConfig(config2, newConfig, defaultConfig) {
|
|
2878
|
-
if (defaultConfig) {
|
|
2879
|
-
defaultConfig = _extends({}, defaultConfig);
|
|
2880
|
-
sanitizeConfig(defaultConfig, newConfig);
|
|
2881
|
-
newConfig = _extends({}, defaultConfig, newConfig);
|
|
2882
|
-
}
|
|
2883
|
-
sanitizeConfig(config2, newConfig);
|
|
2884
|
-
Object.assign(config2, newConfig);
|
|
2885
|
-
for (const key in defaults) {
|
|
2886
|
-
if (config2[key] == null) {
|
|
2887
|
-
config2[key] = defaults[key];
|
|
2888
|
-
}
|
|
2889
|
-
}
|
|
2890
|
-
let {
|
|
2891
|
-
mass,
|
|
2892
|
-
frequency,
|
|
2893
|
-
damping
|
|
2894
|
-
} = config2;
|
|
2895
|
-
if (!is.und(frequency)) {
|
|
2896
|
-
if (frequency < 0.01)
|
|
2897
|
-
frequency = 0.01;
|
|
2898
|
-
if (damping < 0)
|
|
2899
|
-
damping = 0;
|
|
2900
|
-
config2.tension = Math.pow(2 * Math.PI / frequency, 2) * mass;
|
|
2901
|
-
config2.friction = 4 * Math.PI * damping * mass / frequency;
|
|
2902
|
-
}
|
|
2903
|
-
return config2;
|
|
2904
|
-
}
|
|
2905
|
-
function sanitizeConfig(config2, props) {
|
|
2906
|
-
if (!is.und(props.decay)) {
|
|
2907
|
-
config2.duration = void 0;
|
|
2908
|
-
} else {
|
|
2909
|
-
const isTensionConfig = !is.und(props.tension) || !is.und(props.friction);
|
|
2910
|
-
if (isTensionConfig || !is.und(props.frequency) || !is.und(props.damping) || !is.und(props.mass)) {
|
|
2911
|
-
config2.duration = void 0;
|
|
2912
|
-
config2.decay = void 0;
|
|
2913
|
-
}
|
|
2914
|
-
if (isTensionConfig) {
|
|
2915
|
-
config2.frequency = void 0;
|
|
2916
|
-
}
|
|
2917
|
-
}
|
|
2918
|
-
}
|
|
2919
|
-
const emptyArray = [];
|
|
2920
|
-
class Animation {
|
|
2921
|
-
constructor() {
|
|
2922
|
-
this.changed = false;
|
|
2923
|
-
this.values = emptyArray;
|
|
2924
|
-
this.toValues = null;
|
|
2925
|
-
this.fromValues = emptyArray;
|
|
2926
|
-
this.to = void 0;
|
|
2927
|
-
this.from = void 0;
|
|
2928
|
-
this.config = new AnimationConfig();
|
|
2929
|
-
this.immediate = false;
|
|
2930
|
-
}
|
|
2931
|
-
}
|
|
2932
|
-
function scheduleProps(callId, {
|
|
2933
|
-
key,
|
|
2934
|
-
props,
|
|
2935
|
-
defaultProps,
|
|
2936
|
-
state,
|
|
2937
|
-
actions
|
|
2938
|
-
}) {
|
|
2939
|
-
return new Promise((resolve, reject) => {
|
|
2940
|
-
var _props$cancel;
|
|
2941
|
-
let delay;
|
|
2942
|
-
let timeout;
|
|
2943
|
-
let cancel = matchProp((_props$cancel = props.cancel) != null ? _props$cancel : defaultProps == null ? void 0 : defaultProps.cancel, key);
|
|
2944
|
-
if (cancel) {
|
|
2945
|
-
onStart();
|
|
2946
|
-
} else {
|
|
2947
|
-
if (!is.und(props.pause)) {
|
|
2948
|
-
state.paused = matchProp(props.pause, key);
|
|
2949
|
-
}
|
|
2950
|
-
let pause = defaultProps == null ? void 0 : defaultProps.pause;
|
|
2951
|
-
if (pause !== true) {
|
|
2952
|
-
pause = state.paused || matchProp(pause, key);
|
|
2953
|
-
}
|
|
2954
|
-
delay = callProp(props.delay || 0, key);
|
|
2955
|
-
if (pause) {
|
|
2956
|
-
state.resumeQueue.add(onResume);
|
|
2957
|
-
actions.pause();
|
|
2958
|
-
} else {
|
|
2959
|
-
actions.resume();
|
|
2960
|
-
onResume();
|
|
2961
|
-
}
|
|
2962
|
-
}
|
|
2963
|
-
function onPause() {
|
|
2964
|
-
state.resumeQueue.add(onResume);
|
|
2965
|
-
state.timeouts.delete(timeout);
|
|
2966
|
-
timeout.cancel();
|
|
2967
|
-
delay = timeout.time - raf.now();
|
|
2968
|
-
}
|
|
2969
|
-
function onResume() {
|
|
2970
|
-
if (delay > 0) {
|
|
2971
|
-
timeout = raf.setTimeout(onStart, delay);
|
|
2972
|
-
state.pauseQueue.add(onPause);
|
|
2973
|
-
state.timeouts.add(timeout);
|
|
2974
|
-
} else {
|
|
2975
|
-
onStart();
|
|
2976
|
-
}
|
|
2977
|
-
}
|
|
2978
|
-
function onStart() {
|
|
2979
|
-
state.pauseQueue.delete(onPause);
|
|
2980
|
-
state.timeouts.delete(timeout);
|
|
2981
|
-
if (callId <= (state.cancelId || 0)) {
|
|
2982
|
-
cancel = true;
|
|
2983
|
-
}
|
|
2984
|
-
try {
|
|
2985
|
-
actions.start(_extends({}, props, {
|
|
2986
|
-
callId,
|
|
2987
|
-
cancel
|
|
2988
|
-
}), resolve);
|
|
2989
|
-
} catch (err) {
|
|
2990
|
-
reject(err);
|
|
2991
|
-
}
|
|
2992
|
-
}
|
|
2993
|
-
});
|
|
2994
|
-
}
|
|
2995
|
-
const getCombinedResult = (target, results) => results.length == 1 ? results[0] : results.some((result) => result.cancelled) ? getCancelledResult(target.get()) : results.every((result) => result.noop) ? getNoopResult(target.get()) : getFinishedResult(target.get(), results.every((result) => result.finished));
|
|
2996
|
-
const getNoopResult = (value) => ({
|
|
2997
|
-
value,
|
|
2998
|
-
noop: true,
|
|
2999
|
-
finished: true,
|
|
3000
|
-
cancelled: false
|
|
3001
|
-
});
|
|
3002
|
-
const getFinishedResult = (value, finished, cancelled = false) => ({
|
|
3003
|
-
value,
|
|
3004
|
-
finished,
|
|
3005
|
-
cancelled
|
|
3006
|
-
});
|
|
3007
|
-
const getCancelledResult = (value) => ({
|
|
3008
|
-
value,
|
|
3009
|
-
cancelled: true,
|
|
3010
|
-
finished: false
|
|
3011
|
-
});
|
|
3012
|
-
function runAsync(to2, props, state, target) {
|
|
3013
|
-
const {
|
|
3014
|
-
callId,
|
|
3015
|
-
parentId,
|
|
3016
|
-
onRest
|
|
3017
|
-
} = props;
|
|
3018
|
-
const {
|
|
3019
|
-
asyncTo: prevTo,
|
|
3020
|
-
promise: prevPromise
|
|
3021
|
-
} = state;
|
|
3022
|
-
if (!parentId && to2 === prevTo && !props.reset) {
|
|
3023
|
-
return prevPromise;
|
|
3024
|
-
}
|
|
3025
|
-
return state.promise = (async () => {
|
|
3026
|
-
state.asyncId = callId;
|
|
3027
|
-
state.asyncTo = to2;
|
|
3028
|
-
const defaultProps = getDefaultProps(props, (value, key) => key === "onRest" ? void 0 : value);
|
|
3029
|
-
let preventBail;
|
|
3030
|
-
let bail;
|
|
3031
|
-
const bailPromise = new Promise((resolve, reject) => (preventBail = resolve, bail = reject));
|
|
3032
|
-
const bailIfEnded = (bailSignal) => {
|
|
3033
|
-
const bailResult = callId <= (state.cancelId || 0) && getCancelledResult(target) || callId !== state.asyncId && getFinishedResult(target, false);
|
|
3034
|
-
if (bailResult) {
|
|
3035
|
-
bailSignal.result = bailResult;
|
|
3036
|
-
bail(bailSignal);
|
|
3037
|
-
throw bailSignal;
|
|
3038
|
-
}
|
|
3039
|
-
};
|
|
3040
|
-
const animate = (arg1, arg2) => {
|
|
3041
|
-
const bailSignal = new BailSignal();
|
|
3042
|
-
const skipAnimationSignal = new SkipAniamtionSignal();
|
|
3043
|
-
return (async () => {
|
|
3044
|
-
if (globals.skipAnimation) {
|
|
3045
|
-
stopAsync(state);
|
|
3046
|
-
skipAnimationSignal.result = getFinishedResult(target, false);
|
|
3047
|
-
bail(skipAnimationSignal);
|
|
3048
|
-
throw skipAnimationSignal;
|
|
3049
|
-
}
|
|
3050
|
-
bailIfEnded(bailSignal);
|
|
3051
|
-
const props2 = is.obj(arg1) ? _extends({}, arg1) : _extends({}, arg2, {
|
|
3052
|
-
to: arg1
|
|
3053
|
-
});
|
|
3054
|
-
props2.parentId = callId;
|
|
3055
|
-
eachProp(defaultProps, (value, key) => {
|
|
3056
|
-
if (is.und(props2[key])) {
|
|
3057
|
-
props2[key] = value;
|
|
3058
|
-
}
|
|
3059
|
-
});
|
|
3060
|
-
const result2 = await target.start(props2);
|
|
3061
|
-
bailIfEnded(bailSignal);
|
|
3062
|
-
if (state.paused) {
|
|
3063
|
-
await new Promise((resume) => {
|
|
3064
|
-
state.resumeQueue.add(resume);
|
|
3065
|
-
});
|
|
3066
|
-
}
|
|
3067
|
-
return result2;
|
|
3068
|
-
})();
|
|
3069
|
-
};
|
|
3070
|
-
let result;
|
|
3071
|
-
if (globals.skipAnimation) {
|
|
3072
|
-
stopAsync(state);
|
|
3073
|
-
return getFinishedResult(target, false);
|
|
3074
|
-
}
|
|
3075
|
-
try {
|
|
3076
|
-
let animating;
|
|
3077
|
-
if (is.arr(to2)) {
|
|
3078
|
-
animating = (async (queue) => {
|
|
3079
|
-
for (const props2 of queue) {
|
|
3080
|
-
await animate(props2);
|
|
3081
|
-
}
|
|
3082
|
-
})(to2);
|
|
3083
|
-
} else {
|
|
3084
|
-
animating = Promise.resolve(to2(animate, target.stop.bind(target)));
|
|
3085
|
-
}
|
|
3086
|
-
await Promise.all([animating.then(preventBail), bailPromise]);
|
|
3087
|
-
result = getFinishedResult(target.get(), true, false);
|
|
3088
|
-
} catch (err) {
|
|
3089
|
-
if (err instanceof BailSignal) {
|
|
3090
|
-
result = err.result;
|
|
3091
|
-
} else if (err instanceof SkipAniamtionSignal) {
|
|
3092
|
-
result = err.result;
|
|
3093
|
-
} else {
|
|
3094
|
-
throw err;
|
|
3095
|
-
}
|
|
3096
|
-
} finally {
|
|
3097
|
-
if (callId == state.asyncId) {
|
|
3098
|
-
state.asyncId = parentId;
|
|
3099
|
-
state.asyncTo = parentId ? prevTo : void 0;
|
|
3100
|
-
state.promise = parentId ? prevPromise : void 0;
|
|
3101
|
-
}
|
|
3102
|
-
}
|
|
3103
|
-
if (is.fun(onRest)) {
|
|
3104
|
-
raf.batchedUpdates(() => {
|
|
3105
|
-
onRest(result, target, target.item);
|
|
3106
|
-
});
|
|
3107
|
-
}
|
|
3108
|
-
return result;
|
|
3109
|
-
})();
|
|
3110
|
-
}
|
|
3111
|
-
function stopAsync(state, cancelId) {
|
|
3112
|
-
flush(state.timeouts, (t) => t.cancel());
|
|
3113
|
-
state.pauseQueue.clear();
|
|
3114
|
-
state.resumeQueue.clear();
|
|
3115
|
-
state.asyncId = state.asyncTo = state.promise = void 0;
|
|
3116
|
-
if (cancelId)
|
|
3117
|
-
state.cancelId = cancelId;
|
|
3118
|
-
}
|
|
3119
|
-
class BailSignal extends Error {
|
|
3120
|
-
constructor() {
|
|
3121
|
-
super("An async animation has been interrupted. You see this error because you forgot to use `await` or `.catch(...)` on its returned promise.");
|
|
3122
|
-
this.result = void 0;
|
|
3123
|
-
}
|
|
3124
|
-
}
|
|
3125
|
-
class SkipAniamtionSignal extends Error {
|
|
3126
|
-
constructor() {
|
|
3127
|
-
super("SkipAnimationSignal");
|
|
3128
|
-
this.result = void 0;
|
|
3129
|
-
}
|
|
3130
|
-
}
|
|
3131
|
-
const isFrameValue = (value) => value instanceof FrameValue;
|
|
3132
|
-
let nextId$1 = 1;
|
|
3133
|
-
class FrameValue extends FluidValue {
|
|
3134
|
-
constructor(...args) {
|
|
3135
|
-
super(...args);
|
|
3136
|
-
this.id = nextId$1++;
|
|
3137
|
-
this.key = void 0;
|
|
3138
|
-
this._priority = 0;
|
|
3139
|
-
}
|
|
3140
|
-
get priority() {
|
|
3141
|
-
return this._priority;
|
|
3142
|
-
}
|
|
3143
|
-
set priority(priority2) {
|
|
3144
|
-
if (this._priority != priority2) {
|
|
3145
|
-
this._priority = priority2;
|
|
3146
|
-
this._onPriorityChange(priority2);
|
|
3147
|
-
}
|
|
3148
|
-
}
|
|
3149
|
-
get() {
|
|
3150
|
-
const node = getAnimated(this);
|
|
3151
|
-
return node && node.getValue();
|
|
3152
|
-
}
|
|
3153
|
-
to(...args) {
|
|
3154
|
-
return globals.to(this, args);
|
|
3155
|
-
}
|
|
3156
|
-
interpolate(...args) {
|
|
3157
|
-
deprecateInterpolate();
|
|
3158
|
-
return globals.to(this, args);
|
|
3159
|
-
}
|
|
3160
|
-
toJSON() {
|
|
3161
|
-
return this.get();
|
|
3162
|
-
}
|
|
3163
|
-
observerAdded(count) {
|
|
3164
|
-
if (count == 1)
|
|
3165
|
-
this._attach();
|
|
3166
|
-
}
|
|
3167
|
-
observerRemoved(count) {
|
|
3168
|
-
if (count == 0)
|
|
3169
|
-
this._detach();
|
|
3170
|
-
}
|
|
3171
|
-
_attach() {
|
|
3172
|
-
}
|
|
3173
|
-
_detach() {
|
|
3174
|
-
}
|
|
3175
|
-
_onChange(value, idle = false) {
|
|
3176
|
-
callFluidObservers(this, {
|
|
3177
|
-
type: "change",
|
|
3178
|
-
parent: this,
|
|
3179
|
-
value,
|
|
3180
|
-
idle
|
|
3181
|
-
});
|
|
3182
|
-
}
|
|
3183
|
-
_onPriorityChange(priority2) {
|
|
3184
|
-
if (!this.idle) {
|
|
3185
|
-
frameLoop.sort(this);
|
|
3186
|
-
}
|
|
3187
|
-
callFluidObservers(this, {
|
|
3188
|
-
type: "priority",
|
|
3189
|
-
parent: this,
|
|
3190
|
-
priority: priority2
|
|
3191
|
-
});
|
|
3192
|
-
}
|
|
3193
|
-
}
|
|
3194
|
-
const $P = Symbol.for("SpringPhase");
|
|
3195
|
-
const HAS_ANIMATED = 1;
|
|
3196
|
-
const IS_ANIMATING = 2;
|
|
3197
|
-
const IS_PAUSED = 4;
|
|
3198
|
-
const hasAnimated = (target) => (target[$P] & HAS_ANIMATED) > 0;
|
|
3199
|
-
const isAnimating = (target) => (target[$P] & IS_ANIMATING) > 0;
|
|
3200
|
-
const isPaused = (target) => (target[$P] & IS_PAUSED) > 0;
|
|
3201
|
-
const setActiveBit = (target, active) => active ? target[$P] |= IS_ANIMATING | HAS_ANIMATED : target[$P] &= ~IS_ANIMATING;
|
|
3202
|
-
const setPausedBit = (target, paused) => paused ? target[$P] |= IS_PAUSED : target[$P] &= ~IS_PAUSED;
|
|
3203
|
-
class SpringValue extends FrameValue {
|
|
3204
|
-
constructor(arg1, arg2) {
|
|
3205
|
-
super();
|
|
3206
|
-
this.key = void 0;
|
|
3207
|
-
this.animation = new Animation();
|
|
3208
|
-
this.queue = void 0;
|
|
3209
|
-
this.defaultProps = {};
|
|
3210
|
-
this._state = {
|
|
3211
|
-
paused: false,
|
|
3212
|
-
pauseQueue: new Set(),
|
|
3213
|
-
resumeQueue: new Set(),
|
|
3214
|
-
timeouts: new Set()
|
|
3215
|
-
};
|
|
3216
|
-
this._pendingCalls = new Set();
|
|
3217
|
-
this._lastCallId = 0;
|
|
3218
|
-
this._lastToId = 0;
|
|
3219
|
-
this._memoizedDuration = 0;
|
|
3220
|
-
if (!is.und(arg1) || !is.und(arg2)) {
|
|
3221
|
-
const props = is.obj(arg1) ? _extends({}, arg1) : _extends({}, arg2, {
|
|
3222
|
-
from: arg1
|
|
3223
|
-
});
|
|
3224
|
-
if (is.und(props.default)) {
|
|
3225
|
-
props.default = true;
|
|
3226
|
-
}
|
|
3227
|
-
this.start(props);
|
|
3228
|
-
}
|
|
3229
|
-
}
|
|
3230
|
-
get idle() {
|
|
3231
|
-
return !(isAnimating(this) || this._state.asyncTo) || isPaused(this);
|
|
3232
|
-
}
|
|
3233
|
-
get goal() {
|
|
3234
|
-
return getFluidValue(this.animation.to);
|
|
3235
|
-
}
|
|
3236
|
-
get velocity() {
|
|
3237
|
-
const node = getAnimated(this);
|
|
3238
|
-
return node instanceof AnimatedValue ? node.lastVelocity || 0 : node.getPayload().map((node2) => node2.lastVelocity || 0);
|
|
3239
|
-
}
|
|
3240
|
-
get hasAnimated() {
|
|
3241
|
-
return hasAnimated(this);
|
|
3242
|
-
}
|
|
3243
|
-
get isAnimating() {
|
|
3244
|
-
return isAnimating(this);
|
|
3245
|
-
}
|
|
3246
|
-
get isPaused() {
|
|
3247
|
-
return isPaused(this);
|
|
3248
|
-
}
|
|
3249
|
-
advance(dt) {
|
|
3250
|
-
let idle = true;
|
|
3251
|
-
let changed = false;
|
|
3252
|
-
const anim = this.animation;
|
|
3253
|
-
let {
|
|
3254
|
-
config: config2,
|
|
3255
|
-
toValues
|
|
3256
|
-
} = anim;
|
|
3257
|
-
const payload = getPayload(anim.to);
|
|
3258
|
-
if (!payload && hasFluidValue(anim.to)) {
|
|
3259
|
-
toValues = toArray(getFluidValue(anim.to));
|
|
3260
|
-
}
|
|
3261
|
-
anim.values.forEach((node2, i) => {
|
|
3262
|
-
if (node2.done)
|
|
3263
|
-
return;
|
|
3264
|
-
const to2 = node2.constructor == AnimatedString ? 1 : payload ? payload[i].lastPosition : toValues[i];
|
|
3265
|
-
let finished = anim.immediate;
|
|
3266
|
-
let position = to2;
|
|
3267
|
-
if (!finished) {
|
|
3268
|
-
position = node2.lastPosition;
|
|
3269
|
-
if (config2.tension <= 0) {
|
|
3270
|
-
node2.done = true;
|
|
3271
|
-
return;
|
|
3272
|
-
}
|
|
3273
|
-
let elapsed = node2.elapsedTime += dt;
|
|
3274
|
-
const from = anim.fromValues[i];
|
|
3275
|
-
const v0 = node2.v0 != null ? node2.v0 : node2.v0 = is.arr(config2.velocity) ? config2.velocity[i] : config2.velocity;
|
|
3276
|
-
let velocity;
|
|
3277
|
-
if (!is.und(config2.duration)) {
|
|
3278
|
-
let p = 1;
|
|
3279
|
-
if (config2.duration > 0) {
|
|
3280
|
-
if (this._memoizedDuration !== config2.duration) {
|
|
3281
|
-
this._memoizedDuration = config2.duration;
|
|
3282
|
-
if (node2.durationProgress > 0) {
|
|
3283
|
-
node2.elapsedTime = config2.duration * node2.durationProgress;
|
|
3284
|
-
elapsed = node2.elapsedTime += dt;
|
|
3285
|
-
}
|
|
3286
|
-
}
|
|
3287
|
-
p = (config2.progress || 0) + elapsed / this._memoizedDuration;
|
|
3288
|
-
p = p > 1 ? 1 : p < 0 ? 0 : p;
|
|
3289
|
-
node2.durationProgress = p;
|
|
3290
|
-
}
|
|
3291
|
-
position = from + config2.easing(p) * (to2 - from);
|
|
3292
|
-
velocity = (position - node2.lastPosition) / dt;
|
|
3293
|
-
finished = p == 1;
|
|
3294
|
-
} else if (config2.decay) {
|
|
3295
|
-
const decay = config2.decay === true ? 0.998 : config2.decay;
|
|
3296
|
-
const e = Math.exp(-(1 - decay) * elapsed);
|
|
3297
|
-
position = from + v0 / (1 - decay) * (1 - e);
|
|
3298
|
-
finished = Math.abs(node2.lastPosition - position) < 0.1;
|
|
3299
|
-
velocity = v0 * e;
|
|
3300
|
-
} else {
|
|
3301
|
-
velocity = node2.lastVelocity == null ? v0 : node2.lastVelocity;
|
|
3302
|
-
const precision = config2.precision || (from == to2 ? 5e-3 : Math.min(1, Math.abs(to2 - from) * 1e-3));
|
|
3303
|
-
const restVelocity = config2.restVelocity || precision / 10;
|
|
3304
|
-
const bounceFactor = config2.clamp ? 0 : config2.bounce;
|
|
3305
|
-
const canBounce = !is.und(bounceFactor);
|
|
3306
|
-
const isGrowing = from == to2 ? node2.v0 > 0 : from < to2;
|
|
3307
|
-
let isMoving;
|
|
3308
|
-
let isBouncing = false;
|
|
3309
|
-
const step = 1;
|
|
3310
|
-
const numSteps = Math.ceil(dt / step);
|
|
3311
|
-
for (let n = 0; n < numSteps; ++n) {
|
|
3312
|
-
isMoving = Math.abs(velocity) > restVelocity;
|
|
3313
|
-
if (!isMoving) {
|
|
3314
|
-
finished = Math.abs(to2 - position) <= precision;
|
|
3315
|
-
if (finished) {
|
|
3316
|
-
break;
|
|
3317
|
-
}
|
|
3318
|
-
}
|
|
3319
|
-
if (canBounce) {
|
|
3320
|
-
isBouncing = position == to2 || position > to2 == isGrowing;
|
|
3321
|
-
if (isBouncing) {
|
|
3322
|
-
velocity = -velocity * bounceFactor;
|
|
3323
|
-
position = to2;
|
|
3324
|
-
}
|
|
3325
|
-
}
|
|
3326
|
-
const springForce = -config2.tension * 1e-6 * (position - to2);
|
|
3327
|
-
const dampingForce = -config2.friction * 1e-3 * velocity;
|
|
3328
|
-
const acceleration = (springForce + dampingForce) / config2.mass;
|
|
3329
|
-
velocity = velocity + acceleration * step;
|
|
3330
|
-
position = position + velocity * step;
|
|
3331
|
-
}
|
|
3332
|
-
}
|
|
3333
|
-
node2.lastVelocity = velocity;
|
|
3334
|
-
if (Number.isNaN(position)) {
|
|
3335
|
-
console.warn(`Got NaN while animating:`, this);
|
|
3336
|
-
finished = true;
|
|
3337
|
-
}
|
|
3338
|
-
}
|
|
3339
|
-
if (payload && !payload[i].done) {
|
|
3340
|
-
finished = false;
|
|
3341
|
-
}
|
|
3342
|
-
if (finished) {
|
|
3343
|
-
node2.done = true;
|
|
3344
|
-
} else {
|
|
3345
|
-
idle = false;
|
|
3346
|
-
}
|
|
3347
|
-
if (node2.setValue(position, config2.round)) {
|
|
3348
|
-
changed = true;
|
|
3349
|
-
}
|
|
3350
|
-
});
|
|
3351
|
-
const node = getAnimated(this);
|
|
3352
|
-
const currVal = node.getValue();
|
|
3353
|
-
if (idle) {
|
|
3354
|
-
const finalVal = getFluidValue(anim.to);
|
|
3355
|
-
if ((currVal !== finalVal || changed) && !config2.decay) {
|
|
3356
|
-
node.setValue(finalVal);
|
|
3357
|
-
this._onChange(finalVal);
|
|
3358
|
-
} else if (changed && config2.decay) {
|
|
3359
|
-
this._onChange(currVal);
|
|
3360
|
-
}
|
|
3361
|
-
this._stop();
|
|
3362
|
-
} else if (changed) {
|
|
3363
|
-
this._onChange(currVal);
|
|
3364
|
-
}
|
|
3365
|
-
}
|
|
3366
|
-
set(value) {
|
|
3367
|
-
raf.batchedUpdates(() => {
|
|
3368
|
-
this._stop();
|
|
3369
|
-
this._focus(value);
|
|
3370
|
-
this._set(value);
|
|
3371
|
-
});
|
|
3372
|
-
return this;
|
|
3373
|
-
}
|
|
3374
|
-
pause() {
|
|
3375
|
-
this._update({
|
|
3376
|
-
pause: true
|
|
3377
|
-
});
|
|
3378
|
-
}
|
|
3379
|
-
resume() {
|
|
3380
|
-
this._update({
|
|
3381
|
-
pause: false
|
|
3382
|
-
});
|
|
3383
|
-
}
|
|
3384
|
-
finish() {
|
|
3385
|
-
if (isAnimating(this)) {
|
|
3386
|
-
const {
|
|
3387
|
-
to: to2,
|
|
3388
|
-
config: config2
|
|
3389
|
-
} = this.animation;
|
|
3390
|
-
raf.batchedUpdates(() => {
|
|
3391
|
-
this._onStart();
|
|
3392
|
-
if (!config2.decay) {
|
|
3393
|
-
this._set(to2, false);
|
|
3394
|
-
}
|
|
3395
|
-
this._stop();
|
|
3396
|
-
});
|
|
3397
|
-
}
|
|
3398
|
-
return this;
|
|
3399
|
-
}
|
|
3400
|
-
update(props) {
|
|
3401
|
-
const queue = this.queue || (this.queue = []);
|
|
3402
|
-
queue.push(props);
|
|
3403
|
-
return this;
|
|
3404
|
-
}
|
|
3405
|
-
start(to2, arg2) {
|
|
3406
|
-
let queue;
|
|
3407
|
-
if (!is.und(to2)) {
|
|
3408
|
-
queue = [is.obj(to2) ? to2 : _extends({}, arg2, {
|
|
3409
|
-
to: to2
|
|
3410
|
-
})];
|
|
3411
|
-
} else {
|
|
3412
|
-
queue = this.queue || [];
|
|
3413
|
-
this.queue = [];
|
|
3414
|
-
}
|
|
3415
|
-
return Promise.all(queue.map((props) => this._update(props))).then((results) => getCombinedResult(this, results));
|
|
3416
|
-
}
|
|
3417
|
-
stop(cancel) {
|
|
3418
|
-
const {
|
|
3419
|
-
to: to2
|
|
3420
|
-
} = this.animation;
|
|
3421
|
-
this._focus(this.get());
|
|
3422
|
-
stopAsync(this._state, cancel && this._lastCallId);
|
|
3423
|
-
raf.batchedUpdates(() => this._stop(to2, cancel));
|
|
3424
|
-
return this;
|
|
3425
|
-
}
|
|
3426
|
-
reset() {
|
|
3427
|
-
this._update({
|
|
3428
|
-
reset: true
|
|
3429
|
-
});
|
|
3430
|
-
}
|
|
3431
|
-
eventObserved(event) {
|
|
3432
|
-
if (event.type == "change") {
|
|
3433
|
-
this._start();
|
|
3434
|
-
} else if (event.type == "priority") {
|
|
3435
|
-
this.priority = event.priority + 1;
|
|
3436
|
-
}
|
|
3437
|
-
}
|
|
3438
|
-
_prepareNode(props) {
|
|
3439
|
-
const key = this.key || "";
|
|
3440
|
-
let {
|
|
3441
|
-
to: to2,
|
|
3442
|
-
from
|
|
3443
|
-
} = props;
|
|
3444
|
-
to2 = is.obj(to2) ? to2[key] : to2;
|
|
3445
|
-
if (to2 == null || isAsyncTo(to2)) {
|
|
3446
|
-
to2 = void 0;
|
|
3447
|
-
}
|
|
3448
|
-
from = is.obj(from) ? from[key] : from;
|
|
3449
|
-
if (from == null) {
|
|
3450
|
-
from = void 0;
|
|
3451
|
-
}
|
|
3452
|
-
const range = {
|
|
3453
|
-
to: to2,
|
|
3454
|
-
from
|
|
3455
|
-
};
|
|
3456
|
-
if (!hasAnimated(this)) {
|
|
3457
|
-
if (props.reverse)
|
|
3458
|
-
[to2, from] = [from, to2];
|
|
3459
|
-
from = getFluidValue(from);
|
|
3460
|
-
if (!is.und(from)) {
|
|
3461
|
-
this._set(from);
|
|
3462
|
-
} else if (!getAnimated(this)) {
|
|
3463
|
-
this._set(to2);
|
|
3464
|
-
}
|
|
3465
|
-
}
|
|
3466
|
-
return range;
|
|
3467
|
-
}
|
|
3468
|
-
_update(_ref, isLoop) {
|
|
3469
|
-
let props = _extends({}, _ref);
|
|
3470
|
-
const {
|
|
3471
|
-
key,
|
|
3472
|
-
defaultProps
|
|
3473
|
-
} = this;
|
|
3474
|
-
if (props.default)
|
|
3475
|
-
Object.assign(defaultProps, getDefaultProps(props, (value, prop) => /^on/.test(prop) ? resolveProp(value, key) : value));
|
|
3476
|
-
mergeActiveFn(this, props, "onProps");
|
|
3477
|
-
sendEvent(this, "onProps", props, this);
|
|
3478
|
-
const range = this._prepareNode(props);
|
|
3479
|
-
if (Object.isFrozen(this)) {
|
|
3480
|
-
throw Error("Cannot animate a `SpringValue` object that is frozen. Did you forget to pass your component to `animated(...)` before animating its props?");
|
|
3481
|
-
}
|
|
3482
|
-
const state = this._state;
|
|
3483
|
-
return scheduleProps(++this._lastCallId, {
|
|
3484
|
-
key,
|
|
3485
|
-
props,
|
|
3486
|
-
defaultProps,
|
|
3487
|
-
state,
|
|
3488
|
-
actions: {
|
|
3489
|
-
pause: () => {
|
|
3490
|
-
if (!isPaused(this)) {
|
|
3491
|
-
setPausedBit(this, true);
|
|
3492
|
-
flushCalls(state.pauseQueue);
|
|
3493
|
-
sendEvent(this, "onPause", getFinishedResult(this, checkFinished(this, this.animation.to)), this);
|
|
3494
|
-
}
|
|
3495
|
-
},
|
|
3496
|
-
resume: () => {
|
|
3497
|
-
if (isPaused(this)) {
|
|
3498
|
-
setPausedBit(this, false);
|
|
3499
|
-
if (isAnimating(this)) {
|
|
3500
|
-
this._resume();
|
|
3501
|
-
}
|
|
3502
|
-
flushCalls(state.resumeQueue);
|
|
3503
|
-
sendEvent(this, "onResume", getFinishedResult(this, checkFinished(this, this.animation.to)), this);
|
|
3504
|
-
}
|
|
3505
|
-
},
|
|
3506
|
-
start: this._merge.bind(this, range)
|
|
3507
|
-
}
|
|
3508
|
-
}).then((result) => {
|
|
3509
|
-
if (props.loop && result.finished && !(isLoop && result.noop)) {
|
|
3510
|
-
const nextProps = createLoopUpdate(props);
|
|
3511
|
-
if (nextProps) {
|
|
3512
|
-
return this._update(nextProps, true);
|
|
3513
|
-
}
|
|
3514
|
-
}
|
|
3515
|
-
return result;
|
|
3516
|
-
});
|
|
3517
|
-
}
|
|
3518
|
-
_merge(range, props, resolve) {
|
|
3519
|
-
if (props.cancel) {
|
|
3520
|
-
this.stop(true);
|
|
3521
|
-
return resolve(getCancelledResult(this));
|
|
3522
|
-
}
|
|
3523
|
-
const hasToProp = !is.und(range.to);
|
|
3524
|
-
const hasFromProp = !is.und(range.from);
|
|
3525
|
-
if (hasToProp || hasFromProp) {
|
|
3526
|
-
if (props.callId > this._lastToId) {
|
|
3527
|
-
this._lastToId = props.callId;
|
|
3528
|
-
} else {
|
|
3529
|
-
return resolve(getCancelledResult(this));
|
|
3530
|
-
}
|
|
3531
|
-
}
|
|
3532
|
-
const {
|
|
3533
|
-
key,
|
|
3534
|
-
defaultProps,
|
|
3535
|
-
animation: anim
|
|
3536
|
-
} = this;
|
|
3537
|
-
const {
|
|
3538
|
-
to: prevTo,
|
|
3539
|
-
from: prevFrom
|
|
3540
|
-
} = anim;
|
|
3541
|
-
let {
|
|
3542
|
-
to: to2 = prevTo,
|
|
3543
|
-
from = prevFrom
|
|
3544
|
-
} = range;
|
|
3545
|
-
if (hasFromProp && !hasToProp && (!props.default || is.und(to2))) {
|
|
3546
|
-
to2 = from;
|
|
3547
|
-
}
|
|
3548
|
-
if (props.reverse)
|
|
3549
|
-
[to2, from] = [from, to2];
|
|
3550
|
-
const hasFromChanged = !isEqual(from, prevFrom);
|
|
3551
|
-
if (hasFromChanged) {
|
|
3552
|
-
anim.from = from;
|
|
3553
|
-
}
|
|
3554
|
-
from = getFluidValue(from);
|
|
3555
|
-
const hasToChanged = !isEqual(to2, prevTo);
|
|
3556
|
-
if (hasToChanged) {
|
|
3557
|
-
this._focus(to2);
|
|
3558
|
-
}
|
|
3559
|
-
const hasAsyncTo = isAsyncTo(props.to);
|
|
3560
|
-
const {
|
|
3561
|
-
config: config2
|
|
3562
|
-
} = anim;
|
|
3563
|
-
const {
|
|
3564
|
-
decay,
|
|
3565
|
-
velocity
|
|
3566
|
-
} = config2;
|
|
3567
|
-
if (hasToProp || hasFromProp) {
|
|
3568
|
-
config2.velocity = 0;
|
|
3569
|
-
}
|
|
3570
|
-
if (props.config && !hasAsyncTo) {
|
|
3571
|
-
mergeConfig(config2, callProp(props.config, key), props.config !== defaultProps.config ? callProp(defaultProps.config, key) : void 0);
|
|
3572
|
-
}
|
|
3573
|
-
let node = getAnimated(this);
|
|
3574
|
-
if (!node || is.und(to2)) {
|
|
3575
|
-
return resolve(getFinishedResult(this, true));
|
|
3576
|
-
}
|
|
3577
|
-
const reset = is.und(props.reset) ? hasFromProp && !props.default : !is.und(from) && matchProp(props.reset, key);
|
|
3578
|
-
const value = reset ? from : this.get();
|
|
3579
|
-
const goal = computeGoal(to2);
|
|
3580
|
-
const isAnimatable = is.num(goal) || is.arr(goal) || isAnimatedString(goal);
|
|
3581
|
-
const immediate = !hasAsyncTo && (!isAnimatable || matchProp(defaultProps.immediate || props.immediate, key));
|
|
3582
|
-
if (hasToChanged) {
|
|
3583
|
-
const nodeType = getAnimatedType(to2);
|
|
3584
|
-
if (nodeType !== node.constructor) {
|
|
3585
|
-
if (immediate) {
|
|
3586
|
-
node = this._set(goal);
|
|
3587
|
-
} else
|
|
3588
|
-
throw Error(`Cannot animate between ${node.constructor.name} and ${nodeType.name}, as the "to" prop suggests`);
|
|
3589
|
-
}
|
|
3590
|
-
}
|
|
3591
|
-
const goalType = node.constructor;
|
|
3592
|
-
let started = hasFluidValue(to2);
|
|
3593
|
-
let finished = false;
|
|
3594
|
-
if (!started) {
|
|
3595
|
-
const hasValueChanged = reset || !hasAnimated(this) && hasFromChanged;
|
|
3596
|
-
if (hasToChanged || hasValueChanged) {
|
|
3597
|
-
finished = isEqual(computeGoal(value), goal);
|
|
3598
|
-
started = !finished;
|
|
3599
|
-
}
|
|
3600
|
-
if (!isEqual(anim.immediate, immediate) && !immediate || !isEqual(config2.decay, decay) || !isEqual(config2.velocity, velocity)) {
|
|
3601
|
-
started = true;
|
|
3602
|
-
}
|
|
3603
|
-
}
|
|
3604
|
-
if (finished && isAnimating(this)) {
|
|
3605
|
-
if (anim.changed && !reset) {
|
|
3606
|
-
started = true;
|
|
3607
|
-
} else if (!started) {
|
|
3608
|
-
this._stop(prevTo);
|
|
3609
|
-
}
|
|
3610
|
-
}
|
|
3611
|
-
if (!hasAsyncTo) {
|
|
3612
|
-
if (started || hasFluidValue(prevTo)) {
|
|
3613
|
-
anim.values = node.getPayload();
|
|
3614
|
-
anim.toValues = hasFluidValue(to2) ? null : goalType == AnimatedString ? [1] : toArray(goal);
|
|
3615
|
-
}
|
|
3616
|
-
if (anim.immediate != immediate) {
|
|
3617
|
-
anim.immediate = immediate;
|
|
3618
|
-
if (!immediate && !reset) {
|
|
3619
|
-
this._set(prevTo);
|
|
3620
|
-
}
|
|
3621
|
-
}
|
|
3622
|
-
if (started) {
|
|
3623
|
-
const {
|
|
3624
|
-
onRest
|
|
3625
|
-
} = anim;
|
|
3626
|
-
each(ACTIVE_EVENTS, (type) => mergeActiveFn(this, props, type));
|
|
3627
|
-
const result = getFinishedResult(this, checkFinished(this, prevTo));
|
|
3628
|
-
flushCalls(this._pendingCalls, result);
|
|
3629
|
-
this._pendingCalls.add(resolve);
|
|
3630
|
-
if (anim.changed)
|
|
3631
|
-
raf.batchedUpdates(() => {
|
|
3632
|
-
anim.changed = !reset;
|
|
3633
|
-
onRest == null ? void 0 : onRest(result, this);
|
|
3634
|
-
if (reset) {
|
|
3635
|
-
callProp(defaultProps.onRest, result);
|
|
3636
|
-
} else {
|
|
3637
|
-
anim.onStart == null ? void 0 : anim.onStart(result, this);
|
|
3638
|
-
}
|
|
3639
|
-
});
|
|
3640
|
-
}
|
|
3641
|
-
}
|
|
3642
|
-
if (reset) {
|
|
3643
|
-
this._set(value);
|
|
3644
|
-
}
|
|
3645
|
-
if (hasAsyncTo) {
|
|
3646
|
-
resolve(runAsync(props.to, props, this._state, this));
|
|
3647
|
-
} else if (started) {
|
|
3648
|
-
this._start();
|
|
3649
|
-
} else if (isAnimating(this) && !hasToChanged) {
|
|
3650
|
-
this._pendingCalls.add(resolve);
|
|
3651
|
-
} else {
|
|
3652
|
-
resolve(getNoopResult(value));
|
|
3653
|
-
}
|
|
3654
|
-
}
|
|
3655
|
-
_focus(value) {
|
|
3656
|
-
const anim = this.animation;
|
|
3657
|
-
if (value !== anim.to) {
|
|
3658
|
-
if (getFluidObservers(this)) {
|
|
3659
|
-
this._detach();
|
|
3660
|
-
}
|
|
3661
|
-
anim.to = value;
|
|
3662
|
-
if (getFluidObservers(this)) {
|
|
3663
|
-
this._attach();
|
|
3664
|
-
}
|
|
3665
|
-
}
|
|
3666
|
-
}
|
|
3667
|
-
_attach() {
|
|
3668
|
-
let priority2 = 0;
|
|
3669
|
-
const {
|
|
3670
|
-
to: to2
|
|
3671
|
-
} = this.animation;
|
|
3672
|
-
if (hasFluidValue(to2)) {
|
|
3673
|
-
addFluidObserver(to2, this);
|
|
3674
|
-
if (isFrameValue(to2)) {
|
|
3675
|
-
priority2 = to2.priority + 1;
|
|
3676
|
-
}
|
|
3677
|
-
}
|
|
3678
|
-
this.priority = priority2;
|
|
3679
|
-
}
|
|
3680
|
-
_detach() {
|
|
3681
|
-
const {
|
|
3682
|
-
to: to2
|
|
3683
|
-
} = this.animation;
|
|
3684
|
-
if (hasFluidValue(to2)) {
|
|
3685
|
-
removeFluidObserver(to2, this);
|
|
3686
|
-
}
|
|
3687
|
-
}
|
|
3688
|
-
_set(arg, idle = true) {
|
|
3689
|
-
const value = getFluidValue(arg);
|
|
3690
|
-
if (!is.und(value)) {
|
|
3691
|
-
const oldNode = getAnimated(this);
|
|
3692
|
-
if (!oldNode || !isEqual(value, oldNode.getValue())) {
|
|
3693
|
-
const nodeType = getAnimatedType(value);
|
|
3694
|
-
if (!oldNode || oldNode.constructor != nodeType) {
|
|
3695
|
-
setAnimated(this, nodeType.create(value));
|
|
3696
|
-
} else {
|
|
3697
|
-
oldNode.setValue(value);
|
|
3698
|
-
}
|
|
3699
|
-
if (oldNode) {
|
|
3700
|
-
raf.batchedUpdates(() => {
|
|
3701
|
-
this._onChange(value, idle);
|
|
3702
|
-
});
|
|
3703
|
-
}
|
|
3704
|
-
}
|
|
3705
|
-
}
|
|
3706
|
-
return getAnimated(this);
|
|
3707
|
-
}
|
|
3708
|
-
_onStart() {
|
|
3709
|
-
const anim = this.animation;
|
|
3710
|
-
if (!anim.changed) {
|
|
3711
|
-
anim.changed = true;
|
|
3712
|
-
sendEvent(this, "onStart", getFinishedResult(this, checkFinished(this, anim.to)), this);
|
|
3713
|
-
}
|
|
3714
|
-
}
|
|
3715
|
-
_onChange(value, idle) {
|
|
3716
|
-
if (!idle) {
|
|
3717
|
-
this._onStart();
|
|
3718
|
-
callProp(this.animation.onChange, value, this);
|
|
3719
|
-
}
|
|
3720
|
-
callProp(this.defaultProps.onChange, value, this);
|
|
3721
|
-
super._onChange(value, idle);
|
|
3722
|
-
}
|
|
3723
|
-
_start() {
|
|
3724
|
-
const anim = this.animation;
|
|
3725
|
-
getAnimated(this).reset(getFluidValue(anim.to));
|
|
3726
|
-
if (!anim.immediate) {
|
|
3727
|
-
anim.fromValues = anim.values.map((node) => node.lastPosition);
|
|
3728
|
-
}
|
|
3729
|
-
if (!isAnimating(this)) {
|
|
3730
|
-
setActiveBit(this, true);
|
|
3731
|
-
if (!isPaused(this)) {
|
|
3732
|
-
this._resume();
|
|
3733
|
-
}
|
|
3734
|
-
}
|
|
3735
|
-
}
|
|
3736
|
-
_resume() {
|
|
3737
|
-
if (globals.skipAnimation) {
|
|
3738
|
-
this.finish();
|
|
3739
|
-
} else {
|
|
3740
|
-
frameLoop.start(this);
|
|
3741
|
-
}
|
|
3742
|
-
}
|
|
3743
|
-
_stop(goal, cancel) {
|
|
3744
|
-
if (isAnimating(this)) {
|
|
3745
|
-
setActiveBit(this, false);
|
|
3746
|
-
const anim = this.animation;
|
|
3747
|
-
each(anim.values, (node) => {
|
|
3748
|
-
node.done = true;
|
|
3749
|
-
});
|
|
3750
|
-
if (anim.toValues) {
|
|
3751
|
-
anim.onChange = anim.onPause = anim.onResume = void 0;
|
|
3752
|
-
}
|
|
3753
|
-
callFluidObservers(this, {
|
|
3754
|
-
type: "idle",
|
|
3755
|
-
parent: this
|
|
3756
|
-
});
|
|
3757
|
-
const result = cancel ? getCancelledResult(this.get()) : getFinishedResult(this.get(), checkFinished(this, goal != null ? goal : anim.to));
|
|
3758
|
-
flushCalls(this._pendingCalls, result);
|
|
3759
|
-
if (anim.changed) {
|
|
3760
|
-
anim.changed = false;
|
|
3761
|
-
sendEvent(this, "onRest", result, this);
|
|
3762
|
-
}
|
|
3763
|
-
}
|
|
3764
|
-
}
|
|
3765
|
-
}
|
|
3766
|
-
function checkFinished(target, to2) {
|
|
3767
|
-
const goal = computeGoal(to2);
|
|
3768
|
-
const value = computeGoal(target.get());
|
|
3769
|
-
return isEqual(value, goal);
|
|
3770
|
-
}
|
|
3771
|
-
function createLoopUpdate(props, loop2 = props.loop, to2 = props.to) {
|
|
3772
|
-
let loopRet = callProp(loop2);
|
|
3773
|
-
if (loopRet) {
|
|
3774
|
-
const overrides = loopRet !== true && inferTo(loopRet);
|
|
3775
|
-
const reverse = (overrides || props).reverse;
|
|
3776
|
-
const reset = !overrides || overrides.reset;
|
|
3777
|
-
return createUpdate(_extends({}, props, {
|
|
3778
|
-
loop: loop2,
|
|
3779
|
-
default: false,
|
|
3780
|
-
pause: void 0,
|
|
3781
|
-
to: !reverse || isAsyncTo(to2) ? to2 : void 0,
|
|
3782
|
-
from: reset ? props.from : void 0,
|
|
3783
|
-
reset
|
|
3784
|
-
}, overrides));
|
|
3785
|
-
}
|
|
3786
|
-
}
|
|
3787
|
-
function createUpdate(props) {
|
|
3788
|
-
const {
|
|
3789
|
-
to: to2,
|
|
3790
|
-
from
|
|
3791
|
-
} = props = inferTo(props);
|
|
3792
|
-
const keys = new Set();
|
|
3793
|
-
if (is.obj(to2))
|
|
3794
|
-
findDefined(to2, keys);
|
|
3795
|
-
if (is.obj(from))
|
|
3796
|
-
findDefined(from, keys);
|
|
3797
|
-
props.keys = keys.size ? Array.from(keys) : null;
|
|
3798
|
-
return props;
|
|
3799
|
-
}
|
|
3800
|
-
function declareUpdate(props) {
|
|
3801
|
-
const update2 = createUpdate(props);
|
|
3802
|
-
if (is.und(update2.default)) {
|
|
3803
|
-
update2.default = getDefaultProps(update2);
|
|
3804
|
-
}
|
|
3805
|
-
return update2;
|
|
3806
|
-
}
|
|
3807
|
-
function findDefined(values, keys) {
|
|
3808
|
-
eachProp(values, (value, key) => value != null && keys.add(key));
|
|
3809
|
-
}
|
|
3810
|
-
const ACTIVE_EVENTS = ["onStart", "onRest", "onChange", "onPause", "onResume"];
|
|
3811
|
-
function mergeActiveFn(target, props, type) {
|
|
3812
|
-
target.animation[type] = props[type] !== getDefaultProp(props, type) ? resolveProp(props[type], target.key) : void 0;
|
|
3813
|
-
}
|
|
3814
|
-
function sendEvent(target, type, ...args) {
|
|
3815
|
-
var _target$animation$typ, _target$animation, _target$defaultProps$, _target$defaultProps;
|
|
3816
|
-
(_target$animation$typ = (_target$animation = target.animation)[type]) == null ? void 0 : _target$animation$typ.call(_target$animation, ...args);
|
|
3817
|
-
(_target$defaultProps$ = (_target$defaultProps = target.defaultProps)[type]) == null ? void 0 : _target$defaultProps$.call(_target$defaultProps, ...args);
|
|
3818
|
-
}
|
|
3819
|
-
const BATCHED_EVENTS = ["onStart", "onChange", "onRest"];
|
|
3820
|
-
let nextId = 1;
|
|
3821
|
-
class Controller {
|
|
3822
|
-
constructor(props, flush2) {
|
|
3823
|
-
this.id = nextId++;
|
|
3824
|
-
this.springs = {};
|
|
3825
|
-
this.queue = [];
|
|
3826
|
-
this.ref = void 0;
|
|
3827
|
-
this._flush = void 0;
|
|
3828
|
-
this._initialProps = void 0;
|
|
3829
|
-
this._lastAsyncId = 0;
|
|
3830
|
-
this._active = new Set();
|
|
3831
|
-
this._changed = new Set();
|
|
3832
|
-
this._started = false;
|
|
3833
|
-
this._item = void 0;
|
|
3834
|
-
this._state = {
|
|
3835
|
-
paused: false,
|
|
3836
|
-
pauseQueue: new Set(),
|
|
3837
|
-
resumeQueue: new Set(),
|
|
3838
|
-
timeouts: new Set()
|
|
3839
|
-
};
|
|
3840
|
-
this._events = {
|
|
3841
|
-
onStart: new Map(),
|
|
3842
|
-
onChange: new Map(),
|
|
3843
|
-
onRest: new Map()
|
|
3844
|
-
};
|
|
3845
|
-
this._onFrame = this._onFrame.bind(this);
|
|
3846
|
-
if (flush2) {
|
|
3847
|
-
this._flush = flush2;
|
|
3848
|
-
}
|
|
3849
|
-
if (props) {
|
|
3850
|
-
this.start(_extends({
|
|
3851
|
-
default: true
|
|
3852
|
-
}, props));
|
|
3853
|
-
}
|
|
3854
|
-
}
|
|
3855
|
-
get idle() {
|
|
3856
|
-
return !this._state.asyncTo && Object.values(this.springs).every((spring) => spring.idle);
|
|
3857
|
-
}
|
|
3858
|
-
get item() {
|
|
3859
|
-
return this._item;
|
|
3860
|
-
}
|
|
3861
|
-
set item(item) {
|
|
3862
|
-
this._item = item;
|
|
3863
|
-
}
|
|
3864
|
-
get() {
|
|
3865
|
-
const values = {};
|
|
3866
|
-
this.each((spring, key) => values[key] = spring.get());
|
|
3867
|
-
return values;
|
|
3868
|
-
}
|
|
3869
|
-
set(values) {
|
|
3870
|
-
for (const key in values) {
|
|
3871
|
-
const value = values[key];
|
|
3872
|
-
if (!is.und(value)) {
|
|
3873
|
-
this.springs[key].set(value);
|
|
3874
|
-
}
|
|
3875
|
-
}
|
|
3876
|
-
}
|
|
3877
|
-
update(props) {
|
|
3878
|
-
if (props) {
|
|
3879
|
-
this.queue.push(createUpdate(props));
|
|
3880
|
-
}
|
|
3881
|
-
return this;
|
|
3882
|
-
}
|
|
3883
|
-
start(props) {
|
|
3884
|
-
let {
|
|
3885
|
-
queue
|
|
3886
|
-
} = this;
|
|
3887
|
-
if (props) {
|
|
3888
|
-
queue = toArray(props).map(createUpdate);
|
|
3889
|
-
} else {
|
|
3890
|
-
this.queue = [];
|
|
3891
|
-
}
|
|
3892
|
-
if (this._flush) {
|
|
3893
|
-
return this._flush(this, queue);
|
|
3894
|
-
}
|
|
3895
|
-
prepareKeys(this, queue);
|
|
3896
|
-
return flushUpdateQueue(this, queue);
|
|
3897
|
-
}
|
|
3898
|
-
stop(arg, keys) {
|
|
3899
|
-
if (arg !== !!arg) {
|
|
3900
|
-
keys = arg;
|
|
3901
|
-
}
|
|
3902
|
-
if (keys) {
|
|
3903
|
-
const springs = this.springs;
|
|
3904
|
-
each(toArray(keys), (key) => springs[key].stop(!!arg));
|
|
3905
|
-
} else {
|
|
3906
|
-
stopAsync(this._state, this._lastAsyncId);
|
|
3907
|
-
this.each((spring) => spring.stop(!!arg));
|
|
3908
|
-
}
|
|
3909
|
-
return this;
|
|
3910
|
-
}
|
|
3911
|
-
pause(keys) {
|
|
3912
|
-
if (is.und(keys)) {
|
|
3913
|
-
this.start({
|
|
3914
|
-
pause: true
|
|
3915
|
-
});
|
|
3916
|
-
} else {
|
|
3917
|
-
const springs = this.springs;
|
|
3918
|
-
each(toArray(keys), (key) => springs[key].pause());
|
|
3919
|
-
}
|
|
3920
|
-
return this;
|
|
3921
|
-
}
|
|
3922
|
-
resume(keys) {
|
|
3923
|
-
if (is.und(keys)) {
|
|
3924
|
-
this.start({
|
|
3925
|
-
pause: false
|
|
3926
|
-
});
|
|
3927
|
-
} else {
|
|
3928
|
-
const springs = this.springs;
|
|
3929
|
-
each(toArray(keys), (key) => springs[key].resume());
|
|
3930
|
-
}
|
|
3931
|
-
return this;
|
|
3932
|
-
}
|
|
3933
|
-
each(iterator) {
|
|
3934
|
-
eachProp(this.springs, iterator);
|
|
3935
|
-
}
|
|
3936
|
-
_onFrame() {
|
|
3937
|
-
const {
|
|
3938
|
-
onStart,
|
|
3939
|
-
onChange,
|
|
3940
|
-
onRest
|
|
3941
|
-
} = this._events;
|
|
3942
|
-
const active = this._active.size > 0;
|
|
3943
|
-
const changed = this._changed.size > 0;
|
|
3944
|
-
if (active && !this._started || changed && !this._started) {
|
|
3945
|
-
this._started = true;
|
|
3946
|
-
flush(onStart, ([onStart2, result]) => {
|
|
3947
|
-
result.value = this.get();
|
|
3948
|
-
onStart2(result, this, this._item);
|
|
3949
|
-
});
|
|
3950
|
-
}
|
|
3951
|
-
const idle = !active && this._started;
|
|
3952
|
-
const values = changed || idle && onRest.size ? this.get() : null;
|
|
3953
|
-
if (changed && onChange.size) {
|
|
3954
|
-
flush(onChange, ([onChange2, result]) => {
|
|
3955
|
-
result.value = values;
|
|
3956
|
-
onChange2(result, this, this._item);
|
|
3957
|
-
});
|
|
3958
|
-
}
|
|
3959
|
-
if (idle) {
|
|
3960
|
-
this._started = false;
|
|
3961
|
-
flush(onRest, ([onRest2, result]) => {
|
|
3962
|
-
result.value = values;
|
|
3963
|
-
onRest2(result, this, this._item);
|
|
3964
|
-
});
|
|
3965
|
-
}
|
|
3966
|
-
}
|
|
3967
|
-
eventObserved(event) {
|
|
3968
|
-
if (event.type == "change") {
|
|
3969
|
-
this._changed.add(event.parent);
|
|
3970
|
-
if (!event.idle) {
|
|
3971
|
-
this._active.add(event.parent);
|
|
3972
|
-
}
|
|
3973
|
-
} else if (event.type == "idle") {
|
|
3974
|
-
this._active.delete(event.parent);
|
|
3975
|
-
} else
|
|
3976
|
-
return;
|
|
3977
|
-
raf.onFrame(this._onFrame);
|
|
3978
|
-
}
|
|
3979
|
-
}
|
|
3980
|
-
function flushUpdateQueue(ctrl, queue) {
|
|
3981
|
-
return Promise.all(queue.map((props) => flushUpdate(ctrl, props))).then((results) => getCombinedResult(ctrl, results));
|
|
3982
|
-
}
|
|
3983
|
-
async function flushUpdate(ctrl, props, isLoop) {
|
|
3984
|
-
const {
|
|
3985
|
-
keys,
|
|
3986
|
-
to: to2,
|
|
3987
|
-
from,
|
|
3988
|
-
loop: loop2,
|
|
3989
|
-
onRest,
|
|
3990
|
-
onResolve
|
|
3991
|
-
} = props;
|
|
3992
|
-
const defaults2 = is.obj(props.default) && props.default;
|
|
3993
|
-
if (loop2) {
|
|
3994
|
-
props.loop = false;
|
|
3995
|
-
}
|
|
3996
|
-
if (to2 === false)
|
|
3997
|
-
props.to = null;
|
|
3998
|
-
if (from === false)
|
|
3999
|
-
props.from = null;
|
|
4000
|
-
const asyncTo = is.arr(to2) || is.fun(to2) ? to2 : void 0;
|
|
4001
|
-
if (asyncTo) {
|
|
4002
|
-
props.to = void 0;
|
|
4003
|
-
props.onRest = void 0;
|
|
4004
|
-
if (defaults2) {
|
|
4005
|
-
defaults2.onRest = void 0;
|
|
4006
|
-
}
|
|
4007
|
-
} else {
|
|
4008
|
-
each(BATCHED_EVENTS, (key) => {
|
|
4009
|
-
const handler = props[key];
|
|
4010
|
-
if (is.fun(handler)) {
|
|
4011
|
-
const queue = ctrl["_events"][key];
|
|
4012
|
-
props[key] = ({
|
|
4013
|
-
finished,
|
|
4014
|
-
cancelled
|
|
4015
|
-
}) => {
|
|
4016
|
-
const result2 = queue.get(handler);
|
|
4017
|
-
if (result2) {
|
|
4018
|
-
if (!finished)
|
|
4019
|
-
result2.finished = false;
|
|
4020
|
-
if (cancelled)
|
|
4021
|
-
result2.cancelled = true;
|
|
4022
|
-
} else {
|
|
4023
|
-
queue.set(handler, {
|
|
4024
|
-
value: null,
|
|
4025
|
-
finished: finished || false,
|
|
4026
|
-
cancelled: cancelled || false
|
|
4027
|
-
});
|
|
4028
|
-
}
|
|
4029
|
-
};
|
|
4030
|
-
if (defaults2) {
|
|
4031
|
-
defaults2[key] = props[key];
|
|
4032
|
-
}
|
|
4033
|
-
}
|
|
4034
|
-
});
|
|
4035
|
-
}
|
|
4036
|
-
const state = ctrl["_state"];
|
|
4037
|
-
if (props.pause === !state.paused) {
|
|
4038
|
-
state.paused = props.pause;
|
|
4039
|
-
flushCalls(props.pause ? state.pauseQueue : state.resumeQueue);
|
|
4040
|
-
} else if (state.paused) {
|
|
4041
|
-
props.pause = true;
|
|
4042
|
-
}
|
|
4043
|
-
const promises = (keys || Object.keys(ctrl.springs)).map((key) => ctrl.springs[key].start(props));
|
|
4044
|
-
const cancel = props.cancel === true || getDefaultProp(props, "cancel") === true;
|
|
4045
|
-
if (asyncTo || cancel && state.asyncId) {
|
|
4046
|
-
promises.push(scheduleProps(++ctrl["_lastAsyncId"], {
|
|
4047
|
-
props,
|
|
4048
|
-
state,
|
|
4049
|
-
actions: {
|
|
4050
|
-
pause: noop,
|
|
4051
|
-
resume: noop,
|
|
4052
|
-
start(props2, resolve) {
|
|
4053
|
-
if (cancel) {
|
|
4054
|
-
stopAsync(state, ctrl["_lastAsyncId"]);
|
|
4055
|
-
resolve(getCancelledResult(ctrl));
|
|
4056
|
-
} else {
|
|
4057
|
-
props2.onRest = onRest;
|
|
4058
|
-
resolve(runAsync(asyncTo, props2, state, ctrl));
|
|
4059
|
-
}
|
|
4060
|
-
}
|
|
4061
|
-
}
|
|
4062
|
-
}));
|
|
4063
|
-
}
|
|
4064
|
-
if (state.paused) {
|
|
4065
|
-
await new Promise((resume) => {
|
|
4066
|
-
state.resumeQueue.add(resume);
|
|
4067
|
-
});
|
|
4068
|
-
}
|
|
4069
|
-
const result = getCombinedResult(ctrl, await Promise.all(promises));
|
|
4070
|
-
if (loop2 && result.finished && !(isLoop && result.noop)) {
|
|
4071
|
-
const nextProps = createLoopUpdate(props, loop2, to2);
|
|
4072
|
-
if (nextProps) {
|
|
4073
|
-
prepareKeys(ctrl, [nextProps]);
|
|
4074
|
-
return flushUpdate(ctrl, nextProps, true);
|
|
4075
|
-
}
|
|
4076
|
-
}
|
|
4077
|
-
if (onResolve) {
|
|
4078
|
-
raf.batchedUpdates(() => onResolve(result, ctrl, ctrl.item));
|
|
4079
|
-
}
|
|
4080
|
-
return result;
|
|
4081
|
-
}
|
|
4082
|
-
function getSprings(ctrl, props) {
|
|
4083
|
-
const springs = _extends({}, ctrl.springs);
|
|
4084
|
-
if (props) {
|
|
4085
|
-
each(toArray(props), (props2) => {
|
|
4086
|
-
if (is.und(props2.keys)) {
|
|
4087
|
-
props2 = createUpdate(props2);
|
|
4088
|
-
}
|
|
4089
|
-
if (!is.obj(props2.to)) {
|
|
4090
|
-
props2 = _extends({}, props2, {
|
|
4091
|
-
to: void 0
|
|
4092
|
-
});
|
|
4093
|
-
}
|
|
4094
|
-
prepareSprings(springs, props2, (key) => {
|
|
4095
|
-
return createSpring(key);
|
|
4096
|
-
});
|
|
4097
|
-
});
|
|
4098
|
-
}
|
|
4099
|
-
setSprings(ctrl, springs);
|
|
4100
|
-
return springs;
|
|
4101
|
-
}
|
|
4102
|
-
function setSprings(ctrl, springs) {
|
|
4103
|
-
eachProp(springs, (spring, key) => {
|
|
4104
|
-
if (!ctrl.springs[key]) {
|
|
4105
|
-
ctrl.springs[key] = spring;
|
|
4106
|
-
addFluidObserver(spring, ctrl);
|
|
4107
|
-
}
|
|
4108
|
-
});
|
|
4109
|
-
}
|
|
4110
|
-
function createSpring(key, observer) {
|
|
4111
|
-
const spring = new SpringValue();
|
|
4112
|
-
spring.key = key;
|
|
4113
|
-
if (observer) {
|
|
4114
|
-
addFluidObserver(spring, observer);
|
|
4115
|
-
}
|
|
4116
|
-
return spring;
|
|
4117
|
-
}
|
|
4118
|
-
function prepareSprings(springs, props, create) {
|
|
4119
|
-
if (props.keys) {
|
|
4120
|
-
each(props.keys, (key) => {
|
|
4121
|
-
const spring = springs[key] || (springs[key] = create(key));
|
|
4122
|
-
spring["_prepareNode"](props);
|
|
4123
|
-
});
|
|
4124
|
-
}
|
|
4125
|
-
}
|
|
4126
|
-
function prepareKeys(ctrl, queue) {
|
|
4127
|
-
each(queue, (props) => {
|
|
4128
|
-
prepareSprings(ctrl.springs, props, (key) => {
|
|
4129
|
-
return createSpring(key, ctrl);
|
|
4130
|
-
});
|
|
4131
|
-
});
|
|
4132
|
-
}
|
|
4133
|
-
function _objectWithoutPropertiesLoose$1(source, excluded) {
|
|
4134
|
-
if (source == null)
|
|
4135
|
-
return {};
|
|
4136
|
-
var target = {};
|
|
4137
|
-
var sourceKeys = Object.keys(source);
|
|
4138
|
-
var key, i;
|
|
4139
|
-
for (i = 0; i < sourceKeys.length; i++) {
|
|
4140
|
-
key = sourceKeys[i];
|
|
4141
|
-
if (excluded.indexOf(key) >= 0)
|
|
4142
|
-
continue;
|
|
4143
|
-
target[key] = source[key];
|
|
4144
|
-
}
|
|
4145
|
-
return target;
|
|
4146
|
-
}
|
|
4147
|
-
const _excluded$3 = ["children"];
|
|
4148
|
-
const SpringContext = (_ref) => {
|
|
4149
|
-
let {
|
|
4150
|
-
children
|
|
4151
|
-
} = _ref, props = _objectWithoutPropertiesLoose$1(_ref, _excluded$3);
|
|
4152
|
-
const inherited = useContext(ctx);
|
|
4153
|
-
const pause = props.pause || !!inherited.pause, immediate = props.immediate || !!inherited.immediate;
|
|
4154
|
-
props = useMemoOne(() => ({
|
|
4155
|
-
pause,
|
|
4156
|
-
immediate
|
|
4157
|
-
}), [pause, immediate]);
|
|
4158
|
-
const {
|
|
4159
|
-
Provider
|
|
4160
|
-
} = ctx;
|
|
4161
|
-
return React.createElement(Provider, {
|
|
4162
|
-
value: props
|
|
4163
|
-
}, children);
|
|
4164
|
-
};
|
|
4165
|
-
const ctx = makeContext(SpringContext, {});
|
|
4166
|
-
SpringContext.Provider = ctx.Provider;
|
|
4167
|
-
SpringContext.Consumer = ctx.Consumer;
|
|
4168
|
-
function makeContext(target, init) {
|
|
4169
|
-
Object.assign(target, React.createContext(init));
|
|
4170
|
-
target.Provider._context = target;
|
|
4171
|
-
target.Consumer._context = target;
|
|
4172
|
-
return target;
|
|
4173
|
-
}
|
|
4174
|
-
const SpringRef = () => {
|
|
4175
|
-
const current = [];
|
|
4176
|
-
const SpringRef2 = function SpringRef3(props) {
|
|
4177
|
-
deprecateDirectCall();
|
|
4178
|
-
const results = [];
|
|
4179
|
-
each(current, (ctrl, i) => {
|
|
4180
|
-
if (is.und(props)) {
|
|
4181
|
-
results.push(ctrl.start());
|
|
4182
|
-
} else {
|
|
4183
|
-
const update2 = _getProps(props, ctrl, i);
|
|
4184
|
-
if (update2) {
|
|
4185
|
-
results.push(ctrl.start(update2));
|
|
4186
|
-
}
|
|
4187
|
-
}
|
|
4188
|
-
});
|
|
4189
|
-
return results;
|
|
4190
|
-
};
|
|
4191
|
-
SpringRef2.current = current;
|
|
4192
|
-
SpringRef2.add = function(ctrl) {
|
|
4193
|
-
if (!current.includes(ctrl)) {
|
|
4194
|
-
current.push(ctrl);
|
|
4195
|
-
}
|
|
4196
|
-
};
|
|
4197
|
-
SpringRef2.delete = function(ctrl) {
|
|
4198
|
-
const i = current.indexOf(ctrl);
|
|
4199
|
-
if (~i)
|
|
4200
|
-
current.splice(i, 1);
|
|
4201
|
-
};
|
|
4202
|
-
SpringRef2.pause = function() {
|
|
4203
|
-
each(current, (ctrl) => ctrl.pause(...arguments));
|
|
4204
|
-
return this;
|
|
4205
|
-
};
|
|
4206
|
-
SpringRef2.resume = function() {
|
|
4207
|
-
each(current, (ctrl) => ctrl.resume(...arguments));
|
|
4208
|
-
return this;
|
|
4209
|
-
};
|
|
4210
|
-
SpringRef2.set = function(values) {
|
|
4211
|
-
each(current, (ctrl) => ctrl.set(values));
|
|
4212
|
-
};
|
|
4213
|
-
SpringRef2.start = function(props) {
|
|
4214
|
-
const results = [];
|
|
4215
|
-
each(current, (ctrl, i) => {
|
|
4216
|
-
if (is.und(props)) {
|
|
4217
|
-
results.push(ctrl.start());
|
|
4218
|
-
} else {
|
|
4219
|
-
const update2 = this._getProps(props, ctrl, i);
|
|
4220
|
-
if (update2) {
|
|
4221
|
-
results.push(ctrl.start(update2));
|
|
4222
|
-
}
|
|
4223
|
-
}
|
|
4224
|
-
});
|
|
4225
|
-
return results;
|
|
4226
|
-
};
|
|
4227
|
-
SpringRef2.stop = function() {
|
|
4228
|
-
each(current, (ctrl) => ctrl.stop(...arguments));
|
|
4229
|
-
return this;
|
|
4230
|
-
};
|
|
4231
|
-
SpringRef2.update = function(props) {
|
|
4232
|
-
each(current, (ctrl, i) => ctrl.update(this._getProps(props, ctrl, i)));
|
|
4233
|
-
return this;
|
|
4234
|
-
};
|
|
4235
|
-
const _getProps = function _getProps2(arg, ctrl, index2) {
|
|
4236
|
-
return is.fun(arg) ? arg(index2, ctrl) : arg;
|
|
4237
|
-
};
|
|
4238
|
-
SpringRef2._getProps = _getProps;
|
|
4239
|
-
return SpringRef2;
|
|
4240
|
-
};
|
|
4241
|
-
function useSprings(length, props, deps) {
|
|
4242
|
-
const propsFn = is.fun(props) && props;
|
|
4243
|
-
if (propsFn && !deps)
|
|
4244
|
-
deps = [];
|
|
4245
|
-
const ref = useMemo(() => propsFn || arguments.length == 3 ? SpringRef() : void 0, []);
|
|
4246
|
-
const layoutId = useRef(0);
|
|
4247
|
-
const forceUpdate = useForceUpdate();
|
|
4248
|
-
const state = useMemo(() => ({
|
|
4249
|
-
ctrls: [],
|
|
4250
|
-
queue: [],
|
|
4251
|
-
flush(ctrl, updates2) {
|
|
4252
|
-
const springs2 = getSprings(ctrl, updates2);
|
|
4253
|
-
const canFlushSync = layoutId.current > 0 && !state.queue.length && !Object.keys(springs2).some((key) => !ctrl.springs[key]);
|
|
4254
|
-
return canFlushSync ? flushUpdateQueue(ctrl, updates2) : new Promise((resolve) => {
|
|
4255
|
-
setSprings(ctrl, springs2);
|
|
4256
|
-
state.queue.push(() => {
|
|
4257
|
-
resolve(flushUpdateQueue(ctrl, updates2));
|
|
4258
|
-
});
|
|
4259
|
-
forceUpdate();
|
|
4260
|
-
});
|
|
4261
|
-
}
|
|
4262
|
-
}), []);
|
|
4263
|
-
const ctrls = useRef([...state.ctrls]);
|
|
4264
|
-
const updates = [];
|
|
4265
|
-
const prevLength = usePrev(length) || 0;
|
|
4266
|
-
useMemo(() => {
|
|
4267
|
-
each(ctrls.current.slice(length, prevLength), (ctrl) => {
|
|
4268
|
-
detachRefs(ctrl, ref);
|
|
4269
|
-
ctrl.stop(true);
|
|
4270
|
-
});
|
|
4271
|
-
ctrls.current.length = length;
|
|
4272
|
-
declareUpdates(prevLength, length);
|
|
4273
|
-
}, [length]);
|
|
4274
|
-
useMemo(() => {
|
|
4275
|
-
declareUpdates(0, Math.min(prevLength, length));
|
|
4276
|
-
}, deps);
|
|
4277
|
-
function declareUpdates(startIndex, endIndex) {
|
|
4278
|
-
for (let i = startIndex; i < endIndex; i++) {
|
|
4279
|
-
const ctrl = ctrls.current[i] || (ctrls.current[i] = new Controller(null, state.flush));
|
|
4280
|
-
const update2 = propsFn ? propsFn(i, ctrl) : props[i];
|
|
4281
|
-
if (update2) {
|
|
4282
|
-
updates[i] = declareUpdate(update2);
|
|
4283
|
-
}
|
|
4284
|
-
}
|
|
4285
|
-
}
|
|
4286
|
-
const springs = ctrls.current.map((ctrl, i) => getSprings(ctrl, updates[i]));
|
|
4287
|
-
const context = useContext(SpringContext);
|
|
4288
|
-
const prevContext = usePrev(context);
|
|
4289
|
-
const hasContext = context !== prevContext && hasProps(context);
|
|
4290
|
-
useLayoutEffect(() => {
|
|
4291
|
-
layoutId.current++;
|
|
4292
|
-
state.ctrls = ctrls.current;
|
|
4293
|
-
const {
|
|
4294
|
-
queue
|
|
4295
|
-
} = state;
|
|
4296
|
-
if (queue.length) {
|
|
4297
|
-
state.queue = [];
|
|
4298
|
-
each(queue, (cb) => cb());
|
|
4299
|
-
}
|
|
4300
|
-
each(ctrls.current, (ctrl, i) => {
|
|
4301
|
-
ref == null ? void 0 : ref.add(ctrl);
|
|
4302
|
-
if (hasContext) {
|
|
4303
|
-
ctrl.start({
|
|
4304
|
-
default: context
|
|
4305
|
-
});
|
|
4306
|
-
}
|
|
4307
|
-
const update2 = updates[i];
|
|
4308
|
-
if (update2) {
|
|
4309
|
-
replaceRef(ctrl, update2.ref);
|
|
4310
|
-
if (ctrl.ref) {
|
|
4311
|
-
ctrl.queue.push(update2);
|
|
4312
|
-
} else {
|
|
4313
|
-
ctrl.start(update2);
|
|
4314
|
-
}
|
|
4315
|
-
}
|
|
4316
|
-
});
|
|
4317
|
-
});
|
|
4318
|
-
useOnce(() => () => {
|
|
4319
|
-
each(state.ctrls, (ctrl) => ctrl.stop(true));
|
|
4320
|
-
});
|
|
4321
|
-
const values = springs.map((x) => _extends({}, x));
|
|
4322
|
-
return ref ? [values, ref] : values;
|
|
4323
|
-
}
|
|
4324
|
-
function useSpring(props, deps) {
|
|
4325
|
-
const isFn = is.fun(props);
|
|
4326
|
-
const [[values], ref] = useSprings(1, isFn ? props : [props], isFn ? deps || [] : deps);
|
|
4327
|
-
return isFn || arguments.length == 2 ? [values, ref] : values;
|
|
4328
|
-
}
|
|
4329
|
-
let TransitionPhase;
|
|
4330
|
-
(function(TransitionPhase2) {
|
|
4331
|
-
TransitionPhase2["MOUNT"] = "mount";
|
|
4332
|
-
TransitionPhase2["ENTER"] = "enter";
|
|
4333
|
-
TransitionPhase2["UPDATE"] = "update";
|
|
4334
|
-
TransitionPhase2["LEAVE"] = "leave";
|
|
4335
|
-
})(TransitionPhase || (TransitionPhase = {}));
|
|
4336
|
-
class Interpolation extends FrameValue {
|
|
4337
|
-
constructor(source, args) {
|
|
4338
|
-
super();
|
|
4339
|
-
this.key = void 0;
|
|
4340
|
-
this.idle = true;
|
|
4341
|
-
this.calc = void 0;
|
|
4342
|
-
this._active = new Set();
|
|
4343
|
-
this.source = source;
|
|
4344
|
-
this.calc = createInterpolator(...args);
|
|
4345
|
-
const value = this._get();
|
|
4346
|
-
const nodeType = getAnimatedType(value);
|
|
4347
|
-
setAnimated(this, nodeType.create(value));
|
|
4348
|
-
}
|
|
4349
|
-
advance(_dt) {
|
|
4350
|
-
const value = this._get();
|
|
4351
|
-
const oldValue = this.get();
|
|
4352
|
-
if (!isEqual(value, oldValue)) {
|
|
4353
|
-
getAnimated(this).setValue(value);
|
|
4354
|
-
this._onChange(value, this.idle);
|
|
4355
|
-
}
|
|
4356
|
-
if (!this.idle && checkIdle(this._active)) {
|
|
4357
|
-
becomeIdle(this);
|
|
4358
|
-
}
|
|
4359
|
-
}
|
|
4360
|
-
_get() {
|
|
4361
|
-
const inputs = is.arr(this.source) ? this.source.map(getFluidValue) : toArray(getFluidValue(this.source));
|
|
4362
|
-
return this.calc(...inputs);
|
|
4363
|
-
}
|
|
4364
|
-
_start() {
|
|
4365
|
-
if (this.idle && !checkIdle(this._active)) {
|
|
4366
|
-
this.idle = false;
|
|
4367
|
-
each(getPayload(this), (node) => {
|
|
4368
|
-
node.done = false;
|
|
4369
|
-
});
|
|
4370
|
-
if (globals.skipAnimation) {
|
|
4371
|
-
raf.batchedUpdates(() => this.advance());
|
|
4372
|
-
becomeIdle(this);
|
|
4373
|
-
} else {
|
|
4374
|
-
frameLoop.start(this);
|
|
4375
|
-
}
|
|
4376
|
-
}
|
|
4377
|
-
}
|
|
4378
|
-
_attach() {
|
|
4379
|
-
let priority2 = 1;
|
|
4380
|
-
each(toArray(this.source), (source) => {
|
|
4381
|
-
if (hasFluidValue(source)) {
|
|
4382
|
-
addFluidObserver(source, this);
|
|
4383
|
-
}
|
|
4384
|
-
if (isFrameValue(source)) {
|
|
4385
|
-
if (!source.idle) {
|
|
4386
|
-
this._active.add(source);
|
|
4387
|
-
}
|
|
4388
|
-
priority2 = Math.max(priority2, source.priority + 1);
|
|
4389
|
-
}
|
|
4390
|
-
});
|
|
4391
|
-
this.priority = priority2;
|
|
4392
|
-
this._start();
|
|
4393
|
-
}
|
|
4394
|
-
_detach() {
|
|
4395
|
-
each(toArray(this.source), (source) => {
|
|
4396
|
-
if (hasFluidValue(source)) {
|
|
4397
|
-
removeFluidObserver(source, this);
|
|
4398
|
-
}
|
|
4399
|
-
});
|
|
4400
|
-
this._active.clear();
|
|
4401
|
-
becomeIdle(this);
|
|
4402
|
-
}
|
|
4403
|
-
eventObserved(event) {
|
|
4404
|
-
if (event.type == "change") {
|
|
4405
|
-
if (event.idle) {
|
|
4406
|
-
this.advance();
|
|
4407
|
-
} else {
|
|
4408
|
-
this._active.add(event.parent);
|
|
4409
|
-
this._start();
|
|
4410
|
-
}
|
|
4411
|
-
} else if (event.type == "idle") {
|
|
4412
|
-
this._active.delete(event.parent);
|
|
4413
|
-
} else if (event.type == "priority") {
|
|
4414
|
-
this.priority = toArray(this.source).reduce((highest, parent) => Math.max(highest, (isFrameValue(parent) ? parent.priority : 0) + 1), 0);
|
|
4415
|
-
}
|
|
4416
|
-
}
|
|
4417
|
-
}
|
|
4418
|
-
function isIdle(source) {
|
|
4419
|
-
return source.idle !== false;
|
|
4420
|
-
}
|
|
4421
|
-
function checkIdle(active) {
|
|
4422
|
-
return !active.size || Array.from(active).every(isIdle);
|
|
4423
|
-
}
|
|
4424
|
-
function becomeIdle(self) {
|
|
4425
|
-
if (!self.idle) {
|
|
4426
|
-
self.idle = true;
|
|
4427
|
-
each(getPayload(self), (node) => {
|
|
4428
|
-
node.done = true;
|
|
4429
|
-
});
|
|
4430
|
-
callFluidObservers(self, {
|
|
4431
|
-
type: "idle",
|
|
4432
|
-
parent: self
|
|
4433
|
-
});
|
|
4434
|
-
}
|
|
4435
|
-
}
|
|
4436
|
-
globals.assign({
|
|
4437
|
-
createStringInterpolator,
|
|
4438
|
-
to: (source, args) => new Interpolation(source, args)
|
|
4439
|
-
});
|
|
4440
|
-
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
4441
|
-
if (source == null)
|
|
4442
|
-
return {};
|
|
4443
|
-
var target = {};
|
|
4444
|
-
var sourceKeys = Object.keys(source);
|
|
4445
|
-
var key, i;
|
|
4446
|
-
for (i = 0; i < sourceKeys.length; i++) {
|
|
4447
|
-
key = sourceKeys[i];
|
|
4448
|
-
if (excluded.indexOf(key) >= 0)
|
|
4449
|
-
continue;
|
|
4450
|
-
target[key] = source[key];
|
|
4451
|
-
}
|
|
4452
|
-
return target;
|
|
4453
|
-
}
|
|
4454
|
-
const _excluded$2 = ["style", "children", "scrollTop", "scrollLeft"];
|
|
4455
|
-
const isCustomPropRE = /^--/;
|
|
4456
|
-
function dangerousStyleValue(name, value) {
|
|
4457
|
-
if (value == null || typeof value === "boolean" || value === "")
|
|
4458
|
-
return "";
|
|
4459
|
-
if (typeof value === "number" && value !== 0 && !isCustomPropRE.test(name) && !(isUnitlessNumber.hasOwnProperty(name) && isUnitlessNumber[name]))
|
|
4460
|
-
return value + "px";
|
|
4461
|
-
return ("" + value).trim();
|
|
4462
|
-
}
|
|
4463
|
-
const attributeCache = {};
|
|
4464
|
-
function applyAnimatedValues(instance, props) {
|
|
4465
|
-
if (!instance.nodeType || !instance.setAttribute) {
|
|
4466
|
-
return false;
|
|
4467
|
-
}
|
|
4468
|
-
const isFilterElement = instance.nodeName === "filter" || instance.parentNode && instance.parentNode.nodeName === "filter";
|
|
4469
|
-
const _ref = props, {
|
|
4470
|
-
style,
|
|
4471
|
-
children,
|
|
4472
|
-
scrollTop,
|
|
4473
|
-
scrollLeft
|
|
4474
|
-
} = _ref, attributes = _objectWithoutPropertiesLoose(_ref, _excluded$2);
|
|
4475
|
-
const values = Object.values(attributes);
|
|
4476
|
-
const names = Object.keys(attributes).map((name) => isFilterElement || instance.hasAttribute(name) ? name : attributeCache[name] || (attributeCache[name] = name.replace(/([A-Z])/g, (n) => "-" + n.toLowerCase())));
|
|
4477
|
-
if (children !== void 0) {
|
|
4478
|
-
instance.textContent = children;
|
|
4479
|
-
}
|
|
4480
|
-
for (let name in style) {
|
|
4481
|
-
if (style.hasOwnProperty(name)) {
|
|
4482
|
-
const value = dangerousStyleValue(name, style[name]);
|
|
4483
|
-
if (isCustomPropRE.test(name)) {
|
|
4484
|
-
instance.style.setProperty(name, value);
|
|
4485
|
-
} else {
|
|
4486
|
-
instance.style[name] = value;
|
|
4487
|
-
}
|
|
4488
|
-
}
|
|
4489
|
-
}
|
|
4490
|
-
names.forEach((name, i) => {
|
|
4491
|
-
instance.setAttribute(name, values[i]);
|
|
4492
|
-
});
|
|
4493
|
-
if (scrollTop !== void 0) {
|
|
4494
|
-
instance.scrollTop = scrollTop;
|
|
4495
|
-
}
|
|
4496
|
-
if (scrollLeft !== void 0) {
|
|
4497
|
-
instance.scrollLeft = scrollLeft;
|
|
4498
|
-
}
|
|
4499
|
-
}
|
|
4500
|
-
let isUnitlessNumber = {
|
|
4501
|
-
animationIterationCount: true,
|
|
4502
|
-
borderImageOutset: true,
|
|
4503
|
-
borderImageSlice: true,
|
|
4504
|
-
borderImageWidth: true,
|
|
4505
|
-
boxFlex: true,
|
|
4506
|
-
boxFlexGroup: true,
|
|
4507
|
-
boxOrdinalGroup: true,
|
|
4508
|
-
columnCount: true,
|
|
4509
|
-
columns: true,
|
|
4510
|
-
flex: true,
|
|
4511
|
-
flexGrow: true,
|
|
4512
|
-
flexPositive: true,
|
|
4513
|
-
flexShrink: true,
|
|
4514
|
-
flexNegative: true,
|
|
4515
|
-
flexOrder: true,
|
|
4516
|
-
gridRow: true,
|
|
4517
|
-
gridRowEnd: true,
|
|
4518
|
-
gridRowSpan: true,
|
|
4519
|
-
gridRowStart: true,
|
|
4520
|
-
gridColumn: true,
|
|
4521
|
-
gridColumnEnd: true,
|
|
4522
|
-
gridColumnSpan: true,
|
|
4523
|
-
gridColumnStart: true,
|
|
4524
|
-
fontWeight: true,
|
|
4525
|
-
lineClamp: true,
|
|
4526
|
-
lineHeight: true,
|
|
4527
|
-
opacity: true,
|
|
4528
|
-
order: true,
|
|
4529
|
-
orphans: true,
|
|
4530
|
-
tabSize: true,
|
|
4531
|
-
widows: true,
|
|
4532
|
-
zIndex: true,
|
|
4533
|
-
zoom: true,
|
|
4534
|
-
fillOpacity: true,
|
|
4535
|
-
floodOpacity: true,
|
|
4536
|
-
stopOpacity: true,
|
|
4537
|
-
strokeDasharray: true,
|
|
4538
|
-
strokeDashoffset: true,
|
|
4539
|
-
strokeMiterlimit: true,
|
|
4540
|
-
strokeOpacity: true,
|
|
4541
|
-
strokeWidth: true
|
|
4542
|
-
};
|
|
4543
|
-
const prefixKey = (prefix2, key) => prefix2 + key.charAt(0).toUpperCase() + key.substring(1);
|
|
4544
|
-
const prefixes = ["Webkit", "Ms", "Moz", "O"];
|
|
4545
|
-
isUnitlessNumber = Object.keys(isUnitlessNumber).reduce((acc, prop) => {
|
|
4546
|
-
prefixes.forEach((prefix2) => acc[prefixKey(prefix2, prop)] = acc[prop]);
|
|
4547
|
-
return acc;
|
|
4548
|
-
}, isUnitlessNumber);
|
|
4549
|
-
const _excluded$1 = ["x", "y", "z"];
|
|
4550
|
-
const domTransforms = /^(matrix|translate|scale|rotate|skew)/;
|
|
4551
|
-
const pxTransforms = /^(translate)/;
|
|
4552
|
-
const degTransforms = /^(rotate|skew)/;
|
|
4553
|
-
const addUnit = (value, unit) => is.num(value) && value !== 0 ? value + unit : value;
|
|
4554
|
-
const isValueIdentity = (value, id) => is.arr(value) ? value.every((v) => isValueIdentity(v, id)) : is.num(value) ? value === id : parseFloat(value) === id;
|
|
4555
|
-
class AnimatedStyle extends AnimatedObject {
|
|
4556
|
-
constructor(_ref) {
|
|
4557
|
-
let {
|
|
4558
|
-
x,
|
|
4559
|
-
y,
|
|
4560
|
-
z
|
|
4561
|
-
} = _ref, style = _objectWithoutPropertiesLoose(_ref, _excluded$1);
|
|
4562
|
-
const inputs = [];
|
|
4563
|
-
const transforms = [];
|
|
4564
|
-
if (x || y || z) {
|
|
4565
|
-
inputs.push([x || 0, y || 0, z || 0]);
|
|
4566
|
-
transforms.push((xyz) => [`translate3d(${xyz.map((v) => addUnit(v, "px")).join(",")})`, isValueIdentity(xyz, 0)]);
|
|
4567
|
-
}
|
|
4568
|
-
eachProp(style, (value, key) => {
|
|
4569
|
-
if (key === "transform") {
|
|
4570
|
-
inputs.push([value || ""]);
|
|
4571
|
-
transforms.push((transform) => [transform, transform === ""]);
|
|
4572
|
-
} else if (domTransforms.test(key)) {
|
|
4573
|
-
delete style[key];
|
|
4574
|
-
if (is.und(value))
|
|
4575
|
-
return;
|
|
4576
|
-
const unit = pxTransforms.test(key) ? "px" : degTransforms.test(key) ? "deg" : "";
|
|
4577
|
-
inputs.push(toArray(value));
|
|
4578
|
-
transforms.push(key === "rotate3d" ? ([x2, y2, z2, deg]) => [`rotate3d(${x2},${y2},${z2},${addUnit(deg, unit)})`, isValueIdentity(deg, 0)] : (input) => [`${key}(${input.map((v) => addUnit(v, unit)).join(",")})`, isValueIdentity(input, key.startsWith("scale") ? 1 : 0)]);
|
|
4579
|
-
}
|
|
4580
|
-
});
|
|
4581
|
-
if (inputs.length) {
|
|
4582
|
-
style.transform = new FluidTransform(inputs, transforms);
|
|
4583
|
-
}
|
|
4584
|
-
super(style);
|
|
4585
|
-
}
|
|
4586
|
-
}
|
|
4587
|
-
class FluidTransform extends FluidValue {
|
|
4588
|
-
constructor(inputs, transforms) {
|
|
4589
|
-
super();
|
|
4590
|
-
this._value = null;
|
|
4591
|
-
this.inputs = inputs;
|
|
4592
|
-
this.transforms = transforms;
|
|
4593
|
-
}
|
|
4594
|
-
get() {
|
|
4595
|
-
return this._value || (this._value = this._get());
|
|
4596
|
-
}
|
|
4597
|
-
_get() {
|
|
4598
|
-
let transform = "";
|
|
4599
|
-
let identity = true;
|
|
4600
|
-
each(this.inputs, (input, i) => {
|
|
4601
|
-
const arg1 = getFluidValue(input[0]);
|
|
4602
|
-
const [t, id] = this.transforms[i](is.arr(arg1) ? arg1 : input.map(getFluidValue));
|
|
4603
|
-
transform += " " + t;
|
|
4604
|
-
identity = identity && id;
|
|
4605
|
-
});
|
|
4606
|
-
return identity ? "none" : transform;
|
|
4607
|
-
}
|
|
4608
|
-
observerAdded(count) {
|
|
4609
|
-
if (count == 1)
|
|
4610
|
-
each(this.inputs, (input) => each(input, (value) => hasFluidValue(value) && addFluidObserver(value, this)));
|
|
4611
|
-
}
|
|
4612
|
-
observerRemoved(count) {
|
|
4613
|
-
if (count == 0)
|
|
4614
|
-
each(this.inputs, (input) => each(input, (value) => hasFluidValue(value) && removeFluidObserver(value, this)));
|
|
4615
|
-
}
|
|
4616
|
-
eventObserved(event) {
|
|
4617
|
-
if (event.type == "change") {
|
|
4618
|
-
this._value = null;
|
|
4619
|
-
}
|
|
4620
|
-
callFluidObservers(this, event);
|
|
4621
|
-
}
|
|
4622
|
-
}
|
|
4623
|
-
const primitives = ["a", "abbr", "address", "area", "article", "aside", "audio", "b", "base", "bdi", "bdo", "big", "blockquote", "body", "br", "button", "canvas", "caption", "cite", "code", "col", "colgroup", "data", "datalist", "dd", "del", "details", "dfn", "dialog", "div", "dl", "dt", "em", "embed", "fieldset", "figcaption", "figure", "footer", "form", "h1", "h2", "h3", "h4", "h5", "h6", "head", "header", "hgroup", "hr", "html", "i", "iframe", "img", "input", "ins", "kbd", "keygen", "label", "legend", "li", "link", "main", "map", "mark", "menu", "menuitem", "meta", "meter", "nav", "noscript", "object", "ol", "optgroup", "option", "output", "p", "param", "picture", "pre", "progress", "q", "rp", "rt", "ruby", "s", "samp", "script", "section", "select", "small", "source", "span", "strong", "style", "sub", "summary", "sup", "table", "tbody", "td", "textarea", "tfoot", "th", "thead", "time", "title", "tr", "track", "u", "ul", "var", "video", "wbr", "circle", "clipPath", "defs", "ellipse", "foreignObject", "g", "image", "line", "linearGradient", "mask", "path", "pattern", "polygon", "polyline", "radialGradient", "rect", "stop", "svg", "text", "tspan"];
|
|
4624
|
-
const _excluded = ["scrollTop", "scrollLeft"];
|
|
4625
|
-
globals.assign({
|
|
4626
|
-
batchedUpdates: unstable_batchedUpdates,
|
|
4627
|
-
createStringInterpolator,
|
|
4628
|
-
colors
|
|
4629
|
-
});
|
|
4630
|
-
const host = createHost(primitives, {
|
|
4631
|
-
applyAnimatedValues,
|
|
4632
|
-
createAnimatedStyle: (style) => new AnimatedStyle(style),
|
|
4633
|
-
getComponentProps: (_ref) => {
|
|
4634
|
-
let props = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
4635
|
-
return props;
|
|
4636
|
-
}
|
|
4637
|
-
});
|
|
4638
|
-
const animated = host.animated;
|
|
4639
1561
|
function PdaActionSheet(props) {
|
|
4640
|
-
const { className, visible, actions } = props;
|
|
4641
|
-
|
|
4642
|
-
|
|
4643
|
-
|
|
4644
|
-
|
|
4645
|
-
config: {
|
|
4646
|
-
precision: 0.1,
|
|
4647
|
-
mass: 0.4,
|
|
4648
|
-
tension: 300,
|
|
4649
|
-
friction: 30
|
|
4650
|
-
},
|
|
4651
|
-
onStart: () => {
|
|
4652
|
-
setActive(true);
|
|
4653
|
-
},
|
|
4654
|
-
onRest: () => {
|
|
4655
|
-
setActive(props.visible);
|
|
4656
|
-
}
|
|
4657
|
-
});
|
|
4658
|
-
return /* @__PURE__ */ React__default.createElement("div", {
|
|
4659
|
-
className: classNames({ [className]: true, "pda-action-sheet": true }),
|
|
4660
|
-
style: { display: active ? "unset" : "none" }
|
|
4661
|
-
}, /* @__PURE__ */ React__default.createElement(animated.div, {
|
|
4662
|
-
className: "pda-action-sheet-body",
|
|
4663
|
-
style: {
|
|
4664
|
-
transform: percent.to((v) => {
|
|
4665
|
-
return `translate(0, ${v}%)`;
|
|
4666
|
-
})
|
|
4667
|
-
},
|
|
4668
|
-
ref
|
|
1562
|
+
const { className = "", visible, actions } = props;
|
|
1563
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
1564
|
+
className: classNames({ [className]: true, "pda-action-sheet": true, "show": visible })
|
|
1565
|
+
}, /* @__PURE__ */ React.createElement("div", {
|
|
1566
|
+
className: "pda-action-sheet-body"
|
|
4669
1567
|
}, actions.map((item, index2) => {
|
|
4670
|
-
return /* @__PURE__ */
|
|
1568
|
+
return /* @__PURE__ */ React.createElement("div", {
|
|
4671
1569
|
onClick: () => {
|
|
4672
1570
|
item.onClick(item.key);
|
|
4673
1571
|
},
|
|
@@ -4676,4 +1574,5 @@ function PdaActionSheet(props) {
|
|
|
4676
1574
|
}, item.title);
|
|
4677
1575
|
})));
|
|
4678
1576
|
}
|
|
4679
|
-
|
|
1577
|
+
const ListItem = PdaListItem;
|
|
1578
|
+
export { PdaActionSheet as ActionSheet, BaseLayout, Button, Confirm$1 as Confirm, PdaDistanceCard as DistanceCard, PdaFinishCard as FinishCard, index$i as Header, InfiniteScroll, PdaInfoCard$2 as InfoCard, List, ListItem, Overlay, index$b as PageFlowSystemPages, Presentation, PdaInfoCard as Steps, SubCard, PdaListItem as TaskCard, PdaTitle as Title, Confirm as Toast, WakeKeyborard };
|