@twobirds/microcomponents 0.1.21 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +91 -92
- package/dist/MC.min.js +1 -345
- package/dist/autoload.min.js +1 -0
- package/dist/core/MC.d.ts +401 -0
- package/dist/core/MC.d.ts.map +1 -0
- package/dist/core/MC.js +471 -0
- package/dist/core/autoload.d.ts +54 -0
- package/dist/core/autoload.d.ts.map +1 -0
- package/dist/core/autoload.js +158 -0
- package/dist/core/elements.d.ts +232 -0
- package/dist/core/elements.d.ts.map +1 -0
- package/dist/core/elements.js +123 -0
- package/dist/core/events.d.ts +231 -0
- package/dist/core/events.d.ts.map +1 -0
- package/dist/core/events.js +228 -0
- package/dist/core/mcGuards.d.ts +49 -0
- package/dist/core/mcGuards.d.ts.map +1 -0
- package/dist/core/mcGuards.js +19 -0
- package/dist/elements.min.js +1 -1
- package/dist/events.min.js +1 -0
- package/dist/formValues.min.js +1 -1
- package/dist/mcGuards.min.js +1 -0
- package/dist/microcomponents.d.ts +8 -5
- package/dist/microcomponents.d.ts.map +1 -1
- package/dist/microcomponents.js +8 -5
- package/dist/microcomponents.min.js +1 -1
- package/dist/observables.min.js +1 -1
- package/dist/state/formValues.d.ts +70 -0
- package/dist/state/formValues.d.ts.map +1 -0
- package/dist/state/formValues.js +334 -0
- package/dist/state/observables.d.ts +276 -0
- package/dist/state/observables.d.ts.map +1 -0
- package/dist/state/observables.js +382 -0
- package/dist/state/placeholders.d.ts +62 -0
- package/dist/state/placeholders.d.ts.map +1 -0
- package/dist/state/placeholders.js +181 -0
- package/dist/types/mcTypes.d.ts +201 -0
- package/dist/types/mcTypes.d.ts.map +1 -0
- package/dist/types/mcTypes.js +9 -0
- package/dist/utils/helpers.d.ts +195 -0
- package/dist/utils/helpers.d.ts.map +1 -0
- package/dist/utils/helpers.js +340 -0
- package/package.json +96 -62
- package/dist/MC.d.ts +0 -31
- package/dist/MC.d.ts.map +0 -1
- package/dist/MC.js +0 -249
- package/dist/MC.ts +0 -613
- package/dist/MicroComponents.svg +0 -15
- package/dist/elements.d.ts +0 -5
- package/dist/elements.d.ts.map +0 -1
- package/dist/elements.js +0 -49
- package/dist/elements.ts +0 -114
- package/dist/events.d.ts +0 -11
- package/dist/events.d.ts.map +0 -1
- package/dist/events.js +0 -55
- package/dist/events.ts +0 -158
- package/dist/formValues.d.ts +0 -3
- package/dist/formValues.d.ts.map +0 -1
- package/dist/formValues.js +0 -156
- package/dist/formValues.ts +0 -371
- package/dist/helpers.d.ts +0 -15
- package/dist/helpers.d.ts.map +0 -1
- package/dist/helpers.js +0 -113
- package/dist/helpers.ts +0 -219
- package/dist/main.mjs +0 -1
- package/dist/microcomponents.ts +0 -6
- package/dist/observables.d.ts +0 -11
- package/dist/observables.d.ts.map +0 -1
- package/dist/observables.js +0 -228
- package/dist/observables.ts +0 -449
|
@@ -0,0 +1,201 @@
|
|
|
1
|
+
/**
|
|
2
|
+
@module Type layer
|
|
3
|
+
|
|
4
|
+
Pure type layer of the microcomponent system.
|
|
5
|
+
|
|
6
|
+
RULE: types only — no runtime exports, no imports. It sits at the bottom of the
|
|
7
|
+
dependency graph so every other module can import from it without cycles.
|
|
8
|
+
*/
|
|
9
|
+
/** The bubble control handle passed to event handlers; `BubbleController` in events.ts implements it. */
|
|
10
|
+
export interface McBubbleController {
|
|
11
|
+
stopped: boolean;
|
|
12
|
+
stop(): void;
|
|
13
|
+
}
|
|
14
|
+
/** One bubbling direction: `l` local dispatch, `u` up to ancestors, `d` down to descendants. */
|
|
15
|
+
export type BubbleDirection = 'l' | 'u' | 'd';
|
|
16
|
+
/**
|
|
17
|
+
The `bubble` argument of `trigger()`: one to three {@link BubbleDirection} letters
|
|
18
|
+
combined — e.g. `'l'`, `'lu'`, `'lud'` — to dispatch locally and/or propagate up
|
|
19
|
+
and down in one call.
|
|
20
|
+
*/
|
|
21
|
+
export type BubbleDirections = BubbleDirection | `${BubbleDirection}${BubbleDirection}` | `${BubbleDirection}${BubbleDirection}${BubbleDirection}`;
|
|
22
|
+
/**
|
|
23
|
+
The `detail` of a microcomponent event: the payload under `data`, the bubble
|
|
24
|
+
control handle under `control`.
|
|
25
|
+
|
|
26
|
+
@template D - The payload type under `data`.
|
|
27
|
+
*/
|
|
28
|
+
export interface McDetail<D = unknown> {
|
|
29
|
+
data: D;
|
|
30
|
+
control: McBubbleController;
|
|
31
|
+
}
|
|
32
|
+
/**
|
|
33
|
+
The function `on()` / `one()` accept as an event handler: it receives an
|
|
34
|
+
{@link McEvent} carrying payload `D`.
|
|
35
|
+
|
|
36
|
+
@template D - The payload type under `ev.detail.data`.
|
|
37
|
+
*/
|
|
38
|
+
export type McEventHandler<D = unknown> = (ev: McEvent<D>) => void;
|
|
39
|
+
/**
|
|
40
|
+
The event object passed to `on()` / `one()` handlers — a `CustomEvent` carrying
|
|
41
|
+
payload `D`. Short for `CustomEvent<McDetail<D>>`.
|
|
42
|
+
|
|
43
|
+
Annotate a handler with `McEvent<D>`, or skip the annotation when the event name
|
|
44
|
+
is in the component's event map (`EM` on `DC`) and let it be inferred.
|
|
45
|
+
|
|
46
|
+
@example
|
|
47
|
+
```ts
|
|
48
|
+
cart.on('CartUpdate', (ev: McEvent<{ count: number }>) => {
|
|
49
|
+
ev.detail.data.count; // number
|
|
50
|
+
ev.detail.control.stop(); // stop bubbling
|
|
51
|
+
});
|
|
52
|
+
```
|
|
53
|
+
|
|
54
|
+
@template D - The payload type under `ev.detail.data`.
|
|
55
|
+
*/
|
|
56
|
+
export type McEvent<D = unknown> = CustomEvent<McDetail<D>>;
|
|
57
|
+
/**
|
|
58
|
+
The payload type of event `K`: its entry in the event map `EM`, or the fallback
|
|
59
|
+
`D` when `K` is not in the map.
|
|
60
|
+
|
|
61
|
+
@template EM - Event map: `event name → payload type`.
|
|
62
|
+
@template K - The event name.
|
|
63
|
+
@template D - Fallback payload for unmapped names.
|
|
64
|
+
*/
|
|
65
|
+
export type McPayloadOf<EM, K extends string, D = unknown> = K extends keyof EM ? EM[K] : D;
|
|
66
|
+
declare global {
|
|
67
|
+
/**
|
|
68
|
+
App-wide map of registry key names to component types. Augment it next to a
|
|
69
|
+
component definition and keyed lookups (`isMcDOM(el, 'cart')`, `closest('cart')`,
|
|
70
|
+
`ancestors` / `children` / `descendants`) type themselves from it.
|
|
71
|
+
|
|
72
|
+
Presence is checked at runtime; the key → type mapping is a convention. Where
|
|
73
|
+
you need it proven, use `DC.get(el, 'cart', Cart)` instead.
|
|
74
|
+
|
|
75
|
+
@example
|
|
76
|
+
```ts
|
|
77
|
+
declare global {
|
|
78
|
+
interface McRegistry {
|
|
79
|
+
cart: Cart;
|
|
80
|
+
}
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
const el = document.querySelector('form');
|
|
84
|
+
if (el && isMcDOM(el, 'cart')) {
|
|
85
|
+
el._mc.cart.addItem(item); // Cart
|
|
86
|
+
}
|
|
87
|
+
```
|
|
88
|
+
*/
|
|
89
|
+
interface McRegistry {
|
|
90
|
+
}
|
|
91
|
+
}
|
|
92
|
+
/**
|
|
93
|
+
The public surface of a DOM microcomponent controller — what `DC` exposes per
|
|
94
|
+
instance. The registry types reference this instead of the `DC` class so the
|
|
95
|
+
file stays import-free (`DC implements McController`).
|
|
96
|
+
|
|
97
|
+
`trigger`'s `bubble` is `string` here, not `BubbleDirections`, because this file
|
|
98
|
+
cannot import from events.ts; `DC` narrows it.
|
|
99
|
+
|
|
100
|
+
@template T - The host element type.
|
|
101
|
+
*/
|
|
102
|
+
export interface McController<T extends HTMLElement = HTMLElement> {
|
|
103
|
+
/** The host DOM element this controller is attached to. */
|
|
104
|
+
readonly target: T;
|
|
105
|
+
off<D = unknown>(eventName: string, handler: McEventHandler<D>): void;
|
|
106
|
+
off(eventName: string, handler: EventListenerOrEventListenerObject): void;
|
|
107
|
+
on<D = unknown>(eventName: string, handler: McEventHandler<D>): McEventHandler<D>;
|
|
108
|
+
on(eventName: string, handler: EventListenerOrEventListenerObject): EventListenerOrEventListenerObject;
|
|
109
|
+
one<D = unknown>(eventName: string, handler: McEventHandler<D>): McEventHandler<D>;
|
|
110
|
+
one(eventName: string, handler: EventListenerOrEventListenerObject): EventListenerOrEventListenerObject;
|
|
111
|
+
trigger(eventName: string, data?: unknown, bubble?: string, controller?: McBubbleController): void;
|
|
112
|
+
ancestors<R extends Record<string, unknown> = Record<never, never>>(): (McController & R)[];
|
|
113
|
+
ancestors<K extends keyof McRegistry & string>(key: K): (McController & Pick<McRegistry, K>)[];
|
|
114
|
+
closest<R extends Record<string, unknown> = Record<never, never>>(): (McController & R) | null;
|
|
115
|
+
closest<K extends keyof McRegistry & string>(key: K): (McController & Pick<McRegistry, K>) | null;
|
|
116
|
+
children<R extends Record<string, unknown> = Record<never, never>>(): (McController & R)[];
|
|
117
|
+
children<K extends keyof McRegistry & string>(key: K): (McController & Pick<McRegistry, K>)[];
|
|
118
|
+
descendants<R extends Record<string, unknown> = Record<never, never>>(): (McController & R)[];
|
|
119
|
+
descendants<K extends keyof McRegistry & string>(key: K): (McController & Pick<McRegistry, K>)[];
|
|
120
|
+
}
|
|
121
|
+
/**
|
|
122
|
+
Opt-in type check for native-event handler methods (`onClick`, `onePointerdown`,
|
|
123
|
+
…). Add it with `implements` and each `on<Event>` / `one<Event>` method is
|
|
124
|
+
checked against the correct DOM event type; other methods are left alone.
|
|
125
|
+
Type-only — nothing exists at runtime.
|
|
126
|
+
|
|
127
|
+
@example
|
|
128
|
+
```ts
|
|
129
|
+
class Panel extends DC implements McNativeEventHandlers {
|
|
130
|
+
onClick(ev: MouseEvent) {} // ✓ checked against 'click'
|
|
131
|
+
// onClick(ev: KeyboardEvent) {} // ✗ wrong event type
|
|
132
|
+
}
|
|
133
|
+
```
|
|
134
|
+
*/
|
|
135
|
+
export type McNativeEventHandlers = {
|
|
136
|
+
[K in keyof GlobalEventHandlersEventMap as `on${Capitalize<K>}` | `one${Capitalize<K>}`]?: (ev: GlobalEventHandlersEventMap[K]) => void;
|
|
137
|
+
};
|
|
138
|
+
/**
|
|
139
|
+
A DOM element that hosts microcomponents: the element type `T` plus an `_mc`
|
|
140
|
+
registry. `R` holds the known entries (`key → element type`); there is no string
|
|
141
|
+
index, so an unregistered key is a compile error. Chained `add()` calls merge
|
|
142
|
+
their entries into `R`.
|
|
143
|
+
|
|
144
|
+
@template T - The host element type (defaults to `HTMLElement`).
|
|
145
|
+
@template R - Known `_mc` entries (defaults to none).
|
|
146
|
+
@example
|
|
147
|
+
```ts
|
|
148
|
+
const withA = DC.add(form, 'a', { a: 0 });
|
|
149
|
+
withA._mc.a.a; // number
|
|
150
|
+
withA._mc.b; // ✗ never registered
|
|
151
|
+
```
|
|
152
|
+
*/
|
|
153
|
+
export type McHost<T extends HTMLElement = HTMLElement, R extends Record<string, unknown> = Record<never, never>> = T & {
|
|
154
|
+
/** The hosted microcomponents: the controller API plus one entry per `add()` key. */
|
|
155
|
+
_mc: McController<T> & R;
|
|
156
|
+
};
|
|
157
|
+
/**
|
|
158
|
+
The element type behind a target: unwraps `McHost<U, R>` back to `U`, identity
|
|
159
|
+
for a plain element. Keeps chained `add()` calls from nesting.
|
|
160
|
+
|
|
161
|
+
@template T - A plain or enhanced element type.
|
|
162
|
+
*/
|
|
163
|
+
export type McHostOf<T extends HTMLElement> = T extends {
|
|
164
|
+
_mc: McController<infer U>;
|
|
165
|
+
} ? U : T;
|
|
166
|
+
/**
|
|
167
|
+
The known `_mc` entries of a target as a flat `key → element type` record: the
|
|
168
|
+
`add()` entries with the controller members stripped out, empty for a plain
|
|
169
|
+
element. This is what lets chained `add()` calls stay flat instead of nesting.
|
|
170
|
+
|
|
171
|
+
@template T - A plain or enhanced element type.
|
|
172
|
+
*/
|
|
173
|
+
export type McEntriesOf<T> = T extends {
|
|
174
|
+
_mc: infer M;
|
|
175
|
+
} ? {
|
|
176
|
+
[P in keyof M as P extends string ? string extends P ? never : P extends keyof McController ? never : [M[P]] extends [never] ? never : P : never]: M[P];
|
|
177
|
+
} : Record<never, never>;
|
|
178
|
+
/** Merges two records into one flat record, so registry entries show as a single object. */
|
|
179
|
+
export type McMerged<A, B> = A & B extends infer U ? {
|
|
180
|
+
[K in keyof U]: U[K];
|
|
181
|
+
} : never;
|
|
182
|
+
/**
|
|
183
|
+
The type `remove()` asserts onto the caller's reference: on an enhanced target the
|
|
184
|
+
removed key is poisoned to `never` (member access becomes a compile error); a
|
|
185
|
+
plain target is left untouched. A later `add()` re-registers the key cleanly.
|
|
186
|
+
|
|
187
|
+
@template T - A plain or enhanced element type.
|
|
188
|
+
@template K - The key being removed.
|
|
189
|
+
*/
|
|
190
|
+
export type McRemoved<T extends HTMLElement, K extends string> = T extends {
|
|
191
|
+
_mc: McController;
|
|
192
|
+
} ? {
|
|
193
|
+
_mc: Record<K, never>;
|
|
194
|
+
} : unknown;
|
|
195
|
+
declare global {
|
|
196
|
+
interface CustomElementConstructor {
|
|
197
|
+
/** Builds the element for a host node when `new DefinitionClass(node)` throws. */
|
|
198
|
+
create?(node: HTMLElement): unknown;
|
|
199
|
+
}
|
|
200
|
+
}
|
|
201
|
+
//# sourceMappingURL=mcTypes.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"mcTypes.d.ts","sourceRoot":"","sources":["../../src/types/mcTypes.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,195 @@
|
|
|
1
|
+
/**
|
|
2
|
+
@module Helpers
|
|
3
|
+
|
|
4
|
+
Small runtime-agnostic utilities shared across the library: environment
|
|
5
|
+
detection, object flattening/comparison, debouncing, accessor copying, and
|
|
6
|
+
kebab-to-PascalCase conversion.
|
|
7
|
+
*/
|
|
8
|
+
/**
|
|
9
|
+
* Determines whether the current runtime environment is a web browser.
|
|
10
|
+
*
|
|
11
|
+
* This function works by attempting to access `this` within an anonymous function
|
|
12
|
+
* and checking if it refers to the global `window` object. It returns `true`
|
|
13
|
+
* when executed in a browser context, and `false` otherwise (e.g., Node.js).
|
|
14
|
+
*
|
|
15
|
+
* Note: While modern environments typically provide more reliable detection mechanisms,
|
|
16
|
+
* this fallback remains compatible across older runtimes where other detection techniques
|
|
17
|
+
* may be unreliable.
|
|
18
|
+
*
|
|
19
|
+
* @returns `true` if the code is running in a browser environment, `false` otherwise.
|
|
20
|
+
*
|
|
21
|
+
* @example
|
|
22
|
+
* ```ts
|
|
23
|
+
* if (isBrowser()) {
|
|
24
|
+
* console.log('Running in a browser');
|
|
25
|
+
* }
|
|
26
|
+
* ```
|
|
27
|
+
*/
|
|
28
|
+
export declare function isBrowser(): boolean;
|
|
29
|
+
/**
|
|
30
|
+
* Checks if a value is a native JavaScript object (created via {} or new Object()).
|
|
31
|
+
* @param value - The value to check.
|
|
32
|
+
* @returns True if the value is a plain object, false otherwise.
|
|
33
|
+
*
|
|
34
|
+
* @example
|
|
35
|
+
* ```ts
|
|
36
|
+
* isNativeObject({}); // true
|
|
37
|
+
* isNativeObject(new Object()); // true
|
|
38
|
+
* isNativeObject([]); // false
|
|
39
|
+
* isNativeObject(null); // false
|
|
40
|
+
* ```
|
|
41
|
+
*/
|
|
42
|
+
export declare function isNativeObject(value: unknown): value is Record<string, unknown>;
|
|
43
|
+
/**
|
|
44
|
+
* Recursively sorts all keys in an object alphabetically, preserving nested structure.
|
|
45
|
+
* @param source - The object to sort.
|
|
46
|
+
* @returns A new object with sorted keys at all levels.
|
|
47
|
+
*
|
|
48
|
+
* @example
|
|
49
|
+
* ```ts
|
|
50
|
+
* const obj = { z: 1, a: { y: 2, b: 3 } };
|
|
51
|
+
* sortObject(obj); // { a: { b: 3, y: 2 }, z: 1 }
|
|
52
|
+
* ```
|
|
53
|
+
*/
|
|
54
|
+
export declare function sortObject<T extends Record<string, unknown>>(source: T): T;
|
|
55
|
+
/**
|
|
56
|
+
* Flattens a nested object into a single-level object with dot-separated keys.
|
|
57
|
+
* Optionally sorts the resulting flat keys alphabetically (default: true).
|
|
58
|
+
* @param source - The object to flatten.
|
|
59
|
+
* @param doSort - Whether to sort the resulting keys (default: true).
|
|
60
|
+
* @returns A flattened object with dot-notation keys.
|
|
61
|
+
*
|
|
62
|
+
* @example
|
|
63
|
+
* ```ts
|
|
64
|
+
* const obj = { user: { name: 'Alice', age: 30 } };
|
|
65
|
+
* flattenObject(obj); // { 'user.age': 30, 'user.name': 'Alice' }
|
|
66
|
+
* ```
|
|
67
|
+
*/
|
|
68
|
+
export declare function flattenObject(source: object, doSort?: boolean): Record<string, unknown>;
|
|
69
|
+
/**
|
|
70
|
+
* Structural deep-equality using SameValueZero for primitives.
|
|
71
|
+
*
|
|
72
|
+
* See {@link https://tc39.es/ecma262/multipage/abstract-operations.html#sec-samevaluezero}.
|
|
73
|
+
*
|
|
74
|
+
* Note: `Map`/`Set` are not structurally compared.
|
|
75
|
+
*
|
|
76
|
+
* @param a - The first value to compare.
|
|
77
|
+
* @param b - The second value to compare.
|
|
78
|
+
* @returns True if the values are deeply equal, false otherwise.
|
|
79
|
+
*
|
|
80
|
+
* @example
|
|
81
|
+
* ```ts
|
|
82
|
+
* deepEqual({ a: 1 }, { a: 1 }); // true
|
|
83
|
+
* deepEqual({ a: { b: 2 } }, { a: {} }); // false
|
|
84
|
+
* deepEqual({ a: NaN }, { a: NaN }); // true (SameValueZero)
|
|
85
|
+
* deepEqual({ a: NaN }, { a: null }); // false
|
|
86
|
+
* ```
|
|
87
|
+
*/
|
|
88
|
+
export declare function deepEqual(a: unknown, b: unknown): boolean;
|
|
89
|
+
/**
|
|
90
|
+
* Retrieves a nested value from an object using a namespace path (dot-separated).
|
|
91
|
+
* @param ns - The namespace string or array of keys representing the path.
|
|
92
|
+
* @param obj - The object to traverse.
|
|
93
|
+
* @returns The value at the specified namespace path, or undefined if not found.
|
|
94
|
+
*
|
|
95
|
+
* @example
|
|
96
|
+
* ```ts
|
|
97
|
+
* const data = { user: { profile: { name: 'Alice' } } };
|
|
98
|
+
* nameSpace('user.profile.name', data); // 'Alice'
|
|
99
|
+
* nameSpace(['user', 'profile'], data); // { name: 'Alice' }
|
|
100
|
+
* ```
|
|
101
|
+
*/
|
|
102
|
+
export declare function nameSpace(ns: string | string[], obj?: object): unknown;
|
|
103
|
+
/**
|
|
104
|
+
* Parses a template string or object, replacing placeholders in the form of {key.path} with
|
|
105
|
+
* corresponding values from the provided data object using namespace resolution.
|
|
106
|
+
* Also recursively processes objects and arrays within the input.
|
|
107
|
+
* @param template - The string or object to parse (can contain {{placeholder}} expressions).
|
|
108
|
+
* @param parseThis - The object containing values for placeholder substitution.
|
|
109
|
+
* @returns The parsed result, with placeholders replaced by actual values.
|
|
110
|
+
*
|
|
111
|
+
* @example
|
|
112
|
+
* ```ts
|
|
113
|
+
* const data = { user: { name: 'Alice' } };
|
|
114
|
+
* parse('Hello {user.name}!', data); // 'Hello Alice!'
|
|
115
|
+
*
|
|
116
|
+
* parse(['Hi {user.name}', 'Bye {user.name}'], data); // ['Hi Alice', 'Bye Alice']
|
|
117
|
+
* ```
|
|
118
|
+
*/
|
|
119
|
+
export declare function parse<T = string | object | unknown[]>(template: T, parseThis: object, ...rest: unknown[]): T;
|
|
120
|
+
/**
|
|
121
|
+
* Converts a kebab-case string to PascalCase.
|
|
122
|
+
* Example: 'my-component-name' -> 'MyComponentName'
|
|
123
|
+
* @param str - The kebab-case string to convert.
|
|
124
|
+
* @returns The converted PascalCase string.
|
|
125
|
+
*
|
|
126
|
+
* @example
|
|
127
|
+
* ```ts
|
|
128
|
+
* kebabToPascal('my-element'); // 'MyElement'
|
|
129
|
+
* ```
|
|
130
|
+
*/
|
|
131
|
+
export declare function kebabToPascal(str: string): string;
|
|
132
|
+
/**
|
|
133
|
+
* Creates a debounced version of a function that delays execution until after the specified
|
|
134
|
+
* number of milliseconds have elapsed since the last time this function was invoked.
|
|
135
|
+
* Useful for rate-limiting expensive operations like event handlers or API calls.
|
|
136
|
+
* @param func - The function to debounce.
|
|
137
|
+
* @param milliseconds - The number of milliseconds to delay execution.
|
|
138
|
+
* @returns A debounced version of the input function.
|
|
139
|
+
*
|
|
140
|
+
* @example
|
|
141
|
+
* ```ts
|
|
142
|
+
* const log = debounce(() => console.log('called'), 300);
|
|
143
|
+
* log(); // will only execute once after 300ms of inactivity
|
|
144
|
+
* ```
|
|
145
|
+
*/
|
|
146
|
+
export declare function debounce<A extends unknown[]>(func: (...args: A) => unknown, milliseconds: number): (...args: A) => void;
|
|
147
|
+
/**
|
|
148
|
+
* Parses an HTML string and returns an array of DOM elements.
|
|
149
|
+
* Handles self-closing tags (XHTML style) by converting them to full closing tags first.
|
|
150
|
+
* @param html - The HTML string to parse.
|
|
151
|
+
* @returns An array of HTMLElement objects representing the parsed HTML nodes.
|
|
152
|
+
*
|
|
153
|
+
* @example
|
|
154
|
+
* ```ts
|
|
155
|
+
* const elems = htmlToElements('<div>Hello</div><span>World</span>');
|
|
156
|
+
* // [HTMLElement<div>, HTMLElement<span>]
|
|
157
|
+
* ```
|
|
158
|
+
*/
|
|
159
|
+
export declare function htmlToElements(html: string): HTMLElement[];
|
|
160
|
+
/**
|
|
161
|
+
* Returns the correct event name to listen for on a DOM element.
|
|
162
|
+
*
|
|
163
|
+
* If `eventName` (case-insensitive) matches a native HTML event handler property
|
|
164
|
+
* (`'on' + eventName.toLowerCase()`) on the target, returns the lowercase native
|
|
165
|
+
* name so that standard DOM events like `'click'` are listened to correctly.
|
|
166
|
+
* Otherwise, prefixes with `_mc` for microcomponent custom events.
|
|
167
|
+
*
|
|
168
|
+
* @param target - The DOM element whose native event support is checked.
|
|
169
|
+
* @param eventName - The event name as provided by the caller (e.g., `'click'`, `'Update'`).
|
|
170
|
+
* @returns The resolved event name: lowercase native or `_mc`-prefixed custom.
|
|
171
|
+
*
|
|
172
|
+
* @example
|
|
173
|
+
* ```ts
|
|
174
|
+
* const btn = document.createElement('button');
|
|
175
|
+
* trueEventName(btn, 'Click'); // 'click' — native handler exists
|
|
176
|
+
* trueEventName(btn, 'Update'); // '_mcUpdate' — custom event
|
|
177
|
+
* ```
|
|
178
|
+
*/
|
|
179
|
+
export declare function trueEventName(target: HTMLElement, eventName: string): string;
|
|
180
|
+
/**
|
|
181
|
+
* Copies all getter and setter properties from a source object to a target object.
|
|
182
|
+
* Does not copy methods or regular data properties—only accessor properties (get/set).
|
|
183
|
+
* @param source - The source object with getters and/or setters to copy.
|
|
184
|
+
* @param target - The target object to which the accessors will be copied.
|
|
185
|
+
*
|
|
186
|
+
* @example
|
|
187
|
+
* ```ts
|
|
188
|
+
* const src = { get name() { return 'Alice'; } };
|
|
189
|
+
* const tgt = {};
|
|
190
|
+
* copyGettersSetters(src, tgt);
|
|
191
|
+
* console.log(tgt.name); // 'Alice'
|
|
192
|
+
* ```
|
|
193
|
+
*/
|
|
194
|
+
export declare function copyGettersSetters(source: object, target: object): void;
|
|
195
|
+
//# sourceMappingURL=helpers.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../src/utils/helpers.ts"],"names":[],"mappings":"AAAA;;;;;;EAME;AAEF;;;;;;;;;;;;;;;;;;;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;;;;;;;;;;;GAWG;AACH,wBAAgB,cAAc,CAAC,IAAI,EAAE,MAAM,GAAG,WAAW,EAAE,CAU1D;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,aAAa,CAAC,MAAM,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,GAAG,MAAM,CAK5E;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI,CAOvE"}
|