@studiometa/js-toolkit 2.0.0-beta.10 → 2.0.0-beta.14
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 +295 -0
- package/Base/index.js +88 -174
- package/Base/managers/ChildrenManager.cjs +125 -0
- package/Base/managers/ChildrenManager.js +29 -55
- package/Base/managers/EventsManager.cjs +185 -0
- package/Base/managers/EventsManager.js +84 -130
- package/Base/managers/OptionsManager.cjs +176 -0
- package/Base/managers/OptionsManager.js +46 -88
- package/Base/managers/RefsManager.cjs +99 -0
- package/Base/managers/RefsManager.js +22 -38
- package/Base/managers/ServicesManager.cjs +133 -0
- package/Base/managers/ServicesManager.js +31 -65
- package/Base/utils.cjs +46 -0
- package/Base/utils.js +12 -11
- package/decorators/index.cjs +50 -0
- package/decorators/index.js +18 -8
- package/decorators/withBreakpointManager.cjs +92 -0
- package/decorators/withBreakpointManager.js +18 -39
- package/decorators/withBreakpointObserver.cjs +117 -0
- package/decorators/withBreakpointObserver.js +40 -88
- package/decorators/withDrag.cjs +55 -0
- package/decorators/withDrag.js +18 -26
- package/decorators/withExtraConfig.cjs +45 -0
- package/decorators/withExtraConfig.js +11 -12
- package/decorators/withIntersectionObserver.cjs +62 -0
- package/decorators/withIntersectionObserver.js +23 -32
- package/decorators/withMountWhenInView.cjs +69 -0
- package/decorators/withMountWhenInView.js +26 -53
- package/decorators/withScrolledInView.cjs +113 -0
- package/decorators/withScrolledInView.js +50 -63
- package/decorators/withVue2.cjs +61 -0
- package/decorators/withVue2.js +21 -32
- package/helpers/createApp.cjs +57 -0
- package/helpers/createApp.js +12 -12
- package/helpers/importOnInteraction.cjs +57 -0
- package/helpers/importOnInteraction.js +17 -18
- package/helpers/importWhenIdle.cjs +53 -0
- package/helpers/importWhenIdle.js +13 -17
- package/helpers/importWhenVisible.cjs +55 -0
- package/helpers/importWhenVisible.js +16 -18
- package/helpers/index.cjs +42 -0
- package/helpers/index.js +10 -4
- package/helpers/utils.cjs +40 -0
- package/helpers/utils.js +7 -6
- package/index.cjs +39 -0
- package/index.js +7 -4
- package/package.json +14 -3
- package/services/Service.cjs +76 -0
- package/services/Service.js +13 -32
- package/services/drag.cjs +195 -0
- package/services/drag.js +60 -90
- package/services/index.cjs +48 -0
- package/services/index.js +16 -7
- package/services/key.cjs +102 -0
- package/services/key.js +34 -52
- package/services/load.cjs +71 -0
- package/services/load.js +13 -24
- package/services/pointer.cjs +160 -0
- package/services/pointer.js +60 -87
- package/services/raf.cjs +82 -0
- package/services/raf.js +16 -33
- package/services/resize.cjs +107 -0
- package/services/resize.js +31 -49
- package/services/scroll.cjs +130 -0
- package/services/scroll.js +44 -62
- package/utils/collide/boundingRectToCircle.cjs +39 -0
- package/utils/collide/boundingRectToCircle.d.ts +1 -1
- package/utils/collide/boundingRectToCircle.js +7 -10
- package/utils/collide/collideCircleCircle.cjs +39 -0
- package/utils/collide/collideCircleCircle.js +8 -7
- package/utils/collide/collideCircleRect.cjs +51 -0
- package/utils/collide/collideCircleRect.js +10 -12
- package/utils/collide/collidePointCircle.cjs +36 -0
- package/utils/collide/collidePointCircle.js +8 -5
- package/utils/collide/collidePointRect.cjs +33 -0
- package/utils/collide/collidePointRect.js +5 -2
- package/utils/collide/collideRectRect.cjs +33 -0
- package/utils/collide/collideRectRect.js +5 -2
- package/utils/collide/index.cjs +46 -0
- package/utils/collide/index.js +14 -6
- package/utils/css/classes.cjs +49 -0
- package/utils/css/classes.js +13 -12
- package/utils/css/index.cjs +42 -0
- package/utils/css/index.js +10 -6
- package/utils/css/matrix.cjs +34 -0
- package/utils/css/matrix.js +6 -5
- package/utils/css/styles.cjs +52 -0
- package/utils/css/styles.js +13 -12
- package/utils/css/transition.cjs +122 -0
- package/utils/css/transition.js +62 -117
- package/utils/debounce.cjs +39 -0
- package/utils/debounce.js +7 -9
- package/utils/focusTrap.cjs +89 -0
- package/utils/focusTrap.js +30 -21
- package/utils/history.cjs +96 -0
- package/utils/history.js +28 -57
- package/utils/index.cjs +58 -0
- package/utils/index.d.ts +1 -0
- package/utils/index.js +30 -11
- package/utils/keyCodes.cjs +40 -0
- package/utils/keyCodes.js +5 -2
- package/utils/math/clamp.cjs +33 -0
- package/utils/math/clamp.js +5 -2
- package/utils/math/clamp01.cjs +39 -0
- package/utils/math/clamp01.js +6 -3
- package/utils/math/damp.cjs +33 -0
- package/utils/math/damp.js +5 -4
- package/utils/math/ease.cjs +93 -0
- package/utils/math/ease.js +50 -25
- package/utils/math/index.cjs +49 -0
- package/utils/math/index.js +17 -8
- package/utils/math/inertiaFinalValue.cjs +42 -0
- package/utils/math/inertiaFinalValue.js +8 -10
- package/utils/math/lerp.cjs +33 -0
- package/utils/math/lerp.js +5 -2
- package/utils/math/map.cjs +33 -0
- package/utils/math/map.js +5 -2
- package/utils/math/round.cjs +33 -0
- package/utils/math/round.js +5 -3
- package/utils/memoize.cjs +48 -0
- package/utils/memoize.js +10 -19
- package/utils/nextFrame.cjs +45 -0
- package/utils/nextFrame.js +14 -9
- package/utils/object/autoBind.cjs +56 -0
- package/utils/object/autoBind.js +12 -22
- package/utils/object/getAllProperties.cjs +42 -0
- package/utils/object/getAllProperties.js +10 -13
- package/utils/object/index.cjs +40 -0
- package/utils/object/index.js +8 -3
- package/utils/object/isObject.cjs +33 -0
- package/utils/object/isObject.js +6 -3
- package/utils/scrollTo.cjs +87 -0
- package/utils/scrollTo.js +20 -40
- package/utils/string/index.cjs +54 -0
- package/utils/string/index.js +22 -10
- package/utils/string/withLeadingCharacters.cjs +39 -0
- package/utils/string/withLeadingCharacters.js +7 -4
- package/utils/string/withLeadingSlash.cjs +39 -0
- package/utils/string/withLeadingSlash.js +7 -4
- package/utils/string/withTrailingCharacters.cjs +39 -0
- package/utils/string/withTrailingCharacters.js +7 -4
- package/utils/string/withTrailingSlash.cjs +39 -0
- package/utils/string/withTrailingSlash.js +7 -4
- package/utils/string/withoutLeadingCharacters.cjs +33 -0
- package/utils/string/withoutLeadingCharacters.js +6 -3
- package/utils/string/withoutLeadingCharactersRecursive.cjs +44 -0
- package/utils/string/withoutLeadingCharactersRecursive.js +8 -7
- package/utils/string/withoutLeadingSlash.cjs +39 -0
- package/utils/string/withoutLeadingSlash.js +7 -4
- package/utils/string/withoutTrailingCharacters.cjs +33 -0
- package/utils/string/withoutTrailingCharacters.js +6 -3
- package/utils/string/withoutTrailingCharactersRecursive.cjs +44 -0
- package/utils/string/withoutTrailingCharactersRecursive.js +8 -7
- package/utils/string/withoutTrailingSlash.cjs +39 -0
- package/utils/string/withoutTrailingSlash.js +7 -4
- package/utils/throttle.cjs +41 -0
- package/utils/throttle.js +9 -9
- package/index.modern.js +0 -1
- package/index.umd.js +0 -1
package/Base/index.js
CHANGED
|
@@ -1,344 +1,258 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
export default class Base extends EventTarget {
|
|
1
|
+
import { getComponentElements } from "./utils.js";
|
|
2
|
+
import ChildrenManager from "./managers/ChildrenManager.js";
|
|
3
|
+
import RefsManager from "./managers/RefsManager.js";
|
|
4
|
+
import ServicesManager from "./managers/ServicesManager.js";
|
|
5
|
+
import EventsManager from "./managers/EventsManager.js";
|
|
6
|
+
import OptionsManager from "./managers/OptionsManager.js";
|
|
7
|
+
let id = 0;
|
|
8
|
+
const isDev = typeof __DEV__ !== "undefined" && __DEV__;
|
|
9
|
+
function noop() {
|
|
10
|
+
}
|
|
11
|
+
class Base extends EventTarget {
|
|
12
|
+
static $isBase = true;
|
|
13
|
+
$parent = null;
|
|
14
|
+
$id;
|
|
15
|
+
$el;
|
|
16
|
+
$isMounted = false;
|
|
17
|
+
__eventHandlers = /* @__PURE__ */ new Map();
|
|
19
18
|
get $root() {
|
|
20
19
|
if (!this.$parent) {
|
|
21
20
|
return this;
|
|
22
21
|
}
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
var root = this.$parent;
|
|
26
|
-
|
|
22
|
+
let parent = this.$parent;
|
|
23
|
+
let root = this.$parent;
|
|
27
24
|
while (parent) {
|
|
28
25
|
if (!parent.$parent) {
|
|
29
26
|
root = parent;
|
|
30
27
|
}
|
|
31
|
-
|
|
32
28
|
parent = parent.$parent;
|
|
33
29
|
}
|
|
34
|
-
|
|
35
30
|
return root;
|
|
36
31
|
}
|
|
37
|
-
|
|
38
32
|
get __config() {
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
config
|
|
42
|
-
} = proto.constructor;
|
|
43
|
-
|
|
33
|
+
let proto = Object.getPrototypeOf(this);
|
|
34
|
+
let { config } = proto.constructor;
|
|
44
35
|
while (proto.constructor.config && proto.constructor.$isBase) {
|
|
45
|
-
config =
|
|
46
|
-
|
|
36
|
+
config = {
|
|
37
|
+
...proto.constructor.config,
|
|
38
|
+
...config
|
|
39
|
+
};
|
|
47
40
|
if (proto.constructor.config.options) {
|
|
48
|
-
config.options =
|
|
41
|
+
config.options = {
|
|
42
|
+
...proto.constructor.config.options,
|
|
43
|
+
...config.options
|
|
44
|
+
};
|
|
49
45
|
}
|
|
50
|
-
|
|
51
46
|
if (proto.constructor.config.emits && config.emits) {
|
|
52
47
|
config.emits = [...proto.constructor.config.emits, ...config.emits];
|
|
53
48
|
}
|
|
54
|
-
|
|
55
49
|
proto = Object.getPrototypeOf(proto);
|
|
56
50
|
}
|
|
57
|
-
|
|
58
51
|
return config;
|
|
59
52
|
}
|
|
60
|
-
|
|
53
|
+
static config = {
|
|
54
|
+
name: "Base",
|
|
55
|
+
emits: [
|
|
56
|
+
"mounted",
|
|
57
|
+
"updated",
|
|
58
|
+
"destroyed",
|
|
59
|
+
"terminated",
|
|
60
|
+
"ticked",
|
|
61
|
+
"scrolled",
|
|
62
|
+
"resized",
|
|
63
|
+
"moved",
|
|
64
|
+
"loaded",
|
|
65
|
+
"keyed"
|
|
66
|
+
]
|
|
67
|
+
};
|
|
68
|
+
__services;
|
|
61
69
|
get $services() {
|
|
62
70
|
return this.__services;
|
|
63
71
|
}
|
|
64
|
-
|
|
72
|
+
__refs;
|
|
65
73
|
get $refs() {
|
|
66
74
|
return this.__refs;
|
|
67
75
|
}
|
|
68
|
-
|
|
76
|
+
__options;
|
|
69
77
|
get $options() {
|
|
70
78
|
return this.__options;
|
|
71
79
|
}
|
|
72
|
-
|
|
80
|
+
__children;
|
|
73
81
|
get $children() {
|
|
74
82
|
return this.__children;
|
|
75
83
|
}
|
|
76
|
-
|
|
84
|
+
__events;
|
|
77
85
|
get $log() {
|
|
78
|
-
return this.__options.log ? window.console.log.bind(window,
|
|
86
|
+
return this.__options.log ? window.console.log.bind(window, `[${this.__config.name}]`) : noop;
|
|
79
87
|
}
|
|
80
|
-
|
|
81
88
|
get __debug() {
|
|
82
|
-
return isDev && this.__options.debug ? window.console.log.bind(window,
|
|
89
|
+
return isDev && this.__options.debug ? window.console.log.bind(window, `[debug] [${this.$id}]`) : noop;
|
|
83
90
|
}
|
|
84
|
-
|
|
85
|
-
__callMethod(method) {
|
|
86
|
-
for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
|
87
|
-
args[_key - 1] = arguments[_key];
|
|
88
|
-
}
|
|
89
|
-
|
|
91
|
+
__callMethod(method, ...args) {
|
|
90
92
|
if (isDev) {
|
|
91
|
-
this.__debug(
|
|
93
|
+
this.__debug("callMethod", method, ...args);
|
|
92
94
|
}
|
|
93
|
-
|
|
94
95
|
this.$emit(method, ...args);
|
|
95
|
-
|
|
96
|
-
if (typeof this[method] !== 'function') {
|
|
96
|
+
if (typeof this[method] !== "function") {
|
|
97
97
|
return;
|
|
98
98
|
}
|
|
99
|
-
|
|
100
99
|
this[method].call(this, ...args);
|
|
101
|
-
|
|
102
100
|
if (isDev) {
|
|
103
101
|
this.__debug(method, this, ...args);
|
|
104
102
|
}
|
|
105
103
|
}
|
|
106
|
-
|
|
107
104
|
__hasEvent(event) {
|
|
108
|
-
|
|
109
|
-
|
|
105
|
+
const eventHandlers = this.__eventHandlers.get(event);
|
|
110
106
|
return eventHandlers && eventHandlers.size > 0;
|
|
111
107
|
}
|
|
112
|
-
|
|
113
108
|
constructor(element) {
|
|
114
109
|
super();
|
|
115
|
-
|
|
116
|
-
_defineProperty(this, "$parent", null);
|
|
117
|
-
|
|
118
|
-
_defineProperty(this, "$id", void 0);
|
|
119
|
-
|
|
120
|
-
_defineProperty(this, "$el", void 0);
|
|
121
|
-
|
|
122
|
-
_defineProperty(this, "$isMounted", false);
|
|
123
|
-
|
|
124
|
-
_defineProperty(this, "__eventHandlers", new Map());
|
|
125
|
-
|
|
126
|
-
_defineProperty(this, "__services", void 0);
|
|
127
|
-
|
|
128
|
-
_defineProperty(this, "__refs", void 0);
|
|
129
|
-
|
|
130
|
-
_defineProperty(this, "__options", void 0);
|
|
131
|
-
|
|
132
|
-
_defineProperty(this, "__children", void 0);
|
|
133
|
-
|
|
134
|
-
_defineProperty(this, "__events", void 0);
|
|
135
|
-
|
|
136
110
|
if (!element) {
|
|
137
|
-
throw new Error(
|
|
111
|
+
throw new Error("The root element must be defined.");
|
|
138
112
|
}
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
} = this;
|
|
143
|
-
|
|
144
|
-
if (__config.name === 'Base') {
|
|
145
|
-
throw new Error('The `config.name` property is required.');
|
|
113
|
+
const { __config } = this;
|
|
114
|
+
if (__config.name === "Base") {
|
|
115
|
+
throw new Error("The `config.name` property is required.");
|
|
146
116
|
}
|
|
147
|
-
|
|
148
|
-
this.$id = "".concat(__config.name, "-").concat(id);
|
|
117
|
+
this.$id = `${__config.name}-${id}`;
|
|
149
118
|
id += 1;
|
|
150
119
|
this.$el = element;
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
Object.defineProperty(this.$el, '__base__', {
|
|
120
|
+
if (!("__base__" in this.$el)) {
|
|
121
|
+
Object.defineProperty(this.$el, "__base__", {
|
|
154
122
|
get: () => this,
|
|
155
123
|
configurable: true
|
|
156
124
|
});
|
|
157
125
|
}
|
|
158
|
-
|
|
159
126
|
this.__options = new OptionsManager(element, __config.options || {}, __config);
|
|
160
127
|
this.__services = new ServicesManager(this);
|
|
161
128
|
this.__events = new EventsManager(element, this);
|
|
162
129
|
this.__children = new ChildrenManager(this, element, __config.components || {}, this.__events);
|
|
163
130
|
this.__refs = new RefsManager(this, element, __config.refs || [], this.__events);
|
|
164
|
-
|
|
165
131
|
if (isDev) {
|
|
166
|
-
this.__debug(
|
|
132
|
+
this.__debug("constructor", this);
|
|
167
133
|
}
|
|
168
|
-
|
|
169
134
|
return this;
|
|
170
135
|
}
|
|
171
|
-
|
|
172
136
|
$mount() {
|
|
173
137
|
if (this.$isMounted) {
|
|
174
138
|
return this;
|
|
175
139
|
}
|
|
176
|
-
|
|
177
140
|
this.$isMounted = true;
|
|
178
|
-
|
|
179
141
|
if (isDev) {
|
|
180
|
-
this.__debug(
|
|
142
|
+
this.__debug("$mount");
|
|
181
143
|
}
|
|
182
|
-
|
|
183
144
|
this.$children.registerAll();
|
|
184
145
|
this.$refs.registerAll();
|
|
185
|
-
|
|
186
146
|
this.__events.bindRootElement();
|
|
187
|
-
|
|
188
147
|
this.$services.enableAll();
|
|
189
148
|
this.$children.mountAll();
|
|
190
|
-
|
|
191
|
-
this.__callMethod('mounted');
|
|
192
|
-
|
|
149
|
+
this.__callMethod("mounted");
|
|
193
150
|
return this;
|
|
194
151
|
}
|
|
195
|
-
|
|
196
152
|
$update() {
|
|
197
153
|
if (isDev) {
|
|
198
|
-
this.__debug(
|
|
154
|
+
this.__debug("$update");
|
|
199
155
|
}
|
|
200
|
-
|
|
201
156
|
this.$refs.unregisterAll();
|
|
202
157
|
this.$services.disableAll();
|
|
203
158
|
this.$children.registerAll();
|
|
204
159
|
this.$refs.registerAll();
|
|
205
160
|
this.$services.enableAll();
|
|
206
161
|
this.$children.updateAll();
|
|
207
|
-
|
|
208
|
-
this.__callMethod('updated');
|
|
209
|
-
|
|
162
|
+
this.__callMethod("updated");
|
|
210
163
|
return this;
|
|
211
164
|
}
|
|
212
|
-
|
|
213
165
|
$destroy() {
|
|
214
166
|
if (!this.$isMounted) {
|
|
215
167
|
return this;
|
|
216
168
|
}
|
|
217
|
-
|
|
218
169
|
this.$isMounted = false;
|
|
219
|
-
|
|
220
170
|
if (isDev) {
|
|
221
|
-
this.__debug(
|
|
171
|
+
this.__debug("$destroy");
|
|
222
172
|
}
|
|
223
|
-
|
|
224
173
|
this.__events.unbindRootElement();
|
|
225
|
-
|
|
226
174
|
this.$refs.unregisterAll();
|
|
227
175
|
this.$services.disableAll();
|
|
228
176
|
this.$children.destroyAll();
|
|
229
|
-
|
|
230
|
-
this.__callMethod('destroyed');
|
|
231
|
-
|
|
177
|
+
this.__callMethod("destroyed");
|
|
232
178
|
return this;
|
|
233
179
|
}
|
|
234
|
-
|
|
235
180
|
$terminate() {
|
|
236
181
|
if (isDev) {
|
|
237
|
-
this.__debug(
|
|
182
|
+
this.__debug("$terminate");
|
|
238
183
|
}
|
|
239
|
-
|
|
240
184
|
this.$destroy();
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
Object.defineProperty(this.$el, '__base__', {
|
|
245
|
-
value: 'terminated',
|
|
185
|
+
this.__callMethod("terminated");
|
|
186
|
+
Object.defineProperty(this.$el, "__base__", {
|
|
187
|
+
value: "terminated",
|
|
246
188
|
configurable: false,
|
|
247
189
|
writable: false
|
|
248
190
|
});
|
|
249
191
|
}
|
|
250
|
-
|
|
251
192
|
__testEventIsDefined(event) {
|
|
252
193
|
if (!(Array.isArray(this.__config.emits) && this.__config.emits.includes(event))) {
|
|
253
|
-
console.warn(
|
|
194
|
+
console.warn(`[${this.__config.name}]`, `The "${event}" event is missing from the configuration.`);
|
|
254
195
|
}
|
|
255
196
|
}
|
|
256
|
-
|
|
257
197
|
__addEmits(event) {
|
|
258
|
-
|
|
259
|
-
|
|
198
|
+
const ctor = this.constructor;
|
|
260
199
|
if (Array.isArray(ctor.config.emits)) {
|
|
261
200
|
ctor.config.emits.push(event);
|
|
262
201
|
} else {
|
|
263
202
|
ctor.config.emits = [event];
|
|
264
203
|
}
|
|
265
204
|
}
|
|
266
|
-
|
|
267
205
|
__removeEmits(event) {
|
|
268
|
-
|
|
269
|
-
|
|
206
|
+
const ctor = this.constructor;
|
|
207
|
+
const index = ctor.config.emits.findIndex((value) => value === event);
|
|
270
208
|
ctor.config.emits.splice(index, 1);
|
|
271
209
|
}
|
|
272
|
-
|
|
273
210
|
$on(event, listener, options) {
|
|
274
211
|
if (isDev) {
|
|
275
|
-
this.__debug(
|
|
212
|
+
this.__debug("$on", event, listener, options);
|
|
276
213
|
}
|
|
277
|
-
|
|
278
214
|
if (isDev) {
|
|
279
215
|
this.__testEventIsDefined(event);
|
|
280
216
|
}
|
|
281
|
-
|
|
282
|
-
var set = this.__eventHandlers.get(event);
|
|
283
|
-
|
|
217
|
+
let set = this.__eventHandlers.get(event);
|
|
284
218
|
if (!set) {
|
|
285
|
-
set = new Set();
|
|
286
|
-
|
|
219
|
+
set = /* @__PURE__ */ new Set();
|
|
287
220
|
this.__eventHandlers.set(event, set);
|
|
288
221
|
}
|
|
289
|
-
|
|
290
222
|
set.add(listener);
|
|
291
223
|
this.addEventListener(event, listener, options);
|
|
292
224
|
return () => {
|
|
293
225
|
this.$off(event, listener, options);
|
|
294
226
|
};
|
|
295
227
|
}
|
|
296
|
-
|
|
297
228
|
$off(event, listener, options) {
|
|
298
229
|
if (isDev) {
|
|
299
|
-
this.__debug(
|
|
230
|
+
this.__debug("$off", event, listener);
|
|
300
231
|
}
|
|
301
|
-
|
|
302
232
|
if (isDev) {
|
|
303
233
|
this.__testEventIsDefined(event);
|
|
304
234
|
}
|
|
305
|
-
|
|
306
235
|
this.__eventHandlers.get(event).delete(listener);
|
|
307
|
-
|
|
308
236
|
this.removeEventListener(event, listener, options);
|
|
309
237
|
}
|
|
310
|
-
|
|
311
|
-
$emit(event) {
|
|
312
|
-
for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
|
|
313
|
-
args[_key2 - 1] = arguments[_key2];
|
|
314
|
-
}
|
|
315
|
-
|
|
238
|
+
$emit(event, ...args) {
|
|
316
239
|
if (isDev) {
|
|
317
|
-
this.__debug(
|
|
240
|
+
this.__debug("$emit", event, args);
|
|
318
241
|
}
|
|
319
|
-
|
|
320
242
|
if (isDev) {
|
|
321
243
|
this.__testEventIsDefined(event);
|
|
322
244
|
}
|
|
323
|
-
|
|
324
245
|
this.dispatchEvent(new CustomEvent(event, {
|
|
325
246
|
detail: args
|
|
326
247
|
}));
|
|
327
248
|
}
|
|
328
|
-
|
|
329
249
|
static $factory(nameOrSelector) {
|
|
330
250
|
if (!nameOrSelector) {
|
|
331
|
-
throw new Error(
|
|
251
|
+
throw new Error("The $factory method requires a component\u2019s name or selector to be specified.");
|
|
332
252
|
}
|
|
333
|
-
|
|
334
|
-
return getComponentElements(nameOrSelector).map(el => new this(el).$mount());
|
|
253
|
+
return getComponentElements(nameOrSelector).map((el) => new this(el).$mount());
|
|
335
254
|
}
|
|
336
|
-
|
|
337
255
|
}
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
_defineProperty(Base, "config", {
|
|
342
|
-
name: 'Base',
|
|
343
|
-
emits: ['mounted', 'updated', 'destroyed', 'terminated', 'ticked', 'scrolled', 'resized', 'moved', 'loaded', 'keyed']
|
|
344
|
-
});
|
|
256
|
+
export {
|
|
257
|
+
Base as default
|
|
258
|
+
};
|
|
@@ -0,0 +1,125 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
+
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
+
};
|
|
10
|
+
var __reExport = (target, module2, copyDefault, desc) => {
|
|
11
|
+
if (module2 && typeof module2 === "object" || typeof module2 === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(module2))
|
|
13
|
+
if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
|
|
14
|
+
__defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return target;
|
|
17
|
+
};
|
|
18
|
+
var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
19
|
+
return (module2, temp) => {
|
|
20
|
+
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
21
|
+
};
|
|
22
|
+
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
23
|
+
|
|
24
|
+
// packages/js-toolkit/Base/managers/ChildrenManager.js
|
|
25
|
+
var ChildrenManager_exports = {};
|
|
26
|
+
__export(ChildrenManager_exports, {
|
|
27
|
+
default: () => ChildrenManager
|
|
28
|
+
});
|
|
29
|
+
var import_utils = require("../utils.cjs");
|
|
30
|
+
var ChildrenManager = class {
|
|
31
|
+
__base;
|
|
32
|
+
__element;
|
|
33
|
+
__components;
|
|
34
|
+
__eventsManager;
|
|
35
|
+
get registeredNames() {
|
|
36
|
+
return Object.keys(this).filter((key) => !key.startsWith("__"));
|
|
37
|
+
}
|
|
38
|
+
constructor(base, element, components, eventsManager) {
|
|
39
|
+
Object.defineProperties(this, {
|
|
40
|
+
__base: {
|
|
41
|
+
enumerable: false,
|
|
42
|
+
writable: false,
|
|
43
|
+
value: base
|
|
44
|
+
},
|
|
45
|
+
__element: {
|
|
46
|
+
enumerable: false,
|
|
47
|
+
writable: false,
|
|
48
|
+
value: element
|
|
49
|
+
},
|
|
50
|
+
__components: {
|
|
51
|
+
enumerable: false,
|
|
52
|
+
writable: false,
|
|
53
|
+
value: components
|
|
54
|
+
},
|
|
55
|
+
__eventsManager: {
|
|
56
|
+
enumerable: false,
|
|
57
|
+
writable: false,
|
|
58
|
+
value: eventsManager
|
|
59
|
+
}
|
|
60
|
+
});
|
|
61
|
+
}
|
|
62
|
+
registerAll() {
|
|
63
|
+
Object.entries(this.__components).forEach(([name, component]) => this.__register(name, component));
|
|
64
|
+
}
|
|
65
|
+
__register(name, component) {
|
|
66
|
+
Object.defineProperty(this, name, {
|
|
67
|
+
enumerable: true,
|
|
68
|
+
configurable: true,
|
|
69
|
+
get: () => {
|
|
70
|
+
const elements = (0, import_utils.getComponentElements)(name, this.__element);
|
|
71
|
+
if (elements.length === 0) {
|
|
72
|
+
return [];
|
|
73
|
+
}
|
|
74
|
+
return elements.map((element) => this.__getChild(element, component, name)).filter((instance) => instance !== "terminated");
|
|
75
|
+
}
|
|
76
|
+
});
|
|
77
|
+
}
|
|
78
|
+
__getChild(el, ComponentClass, name) {
|
|
79
|
+
if (el.__base__) {
|
|
80
|
+
return el.__base__;
|
|
81
|
+
}
|
|
82
|
+
if ("$isBase" in ComponentClass) {
|
|
83
|
+
const child = new ComponentClass(el);
|
|
84
|
+
Object.defineProperty(child, "$parent", { get: () => this.__base });
|
|
85
|
+
return child;
|
|
86
|
+
}
|
|
87
|
+
return ComponentClass(this.__base).then((module2) => {
|
|
88
|
+
return this.__getChild(el, module2.default ?? module2, name);
|
|
89
|
+
});
|
|
90
|
+
}
|
|
91
|
+
mountAll() {
|
|
92
|
+
this.__triggerHookForAll("$mount");
|
|
93
|
+
}
|
|
94
|
+
updateAll() {
|
|
95
|
+
this.__triggerHookForAll("$update");
|
|
96
|
+
}
|
|
97
|
+
destroyAll() {
|
|
98
|
+
this.__triggerHookForAll("$destroy");
|
|
99
|
+
}
|
|
100
|
+
__triggerHookForAll(hook) {
|
|
101
|
+
this.registeredNames.forEach((name) => {
|
|
102
|
+
this[name].forEach((instance) => {
|
|
103
|
+
if (instance instanceof Promise) {
|
|
104
|
+
instance.then((resolvedInstance) => this.__triggerHook(hook, resolvedInstance, name));
|
|
105
|
+
} else {
|
|
106
|
+
this.__triggerHook(hook, instance, name);
|
|
107
|
+
}
|
|
108
|
+
});
|
|
109
|
+
});
|
|
110
|
+
}
|
|
111
|
+
__triggerHook(hook, instance, name) {
|
|
112
|
+
if (hook === "$update" && !instance.$isMounted) {
|
|
113
|
+
hook = "$mount";
|
|
114
|
+
}
|
|
115
|
+
if (hook === "$update" || hook === "$destroy") {
|
|
116
|
+
this.__eventsManager.unbindChild(name, instance);
|
|
117
|
+
}
|
|
118
|
+
if (hook === "$update" || hook === "$mount") {
|
|
119
|
+
this.__eventsManager.bindChild(name, instance);
|
|
120
|
+
}
|
|
121
|
+
instance[hook]();
|
|
122
|
+
}
|
|
123
|
+
};
|
|
124
|
+
module.exports = __toCommonJS(ChildrenManager_exports);
|
|
125
|
+
if (module.exports.default) module.exports = module.exports.default;
|
|
@@ -1,19 +1,13 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
import { getComponentElements } from "../utils.js";
|
|
2
|
+
class ChildrenManager {
|
|
3
|
+
__base;
|
|
4
|
+
__element;
|
|
5
|
+
__components;
|
|
6
|
+
__eventsManager;
|
|
4
7
|
get registeredNames() {
|
|
5
|
-
return Object.keys(this).filter(key => !key.startsWith(
|
|
8
|
+
return Object.keys(this).filter((key) => !key.startsWith("__"));
|
|
6
9
|
}
|
|
7
|
-
|
|
8
10
|
constructor(base, element, components, eventsManager) {
|
|
9
|
-
_defineProperty(this, "__base", void 0);
|
|
10
|
-
|
|
11
|
-
_defineProperty(this, "__element", void 0);
|
|
12
|
-
|
|
13
|
-
_defineProperty(this, "__components", void 0);
|
|
14
|
-
|
|
15
|
-
_defineProperty(this, "__eventsManager", void 0);
|
|
16
|
-
|
|
17
11
|
Object.defineProperties(this, {
|
|
18
12
|
__base: {
|
|
19
13
|
enumerable: false,
|
|
@@ -37,88 +31,68 @@ export default class ChildrenManager {
|
|
|
37
31
|
}
|
|
38
32
|
});
|
|
39
33
|
}
|
|
40
|
-
|
|
41
34
|
registerAll() {
|
|
42
|
-
Object.entries(this.__components).forEach(
|
|
43
|
-
var [name, component] = _ref;
|
|
44
|
-
return this.__register(name, component);
|
|
45
|
-
});
|
|
35
|
+
Object.entries(this.__components).forEach(([name, component]) => this.__register(name, component));
|
|
46
36
|
}
|
|
47
|
-
|
|
48
37
|
__register(name, component) {
|
|
49
38
|
Object.defineProperty(this, name, {
|
|
50
39
|
enumerable: true,
|
|
51
40
|
configurable: true,
|
|
52
41
|
get: () => {
|
|
53
|
-
|
|
54
|
-
|
|
42
|
+
const elements = getComponentElements(name, this.__element);
|
|
55
43
|
if (elements.length === 0) {
|
|
56
44
|
return [];
|
|
57
45
|
}
|
|
58
|
-
|
|
59
|
-
return elements.map(element => this.__getChild(element, component, name)).filter(instance => instance !== 'terminated');
|
|
46
|
+
return elements.map((element) => this.__getChild(element, component, name)).filter((instance) => instance !== "terminated");
|
|
60
47
|
}
|
|
61
48
|
});
|
|
62
49
|
}
|
|
63
|
-
|
|
64
50
|
__getChild(el, ComponentClass, name) {
|
|
65
51
|
if (el.__base__) {
|
|
66
52
|
return el.__base__;
|
|
67
53
|
}
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
Object.defineProperty(child, '$parent', {
|
|
72
|
-
get: () => this.__base
|
|
73
|
-
});
|
|
54
|
+
if ("$isBase" in ComponentClass) {
|
|
55
|
+
const child = new ComponentClass(el);
|
|
56
|
+
Object.defineProperty(child, "$parent", { get: () => this.__base });
|
|
74
57
|
return child;
|
|
75
58
|
}
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
var _module$default;
|
|
79
|
-
|
|
80
|
-
return this.__getChild(el, (_module$default = module.default) !== null && _module$default !== void 0 ? _module$default : module, name);
|
|
59
|
+
return ComponentClass(this.__base).then((module) => {
|
|
60
|
+
return this.__getChild(el, module.default ?? module, name);
|
|
81
61
|
});
|
|
82
62
|
}
|
|
83
|
-
|
|
84
63
|
mountAll() {
|
|
85
|
-
this.__triggerHookForAll(
|
|
64
|
+
this.__triggerHookForAll("$mount");
|
|
86
65
|
}
|
|
87
|
-
|
|
88
66
|
updateAll() {
|
|
89
|
-
this.__triggerHookForAll(
|
|
67
|
+
this.__triggerHookForAll("$update");
|
|
90
68
|
}
|
|
91
|
-
|
|
92
69
|
destroyAll() {
|
|
93
|
-
this.__triggerHookForAll(
|
|
70
|
+
this.__triggerHookForAll("$destroy");
|
|
94
71
|
}
|
|
95
|
-
|
|
96
72
|
__triggerHookForAll(hook) {
|
|
97
|
-
this.registeredNames.forEach(name => {
|
|
98
|
-
this[name].forEach(instance => {
|
|
73
|
+
this.registeredNames.forEach((name) => {
|
|
74
|
+
this[name].forEach((instance) => {
|
|
99
75
|
if (instance instanceof Promise) {
|
|
100
|
-
instance.then(resolvedInstance => this.__triggerHook(hook, resolvedInstance, name));
|
|
76
|
+
instance.then((resolvedInstance) => this.__triggerHook(hook, resolvedInstance, name));
|
|
101
77
|
} else {
|
|
102
78
|
this.__triggerHook(hook, instance, name);
|
|
103
79
|
}
|
|
104
80
|
});
|
|
105
81
|
});
|
|
106
82
|
}
|
|
107
|
-
|
|
108
83
|
__triggerHook(hook, instance, name) {
|
|
109
|
-
if (hook ===
|
|
110
|
-
hook =
|
|
84
|
+
if (hook === "$update" && !instance.$isMounted) {
|
|
85
|
+
hook = "$mount";
|
|
111
86
|
}
|
|
112
|
-
|
|
113
|
-
if (hook === '$update' || hook === '$destroy') {
|
|
87
|
+
if (hook === "$update" || hook === "$destroy") {
|
|
114
88
|
this.__eventsManager.unbindChild(name, instance);
|
|
115
89
|
}
|
|
116
|
-
|
|
117
|
-
if (hook === '$update' || hook === '$mount') {
|
|
90
|
+
if (hook === "$update" || hook === "$mount") {
|
|
118
91
|
this.__eventsManager.bindChild(name, instance);
|
|
119
92
|
}
|
|
120
|
-
|
|
121
93
|
instance[hook]();
|
|
122
94
|
}
|
|
123
|
-
|
|
124
|
-
|
|
95
|
+
}
|
|
96
|
+
export {
|
|
97
|
+
ChildrenManager as default
|
|
98
|
+
};
|