@twobirds/microcomponents 0.2.2 → 0.2.4
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/README.md +45 -20
- package/dist/MC.min.js +1 -1
- package/dist/autoload.min.js +1 -1
- package/dist/core/MC.d.ts +288 -237
- package/dist/core/MC.d.ts.map +1 -1
- package/dist/core/MC.js +438 -182
- package/dist/core/elements.d.ts +58 -231
- package/dist/core/elements.d.ts.map +1 -1
- package/dist/core/elements.js +99 -214
- package/dist/core/index.d.ts +75 -0
- package/dist/core/index.d.ts.map +1 -0
- package/dist/core/index.js +72 -0
- package/dist/core/mcGuards.d.ts +7 -7
- package/dist/core/mcGuards.d.ts.map +1 -1
- package/dist/core/mcGuards.js +1 -1
- package/dist/elements.min.js +1 -1
- package/dist/formValues.min.js +1 -1
- package/dist/mcGuards.min.js +1 -1
- package/dist/microcomponents.min.js +1 -1
- package/dist/observables.min.js +1 -1
- package/dist/state/formValues.d.ts +3 -1
- package/dist/state/formValues.d.ts.map +1 -1
- package/dist/state/formValues.js +3 -1
- package/dist/state/index.d.ts +7 -0
- package/dist/state/index.d.ts.map +1 -0
- package/dist/state/index.js +5 -0
- package/dist/state/observables.d.ts +7 -59
- package/dist/state/observables.d.ts.map +1 -1
- package/dist/state/observables.js +63 -1
- package/dist/state/placeholders.d.ts +1 -0
- package/dist/state/placeholders.d.ts.map +1 -1
- package/dist/state/placeholders.js +1 -0
- package/dist/types/index.d.ts +7 -0
- package/dist/types/index.d.ts.map +1 -0
- package/dist/types/index.js +1 -0
- package/dist/types/mcTypes.d.ts +3 -3
- package/dist/types/mcTypes.js +1 -1
- package/dist/utils/autoload.d.ts +6 -2
- package/dist/utils/autoload.d.ts.map +1 -1
- package/dist/utils/autoload.js +7 -5
- package/dist/utils/events.d.ts +22 -79
- package/dist/utils/events.d.ts.map +1 -1
- package/dist/utils/events.js +63 -1
- package/dist/utils/helpers.d.ts +3 -2
- package/dist/utils/helpers.d.ts.map +1 -1
- package/dist/utils/helpers.js +3 -2
- package/dist/utils/index.d.ts +17 -0
- package/dist/utils/index.d.ts.map +1 -0
- package/dist/utils/index.js +12 -0
- package/package.json +9 -11
|
@@ -54,6 +54,7 @@ state.user.bind(document.querySelector('.model'));
|
|
|
54
54
|
|
|
55
55
|
*/
|
|
56
56
|
/**
|
|
57
|
+
@hidden
|
|
57
58
|
A callback invoked with the current observable value when notified.
|
|
58
59
|
|
|
59
60
|
@example
|
|
@@ -64,6 +65,7 @@ observable.subscribe(cb);
|
|
|
64
65
|
*/
|
|
65
66
|
export type Callback<T = unknown> = (value: T) => void;
|
|
66
67
|
/**
|
|
68
|
+
@hidden
|
|
67
69
|
Interface representing an observable object that supports subscription, notification, and DOM binding.
|
|
68
70
|
|
|
69
71
|
Observable objects track registered callbacks and invoke them when their internal state changes.
|
|
@@ -85,6 +87,7 @@ export type Observable<T = unknown> = T & {
|
|
|
85
87
|
callbacks: Array<Function>;
|
|
86
88
|
};
|
|
87
89
|
/**
|
|
90
|
+
@hidden
|
|
88
91
|
Every property of `T` mapped to an observable of its value.
|
|
89
92
|
|
|
90
93
|
KNOWN LIMIT: the runtime property *setter* accepts a plain value
|
|
@@ -114,6 +117,7 @@ export type Observed<T> = {
|
|
|
114
117
|
[K in keyof T]: Observable<T[K]>;
|
|
115
118
|
};
|
|
116
119
|
/**
|
|
120
|
+
@hidden
|
|
117
121
|
Only `K` of `T` mapped to an observable; other properties keep their type.
|
|
118
122
|
Carries the same write limitation as {@link Observed} for the mapped key.
|
|
119
123
|
|
|
@@ -127,6 +131,7 @@ export type ObservedKey<T, K extends keyof T> = {
|
|
|
127
131
|
[P in keyof T]: P extends K ? Observable<T[P]> : T[P];
|
|
128
132
|
};
|
|
129
133
|
/**
|
|
134
|
+
@hidden
|
|
130
135
|
The inverse of a hand-declared observable state interface: strips the
|
|
131
136
|
`Observable` wrapper from every property, yielding the plain seed shape.
|
|
132
137
|
`Unobserved<CounterState>` → `{ count: number }`.
|
|
@@ -154,6 +159,7 @@ export type Unobserved<S> = {
|
|
|
154
159
|
} ? V : S[K];
|
|
155
160
|
};
|
|
156
161
|
/**
|
|
162
|
+
@hidden
|
|
157
163
|
Whether a value is already an observable wrapper — `subscribe` is reachable on its prototype chain.
|
|
158
164
|
Used by {@link observe} to skip re-wrapping and to detect the "not yet observed" state on reassignment.
|
|
159
165
|
|
|
@@ -165,64 +171,6 @@ isAlreadyObserved(42); // false
|
|
|
165
171
|
```
|
|
166
172
|
*/
|
|
167
173
|
export declare function isAlreadyObserved(value: unknown): boolean;
|
|
168
|
-
/**
|
|
169
|
-
Makes a target object's properties observable by replacing them with wrapped values.
|
|
170
|
-
|
|
171
|
-
Wraps each property of `target` that is not already observable (and meets criteria)
|
|
172
|
-
in an observable wrapper. Also sets up deep change detection for objects and
|
|
173
|
-
debounced notifications when the data changes.
|
|
174
|
-
|
|
175
|
-
There are two sides to using it — pick per call site:
|
|
176
|
-
|
|
177
|
-
**Declarative (typed class fields).** Declare the field as `Observable<T>` up
|
|
178
|
-
front, then let `observe(this, 'field')` install the live wrapper in the
|
|
179
|
-
constructor. The declaration needs the double cast once (`0 as unknown as
|
|
180
|
-
Observable<number>`): the field starts life as a plain value and only becomes
|
|
181
|
-
the wrapper when `observe()` runs. In exchange, every later use is fully typed —
|
|
182
|
-
arithmetic, `subscribe`, `bind` — with no casts anywhere else.
|
|
183
|
-
|
|
184
|
-
**Imperative (wrapping existing data).** Hand any object to `observe()` after
|
|
185
|
-
the fact — no declarations, the return type is inferred: every property comes
|
|
186
|
-
back as `Observable<PropertyType>`.
|
|
187
|
-
|
|
188
|
-
@param target - The object whose properties should be made observable.
|
|
189
|
-
@param propertyName - Optional specific property name to make one property observable instead of all properties.
|
|
190
|
-
@returns The original target object, now with observable properties.
|
|
191
|
-
|
|
192
|
-
@example Imperative usage — wrap an existing plain object:
|
|
193
|
-
```ts
|
|
194
|
-
const state = observe({ count: 0, label: 'hi' });
|
|
195
|
-
state.count.subscribe((v) => console.log('count is now', v));
|
|
196
|
-
state.count++; // triggers the callback
|
|
197
|
-
```
|
|
198
|
-
|
|
199
|
-
@example Declarative usage — typed class field with double cast:
|
|
200
|
-
```ts
|
|
201
|
-
class Counter {
|
|
202
|
-
clicks: Observable<number> = 0 as unknown as Observable<number>;
|
|
203
|
-
|
|
204
|
-
constructor() {
|
|
205
|
-
observe(this, 'clicks');
|
|
206
|
-
}
|
|
207
|
-
|
|
208
|
-
bump() {
|
|
209
|
-
this.clicks++; // plain arithmetic — the declaration carries the type
|
|
210
|
-
}
|
|
211
|
-
}
|
|
212
|
-
```
|
|
213
|
-
|
|
214
|
-
@example Schema-first usage — divergent read/write types via hand-declared interface:
|
|
215
|
-
```ts
|
|
216
|
-
interface CounterState {
|
|
217
|
-
get count(): Observable<number>;
|
|
218
|
-
set count(v: number);
|
|
219
|
-
}
|
|
220
|
-
|
|
221
|
-
const state = observe<CounterState>({ count: 0 }); // seed validated against schema
|
|
222
|
-
state.count.subscribe((v) => console.log(v)); // fully typed
|
|
223
|
-
state.count = 5; // plain assignment — the declared setter type permits it
|
|
224
|
-
```
|
|
225
|
-
*/
|
|
226
174
|
export declare function observe<T extends object, K extends keyof T>(target: T, propertyName: K): ObservedKey<T, K>;
|
|
227
175
|
export declare function observe<T extends object>(target: T): Observed<T>;
|
|
228
176
|
export declare function observe<S extends object>(target: Unobserved<S>): S;
|
|
@@ -235,7 +183,7 @@ All three methods return the component instance, so you can chain them fluently.
|
|
|
235
183
|
Call it once at module level before defining any component classes. The plugin is idempotent —
|
|
236
184
|
subsequent calls are no-ops.
|
|
237
185
|
|
|
238
|
-
@param Class - A constructor function whose prototype chain includes {@link McBase}.
|
|
186
|
+
@param Class - A constructor function whose prototype chain includes {@link Core.McBase}.
|
|
239
187
|
|
|
240
188
|
@example
|
|
241
189
|
```ts
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"observables.d.ts","sourceRoot":"","sources":["../../src/state/observables.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAsDE;
|
|
1
|
+
{"version":3,"file":"observables.d.ts","sourceRoot":"","sources":["../../src/state/observables.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAsDE;AAkBF;;;;;;;;;EASE;AACF,MAAM,MAAM,QAAQ,CAAC,CAAC,GAAG,OAAO,IAAI,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;AAEvD;;;;;;;;;;;;;EAaE;AACF,MAAM,MAAM,UAAU,CAAC,CAAC,GAAG,OAAO,IAAI,CAAC,GAAG;IACzC,SAAS,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC;IAChD,WAAW,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC;IAClD,MAAM,CAAC,MAAM,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC;IACxC,IAAI,CAAC,MAAM,EAAE,WAAW,GAAG,gBAAgB,GAAG,UAAU,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC;IACzE,cAAc;IACd,SAAS,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;CAC3B,CAAC;AAyNF;;;;;;;;;;;;;;;;;;;;;;;;;;EA0BE;AACF,MAAM,MAAM,QAAQ,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;CAAE,CAAC;AAE/D;;;;;;;;;;EAUE;AACF,MAAM,MAAM,WAAW,CAAC,CAAC,EAAE,CAAC,SAAS,MAAM,CAAC,IAAI;KAC9C,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,SAAS,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CACrD,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;EAsBE;AACF,MAAM,MAAM,UAAU,CAAC,CAAC,IAAI;KAC1B,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS;QAAE,SAAS,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,CAAC,KAAK,IAAI,GAAG,OAAO,CAAA;KAAE,GACpF,CAAC,GACD,CAAC,CAAC,CAAC,CAAC;CACP,CAAC;AAKF;;;;;;;;;;;EAWE;AACF,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,OAAO,GAAG,OAAO,CAMzD;AAED,wBAAgB,OAAO,CAAC,CAAC,SAAS,MAAM,EAAE,CAAC,SAAS,MAAM,CAAC,EAC1D,MAAM,EAAE,CAAC,EACT,YAAY,EAAE,CAAC,GACb,WAAW,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;AACrB,wBAAgB,OAAO,CAAC,CAAC,SAAS,MAAM,EAAE,MAAM,EAAE,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;AAClE,wBAAgB,OAAO,CAAC,CAAC,SAAS,MAAM,EAAE,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;AAyIpE;;;;;;;;;;;;;;;;;;;;;;;EAuBE;AACF,wBAAgB,aAAa,CAAC,KAAK,EAAE,GAAG,QAoEvC;AAED,OAAO,QAAQ,YAAY,CAAC;IACxB,UAAiB,MAAM,CAAC,OAAO,SAAS,MAAM,GAAG,MAAM;QACnD,MAAM,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;QAC/B,SAAS,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,GAAG,IAAI,CAAC;QACtD,IAAI,CAAC,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,GAAG,UAAU,GAAG,IAAI,CAAC;KAClE;CACJ"}
|
|
@@ -57,6 +57,7 @@ import { flattenObject, deepEqual, copyGettersSetters, isBrowser } from '../util
|
|
|
57
57
|
import { makePlaceholders } from './placeholders.js';
|
|
58
58
|
import { trigger } from '../utils/events.js';
|
|
59
59
|
/**
|
|
60
|
+
@hidden
|
|
60
61
|
Determines if a value is an observable object.
|
|
61
62
|
|
|
62
63
|
@param value - The value to check.
|
|
@@ -68,6 +69,7 @@ function isObservableObject(value) {
|
|
|
68
69
|
// repository for observable class wrappers
|
|
69
70
|
const classRepo = {};
|
|
70
71
|
/**
|
|
72
|
+
@hidden
|
|
71
73
|
Creates a new observable wrapper class for the given value's constructor.
|
|
72
74
|
|
|
73
75
|
Returns a subclass of the original constructor that implements the Observable interface,
|
|
@@ -254,6 +256,7 @@ function getConstructor(val) {
|
|
|
254
256
|
return classRepo[key] || makeObservable(val);
|
|
255
257
|
}
|
|
256
258
|
/**
|
|
259
|
+
@hidden
|
|
257
260
|
Whether a value is already an observable wrapper — `subscribe` is reachable on its prototype chain.
|
|
258
261
|
Used by {@link observe} to skip re-wrapping and to detect the "not yet observed" state on reassignment.
|
|
259
262
|
|
|
@@ -269,6 +272,65 @@ export function isAlreadyObserved(value) {
|
|
|
269
272
|
value !== null &&
|
|
270
273
|
'subscribe' in value);
|
|
271
274
|
}
|
|
275
|
+
/**
|
|
276
|
+
@hidden
|
|
277
|
+
Makes a target object's properties observable by replacing them with wrapped values.
|
|
278
|
+
|
|
279
|
+
Wraps each property of `target` that is not already observable (and meets criteria)
|
|
280
|
+
in an observable wrapper. Also sets up deep change detection for objects and
|
|
281
|
+
debounced notifications when the data changes.
|
|
282
|
+
|
|
283
|
+
There are two sides to using it — pick per call site:
|
|
284
|
+
|
|
285
|
+
**Declarative (typed class fields).** Declare the field as `Observable<T>` up
|
|
286
|
+
front, then let `observe(this, 'field')` install the live wrapper in the
|
|
287
|
+
constructor. The declaration needs the double cast once (`0 as unknown as
|
|
288
|
+
Observable<number>`): the field starts life as a plain value and only becomes
|
|
289
|
+
the wrapper when `observe()` runs. In exchange, every later use is fully typed —
|
|
290
|
+
arithmetic, `subscribe`, `bind` — with no casts anywhere else.
|
|
291
|
+
|
|
292
|
+
**Imperative (wrapping existing data).** Hand any object to `observe()` after
|
|
293
|
+
the fact — no declarations, the return type is inferred: every property comes
|
|
294
|
+
back as `Observable<PropertyType>`.
|
|
295
|
+
|
|
296
|
+
@param target - The object whose properties should be made observable.
|
|
297
|
+
@param propertyName - Optional specific property name to make one property observable instead of all properties.
|
|
298
|
+
@returns The original target object, now with observable properties.
|
|
299
|
+
|
|
300
|
+
@example Imperative usage — wrap an existing plain object:
|
|
301
|
+
```ts
|
|
302
|
+
const state = observe({ count: 0, label: 'hi' });
|
|
303
|
+
state.count.subscribe((v) => console.log('count is now', v));
|
|
304
|
+
state.count++; // triggers the callback
|
|
305
|
+
```
|
|
306
|
+
|
|
307
|
+
@example Declarative usage — typed class field with double cast:
|
|
308
|
+
```ts
|
|
309
|
+
class Counter {
|
|
310
|
+
clicks: Observable<number> = 0 as unknown as Observable<number>;
|
|
311
|
+
|
|
312
|
+
constructor() {
|
|
313
|
+
observe(this, 'clicks');
|
|
314
|
+
}
|
|
315
|
+
|
|
316
|
+
bump() {
|
|
317
|
+
this.clicks++; // plain arithmetic — the declaration carries the type
|
|
318
|
+
}
|
|
319
|
+
}
|
|
320
|
+
```
|
|
321
|
+
|
|
322
|
+
@example Schema-first usage — divergent read/write types via hand-declared interface:
|
|
323
|
+
```ts
|
|
324
|
+
interface CounterState {
|
|
325
|
+
get count(): Observable<number>;
|
|
326
|
+
set count(v: number);
|
|
327
|
+
}
|
|
328
|
+
|
|
329
|
+
const state = observe<CounterState>({ count: 0 }); // seed validated against schema
|
|
330
|
+
state.count.subscribe((v) => console.log(v)); // fully typed
|
|
331
|
+
state.count = 5; // plain assignment — the declared setter type permits it
|
|
332
|
+
```
|
|
333
|
+
*/
|
|
272
334
|
export function observe(target, propertyName) {
|
|
273
335
|
const source = target;
|
|
274
336
|
const keys = propertyName ? [propertyName] : [...Object.getOwnPropertyNames(target)];
|
|
@@ -342,7 +404,7 @@ All three methods return the component instance, so you can chain them fluently.
|
|
|
342
404
|
Call it once at module level before defining any component classes. The plugin is idempotent —
|
|
343
405
|
subsequent calls are no-ops.
|
|
344
406
|
|
|
345
|
-
@param Class - A constructor function whose prototype chain includes {@link McBase}.
|
|
407
|
+
@param Class - A constructor function whose prototype chain includes {@link Core.McBase}.
|
|
346
408
|
|
|
347
409
|
@example
|
|
348
410
|
```ts
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"placeholders.d.ts","sourceRoot":"","sources":["../../src/state/placeholders.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"placeholders.d.ts","sourceRoot":"","sources":["../../src/state/placeholders.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AAEF,OAAO,EAAE,EAAE,EAAE,KAAK,QAAQ,EAAE,KAAK,MAAM,EAAE,MAAM,eAAe,CAAC;AAC/D,OAAO,EAAW,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAoD5D;;;;;;EAME;AACF,cAAM,YAAa,SAAQ,EAAE;;IAE5B,IAAI,EAAE,UAAU,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAwD;IACjG,UAAU,CAAC,EAAE,MAAM,CAAM;IAEzB;;;;;;;;MAQE;gBACU,MAAM,EAAE,WAAW;IAkF/B;;;;;;;MAOE;IACF,MAAM,CAAC,EAAE,EAAE,WAAW,CAAC,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;CAOzD;AAmBD;;;;;;;EAOE;AACF,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,WAAW,GAAG,gBAAgB,GAAG,UAAU,GAAG,IAAI,CAK3F;AAED;;;;EAIE;AACF,MAAM,MAAM,gBAAgB,GAAG,MAAM,CAAC,WAAW,EAAE;IAAE,aAAa,CAAC,EAAE,YAAY,CAAA;CAAE,CAAC,CAAC"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
/**
|
|
2
|
+
Types module — pure type layer for the microcomponent system.
|
|
3
|
+
|
|
4
|
+
@module Types
|
|
5
|
+
*/
|
|
6
|
+
export type { McBubbleController, BubbleDirection, BubbleDirections, McDetail, McEventHandler, McEvent, McPayloadOf, McController, McNativeEventHandlers, McHost, McHostOf, McEntriesOf, McMerged, McRemoved, } from './mcTypes.js';
|
|
7
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/types/index.ts"],"names":[],"mappings":"AAAA;;;;EAIE;AACF,YAAY,EACX,kBAAkB,EAClB,eAAe,EACf,gBAAgB,EAChB,QAAQ,EACR,cAAc,EACd,OAAO,EACP,WAAW,EACX,YAAY,EACZ,qBAAqB,EACrB,MAAM,EACN,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,SAAS,GACT,MAAM,cAAc,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
package/dist/types/mcTypes.d.ts
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
/**
|
|
2
|
-
@module Type layer
|
|
3
2
|
|
|
4
3
|
Pure type layer of the microcomponent system.
|
|
5
4
|
|
|
6
5
|
RULE: types only — no runtime exports, no imports. It sits at the bottom of the
|
|
7
6
|
dependency graph so every other module can import from it without cycles.
|
|
7
|
+
@module Types
|
|
8
8
|
*/
|
|
9
9
|
/** The bubble control handle passed to event handlers; `BubbleController` in events.ts implements it. */
|
|
10
10
|
export interface McBubbleController {
|
|
@@ -66,7 +66,7 @@ export type McPayloadOf<EM, K extends string, D = unknown> = K extends keyof EM
|
|
|
66
66
|
declare global {
|
|
67
67
|
/**
|
|
68
68
|
App-wide map of registry key names to component types. Augment it next to a
|
|
69
|
-
component definition and keyed lookups (`
|
|
69
|
+
component definition and keyed lookups (`isMcHost(el, 'cart')`, `closest('cart')`,
|
|
70
70
|
`ancestors` / `children` / `descendants`) type themselves from it.
|
|
71
71
|
|
|
72
72
|
Presence is checked at runtime; the key → type mapping is a convention. Where
|
|
@@ -81,7 +81,7 @@ declare global {
|
|
|
81
81
|
}
|
|
82
82
|
|
|
83
83
|
const el = document.querySelector('form');
|
|
84
|
-
if (el &&
|
|
84
|
+
if (el && isMcHost(el, 'cart')) {
|
|
85
85
|
el._mc.cart.addItem(item); // Cart
|
|
86
86
|
}
|
|
87
87
|
```
|
package/dist/types/mcTypes.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
/**
|
|
2
|
-
@module Type layer
|
|
3
2
|
|
|
4
3
|
Pure type layer of the microcomponent system.
|
|
5
4
|
|
|
6
5
|
RULE: types only — no runtime exports, no imports. It sits at the bottom of the
|
|
7
6
|
dependency graph so every other module can import from it without cycles.
|
|
7
|
+
@module Types
|
|
8
8
|
*/
|
|
9
9
|
export {};
|
package/dist/utils/autoload.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
@module
|
|
2
|
+
@module Autoload
|
|
3
3
|
|
|
4
4
|
The {@linkcode autoload} function enables automatic detection and instantiation of microcomponents in the DOM via a `MutationObserver`. When enabled, newly added elements with undefined custom tags or `data-mc` references will trigger dynamic script loading and component attachment.
|
|
5
5
|
|
|
@@ -20,6 +20,7 @@ autoload(true); // enable auto-loading
|
|
|
20
20
|
console.log(autoload.state); // Set of component names currently loading
|
|
21
21
|
autoload(false); // disable
|
|
22
22
|
```
|
|
23
|
+
@group Autoload
|
|
23
24
|
*/
|
|
24
25
|
export interface Autoload {
|
|
25
26
|
/**
|
|
@@ -50,5 +51,8 @@ declare global {
|
|
|
50
51
|
autoload?: Autoload;
|
|
51
52
|
}
|
|
52
53
|
}
|
|
53
|
-
export declare
|
|
54
|
+
export declare function autoload(enable?: boolean): boolean;
|
|
55
|
+
export declare namespace autoload {
|
|
56
|
+
var state: Set<string>;
|
|
57
|
+
}
|
|
54
58
|
//# sourceMappingURL=autoload.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"autoload.d.ts","sourceRoot":"","sources":["../../src/utils/autoload.ts"],"names":[],"mappings":"AAAA;;;;;;;;;EASE;
|
|
1
|
+
{"version":3,"file":"autoload.d.ts","sourceRoot":"","sources":["../../src/utils/autoload.ts"],"names":[],"mappings":"AAAA;;;;;;;;;EASE;AAqJF;;;;;;;;;;;;;EAaE;AACF,MAAM,WAAW,QAAQ;IACxB;;;;;;;;;;;;;IAaG;IACH,CAAC,MAAM,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC;IAC5B;;;;;IAKG;IACH,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;CACnB;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,MAAM;QACf,QAAQ,CAAC,EAAE,QAAQ,CAAC;KACpB;CACD;AAID,wBAAgB,QAAQ,CAAC,MAAM,GAAE,OAAc,GAAG,OAAO,CAuBxD;yBAvBe,QAAQ"}
|
package/dist/utils/autoload.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
@module
|
|
2
|
+
@module Autoload
|
|
3
3
|
|
|
4
4
|
The {@linkcode autoload} function enables automatic detection and instantiation of microcomponents in the DOM via a `MutationObserver`. When enabled, newly added elements with undefined custom tags or `data-mc` references will trigger dynamic script loading and component attachment.
|
|
5
5
|
|
|
@@ -9,7 +9,7 @@ importing `DC`/`MC` never pulls a DOM observer into the bundle unless
|
|
|
9
9
|
{@link autoload} itself is imported.
|
|
10
10
|
*/
|
|
11
11
|
import { DC } from '../core/MC.js';
|
|
12
|
-
import {
|
|
12
|
+
import { isMcHost } from '../core/mcGuards.js';
|
|
13
13
|
const loadingDCs = new Set();
|
|
14
14
|
/**
|
|
15
15
|
Creates a closure that attaches DOM elements with the specified tag name to
|
|
@@ -24,6 +24,7 @@ element definition becomes available, and performs:
|
|
|
24
24
|
|
|
25
25
|
@param element - The tag name (custom element name) of the microcomponent to instantiate.
|
|
26
26
|
@returns A closure that performs the attachment logic when invoked.
|
|
27
|
+
@group Autoload
|
|
27
28
|
*/
|
|
28
29
|
function attachDC(element) {
|
|
29
30
|
return () => {
|
|
@@ -39,7 +40,7 @@ function attachDC(element) {
|
|
|
39
40
|
/* v8 ignore start */
|
|
40
41
|
if ('create' in customElementClass && typeof customElementClass.create === 'function') {
|
|
41
42
|
const customElement = customElementClass.create(node);
|
|
42
|
-
if (!
|
|
43
|
+
if (!isMcHost(customElement))
|
|
43
44
|
throw `create() of Class ${customElementClass.name} did not return a McHost.`;
|
|
44
45
|
customElement.setAttribute('data-mc', node.getAttribute('data-mc') ?? '');
|
|
45
46
|
node.replaceWith(customElement);
|
|
@@ -135,7 +136,7 @@ function loadUndefinedMCs() {
|
|
|
135
136
|
});
|
|
136
137
|
}
|
|
137
138
|
let observer = null;
|
|
138
|
-
export
|
|
139
|
+
export function autoload(enable = true) {
|
|
139
140
|
if (!enable) {
|
|
140
141
|
if (observer) {
|
|
141
142
|
observer.disconnect();
|
|
@@ -154,5 +155,6 @@ export const autoload = function (enable = true) {
|
|
|
154
155
|
}, 5);
|
|
155
156
|
window.autoload ??= autoload;
|
|
156
157
|
return true;
|
|
157
|
-
}
|
|
158
|
+
}
|
|
159
|
+
;
|
|
158
160
|
autoload.state = loadingDCs;
|
package/dist/utils/events.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
@module
|
|
2
|
+
@module Events
|
|
3
3
|
|
|
4
4
|
This module provides event utilities for interfacing **between microcomponents and external
|
|
5
5
|
frameworks or native DOM/JS environments**. It is not intended for communication between
|
|
@@ -94,91 +94,34 @@ export declare function getMcEventName(eventName: string): string;
|
|
|
94
94
|
*/
|
|
95
95
|
export declare function trueEventName(target: HTMLElement, eventName: string): string;
|
|
96
96
|
/**
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
97
|
+
A query selector string used to match one or more DOM elements.
|
|
98
|
+
|
|
99
|
+
@example
|
|
100
|
+
```ts
|
|
101
|
+
const selector: QuerySelectorString = '.my-component';
|
|
102
|
+
```
|
|
103
|
+
@group Events
|
|
104
|
+
*/
|
|
104
105
|
export type QuerySelectorString = string;
|
|
105
106
|
/**
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
107
|
+
Represents the target of an event operation — either a concrete element,
|
|
108
|
+
a CSS selector string, or `undefined` (which is silently ignored).
|
|
109
|
+
|
|
110
|
+
@example
|
|
111
|
+
```ts
|
|
112
|
+
// Pass an HTMLElement directly
|
|
113
|
+
const el: TargetSelect = document.getElementById('root');
|
|
114
|
+
|
|
115
|
+
// Or pass a selector string to match multiple elements
|
|
116
|
+
const allCards: TargetSelect = '.card';
|
|
117
|
+
```
|
|
118
|
+
@group Events
|
|
119
|
+
*/
|
|
118
120
|
export type TargetSelect = HTMLElement | QuerySelectorString | undefined | null;
|
|
119
|
-
/**
|
|
120
|
-
* Removes a previously attached event handler from the DOM node. See {@link on} and {@link one}.
|
|
121
|
-
*
|
|
122
|
-
* Uses internal microcomponent-prefixed naming for event handlers.
|
|
123
|
-
* This is primarily used to interface with external frameworks or vanilla JS environments.
|
|
124
|
-
* For communication between frontend microcomponents, use the `DC.off()` method instead.
|
|
125
|
-
*
|
|
126
|
-
* @param target - The DOM element from which to remove the listener.
|
|
127
|
-
* @param eventName - The name of the event (e.g., 'click', 'update').
|
|
128
|
-
* @param handler - The listener function or object to detach.
|
|
129
|
-
*
|
|
130
|
-
* @example
|
|
131
|
-
* ```ts
|
|
132
|
-
* const handler = on(myElement, 'click', () => console.log('clicked'));
|
|
133
|
-
* off(myElement, 'click', handler); // removes the listener
|
|
134
|
-
* ```
|
|
135
|
-
*/
|
|
136
121
|
export declare function off<D = unknown>(target: TargetSelect, eventName: string, handler: McEventHandler<D>): void;
|
|
137
122
|
export declare function off(target: TargetSelect, eventName: string, handler: EventListenerOrEventListenerObject): void;
|
|
138
|
-
/**
|
|
139
|
-
* Attaches a persistent event listener that will fire every time the specified event occurs.
|
|
140
|
-
*
|
|
141
|
-
* This is primarily used to interface with external frameworks or vanilla JS environments.
|
|
142
|
-
* For communication between frontend microcomponents, use the `DC.on()` method instead.
|
|
143
|
-
*
|
|
144
|
-
* The handler receives a `CustomEvent<McDetail<D>>`: the payload sits under
|
|
145
|
-
* `ev.detail.data`, the bubble-control handle under `ev.detail.control`.
|
|
146
|
-
*
|
|
147
|
-
* @param target - The DOM element to attach the listener to.
|
|
148
|
-
* @param eventName - The name of the event (e.g., 'click', 'update').
|
|
149
|
-
* @param handler - The callback function or object to invoke on each event.
|
|
150
|
-
* @param once - If true, remove the listener after first invocation.
|
|
151
|
-
* @returns The attached handler reference. Useful for later deletion with {@link off}.
|
|
152
|
-
*
|
|
153
|
-
* @example
|
|
154
|
-
* ```ts
|
|
155
|
-
* const handler = on<{ value: number }>(myElement, 'update', (ev) => {
|
|
156
|
-
* console.log(ev.detail.data.value); // number
|
|
157
|
-
* });
|
|
158
|
-
* // to remove: off(myElement, 'update', handler);
|
|
159
|
-
* ```
|
|
160
|
-
*/
|
|
161
123
|
export declare function on<D = unknown>(target: TargetSelect, eventName: string, handler: McEventHandler<D>, once?: boolean): McEventHandler<D>;
|
|
162
124
|
export declare function on(target: TargetSelect, eventName: string, handler: EventListenerOrEventListenerObject, once?: boolean): EventListenerOrEventListenerObject;
|
|
163
|
-
/**
|
|
164
|
-
* Attaches an event listener that will fire only once.
|
|
165
|
-
*
|
|
166
|
-
* Internally calls {@link on} with the `once` flag set to true. The handler
|
|
167
|
-
* is automatically removed after its first invocation.
|
|
168
|
-
* This is primarily used to interface with external frameworks or vanilla JS environments.
|
|
169
|
-
* For communication between frontend microcomponents, use the `DC.one()` method instead.
|
|
170
|
-
*
|
|
171
|
-
* @param target - The DOM element to attach the listener to.
|
|
172
|
-
* @param eventName - The name of the event (e.g., 'click', 'update').
|
|
173
|
-
* @param handler - The callback function or object to invoke once.
|
|
174
|
-
* @returns The attached one-time handler reference. Useful for later deletion with {@link off}.
|
|
175
|
-
*
|
|
176
|
-
* @example
|
|
177
|
-
* ```ts
|
|
178
|
-
* one<{ ready: boolean }>(myElement, 'dataReady', (ev) => console.log('received:', ev.detail.data));
|
|
179
|
-
* // fires only once then detaches automatically
|
|
180
|
-
* ```
|
|
181
|
-
*/
|
|
182
125
|
export declare function one<D = unknown>(target: TargetSelect, eventName: string, handler: McEventHandler<D>): McEventHandler<D>;
|
|
183
126
|
export declare function one(target: TargetSelect, eventName: string, handler: EventListenerOrEventListenerObject): EventListenerOrEventListenerObject;
|
|
184
127
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"events.d.ts","sourceRoot":"","sources":["../../src/utils/events.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyDE;AAIF,OAAO,KAAK,EACX,gBAAgB,EAChB,kBAAkB,EAElB,cAAc,EACd,MAAM,qBAAqB,CAAC;AAC7B,YAAY,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAE5D;;;;;;;;;;;;GAYG;AACH,wBAAgB,cAAc,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM,CAExD;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,aAAa,CAAC,MAAM,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,GAAG,MAAM,CAK5E;AAED
|
|
1
|
+
{"version":3,"file":"events.d.ts","sourceRoot":"","sources":["../../src/utils/events.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyDE;AAIF,OAAO,KAAK,EACX,gBAAgB,EAChB,kBAAkB,EAElB,cAAc,EACd,MAAM,qBAAqB,CAAC;AAC7B,YAAY,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAE5D;;;;;;;;;;;;GAYG;AACH,wBAAgB,cAAc,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM,CAExD;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,aAAa,CAAC,MAAM,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,GAAG,MAAM,CAK5E;AAED;;;;;;;;EAQE;AACF,MAAM,MAAM,mBAAmB,GAAG,MAAM,CAAC;AAEzC;;;;;;;;;;;;;EAaE;AACF,MAAM,MAAM,YAAY,GAAG,WAAW,GAAG,mBAAmB,GAAG,SAAS,GAAG,IAAI,CAAC;AAEhF,wBAAgB,GAAG,CAAC,CAAC,GAAG,OAAO,EAC9B,MAAM,EAAE,YAAY,EACpB,SAAS,EAAE,MAAM,EACjB,OAAO,EAAE,cAAc,CAAC,CAAC,CAAC,GACxB,IAAI,CAAC;AACR,wBAAgB,GAAG,CAClB,MAAM,EAAE,YAAY,EACpB,SAAS,EAAE,MAAM,EACjB,OAAO,EAAE,kCAAkC,GACzC,IAAI,CAAC;AA4CR,wBAAgB,EAAE,CAAC,CAAC,GAAG,OAAO,EAC7B,MAAM,EAAE,YAAY,EACpB,SAAS,EAAE,MAAM,EACjB,OAAO,EAAE,cAAc,CAAC,CAAC,CAAC,EAC1B,IAAI,CAAC,EAAE,OAAO,GACZ,cAAc,CAAC,CAAC,CAAC,CAAC;AACrB,wBAAgB,EAAE,CACjB,MAAM,EAAE,YAAY,EACpB,SAAS,EAAE,MAAM,EACjB,OAAO,EAAE,kCAAkC,EAC3C,IAAI,CAAC,EAAE,OAAO,GACZ,kCAAkC,CAAC;AAsDtC,wBAAgB,GAAG,CAAC,CAAC,GAAG,OAAO,EAC9B,MAAM,EAAE,YAAY,EACpB,SAAS,EAAE,MAAM,EACjB,OAAO,EAAE,cAAc,CAAC,CAAC,CAAC,GACxB,cAAc,CAAC,CAAC,CAAC,CAAC;AACrB,wBAAgB,GAAG,CAClB,MAAM,EAAE,YAAY,EACpB,SAAS,EAAE,MAAM,EACjB,OAAO,EAAE,kCAAkC,GACzC,kCAAkC,CAAC;AA0CtC;;;;;;;;;;;;;;;;;;GAkBG;AACH,qBAAa,gBAAiB,YAAW,kBAAkB;IAC1D,OAAO,UAAS;;IAEhB;;;;;;;;;;;;;;;OAeG;IACH,IAAI;CAGJ;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,OAAO,CAAC,CAAC,GAAG,OAAO,EAClC,MAAM,EAAE,WAAW,GAAG,MAAM,GAAG,SAAS,GAAG,IAAI,EAC/C,KAAK,EAAE,MAAM,EACb,IAAI,GAAE,CAAW,EACjB,MAAM,GAAE,gBAAsB,EAAE,wBAAwB;AACxD,UAAU,CAAC,EAAE,gBAAgB,QA+C7B"}
|
package/dist/utils/events.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/**
|
|
2
|
-
@module
|
|
2
|
+
@module Events
|
|
3
3
|
|
|
4
4
|
This module provides event utilities for interfacing **between microcomponents and external
|
|
5
5
|
frameworks or native DOM/JS environments**. It is not intended for communication between
|
|
@@ -99,6 +99,24 @@ export function trueEventName(target, eventName) {
|
|
|
99
99
|
return lower;
|
|
100
100
|
return '_mc' + eventName[0].toUpperCase() + eventName.substring(1);
|
|
101
101
|
}
|
|
102
|
+
/**
|
|
103
|
+
Removes a previously attached event handler from the DOM node. See {@link on} and {@link one}.
|
|
104
|
+
|
|
105
|
+
Uses internal microcomponent-prefixed naming for event handlers.
|
|
106
|
+
This is primarily used to interface with external frameworks or vanilla JS environments.
|
|
107
|
+
For communication between frontend microcomponents, use the `DC.off()` method instead.
|
|
108
|
+
|
|
109
|
+
@param target - The DOM element from which to remove the listener.
|
|
110
|
+
@param eventName - The name of the event (e.g., 'click', 'update').
|
|
111
|
+
@param handler - The listener function or object to detach.
|
|
112
|
+
|
|
113
|
+
@example
|
|
114
|
+
```ts
|
|
115
|
+
const handler = on(myElement, 'click', () => console.log('clicked'));
|
|
116
|
+
off(myElement, 'click', handler); // removes the listener
|
|
117
|
+
```
|
|
118
|
+
@group Events
|
|
119
|
+
*/
|
|
102
120
|
export function off(target, eventName, handler) {
|
|
103
121
|
/* v8 ignore next */
|
|
104
122
|
if (!target)
|
|
@@ -113,6 +131,30 @@ export function off(target, eventName, handler) {
|
|
|
113
131
|
// the cast re-widens it at the DOM boundary.
|
|
114
132
|
target.removeEventListener(trueEventName(target, eventName), handler);
|
|
115
133
|
}
|
|
134
|
+
/**
|
|
135
|
+
Attaches a persistent event listener that will fire every time the specified event occurs.
|
|
136
|
+
|
|
137
|
+
This is primarily used to interface with external frameworks or vanilla JS environments.
|
|
138
|
+
For communication between frontend microcomponents, use the `DC.on()` method instead.
|
|
139
|
+
|
|
140
|
+
The handler receives a `CustomEvent<McDetail<D>>`: the payload sits under
|
|
141
|
+
`ev.detail.data`, the bubble-control handle under `ev.detail.control`.
|
|
142
|
+
|
|
143
|
+
@param target - The DOM element to attach the listener to.
|
|
144
|
+
@param eventName - The name of the event (e.g., 'click', 'update').
|
|
145
|
+
@param handler - The callback function or object to invoke on each event.
|
|
146
|
+
@param once - If true, remove the listener after first invocation.
|
|
147
|
+
@returns The attached handler reference. Useful for later deletion with {@link off}.
|
|
148
|
+
|
|
149
|
+
@example
|
|
150
|
+
```ts
|
|
151
|
+
const handler = on<{ value: number }>(myElement, 'update', (ev) => {
|
|
152
|
+
console.log(ev.detail.data.value); // number
|
|
153
|
+
});
|
|
154
|
+
// to remove: off(myElement, 'update', handler);
|
|
155
|
+
```
|
|
156
|
+
@group Events
|
|
157
|
+
*/
|
|
116
158
|
export function on(target, eventName, handler, once = false) {
|
|
117
159
|
/* v8 ignore next */
|
|
118
160
|
if (!target)
|
|
@@ -129,6 +171,26 @@ export function on(target, eventName, handler, once = false) {
|
|
|
129
171
|
});
|
|
130
172
|
return handler;
|
|
131
173
|
}
|
|
174
|
+
/**
|
|
175
|
+
Attaches an event listener that will fire only once.
|
|
176
|
+
|
|
177
|
+
Internally calls {@link on} with the `once` flag set to true. The handler
|
|
178
|
+
is automatically removed after its first invocation.
|
|
179
|
+
This is primarily used to interface with external frameworks or vanilla JS environments.
|
|
180
|
+
For communication between frontend microcomponents, use the `DC.one()` method instead.
|
|
181
|
+
|
|
182
|
+
@param target - The DOM element to attach the listener to.
|
|
183
|
+
@param eventName - The name of the event (e.g., 'click', 'update').
|
|
184
|
+
@param handler - The callback function or object to invoke once.
|
|
185
|
+
@returns The attached one-time handler reference. Useful for later deletion with {@link off}.
|
|
186
|
+
|
|
187
|
+
@example
|
|
188
|
+
```ts
|
|
189
|
+
one<{ ready: boolean }>(myElement, 'dataReady', (ev) => console.log('received:', ev.detail.data));
|
|
190
|
+
// fires only once then detaches automatically
|
|
191
|
+
```
|
|
192
|
+
@group Events
|
|
193
|
+
*/
|
|
132
194
|
export function one(target, eventName, handler) {
|
|
133
195
|
/* v8 ignore next */
|
|
134
196
|
if (!target)
|
package/dist/utils/helpers.d.ts
CHANGED
|
@@ -216,7 +216,7 @@ export declare function injectCSS(target: Document | ShadowRoot, css: string): C
|
|
|
216
216
|
* Recognized keys: `'css'`, `'targetCss'` (document-level styles), `'shadowCss'`
|
|
217
217
|
* (shadow-root styles), `'shadowHtml'` (shadow innerHTML), `'targetHtml'` (target innerHTML).
|
|
218
218
|
*
|
|
219
|
-
* @param
|
|
219
|
+
* @param instance - The micro component to apply assets onto.
|
|
220
220
|
* @param assets - A record mapping asset type keys to their string content.
|
|
221
221
|
*
|
|
222
222
|
* @example
|
|
@@ -268,7 +268,8 @@ export declare function loadAssets(name: string, assets: string[]): Promise<Arra
|
|
|
268
268
|
* An optional sibling `payload` attribute supplies the data argument for `trigger()`.
|
|
269
269
|
* After binding, both the event attribute and the payload attribute are removed from the DOM.
|
|
270
270
|
*
|
|
271
|
-
* @param
|
|
271
|
+
* @param rootElement - The container element whose descendants should be scanned for bindings.
|
|
272
|
+
* @param instance - The instance to trigger events on.
|
|
272
273
|
*
|
|
273
274
|
* @example
|
|
274
275
|
* ```html
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../src/utils/helpers.ts"],"names":[],"mappings":"AAAA;;;;;;EAME;AAEF,OAAO,KAAK,EAAE,YAAY,
|
|
1
|
+
{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../src/utils/helpers.ts"],"names":[],"mappings":"AAAA;;;;;;EAME;AAEF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAExD;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,SAAS,IAAI,OAAO,CAEnC;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,OAAO,GAAG,KAAK,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAE/E;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,UAAU,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC,GAAG,CAAC,CAiB1E;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,aAAa,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,GAAE,OAAc,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAqB7F;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,SAAS,CAAC,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,OAAO,GAAG,OAAO,CAiCzD;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,SAAS,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,EAAE,EAAE,GAAG,GAAE,MAAW,GAAG,OAAO,CAe1E;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,KAAK,CAAC,CAAC,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,EAAE,EACpD,QAAQ,EAAE,CAAC,EACX,SAAS,EAAE,MAAM,EACjB,GAAG,IAAI,EAAE,OAAO,EAAE,GAChB,CAAC,CAgCH;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,aAAa,CAAC,GAAG,EAAE,MAAM,UAKxC;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,QAAQ,CAAC,CAAC,SAAS,OAAO,EAAE,EAC3C,IAAI,EAAE,CAAC,GAAG,IAAI,EAAE,CAAC,KAAK,OAAO,EAC7B,YAAY,EAAE,MAAM,GAClB,CAAC,GAAG,IAAI,EAAE,CAAC,KAAK,IAAI,CAStB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,cAAc,CAAC,IAAI,EAAE,MAAM,GAAG,WAAW,EAAE,CAU1D;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI,CAOvE;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,wBAAgB,SAAS,CAAC,MAAM,EAAE,QAAQ,GAAG,UAAU,EAAE,GAAG,EAAE,MAAM,GAAG,aAAa,CAOnF;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,aAAa,CAAC,QAAQ,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,CA2B1F;AAED;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,UAAU,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAiC9E;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,kBAAkB,CAAC,WAAW,EAAE,WAAW,GAAG,UAAU,EAAE,QAAQ,EAAE,YAAY,GAAG,IAAI,CA2CtG"}
|
package/dist/utils/helpers.js
CHANGED
|
@@ -362,7 +362,7 @@ export function injectCSS(target, css) {
|
|
|
362
362
|
* Recognized keys: `'css'`, `'targetCss'` (document-level styles), `'shadowCss'`
|
|
363
363
|
* (shadow-root styles), `'shadowHtml'` (shadow innerHTML), `'targetHtml'` (target innerHTML).
|
|
364
364
|
*
|
|
365
|
-
* @param
|
|
365
|
+
* @param instance - The micro component to apply assets onto.
|
|
366
366
|
* @param assets - A record mapping asset type keys to their string content.
|
|
367
367
|
*
|
|
368
368
|
* @example
|
|
@@ -475,7 +475,8 @@ export function loadAssets(name, assets) {
|
|
|
475
475
|
* An optional sibling `payload` attribute supplies the data argument for `trigger()`.
|
|
476
476
|
* After binding, both the event attribute and the payload attribute are removed from the DOM.
|
|
477
477
|
*
|
|
478
|
-
* @param
|
|
478
|
+
* @param rootElement - The container element whose descendants should be scanned for bindings.
|
|
479
|
+
* @param instance - The instance to trigger events on.
|
|
479
480
|
*
|
|
480
481
|
* @example
|
|
481
482
|
* ```html
|