@studiometa/js-toolkit 3.0.0-alpha.1 → 3.0.0-alpha.10
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/Base.d.ts +7 -7
- package/Base/Base.js +67 -33
- package/Base/Base.js.map +2 -2
- package/Base/features.d.ts +6 -1
- package/Base/features.js +9 -1
- package/Base/features.js.map +2 -2
- package/Base/index.d.ts +1 -0
- package/Base/index.js +4 -0
- package/Base/index.js.map +2 -2
- package/Base/managers/AbstractManager.d.ts +3 -3
- package/Base/managers/ChildrenManager.d.ts +6 -6
- package/Base/managers/ChildrenManager.js +34 -20
- package/Base/managers/ChildrenManager.js.map +2 -2
- package/Base/managers/EventsManager.d.ts +6 -28
- package/Base/managers/EventsManager.js +54 -64
- package/Base/managers/EventsManager.js.map +2 -2
- package/Base/managers/OptionsManager.d.ts +6 -6
- package/Base/managers/OptionsManager.js +29 -23
- package/Base/managers/OptionsManager.js.map +3 -3
- package/Base/managers/RefsManager.d.ts +1 -1
- package/Base/managers/RefsManager.js +23 -34
- package/Base/managers/RefsManager.js.map +3 -3
- package/Base/managers/ResponsiveOptionsManager.js +7 -4
- package/Base/managers/ResponsiveOptionsManager.js.map +2 -2
- package/Base/utils.d.ts +10 -5
- package/Base/utils.js +36 -22
- package/Base/utils.js.map +2 -2
- package/README.md +107 -6
- package/decorators/index.d.ts +1 -0
- package/decorators/index.js +1 -0
- package/decorators/index.js.map +2 -2
- package/decorators/withBreakpointManager.js +6 -4
- package/decorators/withBreakpointManager.js.map +2 -2
- package/decorators/withBreakpointObserver.d.ts +0 -1
- package/decorators/withBreakpointObserver.js +4 -2
- package/decorators/withBreakpointObserver.js.map +2 -2
- package/decorators/withIntersectionObserver.js +2 -4
- package/decorators/withIntersectionObserver.js.map +2 -2
- package/decorators/withMountOnMediaQuery.js +2 -2
- package/decorators/withMountOnMediaQuery.js.map +2 -2
- package/decorators/withMountWhenInView.js +2 -2
- package/decorators/withMountWhenInView.js.map +2 -2
- package/decorators/withName.d.ts +6 -0
- package/decorators/withName.js +12 -0
- package/decorators/withName.js.map +7 -0
- package/helpers/createApp.d.ts +3 -5
- package/helpers/createApp.js +21 -11
- package/helpers/createApp.js.map +2 -2
- package/helpers/getDirectChildren.js +10 -5
- package/helpers/getDirectChildren.js.map +2 -2
- package/helpers/importWhenVisible.js +1 -2
- package/helpers/importWhenVisible.js.map +1 -1
- package/index.d.ts +2 -3
- package/index.js +2 -4
- package/index.js.map +2 -2
- package/package.json +2 -2
- package/services/resize.js +2 -3
- package/services/resize.js.map +2 -2
- package/services/scroll.d.ts +14 -0
- package/services/scroll.js +31 -13
- package/services/scroll.js.map +2 -2
- package/utils/index.d.ts +1 -0
- package/utils/index.js +1 -0
- package/utils/index.js.map +2 -2
- package/utils/math/createRange.d.ts +4 -0
- package/utils/math/createRange.js +13 -0
- package/utils/math/createRange.js.map +7 -0
- package/utils/math/index.d.ts +1 -0
- package/utils/math/index.js +2 -0
- package/utils/math/index.js.map +2 -2
- package/utils/memo.d.ts +5 -0
- package/utils/memo.js +14 -0
- package/utils/memo.js.map +7 -0
- package/utils/random.js +1 -1
- package/utils/random.js.map +1 -1
- package/utils/string/changeCase.d.ts +24 -0
- package/utils/string/changeCase.js +47 -0
- package/utils/string/changeCase.js.map +7 -0
- package/utils/string/index.d.ts +1 -0
- package/utils/string/index.js +1 -0
- package/utils/string/index.js.map +2 -2
- package/Base/managers/ActionManager.d.ts +0 -4
- package/Base/managers/ActionManager.js +0 -10
- package/Base/managers/ActionManager.js.map +0 -7
package/Base/Base.d.ts
CHANGED
|
@@ -47,7 +47,7 @@ export type Managers = {
|
|
|
47
47
|
/**
|
|
48
48
|
* Base class.
|
|
49
49
|
*/
|
|
50
|
-
export declare class Base<T extends BaseProps = BaseProps>
|
|
50
|
+
export declare class Base<T extends BaseProps = BaseProps> {
|
|
51
51
|
/**
|
|
52
52
|
* This is a Base instance.
|
|
53
53
|
*/
|
|
@@ -126,19 +126,19 @@ export declare class Base<T extends BaseProps = BaseProps> extends EventTarget {
|
|
|
126
126
|
/**
|
|
127
127
|
* Trigger the `mounted` callback.
|
|
128
128
|
*/
|
|
129
|
-
$mount(): this
|
|
129
|
+
$mount(): Promise<this>;
|
|
130
130
|
/**
|
|
131
131
|
* Update the instance children.
|
|
132
132
|
*/
|
|
133
|
-
$update(): this
|
|
133
|
+
$update(): Promise<this>;
|
|
134
134
|
/**
|
|
135
135
|
* Trigger the `destroyed` callback.
|
|
136
136
|
*/
|
|
137
|
-
$destroy(): this
|
|
137
|
+
$destroy(): Promise<this>;
|
|
138
138
|
/**
|
|
139
139
|
* Terminate a child instance when it is not needed anymore.
|
|
140
140
|
*/
|
|
141
|
-
$terminate(): void
|
|
141
|
+
$terminate(): Promise<void>;
|
|
142
142
|
/**
|
|
143
143
|
* Add an emitted event.
|
|
144
144
|
*
|
|
@@ -189,9 +189,9 @@ export declare class Base<T extends BaseProps = BaseProps> extends EventTarget {
|
|
|
189
189
|
* @param {any[]} args The arguments to apply to the functions bound to this event.
|
|
190
190
|
* @returns {void}
|
|
191
191
|
*/
|
|
192
|
-
$emit(event: string, ...args: unknown[]): void;
|
|
192
|
+
$emit(event: string | Event, ...args: unknown[]): void;
|
|
193
193
|
/**
|
|
194
194
|
* Register and mount all instances of the component.
|
|
195
195
|
*/
|
|
196
|
-
static $register(nameOrSelector?: string): Base
|
|
196
|
+
static $register(nameOrSelector?: string): Array<Promise<Base>>;
|
|
197
197
|
}
|
package/Base/Base.js
CHANGED
|
@@ -1,4 +1,10 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {
|
|
2
|
+
getComponentElements,
|
|
3
|
+
getEventTarget,
|
|
4
|
+
addToQueue,
|
|
5
|
+
addInstance,
|
|
6
|
+
deleteInstance
|
|
7
|
+
} from "./utils.js";
|
|
2
8
|
import {
|
|
3
9
|
ChildrenManager,
|
|
4
10
|
RefsManager,
|
|
@@ -8,7 +14,7 @@ import {
|
|
|
8
14
|
} from "./managers/index.js";
|
|
9
15
|
import { noop, isDev, isFunction, isArray } from "../utils/index.js";
|
|
10
16
|
let id = 0;
|
|
11
|
-
class Base
|
|
17
|
+
class Base {
|
|
12
18
|
/**
|
|
13
19
|
* This is a Base instance.
|
|
14
20
|
*/
|
|
@@ -168,7 +174,6 @@ class Base extends EventTarget {
|
|
|
168
174
|
* @param {HTMLElement} element The component's root element dd.
|
|
169
175
|
*/
|
|
170
176
|
constructor(element) {
|
|
171
|
-
super();
|
|
172
177
|
if (!element) {
|
|
173
178
|
if (isDev) {
|
|
174
179
|
throw new Error("The root element must be defined.");
|
|
@@ -192,6 +197,12 @@ class Base extends EventTarget {
|
|
|
192
197
|
for (const service of ["Options", "Services", "Events", "Refs", "Children"]) {
|
|
193
198
|
this[`__${service.toLowerCase()}`] = new this.__managers[`${service}Manager`](this);
|
|
194
199
|
}
|
|
200
|
+
this.$on("mounted", () => {
|
|
201
|
+
addInstance(this);
|
|
202
|
+
});
|
|
203
|
+
this.$on("destroyed", () => {
|
|
204
|
+
deleteInstance(this);
|
|
205
|
+
});
|
|
195
206
|
if (isDev) {
|
|
196
207
|
this.__debug("constructor", this);
|
|
197
208
|
}
|
|
@@ -199,7 +210,7 @@ class Base extends EventTarget {
|
|
|
199
210
|
/**
|
|
200
211
|
* Trigger the `mounted` callback.
|
|
201
212
|
*/
|
|
202
|
-
$mount() {
|
|
213
|
+
async $mount() {
|
|
203
214
|
if (this.$isMounted) {
|
|
204
215
|
return this;
|
|
205
216
|
}
|
|
@@ -207,59 +218,73 @@ class Base extends EventTarget {
|
|
|
207
218
|
if (isDev) {
|
|
208
219
|
this.__debug("$mount");
|
|
209
220
|
}
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
221
|
+
await Promise.all([
|
|
222
|
+
addToQueue(() => this.$children.registerAll()),
|
|
223
|
+
addToQueue(() => this.$refs.registerAll()),
|
|
224
|
+
addToQueue(() => this.__events.bindRootElement()),
|
|
225
|
+
addToQueue(() => this.$services.enableAll()),
|
|
226
|
+
addToQueue(() => this.$children.mountAll()),
|
|
227
|
+
addToQueue(() => this.$isMounted = true),
|
|
228
|
+
addToQueue(() => this.__callMethod("mounted"))
|
|
229
|
+
]);
|
|
217
230
|
return this;
|
|
218
231
|
}
|
|
219
232
|
/**
|
|
220
233
|
* Update the instance children.
|
|
221
234
|
*/
|
|
222
|
-
$update() {
|
|
235
|
+
async $update() {
|
|
223
236
|
if (isDev) {
|
|
224
237
|
this.__debug("$update");
|
|
225
238
|
}
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
239
|
+
await Promise.all([
|
|
240
|
+
// Undo
|
|
241
|
+
addToQueue(() => this.$refs.unregisterAll()),
|
|
242
|
+
addToQueue(() => this.$services.disableAll()),
|
|
243
|
+
// Redo
|
|
244
|
+
addToQueue(() => this.$children.registerAll()),
|
|
245
|
+
addToQueue(() => this.$refs.registerAll()),
|
|
246
|
+
addToQueue(() => this.$services.enableAll()),
|
|
247
|
+
// Update
|
|
248
|
+
addToQueue(() => this.$children.updateAll()),
|
|
249
|
+
addToQueue(() => this.__callMethod("updated"))
|
|
250
|
+
]);
|
|
233
251
|
return this;
|
|
234
252
|
}
|
|
235
253
|
/**
|
|
236
254
|
* Trigger the `destroyed` callback.
|
|
237
255
|
*/
|
|
238
|
-
$destroy() {
|
|
256
|
+
async $destroy() {
|
|
239
257
|
if (!this.$isMounted) {
|
|
240
258
|
return this;
|
|
241
259
|
}
|
|
242
260
|
if (isDev) {
|
|
243
261
|
this.__debug("$destroy");
|
|
244
262
|
}
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
263
|
+
await Promise.all([
|
|
264
|
+
addToQueue(() => this.$isMounted = false),
|
|
265
|
+
addToQueue(() => this.__events.unbindRootElement()),
|
|
266
|
+
addToQueue(() => this.$refs.unregisterAll()),
|
|
267
|
+
addToQueue(() => this.$services.disableAll()),
|
|
268
|
+
addToQueue(() => this.$children.destroyAll()),
|
|
269
|
+
addToQueue(() => this.__callMethod("destroyed"))
|
|
270
|
+
]);
|
|
251
271
|
return this;
|
|
252
272
|
}
|
|
253
273
|
/**
|
|
254
274
|
* Terminate a child instance when it is not needed anymore.
|
|
255
275
|
*/
|
|
256
|
-
$terminate() {
|
|
276
|
+
async $terminate() {
|
|
257
277
|
if (isDev) {
|
|
258
278
|
this.__debug("$terminate");
|
|
259
279
|
}
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
280
|
+
await Promise.all([
|
|
281
|
+
// First, destroy the component.
|
|
282
|
+
addToQueue(() => this.$destroy()),
|
|
283
|
+
// Execute the `terminated` hook if it exists
|
|
284
|
+
addToQueue(() => this.__callMethod("terminated")),
|
|
285
|
+
// Delete instance
|
|
286
|
+
addToQueue(() => this.$el.__base__.set(this.__ctor, "terminated"))
|
|
287
|
+
]);
|
|
263
288
|
}
|
|
264
289
|
/**
|
|
265
290
|
* Add an emitted event.
|
|
@@ -315,7 +340,16 @@ class Base extends EventTarget {
|
|
|
315
340
|
}
|
|
316
341
|
set.add(listener);
|
|
317
342
|
const target = getEventTarget(this, event, this.__config);
|
|
318
|
-
target
|
|
343
|
+
target?.addEventListener(event, listener, options);
|
|
344
|
+
if (isDev) {
|
|
345
|
+
if (!target) {
|
|
346
|
+
console.warn(
|
|
347
|
+
`[${this.$id}]`,
|
|
348
|
+
`The "${event}" event is missing from the configuration and is not a native`,
|
|
349
|
+
`event for the root element of type \`${this.$el.constructor.name}\`.`
|
|
350
|
+
);
|
|
351
|
+
}
|
|
352
|
+
}
|
|
319
353
|
return () => {
|
|
320
354
|
this.$off(event, listener, options);
|
|
321
355
|
};
|
|
@@ -337,7 +371,7 @@ class Base extends EventTarget {
|
|
|
337
371
|
}
|
|
338
372
|
this.__eventHandlers.get(event).delete(listener);
|
|
339
373
|
const target = getEventTarget(this, event, this.__config);
|
|
340
|
-
target
|
|
374
|
+
target?.removeEventListener(event, listener, options);
|
|
341
375
|
}
|
|
342
376
|
/**
|
|
343
377
|
* Emits an event.
|
|
@@ -350,7 +384,7 @@ class Base extends EventTarget {
|
|
|
350
384
|
if (isDev) {
|
|
351
385
|
this.__debug("$emit", event, args);
|
|
352
386
|
}
|
|
353
|
-
this.dispatchEvent(new CustomEvent(event, { detail: args }));
|
|
387
|
+
this.$el.dispatchEvent(event instanceof Event ? event : new CustomEvent(event, { detail: args }));
|
|
354
388
|
}
|
|
355
389
|
/**
|
|
356
390
|
* Register and mount all instances of the component.
|
package/Base/Base.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../packages/js-toolkit/Base/Base.ts"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable no-use-before-define */\nimport { getComponentElements, getEventTarget, addToQueue } from './utils.js';\nimport {\n ChildrenManager,\n RefsManager,\n ServicesManager,\n EventsManager,\n OptionsManager,\n} from './managers/index.js';\nimport { noop, isDev, isFunction, isArray } from '../utils/index.js';\n\nlet id = 0;\n\nexport type BaseEl = HTMLElement & { __base__?: WeakMap<BaseConstructor, Base | 'terminated'> };\nexport type BaseConstructor<T extends Base = Base> = {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n new (...args: any[]): T;\n prototype: Base;\n} & Pick<typeof Base, keyof typeof Base>;\nexport type BaseAsyncConstructor<T extends Base = Base> = (\n instance: Base,\n) => Promise<BaseConstructor<T> | { default: BaseConstructor<T> }>;\nexport type BaseOptions = { [name: string]: unknown };\nexport type BaseRefs = { [name: string]: HTMLElement | HTMLElement[] };\nexport type BaseChildren = { [nameOrSelector: string]: Base[] | Promise<Base>[] };\nexport type BaseConfigComponents = {\n [nameOrSelector: string]: BaseConstructor | BaseAsyncConstructor;\n};\n\nexport type BaseConfig = {\n name: string;\n debug?: boolean;\n log?: boolean;\n refs?: string[];\n emits?: string[];\n components?: BaseConfigComponents;\n options?: import('./managers/OptionsManager').OptionsSchema;\n};\n\nexport type BaseProps = {\n $el?: HTMLElement;\n $options?: BaseOptions;\n $refs?: BaseRefs;\n $children?: BaseChildren;\n $parent?: Base;\n};\n\nexport type Managers = {\n ChildrenManager: typeof ChildrenManager;\n EventsManager: typeof EventsManager;\n OptionsManager: typeof OptionsManager;\n RefsManager: typeof RefsManager;\n ServicesManager: typeof ServicesManager;\n};\n\n/**\n * Base class.\n */\nexport class Base<T extends BaseProps = BaseProps> extends EventTarget {\n /**\n * This is a Base instance.\n */\n static readonly $isBase = true as const;\n\n /**\n * The instance parent.\n */\n $parent: T['$parent'] & Base = null;\n\n /**\n * The instance id.\n */\n $id: string;\n\n /**\n * The root element.\n */\n $el: T['$el'] & BaseEl;\n\n /**\n * The state of the component.\n */\n $isMounted = false;\n\n /**\n * Store the event handlers.\n */\n __eventHandlers: Map<string, Set<EventListenerOrEventListenerObject>> = new Map();\n\n /**\n * Get the root instance of the app.\n */\n get $root(): Base {\n if (!this.$parent) {\n return this;\n }\n\n let parent = this.$parent;\n let root = this.$parent;\n\n while (parent) {\n if (!parent.$parent) {\n root = parent;\n }\n\n parent = parent.$parent;\n }\n\n return root;\n }\n\n /**\n * Merge configuration with the parents' configurations.\n */\n get __config(): BaseConfig {\n let proto = Object.getPrototypeOf(this);\n let { config } = proto.constructor;\n\n while (proto.constructor.config && proto.constructor.$isBase) {\n config = { ...proto.constructor.config, ...config };\n\n if (proto.constructor.config.options) {\n config.options = { ...proto.constructor.config.options, ...config.options };\n }\n\n if (proto.constructor.config.emits && config.emits) {\n config.emits = [...proto.constructor.config.emits, ...config.emits];\n }\n\n proto = Object.getPrototypeOf(proto);\n }\n\n config.options = config.options ?? {};\n config.refs = config.refs ?? [];\n config.components = config.components ?? {};\n\n return config;\n }\n\n static config: BaseConfig = {\n name: 'Base',\n emits: [\n // hook events\n 'before-mounted',\n 'mounted',\n 'updated',\n 'destroyed',\n 'terminated',\n // default services' events\n 'ticked',\n 'scrolled',\n 'resized',\n 'moved',\n 'loaded',\n 'keyed',\n ],\n };\n\n __services: ServicesManager;\n\n get $services(): ServicesManager {\n return this.__services;\n }\n\n __refs: RefsManager & T['$refs'] & BaseRefs;\n\n get $refs(): RefsManager & T['$refs'] & BaseRefs {\n return this.__refs;\n }\n\n __options: OptionsManager & T['$options'] & BaseOptions;\n\n get $options(): OptionsManager & T['$options'] & BaseOptions {\n return this.__options;\n }\n\n __children: ChildrenManager & T['$children'] & BaseChildren;\n\n get $children(): ChildrenManager & T['$children'] & BaseChildren {\n return this.__children;\n }\n\n __events: EventsManager;\n\n /**\n * Small helper to log stuff.\n */\n get $log(): (...args: unknown[]) => void {\n return this.__options.log ? window.console.log.bind(window, `[${this.__config.name}]`) : noop;\n }\n\n /**\n * Small helper to make warning easier.\n */\n get $warn(): (...args: unknown[]) => void {\n return this.__options.log ? window.console.warn.bind(window, `[${this.__config.name}]`) : noop;\n }\n\n /**\n * Small helper to debug information.\n */\n get __debug(): (...args: unknown[]) => void {\n return isDev && this.__options.debug\n ? window.console.log.bind(window, `[debug] [${this.$id}]`)\n : noop;\n }\n\n /**\n * Get manager constructors.\n */\n get __managers(): Managers {\n return {\n ChildrenManager,\n EventsManager,\n OptionsManager,\n RefsManager,\n ServicesManager,\n };\n }\n\n /**\n * Call an instance method and emit corresponding events.\n */\n __callMethod(method: string, ...args: unknown[]): unknown {\n if (isDev) {\n this.__debug('callMethod', method, ...args);\n }\n\n this.$emit(method, ...args);\n\n // We always emit an event, but we do not call the method if it does not exist\n if (!isFunction(this[method])) {\n return null;\n }\n\n if (isDev) {\n this.__debug(method, this, ...args);\n }\n\n return this[method].call(this, ...args);\n }\n\n /**\n * Test if the given event has been bound to the instance.\n *\n * @param {string} event The event's name.\n * @returns {boolean} Wether the given event has been bound or not.\n */\n __hasEvent(event: string): boolean {\n const eventHandlers = this.__eventHandlers.get(event);\n return eventHandlers && eventHandlers.size > 0;\n }\n\n /**\n * Class constructor where all the magic takes place.\n *\n * @param {HTMLElement} element The component's root element dd.\n */\n constructor(element: HTMLElement) {\n super();\n\n if (!element) {\n if (isDev) {\n throw new Error('The root element must be defined.');\n }\n return;\n }\n\n const { __config } = this;\n\n if (__config.name === 'Base') {\n if (isDev) {\n throw new Error('The `config.name` property is required.');\n }\n return;\n }\n\n this.$id = `${__config.name}-${id}`;\n id += 1;\n\n this.$el = element;\n\n if (!this.$el.__base__) {\n this.$el.__base__ = new WeakMap();\n }\n\n this.$el.__base__.set(this.__ctor, this);\n\n for (const service of ['Options', 'Services', 'Events', 'Refs', 'Children']) {\n this[`__${service.toLowerCase()}`] = new this.__managers[`${service}Manager`](this);\n }\n\n if (isDev) {\n this.__debug('constructor', this);\n }\n }\n\n /**\n * Trigger the `mounted` callback.\n */\n $mount(): this {\n if (this.$isMounted) {\n return this;\n }\n\n this.$emit('before-mounted');\n\n if (isDev) {\n this.__debug('$mount');\n }\n\n addToQueue(() => this.$children.registerAll());\n addToQueue(() => this.$refs.registerAll());\n addToQueue(() => this.__events.bindRootElement());\n addToQueue(() => this.$services.enableAll());\n addToQueue(() => this.$children.mountAll());\n // eslint-disable-next-line no-return-assign\n addToQueue(() => (this.$isMounted = true));\n addToQueue(() => this.__callMethod('mounted'));\n\n return this;\n }\n\n /**\n * Update the instance children.\n */\n $update(): this {\n if (isDev) {\n this.__debug('$update');\n }\n\n // Undo\n addToQueue(() => this.$refs.unregisterAll());\n addToQueue(() => this.$services.disableAll());\n // Redo\n addToQueue(() => this.$children.registerAll());\n addToQueue(() => this.$refs.registerAll());\n addToQueue(() => this.$services.enableAll());\n // Update\n addToQueue(() => this.$children.updateAll());\n addToQueue(() => this.__callMethod('updated'));\n\n return this;\n }\n\n /**\n * Trigger the `destroyed` callback.\n */\n $destroy(): this {\n if (!this.$isMounted) {\n return this;\n }\n\n if (isDev) {\n this.__debug('$destroy');\n }\n\n // eslint-disable-next-line no-return-assign\n addToQueue(() => (this.$isMounted = false));\n addToQueue(() => this.__events.unbindRootElement());\n addToQueue(() => this.$refs.unregisterAll());\n addToQueue(() => this.$services.disableAll());\n addToQueue(() => this.$children.destroyAll());\n addToQueue(() => this.__callMethod('destroyed'));\n\n return this;\n }\n\n /**\n * Terminate a child instance when it is not needed anymore.\n */\n $terminate(): void {\n if (isDev) {\n this.__debug('$terminate');\n }\n\n // First, destroy the component.\n addToQueue(() => this.$destroy());\n // Execute the `terminated` hook if it exists\n addToQueue(() => this.__callMethod('terminated'));\n // Delete instance\n addToQueue(() => this.$el.__base__.set(this.__ctor, 'terminated'));\n }\n\n /**\n * Add an emitted event.\n *\n * @param {string} event The event name.\n * @returns {void}\n */\n __addEmits(event: string): void {\n const ctor = this.__ctor;\n if (isArray(ctor.config.emits)) {\n ctor.config.emits.push(event);\n } else {\n ctor.config.emits = [event];\n }\n }\n\n /**\n * Remove an emitted event.\n *\n * @param {string} event The event name.\n * @returns {void}\n */\n __removeEmits(event: string): void {\n const ctor = this.__ctor;\n const index = ctor.config.emits.indexOf(event);\n ctor.config.emits.splice(index, 1);\n }\n\n /**\n * Get the instance constructor.\n */\n get __ctor(): BaseConstructor {\n return this.constructor as BaseConstructor;\n }\n\n /**\n * Bind a listener function to an event.\n *\n * @param {string} event\n * Name of the event.\n * @param {EventListenerOrEventListenerObject} listener\n * Function to be called.\n * @param {boolean|AddEventListenerOptions} [options]\n * Options for the `removeEventListener` method.\n * @returns {() => void}\n * A function to unbind the listener.\n */\n $on(\n event: string,\n listener: EventListenerOrEventListenerObject,\n options?: boolean | AddEventListenerOptions,\n ): () => void {\n if (isDev) {\n this.__debug('$on', event, listener, options);\n }\n\n let set = this.__eventHandlers.get(event);\n\n if (!set) {\n set = new Set();\n this.__eventHandlers.set(event, set);\n }\n\n set.add(listener);\n\n const target = getEventTarget(this, event, this.__config);\n target.addEventListener(event, listener, options);\n\n return () => {\n this.$off(event, listener, options);\n };\n }\n\n /**\n * Unbind a listener function from an event.\n *\n * @param {string} event\n * Name of the event.\n * @param {EventListenerOrEventListenerObject} listener\n * Function to be removed.\n * @param {boolean|EventListenerOptions} [options]\n * Options for the `removeEventListener` method.\n * @returns {void}\n */\n $off(\n event: string,\n listener: EventListenerOrEventListenerObject,\n options?: boolean | EventListenerOptions,\n ) {\n if (isDev) {\n this.__debug('$off', event, listener);\n }\n\n this.__eventHandlers.get(event).delete(listener);\n\n const target = getEventTarget(this, event, this.__config);\n target.removeEventListener(event, listener, options);\n }\n\n /**\n * Emits an event.\n *\n * @param {string} event Name of the event.\n * @param {any[]} args The arguments to apply to the functions bound to this event.\n * @returns {void}\n */\n $emit(event: string, ...args: unknown[]) {\n if (isDev) {\n this.__debug('$emit', event, args);\n }\n\n this.dispatchEvent(new CustomEvent(event, { detail: args }));\n }\n\n /**\n * Register and mount all instances of the component.\n */\n static $register(nameOrSelector?: string): Base[] {\n return getComponentElements(nameOrSelector ?? this.config.name).map((el) =>\n new this(el).$mount(),\n );\n }\n}\n"],
|
|
5
|
-
"mappings": "AACA,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable no-use-before-define */\nimport {\n getComponentElements,\n getEventTarget,\n addToQueue,\n addInstance,\n deleteInstance,\n} from './utils.js';\nimport {\n ChildrenManager,\n RefsManager,\n ServicesManager,\n EventsManager,\n OptionsManager,\n} from './managers/index.js';\nimport { noop, isDev, isFunction, isArray } from '../utils/index.js';\n\nlet id = 0;\n\nexport type BaseEl = HTMLElement & { __base__?: WeakMap<BaseConstructor, Base | 'terminated'> };\nexport type BaseConstructor<T extends Base = Base> = {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n new (...args: any[]): T;\n prototype: Base;\n} & Pick<typeof Base, keyof typeof Base>;\nexport type BaseAsyncConstructor<T extends Base = Base> = (\n instance: Base,\n) => Promise<BaseConstructor<T> | { default: BaseConstructor<T> }>;\nexport type BaseOptions = { [name: string]: unknown };\nexport type BaseRefs = { [name: string]: HTMLElement | HTMLElement[] };\nexport type BaseChildren = { [nameOrSelector: string]: Base[] | Promise<Base>[] };\nexport type BaseConfigComponents = {\n [nameOrSelector: string]: BaseConstructor | BaseAsyncConstructor;\n};\n\nexport type BaseConfig = {\n name: string;\n debug?: boolean;\n log?: boolean;\n refs?: string[];\n emits?: string[];\n components?: BaseConfigComponents;\n options?: import('./managers/OptionsManager').OptionsSchema;\n};\n\nexport type BaseProps = {\n $el?: HTMLElement;\n $options?: BaseOptions;\n $refs?: BaseRefs;\n $children?: BaseChildren;\n $parent?: Base;\n};\n\nexport type Managers = {\n ChildrenManager: typeof ChildrenManager;\n EventsManager: typeof EventsManager;\n OptionsManager: typeof OptionsManager;\n RefsManager: typeof RefsManager;\n ServicesManager: typeof ServicesManager;\n};\n\n/**\n * Base class.\n */\nexport class Base<T extends BaseProps = BaseProps> {\n /**\n * This is a Base instance.\n */\n static readonly $isBase = true as const;\n\n /**\n * The instance parent.\n */\n $parent: T['$parent'] & Base = null;\n\n /**\n * The instance id.\n */\n $id: string;\n\n /**\n * The root element.\n */\n $el: T['$el'] & BaseEl;\n\n /**\n * The state of the component.\n */\n $isMounted = false;\n\n /**\n * Store the event handlers.\n */\n __eventHandlers: Map<string, Set<EventListenerOrEventListenerObject>> = new Map();\n\n /**\n * Get the root instance of the app.\n */\n get $root(): Base {\n if (!this.$parent) {\n return this;\n }\n\n let parent = this.$parent;\n let root = this.$parent;\n\n while (parent) {\n if (!parent.$parent) {\n root = parent;\n }\n\n parent = parent.$parent;\n }\n\n return root;\n }\n\n /**\n * Merge configuration with the parents' configurations.\n */\n get __config(): BaseConfig {\n let proto = Object.getPrototypeOf(this);\n let { config } = proto.constructor;\n\n while (proto.constructor.config && proto.constructor.$isBase) {\n config = { ...proto.constructor.config, ...config };\n\n if (proto.constructor.config.options) {\n config.options = { ...proto.constructor.config.options, ...config.options };\n }\n\n if (proto.constructor.config.emits && config.emits) {\n config.emits = [...proto.constructor.config.emits, ...config.emits];\n }\n\n proto = Object.getPrototypeOf(proto);\n }\n\n config.options = config.options ?? {};\n config.refs = config.refs ?? [];\n config.components = config.components ?? {};\n\n return config;\n }\n\n static config: BaseConfig = {\n name: 'Base',\n emits: [\n // hook events\n 'before-mounted',\n 'mounted',\n 'updated',\n 'destroyed',\n 'terminated',\n // default services' events\n 'ticked',\n 'scrolled',\n 'resized',\n 'moved',\n 'loaded',\n 'keyed',\n ],\n };\n\n __services: ServicesManager;\n\n get $services(): ServicesManager {\n return this.__services;\n }\n\n __refs: RefsManager & T['$refs'] & BaseRefs;\n\n get $refs(): RefsManager & T['$refs'] & BaseRefs {\n return this.__refs;\n }\n\n __options: OptionsManager & T['$options'] & BaseOptions;\n\n get $options(): OptionsManager & T['$options'] & BaseOptions {\n return this.__options;\n }\n\n __children: ChildrenManager & T['$children'] & BaseChildren;\n\n get $children(): ChildrenManager & T['$children'] & BaseChildren {\n return this.__children;\n }\n\n __events: EventsManager;\n\n /**\n * Small helper to log stuff.\n */\n get $log(): (...args: unknown[]) => void {\n return this.__options.log ? window.console.log.bind(window, `[${this.__config.name}]`) : noop;\n }\n\n /**\n * Small helper to make warning easier.\n */\n get $warn(): (...args: unknown[]) => void {\n return this.__options.log ? window.console.warn.bind(window, `[${this.__config.name}]`) : noop;\n }\n\n /**\n * Small helper to debug information.\n */\n get __debug(): (...args: unknown[]) => void {\n return isDev && this.__options.debug\n ? window.console.log.bind(window, `[debug] [${this.$id}]`)\n : noop;\n }\n\n /**\n * Get manager constructors.\n */\n get __managers(): Managers {\n return {\n ChildrenManager,\n EventsManager,\n OptionsManager,\n RefsManager,\n ServicesManager,\n };\n }\n\n /**\n * Call an instance method and emit corresponding events.\n */\n __callMethod(method: string, ...args: unknown[]): unknown {\n if (isDev) {\n this.__debug('callMethod', method, ...args);\n }\n\n this.$emit(method, ...args);\n\n // We always emit an event, but we do not call the method if it does not exist\n if (!isFunction(this[method])) {\n return null;\n }\n\n if (isDev) {\n this.__debug(method, this, ...args);\n }\n\n return this[method].call(this, ...args);\n }\n\n /**\n * Test if the given event has been bound to the instance.\n *\n * @param {string} event The event's name.\n * @returns {boolean} Wether the given event has been bound or not.\n */\n __hasEvent(event: string): boolean {\n const eventHandlers = this.__eventHandlers.get(event);\n return eventHandlers && eventHandlers.size > 0;\n }\n\n /**\n * Class constructor where all the magic takes place.\n *\n * @param {HTMLElement} element The component's root element dd.\n */\n constructor(element: HTMLElement) {\n if (!element) {\n if (isDev) {\n throw new Error('The root element must be defined.');\n }\n return;\n }\n\n const { __config } = this;\n\n if (__config.name === 'Base') {\n if (isDev) {\n throw new Error('The `config.name` property is required.');\n }\n return;\n }\n\n this.$id = `${__config.name}-${id}`;\n id += 1;\n\n this.$el = element;\n\n if (!this.$el.__base__) {\n this.$el.__base__ = new WeakMap();\n }\n\n this.$el.__base__.set(this.__ctor, this);\n\n for (const service of ['Options', 'Services', 'Events', 'Refs', 'Children']) {\n this[`__${service.toLowerCase()}`] = new this.__managers[`${service}Manager`](this);\n }\n\n this.$on('mounted', () => {\n addInstance(this);\n });\n this.$on('destroyed', () => {\n deleteInstance(this);\n });\n\n if (isDev) {\n this.__debug('constructor', this);\n }\n }\n\n /**\n * Trigger the `mounted` callback.\n */\n async $mount(): Promise<this> {\n if (this.$isMounted) {\n return this;\n }\n\n this.$emit('before-mounted');\n\n if (isDev) {\n this.__debug('$mount');\n }\n\n await Promise.all([\n addToQueue(() => this.$children.registerAll()),\n addToQueue(() => this.$refs.registerAll()),\n addToQueue(() => this.__events.bindRootElement()),\n addToQueue(() => this.$services.enableAll()),\n addToQueue(() => this.$children.mountAll()),\n addToQueue(() => (this.$isMounted = true)),\n addToQueue(() => this.__callMethod('mounted')),\n ]);\n\n return this;\n }\n\n /**\n * Update the instance children.\n */\n async $update(): Promise<this> {\n if (isDev) {\n this.__debug('$update');\n }\n\n await Promise.all([\n // Undo\n addToQueue(() => this.$refs.unregisterAll()),\n addToQueue(() => this.$services.disableAll()),\n // Redo\n addToQueue(() => this.$children.registerAll()),\n addToQueue(() => this.$refs.registerAll()),\n addToQueue(() => this.$services.enableAll()),\n // Update\n addToQueue(() => this.$children.updateAll()),\n addToQueue(() => this.__callMethod('updated')),\n ]);\n\n return this;\n }\n\n /**\n * Trigger the `destroyed` callback.\n */\n async $destroy(): Promise<this> {\n if (!this.$isMounted) {\n return this;\n }\n\n if (isDev) {\n this.__debug('$destroy');\n }\n\n await Promise.all([\n addToQueue(() => (this.$isMounted = false)),\n addToQueue(() => this.__events.unbindRootElement()),\n addToQueue(() => this.$refs.unregisterAll()),\n addToQueue(() => this.$services.disableAll()),\n addToQueue(() => this.$children.destroyAll()),\n addToQueue(() => this.__callMethod('destroyed')),\n ]);\n\n return this;\n }\n\n /**\n * Terminate a child instance when it is not needed anymore.\n */\n async $terminate(): Promise<void> {\n if (isDev) {\n this.__debug('$terminate');\n }\n\n await Promise.all([\n // First, destroy the component.\n addToQueue(() => this.$destroy()),\n // Execute the `terminated` hook if it exists\n addToQueue(() => this.__callMethod('terminated')),\n // Delete instance\n addToQueue(() => this.$el.__base__.set(this.__ctor, 'terminated')),\n ]);\n }\n\n /**\n * Add an emitted event.\n *\n * @param {string} event The event name.\n * @returns {void}\n */\n __addEmits(event: string): void {\n const ctor = this.__ctor;\n if (isArray(ctor.config.emits)) {\n ctor.config.emits.push(event);\n } else {\n ctor.config.emits = [event];\n }\n }\n\n /**\n * Remove an emitted event.\n *\n * @param {string} event The event name.\n * @returns {void}\n */\n __removeEmits(event: string): void {\n const ctor = this.__ctor;\n const index = ctor.config.emits.indexOf(event);\n ctor.config.emits.splice(index, 1);\n }\n\n /**\n * Get the instance constructor.\n */\n get __ctor(): BaseConstructor {\n return this.constructor as BaseConstructor;\n }\n\n /**\n * Bind a listener function to an event.\n *\n * @param {string} event\n * Name of the event.\n * @param {EventListenerOrEventListenerObject} listener\n * Function to be called.\n * @param {boolean|AddEventListenerOptions} [options]\n * Options for the `removeEventListener` method.\n * @returns {() => void}\n * A function to unbind the listener.\n */\n $on(\n event: string,\n listener: EventListenerOrEventListenerObject,\n options?: boolean | AddEventListenerOptions,\n ): () => void {\n if (isDev) {\n this.__debug('$on', event, listener, options);\n }\n\n let set = this.__eventHandlers.get(event);\n\n if (!set) {\n set = new Set();\n this.__eventHandlers.set(event, set);\n }\n\n set.add(listener);\n\n const target = getEventTarget(this, event, this.__config);\n target?.addEventListener(event, listener, options);\n\n if (isDev) {\n if (!target) {\n console.warn(\n `[${this.$id}]`,\n `The \"${event}\" event is missing from the configuration and is not a native`,\n `event for the root element of type \\`${this.$el.constructor.name}\\`.`,\n );\n }\n }\n\n return () => {\n this.$off(event, listener, options);\n };\n }\n\n /**\n * Unbind a listener function from an event.\n *\n * @param {string} event\n * Name of the event.\n * @param {EventListenerOrEventListenerObject} listener\n * Function to be removed.\n * @param {boolean|EventListenerOptions} [options]\n * Options for the `removeEventListener` method.\n * @returns {void}\n */\n $off(\n event: string,\n listener: EventListenerOrEventListenerObject,\n options?: boolean | EventListenerOptions,\n ) {\n if (isDev) {\n this.__debug('$off', event, listener);\n }\n\n this.__eventHandlers.get(event).delete(listener);\n\n const target = getEventTarget(this, event, this.__config);\n target?.removeEventListener(event, listener, options);\n }\n\n /**\n * Emits an event.\n *\n * @param {string} event Name of the event.\n * @param {any[]} args The arguments to apply to the functions bound to this event.\n * @returns {void}\n */\n $emit(event: string | Event, ...args: unknown[]) {\n if (isDev) {\n this.__debug('$emit', event, args);\n }\n\n this.$el.dispatchEvent(event instanceof Event ? event : new CustomEvent(event, { detail: args }));\n }\n\n /**\n * Register and mount all instances of the component.\n */\n static $register(nameOrSelector?: string): Array<Promise<Base>> {\n return getComponentElements(nameOrSelector ?? this.config.name).map((el) =>\n new this(el).$mount(),\n );\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/Base/features.d.ts
CHANGED
|
@@ -1,6 +1,11 @@
|
|
|
1
1
|
export type Features = {
|
|
2
|
-
|
|
2
|
+
blocking: boolean;
|
|
3
3
|
breakpoints: Record<string, string>;
|
|
4
|
+
attributes: {
|
|
5
|
+
component: string;
|
|
6
|
+
option: string;
|
|
7
|
+
ref: string;
|
|
8
|
+
};
|
|
4
9
|
};
|
|
5
10
|
interface FeaturesMap extends Map<keyof Features, Features[keyof Features]> {
|
|
6
11
|
get<T extends keyof Features>(key: T): Features[T];
|
package/Base/features.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
const features = /* @__PURE__ */ new Map([
|
|
2
|
-
["
|
|
2
|
+
["blocking", false],
|
|
3
3
|
[
|
|
4
4
|
"breakpoints",
|
|
5
5
|
{
|
|
@@ -19,6 +19,14 @@ const features = /* @__PURE__ */ new Map([
|
|
|
19
19
|
xxxl: "160rem"
|
|
20
20
|
// 2560px
|
|
21
21
|
}
|
|
22
|
+
],
|
|
23
|
+
[
|
|
24
|
+
"attributes",
|
|
25
|
+
{
|
|
26
|
+
component: "data-component",
|
|
27
|
+
option: "data-option",
|
|
28
|
+
ref: "data-ref"
|
|
29
|
+
}
|
|
22
30
|
]
|
|
23
31
|
]);
|
|
24
32
|
export {
|
package/Base/features.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../packages/js-toolkit/Base/features.ts"],
|
|
4
|
-
"sourcesContent": ["export type Features = {\n
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["export type Features = {\n blocking: boolean;\n breakpoints: Record<string, string>;\n attributes: {\n component: string;\n option: string;\n ref: string;\n }\n};\n\ninterface FeaturesMap extends Map<keyof Features, Features[keyof Features]> {\n get<T extends keyof Features>(key: T): Features[T];\n set<T extends keyof Features>(key: T, value: Features[T]): this;\n}\n\nexport const features = new Map<keyof Features, Features[keyof Features]>([\n ['blocking', false],\n [\n 'breakpoints',\n {\n xxs: '0rem',\n xs: '30rem', // 480px\n s: '48rem', // 768px\n m: '64rem', // 1024px\n l: '80rem', // 1280px\n xl: '90rem', // 1440px\n xxl: '120rem', // 1920px\n xxxl: '160rem', // 2560px\n },\n ],\n [\n 'attributes',\n {\n component: 'data-component',\n option: 'data-option',\n ref: 'data-ref'\n }\n ]\n]) as FeaturesMap;\n"],
|
|
5
|
+
"mappings": "AAeO,MAAM,WAAW,oBAAI,IAA8C;AAAA,EACxE,CAAC,YAAY,KAAK;AAAA,EAClB;AAAA,IACE;AAAA,IACA;AAAA,MACE,KAAK;AAAA,MACL,IAAI;AAAA;AAAA,MACJ,GAAG;AAAA;AAAA,MACH,GAAG;AAAA;AAAA,MACH,GAAG;AAAA;AAAA,MACH,IAAI;AAAA;AAAA,MACJ,KAAK;AAAA;AAAA,MACL,MAAM;AAAA;AAAA,IACR;AAAA,EACF;AAAA,EACA;AAAA,IACE;AAAA,IACA;AAAA,MACE,WAAW;AAAA,MACX,QAAQ;AAAA,MACR,KAAK;AAAA,IACP;AAAA,EACF;AACF,CAAC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/Base/index.d.ts
CHANGED
package/Base/index.js
CHANGED
package/Base/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../packages/js-toolkit/Base/index.ts"],
|
|
4
|
-
"sourcesContent": ["export * from './Base.js';\n"],
|
|
5
|
-
"mappings": "AAAA,cAAc;",
|
|
4
|
+
"sourcesContent": ["export * from './Base.js';\nexport { getInstances } from './utils.js';\n"],
|
|
5
|
+
"mappings": "AAAA,cAAc;AACd,SAAS,oBAAoB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -11,16 +11,16 @@ export declare class AbstractManager {
|
|
|
11
11
|
* Get the base instance root element.
|
|
12
12
|
*/
|
|
13
13
|
get __element(): HTMLElement & {
|
|
14
|
-
__base__?: WeakMap<import("Base
|
|
14
|
+
__base__?: WeakMap<import("../Base.js").BaseConstructor, Base | "terminated">;
|
|
15
15
|
};
|
|
16
16
|
/**
|
|
17
17
|
* Get the base instance config.
|
|
18
18
|
*/
|
|
19
|
-
get __config(): import("Base
|
|
19
|
+
get __config(): import("../Base.js").BaseConfig;
|
|
20
20
|
/**
|
|
21
21
|
* Get the events manager.
|
|
22
22
|
*/
|
|
23
|
-
get __eventsManager(): import("
|
|
23
|
+
get __eventsManager(): import("./EventsManager.js").EventsManager;
|
|
24
24
|
/**
|
|
25
25
|
* Class constructor.
|
|
26
26
|
*/
|
|
@@ -17,19 +17,19 @@ export declare class ChildrenManager extends AbstractManager {
|
|
|
17
17
|
/**
|
|
18
18
|
* Register instances of all children components.
|
|
19
19
|
*/
|
|
20
|
-
registerAll(): void
|
|
20
|
+
registerAll(): Promise<void>;
|
|
21
21
|
/**
|
|
22
22
|
* Mount all child component instances.
|
|
23
23
|
*/
|
|
24
|
-
mountAll(): void
|
|
24
|
+
mountAll(): Promise<void>;
|
|
25
25
|
/**
|
|
26
26
|
* Update all child component instances.
|
|
27
27
|
*/
|
|
28
|
-
updateAll(): void
|
|
28
|
+
updateAll(): Promise<void>;
|
|
29
29
|
/**
|
|
30
30
|
* Destroy all child component instances.
|
|
31
31
|
*/
|
|
32
|
-
destroyAll(): void
|
|
32
|
+
destroyAll(): Promise<void>;
|
|
33
33
|
/**
|
|
34
34
|
* Execute the given hook for the given instance.
|
|
35
35
|
*
|
|
@@ -38,7 +38,7 @@ export declare class ChildrenManager extends AbstractManager {
|
|
|
38
38
|
* @param {string} name The name of the component.
|
|
39
39
|
* @private
|
|
40
40
|
*/
|
|
41
|
-
__triggerHook(hook: '$mount' | '$update' | '$destroy', instance: Base, name: string): void
|
|
41
|
+
__triggerHook(hook: '$mount' | '$update' | '$destroy', instance: Base, name: string): Promise<void>;
|
|
42
42
|
/**
|
|
43
43
|
* Register instance of a child component.
|
|
44
44
|
*
|
|
@@ -49,5 +49,5 @@ export declare class ChildrenManager extends AbstractManager {
|
|
|
49
49
|
* @private
|
|
50
50
|
*/
|
|
51
51
|
__register(name: string, component: BaseConstructor | BaseAsyncConstructor): void;
|
|
52
|
-
__getValue(name: string, component: BaseConstructor | BaseAsyncConstructor):
|
|
52
|
+
__getValue(name: string, component: BaseConstructor | BaseAsyncConstructor): any[];
|
|
53
53
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { AbstractManager } from "./AbstractManager.js";
|
|
2
2
|
import { getComponentElements, addToQueue } from "../utils.js";
|
|
3
3
|
import { startsWith } from "../../utils/index.js";
|
|
4
|
-
function __getChild(that, el, ComponentClass
|
|
4
|
+
function __getChild(that, el, ComponentClass) {
|
|
5
5
|
const asyncComponentPromise = that.__asyncComponentPromises.get(
|
|
6
6
|
ComponentClass
|
|
7
7
|
);
|
|
@@ -32,22 +32,26 @@ function __getChild(that, el, ComponentClass, name) {
|
|
|
32
32
|
status: "resolved",
|
|
33
33
|
ctor
|
|
34
34
|
});
|
|
35
|
-
return __getChild(that, el, ctor
|
|
35
|
+
return __getChild(that, el, ctor);
|
|
36
36
|
});
|
|
37
37
|
}
|
|
38
|
-
function __triggerHookForAll(that, hook) {
|
|
39
|
-
addToQueue(() => {
|
|
38
|
+
async function __triggerHookForAll(that, hook) {
|
|
39
|
+
return addToQueue(() => {
|
|
40
|
+
const promises = [];
|
|
40
41
|
for (const name of that.registeredNames) {
|
|
41
42
|
for (const instance of that[name]) {
|
|
42
43
|
if (instance instanceof Promise) {
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
44
|
+
promises.push(
|
|
45
|
+
instance.then(
|
|
46
|
+
(resolvedInstance) => addToQueue(() => that.__triggerHook(hook, resolvedInstance, name))
|
|
47
|
+
)
|
|
48
|
+
);
|
|
46
49
|
} else {
|
|
47
|
-
addToQueue(() => that.__triggerHook(hook, instance, name));
|
|
50
|
+
promises.push(addToQueue(() => that.__triggerHook(hook, instance, name)));
|
|
48
51
|
}
|
|
49
52
|
}
|
|
50
53
|
}
|
|
54
|
+
return Promise.all(promises);
|
|
51
55
|
});
|
|
52
56
|
}
|
|
53
57
|
class ChildrenManager extends AbstractManager {
|
|
@@ -62,27 +66,30 @@ class ChildrenManager extends AbstractManager {
|
|
|
62
66
|
/**
|
|
63
67
|
* Register instances of all children components.
|
|
64
68
|
*/
|
|
65
|
-
registerAll() {
|
|
66
|
-
|
|
67
|
-
|
|
69
|
+
async registerAll() {
|
|
70
|
+
const promises = [];
|
|
71
|
+
for (const [name, component] of Object.entries(this.__config.components)) {
|
|
72
|
+
promises.push(this.__register(name, component));
|
|
73
|
+
}
|
|
74
|
+
await Promise.all(promises);
|
|
68
75
|
}
|
|
69
76
|
/**
|
|
70
77
|
* Mount all child component instances.
|
|
71
78
|
*/
|
|
72
|
-
mountAll() {
|
|
73
|
-
__triggerHookForAll(this, "$mount");
|
|
79
|
+
async mountAll() {
|
|
80
|
+
await __triggerHookForAll(this, "$mount");
|
|
74
81
|
}
|
|
75
82
|
/**
|
|
76
83
|
* Update all child component instances.
|
|
77
84
|
*/
|
|
78
|
-
updateAll() {
|
|
79
|
-
__triggerHookForAll(this, "$update");
|
|
85
|
+
async updateAll() {
|
|
86
|
+
await __triggerHookForAll(this, "$update");
|
|
80
87
|
}
|
|
81
88
|
/**
|
|
82
89
|
* Destroy all child component instances.
|
|
83
90
|
*/
|
|
84
|
-
destroyAll() {
|
|
85
|
-
__triggerHookForAll(this, "$destroy");
|
|
91
|
+
async destroyAll() {
|
|
92
|
+
await __triggerHookForAll(this, "$destroy");
|
|
86
93
|
}
|
|
87
94
|
/**
|
|
88
95
|
* Execute the given hook for the given instance.
|
|
@@ -92,7 +99,7 @@ class ChildrenManager extends AbstractManager {
|
|
|
92
99
|
* @param {string} name The name of the component.
|
|
93
100
|
* @private
|
|
94
101
|
*/
|
|
95
|
-
__triggerHook(hook, instance, name) {
|
|
102
|
+
async __triggerHook(hook, instance, name) {
|
|
96
103
|
if (hook === "$update" && !instance.$isMounted) {
|
|
97
104
|
hook = "$mount";
|
|
98
105
|
}
|
|
@@ -102,7 +109,7 @@ class ChildrenManager extends AbstractManager {
|
|
|
102
109
|
if (hook === "$update" || hook === "$mount") {
|
|
103
110
|
this.__eventsManager.bindChild(name, instance);
|
|
104
111
|
}
|
|
105
|
-
instance[hook]();
|
|
112
|
+
await instance[hook]();
|
|
106
113
|
}
|
|
107
114
|
/**
|
|
108
115
|
* Register instance of a child component.
|
|
@@ -125,7 +132,14 @@ class ChildrenManager extends AbstractManager {
|
|
|
125
132
|
if (elements.length === 0) {
|
|
126
133
|
return [];
|
|
127
134
|
}
|
|
128
|
-
|
|
135
|
+
const children = [];
|
|
136
|
+
for (const element of elements) {
|
|
137
|
+
const child = __getChild(this, element, component);
|
|
138
|
+
if (child !== "terminated") {
|
|
139
|
+
children.push(child);
|
|
140
|
+
}
|
|
141
|
+
}
|
|
142
|
+
return children;
|
|
129
143
|
}
|
|
130
144
|
}
|
|
131
145
|
export {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../packages/js-toolkit/Base/managers/ChildrenManager.ts"],
|
|
4
|
-
"sourcesContent": ["import type { Base, BaseConstructor, BaseAsyncConstructor, BaseEl } from '../index.js';\nimport { AbstractManager } from './AbstractManager.js';\nimport { getComponentElements, addToQueue } from '../utils.js';\nimport { startsWith } from '../../utils/index.js';\n\n/**\n * Get a child component's instance.\n *\n * @param {ChildrenManager} that\n * @param {HTMLElement & { __base__?: WeakMap<BaseConstructor, Base> }} el\n * The root element of the child component.\n * @param {BaseConstructor|BaseAsyncConstructor} ComponentClass\n * A Base class or a Promise for async components.\n * @
|
|
5
|
-
"mappings": "AACA,SAAS,uBAAuB;AAChC,SAAS,sBAAsB,kBAAkB;AACjD,SAAS,kBAAkB;
|
|
4
|
+
"sourcesContent": ["import type { Base, BaseConstructor, BaseAsyncConstructor, BaseEl } from '../index.js';\nimport { AbstractManager } from './AbstractManager.js';\nimport { getComponentElements, addToQueue } from '../utils.js';\nimport { startsWith } from '../../utils/index.js';\n\n/**\n * Get a child component's instance.\n *\n * @param {ChildrenManager} that\n * @param {HTMLElement & { __base__?: WeakMap<BaseConstructor, Base> }} el\n * The root element of the child component.\n * @param {BaseConstructor|BaseAsyncConstructor} ComponentClass\n * A Base class or a Promise for async components.\n * @returns {Base|Promise<Base | 'terminated'>|'terminated'}\n * A Base instance or a Promise resolving to a Base instance.\n * @private\n */\nfunction __getChild(\n // eslint-disable-next-line no-use-before-define\n that: ChildrenManager,\n el: BaseEl,\n ComponentClass: BaseConstructor | BaseAsyncConstructor,\n): Base | Promise<Base | 'terminated'> | 'terminated' {\n const asyncComponentPromise = that.__asyncComponentPromises.get(\n ComponentClass as BaseAsyncConstructor,\n );\n\n // Test if we have a constructor and not a promise or if the promise has been resolved\n if (\n '$isBase' in ComponentClass ||\n (asyncComponentPromise && asyncComponentPromise.status === 'resolved')\n ) {\n let ctor = ComponentClass as BaseConstructor;\n\n // Get resolved constructor from weakmap.\n // Only test for existence as the status was checked before.\n if (asyncComponentPromise) {\n ctor = asyncComponentPromise.ctor;\n }\n\n // Return existing instance if it exists\n if (el.__base__ && el.__base__.has(ctor)) {\n return el.__base__.get(ctor);\n }\n\n // Return a new instance if the component class is a child of the Base class\n // eslint-disable-next-line new-cap\n const child = new ctor(el);\n Object.defineProperty(child, '$parent', { get: () => that.__base });\n return child;\n }\n\n const promise = asyncComponentPromise\n ? asyncComponentPromise.promise\n : ComponentClass(that.__base);\n\n if (!asyncComponentPromise) {\n that.__asyncComponentPromises.set(ComponentClass, {\n promise,\n status: 'pending',\n ctor: undefined,\n });\n }\n\n // Resolve async components\n return promise.then((module) => {\n // @ts-ignore\n const ctor = module.default ?? module;\n\n that.__asyncComponentPromises.set(ComponentClass, {\n promise,\n status: 'resolved',\n ctor,\n });\n\n return __getChild(that, el, ctor);\n });\n}\n\n/**\n * Execute the given hook for all children instances.\n *\n * @param {ChildrenManager} that\n * @param {'$mount'|'$update'|'$destroy'} hook The hook to execute.\n * @private\n */\n// eslint-disable-next-line no-use-before-define\nasync function __triggerHookForAll(that: ChildrenManager, hook: '$mount' | '$update' | '$destroy') {\n return addToQueue(() => {\n const promises = [];\n for (const name of that.registeredNames) {\n for (const instance of that[name]) {\n if (instance instanceof Promise) {\n promises.push(\n instance.then((resolvedInstance) =>\n addToQueue(() => that.__triggerHook(hook, resolvedInstance, name)),\n ),\n );\n } else {\n promises.push(addToQueue(() => that.__triggerHook(hook, instance, name)));\n }\n }\n }\n return Promise.all(promises);\n });\n}\n\n/**\n * Children manager.\n */\nexport class ChildrenManager extends AbstractManager {\n /**\n * Store async component promises to avoid calling them multiple times and\n * waiting for them when they are already resolved.\n */\n __asyncComponentPromises: WeakMap<\n BaseAsyncConstructor,\n {\n promise: ReturnType<BaseAsyncConstructor>;\n status: 'pending' | 'resolved';\n ctor?: BaseConstructor;\n }\n > = new WeakMap();\n\n get registeredNames(): string[] {\n return Object.keys(this).filter((key) => !startsWith(key, '__'));\n }\n\n /**\n * Register instances of all children components.\n */\n async registerAll() {\n const promises = [];\n\n for (const [name, component] of Object.entries(this.__config.components)) {\n promises.push(this.__register(name, component));\n }\n\n await Promise.all(promises);\n }\n\n /**\n * Mount all child component instances.\n */\n async mountAll() {\n await __triggerHookForAll(this, '$mount');\n }\n\n /**\n * Update all child component instances.\n */\n async updateAll() {\n await __triggerHookForAll(this, '$update');\n }\n\n /**\n * Destroy all child component instances.\n */\n async destroyAll() {\n await __triggerHookForAll(this, '$destroy');\n }\n\n /**\n * Execute the given hook for the given instance.\n *\n * @param {'$mount'|'$update'|'$destroy'} hook The hook to trigger.\n * @param {Base} instance The target instance.\n * @param {string} name The name of the component.\n * @private\n */\n async __triggerHook(hook: '$mount' | '$update' | '$destroy', instance: Base, name: string) {\n if (hook === '$update' && !instance.$isMounted) {\n // eslint-disable-next-line no-param-reassign\n hook = '$mount';\n }\n\n if (hook === '$update' || hook === '$destroy') {\n this.__eventsManager.unbindChild(name, instance);\n }\n\n if (hook === '$update' || hook === '$mount') {\n this.__eventsManager.bindChild(name, instance);\n }\n\n await instance[hook]();\n }\n\n /**\n * Register instance of a child component.\n *\n * @param {string} name\n * The name of the child component.\n * @param {BaseConstructor|BaseAsyncConstructor} component\n * A Base class or a Promise for async components.\n * @private\n */\n __register(name: string, component: BaseConstructor | BaseAsyncConstructor) {\n Object.defineProperty(this, name, {\n enumerable: true,\n configurable: true,\n get: () => this.__getValue(name, component),\n });\n }\n\n __getValue(name: string, component: BaseConstructor | BaseAsyncConstructor) {\n const elements = getComponentElements(name, this.__element);\n\n if (elements.length === 0) {\n return [];\n }\n\n\n const children = [];\n for (const element of elements) {\n const child = __getChild(this, element, component);\n if (child !== 'terminated') {\n children.push(child);\n }\n }\n\n return children;\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|