@studiometa/js-toolkit 2.2.1 → 2.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Base/index.cjs +60 -69
- package/Base/index.d.ts +0 -8
- package/Base/index.js +67 -82
- package/Base/managers/AbstractManager.cjs +5 -10
- package/Base/managers/AbstractManager.js +5 -11
- package/Base/managers/ChildrenManager.cjs +2 -11
- package/Base/managers/ChildrenManager.js +2 -12
- package/Base/managers/EventsManager.cjs +61 -67
- package/Base/managers/EventsManager.js +61 -68
- package/Base/managers/OptionsManager.cjs +26 -27
- package/Base/managers/OptionsManager.js +26 -28
- package/Base/managers/RefsManager.cjs +9 -7
- package/Base/managers/RefsManager.js +9 -7
- package/Base/managers/ResponsiveOptionsManager.cjs +4 -1
- package/Base/managers/ResponsiveOptionsManager.js +4 -1
- package/Base/managers/ServicesManager.cjs +10 -16
- package/Base/managers/ServicesManager.js +10 -17
- package/Base/utils.cjs +22 -4
- package/Base/utils.d.ts +25 -8
- package/Base/utils.js +22 -4
- package/decorators/withBreakpointManager.cjs +15 -5
- package/decorators/withBreakpointManager.js +15 -5
- package/decorators/withBreakpointObserver.cjs +19 -18
- package/decorators/withBreakpointObserver.js +19 -19
- package/decorators/withDrag.cjs +6 -11
- package/decorators/withDrag.js +6 -12
- package/decorators/withExtraConfig.cjs +3 -8
- package/decorators/withExtraConfig.js +3 -9
- package/decorators/withFreezedOptions.cjs +1 -9
- package/decorators/withFreezedOptions.js +1 -10
- package/decorators/withIntersectionObserver.cjs +11 -16
- package/decorators/withIntersectionObserver.js +11 -17
- package/decorators/withMountWhenInView.cjs +12 -17
- package/decorators/withMountWhenInView.js +12 -18
- package/decorators/withScrolledInView.cjs +30 -35
- package/decorators/withScrolledInView.js +30 -36
- package/decorators/withVue2.cjs +20 -18
- package/decorators/withVue2.js +20 -19
- package/helpers/getInstanceFromElement.cjs +1 -2
- package/helpers/getInstanceFromElement.js +1 -2
- package/helpers/importOnInteraction.cjs +3 -2
- package/helpers/importOnInteraction.js +3 -2
- package/helpers/importWhenIdle.cjs +2 -3
- package/helpers/importWhenIdle.js +2 -3
- package/helpers/importWhenVisible.cjs +3 -2
- package/helpers/importWhenVisible.js +3 -2
- package/helpers/utils.cjs +3 -2
- package/helpers/utils.js +3 -2
- package/package.json +4 -1
- package/services/drag.cjs +126 -148
- package/services/drag.d.ts +10 -10
- package/services/drag.js +125 -148
- package/services/index.cjs +3 -1
- package/services/index.d.ts +1 -0
- package/services/index.js +3 -1
- package/services/key.cjs +48 -63
- package/services/key.d.ts +0 -8
- package/services/key.js +47 -63
- package/services/load.cjs +24 -40
- package/services/load.d.ts +0 -8
- package/services/load.js +23 -37
- package/services/pointer.cjs +72 -103
- package/services/pointer.d.ts +1 -9
- package/services/pointer.js +71 -100
- package/services/raf.cjs +38 -58
- package/services/raf.d.ts +0 -8
- package/services/raf.js +37 -55
- package/services/resize.cjs +59 -68
- package/services/resize.d.ts +0 -7
- package/services/resize.js +58 -68
- package/services/scroll.cjs +49 -71
- package/services/scroll.js +48 -71
- package/services/service.cjs +68 -0
- package/services/service.d.ts +18 -0
- package/services/service.js +46 -0
- package/utils/css/animate.cjs +33 -102
- package/utils/css/animate.d.ts +4 -13
- package/utils/css/animate.js +31 -100
- package/utils/css/classes.cjs +2 -1
- package/utils/css/classes.js +2 -1
- package/utils/css/matrix.cjs +1 -2
- package/utils/css/matrix.js +1 -2
- package/utils/css/styles.cjs +2 -5
- package/utils/css/styles.js +1 -1
- package/utils/css/transform.cjs +14 -18
- package/utils/css/transform.js +2 -3
- package/utils/css/transition.cjs +7 -10
- package/utils/css/transition.js +7 -11
- package/utils/focusTrap.cjs +2 -1
- package/utils/focusTrap.js +2 -1
- package/utils/{isFunction.cjs → has.cjs} +7 -7
- package/utils/has.d.ts +6 -0
- package/utils/has.js +6 -0
- package/utils/history.cjs +5 -7
- package/utils/history.js +4 -3
- package/utils/index.cjs +6 -5
- package/utils/index.d.ts +4 -2
- package/utils/index.js +6 -5
- package/utils/{object/isObject.cjs → is.cjs} +20 -8
- package/utils/is.d.ts +8 -0
- package/utils/is.js +18 -0
- package/utils/math/inertiaFinalValue.cjs +5 -3
- package/utils/math/inertiaFinalValue.js +2 -3
- package/utils/nextFrame.cjs +5 -3
- package/utils/nextFrame.js +5 -3
- package/utils/nextMicrotask.cjs +2 -1
- package/utils/nextMicrotask.js +2 -1
- package/utils/nextTick.cjs +2 -1
- package/utils/nextTick.js +2 -1
- package/utils/{isDefined.cjs → noop.cjs} +10 -7
- package/utils/noop.d.ts +12 -0
- package/utils/noop.js +9 -0
- package/utils/object/autoBind.cjs +3 -2
- package/utils/object/autoBind.js +3 -2
- package/utils/object/getAllProperties.cjs +2 -1
- package/utils/object/getAllProperties.js +2 -1
- package/utils/object/index.cjs +1 -3
- package/utils/object/index.d.ts +0 -1
- package/utils/object/index.js +1 -3
- package/utils/tween.cjs +113 -0
- package/utils/tween.d.ts +25 -0
- package/utils/tween.js +88 -0
- package/services/Service.cjs +0 -76
- package/services/Service.d.ts +0 -76
- package/services/Service.js +0 -55
- package/utils/isDefined.d.ts +0 -7
- package/utils/isDefined.js +0 -6
- package/utils/isFunction.d.ts +0 -7
- package/utils/isFunction.js +0 -6
- package/utils/object/isObject.d.ts +0 -7
- package/utils/object/isObject.js +0 -6
package/utils/css/animate.js
CHANGED
|
@@ -1,15 +1,10 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import isDefined from "../isDefined.js";
|
|
1
|
+
import { lerp, map } from "../math/index.js";
|
|
2
|
+
import { isDefined, isFunction, isNumber } from "../is.js";
|
|
4
3
|
import transform, { TRANSFORM_PROPS } from "./transform.js";
|
|
5
|
-
import useRaf from "../../services/raf.js";
|
|
6
4
|
import { domScheduler as scheduler } from "../scheduler.js";
|
|
5
|
+
import { tween, normalizeEase } from "../tween.js";
|
|
7
6
|
let id = 0;
|
|
8
7
|
const running = /* @__PURE__ */ new WeakMap();
|
|
9
|
-
const raf = useRaf();
|
|
10
|
-
const noop = () => {
|
|
11
|
-
};
|
|
12
|
-
const PROGRESS_PRECISION = 1e-4;
|
|
13
8
|
const CSSUnitConverter = {
|
|
14
9
|
"%": (value, getSizeRef) => value * getSizeRef() / 100,
|
|
15
10
|
vh: (value) => value * window.innerHeight / 100,
|
|
@@ -18,7 +13,7 @@ const CSSUnitConverter = {
|
|
|
18
13
|
vmax: (value) => value * Math.max(window.innerWidth, window.innerHeight) / 100
|
|
19
14
|
};
|
|
20
15
|
function getAnimationStepValue(val, getSizeRef) {
|
|
21
|
-
if (
|
|
16
|
+
if (isNumber(val)) {
|
|
22
17
|
return val;
|
|
23
18
|
}
|
|
24
19
|
if (!val[1] || !CSSUnitConverter[val[1]]) {
|
|
@@ -26,22 +21,10 @@ function getAnimationStepValue(val, getSizeRef) {
|
|
|
26
21
|
}
|
|
27
22
|
return CSSUnitConverter[val[1]](val[0], getSizeRef);
|
|
28
23
|
}
|
|
29
|
-
|
|
30
|
-
return value;
|
|
31
|
-
}
|
|
32
|
-
function normalizeEase(ease) {
|
|
33
|
-
if (!isDefined(ease)) {
|
|
34
|
-
return linear;
|
|
35
|
-
}
|
|
36
|
-
if (Array.isArray(ease)) {
|
|
37
|
-
return cubicBezier(...ease);
|
|
38
|
-
}
|
|
39
|
-
return ease;
|
|
40
|
-
}
|
|
41
|
-
const generateTranslateRenderStrategy = (sizeRef) => (element, fromValue, toValue, progress) => lerp(getAnimationStepValue(fromValue != null ? fromValue : 0, () => element[sizeRef]), getAnimationStepValue(toValue != null ? toValue : 0, () => element[sizeRef]), progress);
|
|
24
|
+
const generateTranslateRenderStrategy = (sizeRef) => (element, fromValue, toValue, progress) => lerp(getAnimationStepValue(fromValue ?? 0, () => element[sizeRef]), getAnimationStepValue(toValue ?? 0, () => element[sizeRef]), progress);
|
|
42
25
|
const widthBasedTranslateRenderStrategy = generateTranslateRenderStrategy("offsetWidth");
|
|
43
26
|
const heightBasedTranslateRenderStrategy = generateTranslateRenderStrategy("offsetHeight");
|
|
44
|
-
const generateLerpRenderStrategy = (defaultValue) => (element, fromValue, toValue, progress) => lerp(fromValue
|
|
27
|
+
const generateLerpRenderStrategy = (defaultValue) => (element, fromValue, toValue, progress) => lerp(fromValue ?? defaultValue, toValue ?? defaultValue, progress);
|
|
45
28
|
const scaleRenderStrategy = generateLerpRenderStrategy(1);
|
|
46
29
|
const degreesRenderStrategy = generateLerpRenderStrategy(0);
|
|
47
30
|
const transformRenderStrategies = {
|
|
@@ -63,10 +46,9 @@ const transformRenderStrategies = {
|
|
|
63
46
|
function render(element, from, to, progress) {
|
|
64
47
|
const stepProgress = to.easing(map(progress, from.offset, to.offset, 0, 1));
|
|
65
48
|
scheduler.read(function renderRead() {
|
|
66
|
-
var _a, _b;
|
|
67
49
|
let opacity = false;
|
|
68
50
|
if (isDefined(from.opacity) || isDefined(to.opacity)) {
|
|
69
|
-
opacity = map(stepProgress, 0, 1,
|
|
51
|
+
opacity = map(stepProgress, 0, 1, from.opacity ?? 1, to.opacity ?? 1);
|
|
70
52
|
} else if (element.style.opacity) {
|
|
71
53
|
opacity = "";
|
|
72
54
|
}
|
|
@@ -91,91 +73,40 @@ function render(element, from, to, progress) {
|
|
|
91
73
|
});
|
|
92
74
|
}
|
|
93
75
|
function animate(element, keyframes, options = {}) {
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
76
|
+
const keyframesCount = keyframes.length - 1;
|
|
77
|
+
const normalizedKeyframes = keyframes.map((keyframe, index) => ({
|
|
78
|
+
...keyframe,
|
|
79
|
+
offset: keyframe.offset ?? index / keyframesCount,
|
|
80
|
+
easing: normalizeEase(keyframe.easing)
|
|
81
|
+
}));
|
|
97
82
|
if (!running.has(element)) {
|
|
98
83
|
running.set(element, /* @__PURE__ */ new Map());
|
|
99
84
|
}
|
|
100
|
-
const ease = normalizeEase(options.easing);
|
|
101
|
-
let duration = (_a = options.duration) != null ? _a : 1;
|
|
102
|
-
duration *= 1e3;
|
|
103
|
-
let startTime = performance.now();
|
|
104
|
-
let endTime = startTime + duration;
|
|
105
85
|
const key = `animate-${id}`;
|
|
106
86
|
id += 1;
|
|
107
|
-
|
|
108
|
-
let isRunning = false;
|
|
109
|
-
const keyframesCount = keyframes.length - 1;
|
|
110
|
-
const normalizedKeyframes = keyframes.map((keyframe, index) => {
|
|
111
|
-
var _a2;
|
|
112
|
-
return {
|
|
113
|
-
...keyframe,
|
|
114
|
-
offset: (_a2 = keyframe.offset) != null ? _a2 : index / keyframesCount,
|
|
115
|
-
easing: normalizeEase(keyframe.easing)
|
|
116
|
-
};
|
|
117
|
-
});
|
|
118
|
-
function pause() {
|
|
119
|
-
isRunning = false;
|
|
120
|
-
raf.remove(key);
|
|
121
|
-
}
|
|
122
|
-
function progress(newProgress) {
|
|
123
|
-
if (typeof newProgress === "undefined") {
|
|
124
|
-
return progressValue;
|
|
125
|
-
}
|
|
126
|
-
progressValue = newProgress;
|
|
127
|
-
if (Math.abs(1 - progressValue) < PROGRESS_PRECISION) {
|
|
128
|
-
progressValue = 1;
|
|
129
|
-
pause();
|
|
130
|
-
scheduler.afterWrite(() => onFinish(progressValue, easedProgress));
|
|
131
|
-
}
|
|
132
|
-
easedProgress = ease(progressValue);
|
|
87
|
+
function callback(progress) {
|
|
133
88
|
let toIndex = 0;
|
|
134
|
-
while (normalizedKeyframes[toIndex] && normalizedKeyframes[toIndex].offset <=
|
|
89
|
+
while (normalizedKeyframes[toIndex] && normalizedKeyframes[toIndex].offset <= progress && normalizedKeyframes[toIndex].offset !== 1) {
|
|
135
90
|
toIndex += 1;
|
|
136
91
|
}
|
|
137
|
-
render(element, normalizedKeyframes[toIndex - 1], normalizedKeyframes[toIndex],
|
|
138
|
-
onProgress(progressValue, easedProgress);
|
|
139
|
-
return progressValue;
|
|
92
|
+
render(element, normalizedKeyframes[toIndex - 1], normalizedKeyframes[toIndex], progress);
|
|
140
93
|
}
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
runningKeys.
|
|
153
|
-
|
|
154
|
-
runningKeys.set(key, pause);
|
|
155
|
-
running.set(element, runningKeys);
|
|
156
|
-
startTime = performance.now();
|
|
157
|
-
endTime = startTime + duration;
|
|
158
|
-
progressValue = 0;
|
|
159
|
-
easedProgress = 0;
|
|
160
|
-
isRunning = true;
|
|
161
|
-
raf.add(key, tick);
|
|
162
|
-
}
|
|
163
|
-
function play() {
|
|
164
|
-
if (isRunning) {
|
|
165
|
-
return;
|
|
94
|
+
const controls = tween(callback, {
|
|
95
|
+
...options,
|
|
96
|
+
onStart() {
|
|
97
|
+
if (isFunction(options.onStart)) {
|
|
98
|
+
options.onStart();
|
|
99
|
+
}
|
|
100
|
+
const runningKeys = running.get(element);
|
|
101
|
+
runningKeys.forEach((runningPause, runningKey) => {
|
|
102
|
+
runningPause();
|
|
103
|
+
runningKeys.delete(runningKey);
|
|
104
|
+
});
|
|
105
|
+
runningKeys.set(key, controls.pause);
|
|
106
|
+
running.set(element, runningKeys);
|
|
166
107
|
}
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
isRunning = true;
|
|
170
|
-
raf.add(key, tick);
|
|
171
|
-
}
|
|
172
|
-
return {
|
|
173
|
-
start,
|
|
174
|
-
finish: () => progress(1),
|
|
175
|
-
pause,
|
|
176
|
-
play,
|
|
177
|
-
progress
|
|
178
|
-
};
|
|
108
|
+
});
|
|
109
|
+
return controls;
|
|
179
110
|
}
|
|
180
111
|
export {
|
|
181
112
|
animate
|
package/utils/css/classes.cjs
CHANGED
|
@@ -24,11 +24,12 @@ __export(classes_exports, {
|
|
|
24
24
|
toggle: () => toggle
|
|
25
25
|
});
|
|
26
26
|
module.exports = __toCommonJS(classes_exports);
|
|
27
|
+
var import_is = require("../is.cjs");
|
|
27
28
|
function setClasses(element, classNames, method, forceToggle) {
|
|
28
29
|
if (!element || !classNames) {
|
|
29
30
|
return;
|
|
30
31
|
}
|
|
31
|
-
const normalizedClassNames =
|
|
32
|
+
const normalizedClassNames = (0, import_is.isArray)(classNames) ? classNames : classNames.split(" ");
|
|
32
33
|
if (method !== "toggle") {
|
|
33
34
|
element.classList[method](...normalizedClassNames);
|
|
34
35
|
} else {
|
package/utils/css/classes.js
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
|
+
import { isArray } from "../is.js";
|
|
1
2
|
function setClasses(element, classNames, method, forceToggle) {
|
|
2
3
|
if (!element || !classNames) {
|
|
3
4
|
return;
|
|
4
5
|
}
|
|
5
|
-
const normalizedClassNames =
|
|
6
|
+
const normalizedClassNames = isArray(classNames) ? classNames : classNames.split(" ");
|
|
6
7
|
if (method !== "toggle") {
|
|
7
8
|
element.classList[method](...normalizedClassNames);
|
|
8
9
|
} else {
|
package/utils/css/matrix.cjs
CHANGED
|
@@ -23,8 +23,7 @@ __export(matrix_exports, {
|
|
|
23
23
|
});
|
|
24
24
|
module.exports = __toCommonJS(matrix_exports);
|
|
25
25
|
function matrix(transform) {
|
|
26
|
-
var _a, _b, _c, _d, _e, _f;
|
|
27
26
|
transform = transform || {};
|
|
28
|
-
return `matrix(${
|
|
27
|
+
return `matrix(${transform.scaleX ?? 1}, ${transform.skewY ?? 0}, ${transform.skewX ?? 0}, ${transform.scaleY ?? 1}, ${transform.translateX ?? 0}, ${transform.translateY ?? 0})`;
|
|
29
28
|
}
|
|
30
29
|
if (module.exports.default) module.exports = module.exports.default;
|
package/utils/css/matrix.js
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
function matrix(transform) {
|
|
2
|
-
var _a, _b, _c, _d, _e, _f;
|
|
3
2
|
transform = transform || {};
|
|
4
|
-
return `matrix(${
|
|
3
|
+
return `matrix(${transform.scaleX ?? 1}, ${transform.skewY ?? 0}, ${transform.skewX ?? 0}, ${transform.scaleY ?? 1}, ${transform.translateX ?? 0}, ${transform.translateY ?? 0})`;
|
|
5
4
|
}
|
|
6
5
|
export {
|
|
7
6
|
matrix as default
|
package/utils/css/styles.cjs
CHANGED
|
@@ -1,8 +1,6 @@
|
|
|
1
|
-
var __create = Object.create;
|
|
2
1
|
var __defProp = Object.defineProperty;
|
|
3
2
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
3
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
6
4
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
5
|
var __export = (target, all) => {
|
|
8
6
|
for (var name in all)
|
|
@@ -16,7 +14,6 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
16
14
|
}
|
|
17
15
|
return to;
|
|
18
16
|
};
|
|
19
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
|
|
20
17
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
21
18
|
|
|
22
19
|
// packages/js-toolkit/utils/css/styles.js
|
|
@@ -26,9 +23,9 @@ __export(styles_exports, {
|
|
|
26
23
|
remove: () => remove
|
|
27
24
|
});
|
|
28
25
|
module.exports = __toCommonJS(styles_exports);
|
|
29
|
-
var
|
|
26
|
+
var import_is = require("../is.cjs");
|
|
30
27
|
function setStyles(element, styles, method = "add") {
|
|
31
|
-
if (!element || !styles || !(0,
|
|
28
|
+
if (!element || !styles || !(0, import_is.isObject)(styles)) {
|
|
32
29
|
return;
|
|
33
30
|
}
|
|
34
31
|
Object.entries(styles).forEach(([prop, value]) => {
|
package/utils/css/styles.js
CHANGED
package/utils/css/transform.cjs
CHANGED
|
@@ -1,8 +1,6 @@
|
|
|
1
|
-
var __create = Object.create;
|
|
2
1
|
var __defProp = Object.defineProperty;
|
|
3
2
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
3
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
6
4
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
5
|
var __export = (target, all) => {
|
|
8
6
|
for (var name in all)
|
|
@@ -16,7 +14,6 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
16
14
|
}
|
|
17
15
|
return to;
|
|
18
16
|
};
|
|
19
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
|
|
20
17
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
21
18
|
|
|
22
19
|
// packages/js-toolkit/utils/css/transform.js
|
|
@@ -26,7 +23,7 @@ __export(transform_exports, {
|
|
|
26
23
|
default: () => transform
|
|
27
24
|
});
|
|
28
25
|
module.exports = __toCommonJS(transform_exports);
|
|
29
|
-
var
|
|
26
|
+
var import_is = require("../is.cjs");
|
|
30
27
|
var TRANSFORM_PROPS = [
|
|
31
28
|
"x",
|
|
32
29
|
"y",
|
|
@@ -44,44 +41,43 @@ var TRANSFORM_PROPS = [
|
|
|
44
41
|
"skewY"
|
|
45
42
|
];
|
|
46
43
|
function transform(element, props) {
|
|
47
|
-
var _a, _b, _c;
|
|
48
44
|
let value = "";
|
|
49
|
-
if ((0,
|
|
50
|
-
value += `translate3d(${
|
|
45
|
+
if ((0, import_is.isDefined)(props.x) || (0, import_is.isDefined)(props.y) || (0, import_is.isDefined)(props.z)) {
|
|
46
|
+
value += `translate3d(${props.x ?? 0}px, ${props.y ?? 0}px, ${props.z ?? 0}px) `;
|
|
51
47
|
}
|
|
52
|
-
if ((0,
|
|
48
|
+
if ((0, import_is.isDefined)(props.rotate)) {
|
|
53
49
|
value += `rotate(${props.rotate}deg) `;
|
|
54
50
|
} else {
|
|
55
|
-
if ((0,
|
|
51
|
+
if ((0, import_is.isDefined)(props.rotateX)) {
|
|
56
52
|
value += `rotateX(${props.rotateX}deg) `;
|
|
57
53
|
}
|
|
58
|
-
if ((0,
|
|
54
|
+
if ((0, import_is.isDefined)(props.rotateY)) {
|
|
59
55
|
value += `rotateY(${props.rotateY}deg) `;
|
|
60
56
|
}
|
|
61
|
-
if ((0,
|
|
57
|
+
if ((0, import_is.isDefined)(props.rotateZ)) {
|
|
62
58
|
value += `rotateZ(${props.rotateZ}deg) `;
|
|
63
59
|
}
|
|
64
60
|
}
|
|
65
|
-
if ((0,
|
|
61
|
+
if ((0, import_is.isDefined)(props.scale)) {
|
|
66
62
|
value += `scale(${props.scale}) `;
|
|
67
63
|
} else {
|
|
68
|
-
if ((0,
|
|
64
|
+
if ((0, import_is.isDefined)(props.scaleX)) {
|
|
69
65
|
value += `scaleX(${props.scaleX}) `;
|
|
70
66
|
}
|
|
71
|
-
if ((0,
|
|
67
|
+
if ((0, import_is.isDefined)(props.scaleY)) {
|
|
72
68
|
value += `scaleY(${props.scaleY}) `;
|
|
73
69
|
}
|
|
74
|
-
if ((0,
|
|
70
|
+
if ((0, import_is.isDefined)(props.scaleZ)) {
|
|
75
71
|
value += `scaleZ(${props.scaleZ}) `;
|
|
76
72
|
}
|
|
77
73
|
}
|
|
78
|
-
if ((0,
|
|
74
|
+
if ((0, import_is.isDefined)(props.skew)) {
|
|
79
75
|
value += `skew(${props.skew}deg) `;
|
|
80
76
|
} else {
|
|
81
|
-
if ((0,
|
|
77
|
+
if ((0, import_is.isDefined)(props.skewX)) {
|
|
82
78
|
value += `skewX(${props.skewX}deg) `;
|
|
83
79
|
}
|
|
84
|
-
if ((0,
|
|
80
|
+
if ((0, import_is.isDefined)(props.skewY)) {
|
|
85
81
|
value += `skewY(${props.skewY}deg) `;
|
|
86
82
|
}
|
|
87
83
|
}
|
package/utils/css/transform.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import isDefined from "../
|
|
1
|
+
import { isDefined } from "../is.js";
|
|
2
2
|
const TRANSFORM_PROPS = [
|
|
3
3
|
"x",
|
|
4
4
|
"y",
|
|
@@ -16,10 +16,9 @@ const TRANSFORM_PROPS = [
|
|
|
16
16
|
"skewY"
|
|
17
17
|
];
|
|
18
18
|
function transform(element, props) {
|
|
19
|
-
var _a, _b, _c;
|
|
20
19
|
let value = "";
|
|
21
20
|
if (isDefined(props.x) || isDefined(props.y) || isDefined(props.z)) {
|
|
22
|
-
value += `translate3d(${
|
|
21
|
+
value += `translate3d(${props.x ?? 0}px, ${props.y ?? 0}px, ${props.z ?? 0}px) `;
|
|
23
22
|
}
|
|
24
23
|
if (isDefined(props.rotate)) {
|
|
25
24
|
value += `rotate(${props.rotate}deg) `;
|
package/utils/css/transition.cjs
CHANGED
|
@@ -4,7 +4,6 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
|
4
4
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
5
|
var __getProtoOf = Object.getPrototypeOf;
|
|
6
6
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
7
|
var __export = (target, all) => {
|
|
9
8
|
for (var name in all)
|
|
10
9
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -19,10 +18,6 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
19
18
|
};
|
|
20
19
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
|
|
21
20
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
|
-
var __publicField = (obj, key, value) => {
|
|
23
|
-
__defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
24
|
-
return value;
|
|
25
|
-
};
|
|
26
21
|
|
|
27
22
|
// packages/js-toolkit/utils/css/transition.js
|
|
28
23
|
var transition_exports = {};
|
|
@@ -34,11 +29,13 @@ module.exports = __toCommonJS(transition_exports);
|
|
|
34
29
|
var import_nextFrame = require("../nextFrame.cjs");
|
|
35
30
|
var classes = __toESM(require("./classes.cjs"), 1);
|
|
36
31
|
var styles = __toESM(require("./styles.cjs"), 1);
|
|
32
|
+
var import_is = require("../is.cjs");
|
|
33
|
+
var import_has = require("../has.cjs");
|
|
37
34
|
var cache = /* @__PURE__ */ new WeakMap();
|
|
38
35
|
var Transition = class {
|
|
36
|
+
isTransitioning = false;
|
|
37
|
+
transitionEndHandler = null;
|
|
39
38
|
constructor(element) {
|
|
40
|
-
__publicField(this, "isTransitioning", false);
|
|
41
|
-
__publicField(this, "transitionEndHandler", null);
|
|
42
39
|
cache.set(element, this);
|
|
43
40
|
}
|
|
44
41
|
static getInstance(element) {
|
|
@@ -50,14 +47,14 @@ var Transition = class {
|
|
|
50
47
|
}
|
|
51
48
|
};
|
|
52
49
|
function setClassesOrStyles(element, classesOrStyles, method = "add") {
|
|
53
|
-
if (
|
|
50
|
+
if ((0, import_is.isString)(classesOrStyles) || (0, import_is.isArray)(classesOrStyles)) {
|
|
54
51
|
classes[method](element, classesOrStyles);
|
|
55
52
|
} else {
|
|
56
53
|
styles[method](element, classesOrStyles);
|
|
57
54
|
}
|
|
58
55
|
}
|
|
59
56
|
function testTransition(element) {
|
|
60
|
-
if (
|
|
57
|
+
if (!(0, import_has.hasWindow)()) {
|
|
61
58
|
return false;
|
|
62
59
|
}
|
|
63
60
|
const { transitionDuration } = window.getComputedStyle(element);
|
|
@@ -100,7 +97,7 @@ function end(element, classesOrStyles, mode = "remove") {
|
|
|
100
97
|
trs.transitionEndHandler = null;
|
|
101
98
|
}
|
|
102
99
|
async function transition(element, name, endMode = "remove") {
|
|
103
|
-
const classesOrStyles =
|
|
100
|
+
const classesOrStyles = (0, import_is.isString)(name) ? {
|
|
104
101
|
from: `${name}-from`,
|
|
105
102
|
active: `${name}-active`,
|
|
106
103
|
to: `${name}-to`
|
package/utils/css/transition.js
CHANGED
|
@@ -1,17 +1,13 @@
|
|
|
1
|
-
var __defProp = Object.defineProperty;
|
|
2
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
3
|
-
var __publicField = (obj, key, value) => {
|
|
4
|
-
__defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
5
|
-
return value;
|
|
6
|
-
};
|
|
7
1
|
import { nextFrame } from "../nextFrame.js";
|
|
8
2
|
import * as classes from "./classes.js";
|
|
9
3
|
import * as styles from "./styles.js";
|
|
4
|
+
import { isArray, isString } from "../is.js";
|
|
5
|
+
import { hasWindow } from "../has.js";
|
|
10
6
|
const cache = /* @__PURE__ */ new WeakMap();
|
|
11
7
|
class Transition {
|
|
8
|
+
isTransitioning = false;
|
|
9
|
+
transitionEndHandler = null;
|
|
12
10
|
constructor(element) {
|
|
13
|
-
__publicField(this, "isTransitioning", false);
|
|
14
|
-
__publicField(this, "transitionEndHandler", null);
|
|
15
11
|
cache.set(element, this);
|
|
16
12
|
}
|
|
17
13
|
static getInstance(element) {
|
|
@@ -23,14 +19,14 @@ class Transition {
|
|
|
23
19
|
}
|
|
24
20
|
}
|
|
25
21
|
function setClassesOrStyles(element, classesOrStyles, method = "add") {
|
|
26
|
-
if (
|
|
22
|
+
if (isString(classesOrStyles) || isArray(classesOrStyles)) {
|
|
27
23
|
classes[method](element, classesOrStyles);
|
|
28
24
|
} else {
|
|
29
25
|
styles[method](element, classesOrStyles);
|
|
30
26
|
}
|
|
31
27
|
}
|
|
32
28
|
function testTransition(element) {
|
|
33
|
-
if (
|
|
29
|
+
if (!hasWindow()) {
|
|
34
30
|
return false;
|
|
35
31
|
}
|
|
36
32
|
const { transitionDuration } = window.getComputedStyle(element);
|
|
@@ -73,7 +69,7 @@ function end(element, classesOrStyles, mode = "remove") {
|
|
|
73
69
|
trs.transitionEndHandler = null;
|
|
74
70
|
}
|
|
75
71
|
async function transition(element, name, endMode = "remove") {
|
|
76
|
-
const classesOrStyles =
|
|
72
|
+
const classesOrStyles = isString(name) ? {
|
|
77
73
|
from: `${name}-from`,
|
|
78
74
|
active: `${name}-active`,
|
|
79
75
|
to: `${name}-to`
|
package/utils/focusTrap.cjs
CHANGED
|
@@ -29,6 +29,7 @@ __export(focusTrap_exports, {
|
|
|
29
29
|
});
|
|
30
30
|
module.exports = __toCommonJS(focusTrap_exports);
|
|
31
31
|
var import_keyCodes = __toESM(require("./keyCodes.cjs"), 1);
|
|
32
|
+
var import_is = require("./is.cjs");
|
|
32
33
|
var FOCUSABLE_ELEMENTS = [
|
|
33
34
|
'a[href]:not([tabindex^="-"]):not([inert])',
|
|
34
35
|
'area[href]:not([tabindex^="-"]):not([inert])',
|
|
@@ -71,7 +72,7 @@ function trap(element, event) {
|
|
|
71
72
|
}
|
|
72
73
|
}
|
|
73
74
|
function untrap() {
|
|
74
|
-
if (focusedBefore &&
|
|
75
|
+
if (focusedBefore && (0, import_is.isFunction)(focusedBefore.focus)) {
|
|
75
76
|
focusedBefore.focus();
|
|
76
77
|
focusedBefore = null;
|
|
77
78
|
}
|
package/utils/focusTrap.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import keyCodes from "./keyCodes.js";
|
|
2
|
+
import { isFunction } from "./is.js";
|
|
2
3
|
const FOCUSABLE_ELEMENTS = [
|
|
3
4
|
'a[href]:not([tabindex^="-"]):not([inert])',
|
|
4
5
|
'area[href]:not([tabindex^="-"]):not([inert])',
|
|
@@ -41,7 +42,7 @@ function trap(element, event) {
|
|
|
41
42
|
}
|
|
42
43
|
}
|
|
43
44
|
function untrap() {
|
|
44
|
-
if (focusedBefore &&
|
|
45
|
+
if (focusedBefore && isFunction(focusedBefore.focus)) {
|
|
45
46
|
focusedBefore.focus();
|
|
46
47
|
focusedBefore = null;
|
|
47
48
|
}
|
|
@@ -16,13 +16,13 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
16
16
|
};
|
|
17
17
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
18
|
|
|
19
|
-
// packages/js-toolkit/utils/
|
|
20
|
-
var
|
|
21
|
-
__export(
|
|
22
|
-
|
|
19
|
+
// packages/js-toolkit/utils/has.js
|
|
20
|
+
var has_exports = {};
|
|
21
|
+
__export(has_exports, {
|
|
22
|
+
hasWindow: () => hasWindow
|
|
23
23
|
});
|
|
24
|
-
module.exports = __toCommonJS(
|
|
25
|
-
function
|
|
26
|
-
return typeof
|
|
24
|
+
module.exports = __toCommonJS(has_exports);
|
|
25
|
+
function hasWindow() {
|
|
26
|
+
return typeof window !== "undefined";
|
|
27
27
|
}
|
|
28
28
|
if (module.exports.default) module.exports = module.exports.default;
|
package/utils/has.d.ts
ADDED
package/utils/has.js
ADDED
package/utils/history.cjs
CHANGED
|
@@ -1,8 +1,6 @@
|
|
|
1
|
-
var __create = Object.create;
|
|
2
1
|
var __defProp = Object.defineProperty;
|
|
3
2
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
3
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
6
4
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
5
|
var __export = (target, all) => {
|
|
8
6
|
for (var name in all)
|
|
@@ -16,7 +14,6 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
16
14
|
}
|
|
17
15
|
return to;
|
|
18
16
|
};
|
|
19
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
|
|
20
17
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
21
18
|
|
|
22
19
|
// packages/js-toolkit/utils/history.js
|
|
@@ -27,7 +24,8 @@ __export(history_exports, {
|
|
|
27
24
|
replace: () => replace
|
|
28
25
|
});
|
|
29
26
|
module.exports = __toCommonJS(history_exports);
|
|
30
|
-
var
|
|
27
|
+
var import_is = require("./is.cjs");
|
|
28
|
+
var import_has = require("./has.cjs");
|
|
31
29
|
function updateUrlSearchParam(params, name, value) {
|
|
32
30
|
if (value === "" || value === null || value === void 0) {
|
|
33
31
|
if (params.has(name)) {
|
|
@@ -35,14 +33,14 @@ function updateUrlSearchParam(params, name, value) {
|
|
|
35
33
|
}
|
|
36
34
|
return params;
|
|
37
35
|
}
|
|
38
|
-
if (
|
|
36
|
+
if ((0, import_is.isArray)(value)) {
|
|
39
37
|
value.forEach((val, index) => {
|
|
40
38
|
const arrayName = `${name}[${index}]`;
|
|
41
39
|
updateUrlSearchParam(params, arrayName, val);
|
|
42
40
|
});
|
|
43
41
|
return params;
|
|
44
42
|
}
|
|
45
|
-
if ((0,
|
|
43
|
+
if ((0, import_is.isObject)(value)) {
|
|
46
44
|
Object.entries(value).forEach(([key, val]) => {
|
|
47
45
|
const objectName = `${name}[${key}]`;
|
|
48
46
|
updateUrlSearchParam(params, objectName, val);
|
|
@@ -52,7 +50,7 @@ function updateUrlSearchParam(params, name, value) {
|
|
|
52
50
|
params.set(name, value);
|
|
53
51
|
return params;
|
|
54
52
|
}
|
|
55
|
-
function objectToURLSearchParams(obj, defaultSearch =
|
|
53
|
+
function objectToURLSearchParams(obj, defaultSearch = (0, import_has.hasWindow)() ? window.location.search : "") {
|
|
56
54
|
return Object.entries(obj).reduce((urlSearchParams, [name, value]) => updateUrlSearchParam(urlSearchParams, name, value), new URLSearchParams(defaultSearch));
|
|
57
55
|
}
|
|
58
56
|
function updateHistory(mode, options, data = {}, title = "") {
|
package/utils/history.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import isObject from "./
|
|
1
|
+
import { isArray, isObject } from "./is.js";
|
|
2
|
+
import { hasWindow } from "./has.js";
|
|
2
3
|
function updateUrlSearchParam(params, name, value) {
|
|
3
4
|
if (value === "" || value === null || value === void 0) {
|
|
4
5
|
if (params.has(name)) {
|
|
@@ -6,7 +7,7 @@ function updateUrlSearchParam(params, name, value) {
|
|
|
6
7
|
}
|
|
7
8
|
return params;
|
|
8
9
|
}
|
|
9
|
-
if (
|
|
10
|
+
if (isArray(value)) {
|
|
10
11
|
value.forEach((val, index) => {
|
|
11
12
|
const arrayName = `${name}[${index}]`;
|
|
12
13
|
updateUrlSearchParam(params, arrayName, val);
|
|
@@ -23,7 +24,7 @@ function updateUrlSearchParam(params, name, value) {
|
|
|
23
24
|
params.set(name, value);
|
|
24
25
|
return params;
|
|
25
26
|
}
|
|
26
|
-
function objectToURLSearchParams(obj, defaultSearch =
|
|
27
|
+
function objectToURLSearchParams(obj, defaultSearch = hasWindow() ? window.location.search : "") {
|
|
27
28
|
return Object.entries(obj).reduce((urlSearchParams, [name, value]) => updateUrlSearchParam(urlSearchParams, name, value), new URLSearchParams(defaultSearch));
|
|
28
29
|
}
|
|
29
30
|
function updateHistory(mode, options, data = {}, title = "") {
|