elements-kit 0.21.0 → 0.22.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.
Files changed (64) hide show
  1. package/README.md +20 -19
  2. package/dist/attributes.d.mts +1 -1
  3. package/dist/await.d.mts +6 -5
  4. package/dist/await.mjs +0 -36
  5. package/dist/{types-CUvFIgPa.d.mts → children-s3nFjpLA.d.mts} +124 -226
  6. package/dist/custom-elements-CdpilMDu.d.mts +87 -0
  7. package/dist/custom-elements.d.mts +2 -2
  8. package/dist/{element-D3om9yA6.mjs → element-Di0PYFX1.mjs} +15 -38
  9. package/dist/for.d.mts +9 -4
  10. package/dist/for.mjs +1 -1
  11. package/dist/{fragment-ROPRBJQd.mjs → fragment-Bvs1sGu1.mjs} +3 -3
  12. package/dist/hydrate/index.mjs +1 -1
  13. package/dist/{hydrate-6Qx4n4Su.mjs → hydrate-CHomBRY9.mjs} +4 -4
  14. package/dist/integrations/astro-client.mjs +2 -2
  15. package/dist/integrations/astro-server.mjs +2 -2
  16. package/dist/integrations/astro-slots.d.mts +6 -5
  17. package/dist/integrations/astro-slots.mjs +9 -8
  18. package/dist/integrations/react.d.mts +1 -1
  19. package/dist/integrations/react.mjs +1 -1
  20. package/dist/jsx-runtime/index.d.mts +2 -2
  21. package/dist/jsx-runtime/index.mjs +2 -2
  22. package/dist/polyfill-BVNd6ogU.d.mts +9 -0
  23. package/dist/render.mjs +1 -1
  24. package/dist/server/index.mjs +1 -1
  25. package/dist/{server-iFSng50i.mjs → server-CTkyXTV6.mjs} +2 -2
  26. package/dist/signals/index.d.mts +1 -1
  27. package/dist/slot.d.mts +83 -2
  28. package/dist/slot.mjs +179 -2
  29. package/dist/ui/marketing/marketing.css +5 -3
  30. package/dist/ui/otp-input/index.d.mts +1 -1
  31. package/dist/ui/styles/index.css +174 -172
  32. package/dist/ui/styles/unset.css +212 -210
  33. package/dist/utilities/active-element.d.mts +1 -1
  34. package/dist/utilities/async.d.mts +1 -1
  35. package/dist/utilities/debounced.d.mts +1 -1
  36. package/dist/utilities/dom-lifecycle.bench.mjs +2 -2
  37. package/dist/utilities/element-rect.d.mts +1 -1
  38. package/dist/utilities/element-scroll.d.mts +1 -1
  39. package/dist/utilities/event-driven.d.mts +1 -1
  40. package/dist/utilities/event-listener.d.mts +1 -1
  41. package/dist/utilities/focus-within.d.mts +1 -1
  42. package/dist/utilities/hover.d.mts +1 -1
  43. package/dist/utilities/interval.d.mts +1 -1
  44. package/dist/utilities/location.d.mts +1 -1
  45. package/dist/utilities/media-devices.d.mts +1 -1
  46. package/dist/utilities/media-player.d.mts +1 -1
  47. package/dist/utilities/media-query.d.mts +1 -1
  48. package/dist/utilities/network.d.mts +1 -1
  49. package/dist/utilities/orientation.d.mts +1 -1
  50. package/dist/utilities/previous.d.mts +1 -1
  51. package/dist/utilities/promise.d.mts +1 -1
  52. package/dist/utilities/routing.d.mts +1 -1
  53. package/dist/utilities/search-params.d.mts +1 -1
  54. package/dist/utilities/storage.d.mts +1 -1
  55. package/dist/utilities/throttled.d.mts +1 -1
  56. package/dist/utilities/timeout.d.mts +1 -1
  57. package/dist/utilities/window-focus.d.mts +1 -1
  58. package/dist/utilities/window-size.d.mts +1 -1
  59. package/package.json +3 -1
  60. package/dist/custom-elements-BGcU6ldL.d.mts +0 -57
  61. package/dist/slot-BFWXeFRl.d.mts +0 -77
  62. package/dist/slot-Dvf30O0B.mjs +0 -138
  63. /package/dist/{attributes-3r7Diua4.d.mts → attributes-DILeh3-s.d.mts} +0 -0
  64. /package/dist/{scope-zbEG299F.mjs → scope-C1vELXqP.mjs} +0 -0
@@ -1,57 +0,0 @@
1
- //#region src/custom-elements.d.ts
2
- /**
3
- * Registry of custom-element tags to their constructors.
4
- * Users augment this interface to add typed JSX support for their elements.
5
- *
6
- * The interface lives in the global `ElementsKit` namespace so augmentations
7
- * propagate cleanly through type-bundle chunk splits — augmenting a module
8
- * subpath would not always merge with internal references inside the JSX
9
- * namespace's `IntrinsicElements`.
10
- *
11
- * @example
12
- * ```ts
13
- * declare global {
14
- * namespace ElementsKit {
15
- * interface CustomElementRegistry {
16
- * "x-range": typeof XRange;
17
- * }
18
- * }
19
- * }
20
- * ```
21
- */
22
- type RegisteredElementInstances = { [K in keyof ElementsKit.CustomElementRegistry]: ElementsKit.CustomElementRegistry[K] extends (abstract new (...args: any[]) => infer I) ? I : never };
23
- declare global {
24
- namespace ElementsKit {
25
- interface CustomElementRegistry {}
26
- }
27
- interface HTMLElementTagNameMap extends RegisteredElementInstances {}
28
- }
29
- type CustomElementRegistry = ElementsKit.CustomElementRegistry;
30
- type AnyCtor = CustomElementConstructor;
31
- /**
32
- * Register a custom element with the browser and return its class.
33
- * Pair with an augmentation of `ElementsKit.CustomElementRegistry` to get typed JSX.
34
- *
35
- * @example
36
- * ```tsx
37
- * import { defineElement } from "elements-kit/custom-elements";
38
- *
39
- * class XCounter extends HTMLElement {}
40
- *
41
- * defineElement("x-counter", XCounter);
42
- *
43
- * declare global {
44
- * namespace ElementsKit {
45
- * interface CustomElementRegistry {
46
- * "x-counter": typeof XCounter;
47
- * }
48
- * }
49
- * }
50
- *
51
- * // JSX now gets typed props + typed ref
52
- * // <x-counter />
53
- * ```
54
- */
55
- declare function defineElement<Tag extends `${string}-${string}`, C extends AnyCtor>(tag: Tag, cls: C, options?: ElementDefinitionOptions): C;
56
- //#endregion
57
- export { defineElement as n, CustomElementRegistry as t };
@@ -1,77 +0,0 @@
1
- //#region src/lib.d.ts
2
- type PrimitiveNodeType = Node | string | boolean | number | bigint | symbol | Date | RegExp | null | undefined;
3
- //#endregion
4
- //#region src/polyfill.d.ts
5
- declare global {
6
- interface SymbolConstructor {
7
- readonly dispose: symbol;
8
- }
9
- interface Disposable {
10
- [Symbol.dispose](): void;
11
- }
12
- }
13
- //#endregion
14
- //#region src/slot.d.ts
15
- /**
16
- * A lightweight slot that reserves a region in the DOM using comment markers.
17
- * Content between the markers can be replaced dynamically without wrapper elements.
18
- */
19
- declare class Slot {
20
- #private;
21
- /**
22
- * Bind a slot to an existing marker pair (server-rendered comments) instead
23
- * of creating new ones. Used by the hydrate claim pass: content between the
24
- * markers is adopted as the slot's current content.
25
- */
26
- static claim(start: Comment, end: Comment): Slot;
27
- /**
28
- * Render the slot as a DocumentFragment.
29
- * If not yet mounted, inserts the comment markers and optional default content.
30
- * If already mounted, extracts and returns the current content WITHOUT disposing
31
- * it — the caller takes ownership of the returned nodes and is responsible for
32
- * their disposal.
33
- */
34
- render(defaultContent?: PrimitiveNodeType): DocumentFragment;
35
- /** Dispose reactive children and remove all content between the markers. */
36
- clear(): void;
37
- /**
38
- * Replace the slot's content with the given element.
39
- * No-op if the slot is not mounted or the content is identical.
40
- */
41
- set(element: Node): void;
42
- /**
43
- * Extract and return the current slot content as a DocumentFragment.
44
- * Returns `null` if the slot is not mounted.
45
- * Content is NOT disposed — the caller takes ownership and is responsible
46
- * for disposal.
47
- */
48
- get(): DocumentFragment | null;
49
- /** Returns the parent node if the slot is mounted, otherwise `null`. */
50
- parent(): ParentNode | null;
51
- /** Whether the slot's comment markers are attached to the DOM. */
52
- isMounted(): boolean;
53
- }
54
- /**
55
- * Symbol key for attaching a slot collection to a custom element instance.
56
- * Prevents collisions with public Element properties and signals to the JSX
57
- * runtime that this property holds slot wiring (not regular children).
58
- *
59
- * The value at `[SLOTS]` is a plain object whose keys are slot names and whose
60
- * values are {@link Slot} instances. Declare with `as const` so TypeScript
61
- * preserves the literal key union — this is what `ElementProps<typeof Cls>`
62
- * uses to synthesize `slot:${K}` entries.
63
- *
64
- * @example
65
- * ```ts
66
- * class Card extends HTMLElement {
67
- * // ✅ literal keys flow through — "header" | "footer"
68
- * [SLOTS] = { header: new Slot(), footer: new Slot() } as const;
69
- * }
70
- *
71
- * // ❌ widens — no typed slot:* props
72
- * // [SLOTS] = { header: new Slot(), footer: new Slot() };
73
- * ```
74
- */
75
- declare const SLOTS: unique symbol;
76
- //#endregion
77
- export { Slot as n, PrimitiveNodeType as r, SLOTS as t };
@@ -1,138 +0,0 @@
1
- import "./polyfill-CdZVCxdo.mjs";
2
- //#region src/lib.ts
3
- var UnsupportedChildError = class extends Error {
4
- constructor(value) {
5
- super(`Unsupported child type: ${typeof value}`);
6
- this.name = "UnsupportedChildError";
7
- }
8
- };
9
- function resolveNode(c) {
10
- if (c instanceof Node) return c;
11
- if (c === null || c === void 0 || typeof c === "boolean") return document.createComment("");
12
- if (typeof c === "string" || typeof c === "number" || typeof c === "bigint" || typeof c === "symbol" || c instanceof Date || c instanceof RegExp) return document.createTextNode(String(c));
13
- throw new UnsupportedChildError(c);
14
- }
15
- //#endregion
16
- //#region src/slot.ts
17
- /**
18
- * A lightweight slot that reserves a region in the DOM using comment markers.
19
- * Content between the markers can be replaced dynamically without wrapper elements.
20
- */
21
- var Slot = class Slot {
22
- #start;
23
- #end;
24
- #pending;
25
- /**
26
- * Bind a slot to an existing marker pair (server-rendered comments) instead
27
- * of creating new ones. Used by the hydrate claim pass: content between the
28
- * markers is adopted as the slot's current content.
29
- */
30
- static claim(start, end) {
31
- const slot = new Slot();
32
- slot.#start = start;
33
- slot.#end = end;
34
- return slot;
35
- }
36
- /**
37
- * Render the slot as a DocumentFragment.
38
- * If not yet mounted, inserts the comment markers and optional default content.
39
- * If already mounted, extracts and returns the current content WITHOUT disposing
40
- * it — the caller takes ownership of the returned nodes and is responsible for
41
- * their disposal.
42
- */
43
- render(defaultContent) {
44
- const fragment = document.createDocumentFragment();
45
- if (this.isMounted()) {
46
- const range = document.createRange();
47
- range.setStartAfter(this.#start);
48
- range.setEndBefore(this.#end);
49
- fragment.appendChild(range.extractContents());
50
- return fragment;
51
- }
52
- const start = this.#start ??= document.createComment("{");
53
- const end = this.#end ??= document.createComment("}");
54
- fragment.appendChild(start);
55
- fragment.appendChild(end);
56
- const initialContent = this.#pending ?? resolveNode(defaultContent);
57
- if (initialContent) fragment.insertBefore(initialContent, end);
58
- this.#pending = void 0;
59
- return fragment;
60
- }
61
- /** Dispose reactive children and remove all content between the markers. */
62
- clear() {
63
- if (!this.#start || !this.#end) return;
64
- let node = this.#start.nextSibling;
65
- while (node && node !== this.#end) {
66
- const next = node.nextSibling;
67
- if (node instanceof Element) node[Symbol.dispose]?.();
68
- node = next;
69
- }
70
- const range = document.createRange();
71
- range.setStartAfter(this.#start);
72
- range.setEndBefore(this.#end);
73
- range.deleteContents();
74
- }
75
- /**
76
- * Replace the slot's content with the given element.
77
- * No-op if the slot is not mounted or the content is identical.
78
- */
79
- set(element) {
80
- const parent = this.parent();
81
- if (!parent) {
82
- this.#pending = element;
83
- return;
84
- }
85
- if (this.#isSame(element)) return;
86
- this.clear();
87
- parent.insertBefore(element, this.#end);
88
- this.#pending = void 0;
89
- }
90
- /**
91
- * Extract and return the current slot content as a DocumentFragment.
92
- * Returns `null` if the slot is not mounted.
93
- * Content is NOT disposed — the caller takes ownership and is responsible
94
- * for disposal.
95
- */
96
- get() {
97
- if (!this.isMounted()) return null;
98
- const range = document.createRange();
99
- range.setStartAfter(this.#start);
100
- range.setEndBefore(this.#end);
101
- return range.extractContents();
102
- }
103
- /** Returns the parent node if the slot is mounted, otherwise `null`. */
104
- parent() {
105
- return this.isMounted() ? this.#start.parentNode : null;
106
- }
107
- /** Whether the slot's comment markers are attached to the DOM. */
108
- isMounted() {
109
- return !!this.#start && this.#start.parentNode !== null && this.#start.parentNode === this.#end.parentNode;
110
- }
111
- #isSame(element) {
112
- return this.#start.nextSibling === element && this.#end === element.nextSibling;
113
- }
114
- };
115
- /**
116
- * Symbol key for attaching a slot collection to a custom element instance.
117
- * Prevents collisions with public Element properties and signals to the JSX
118
- * runtime that this property holds slot wiring (not regular children).
119
- *
120
- * The value at `[SLOTS]` is a plain object whose keys are slot names and whose
121
- * values are {@link Slot} instances. Declare with `as const` so TypeScript
122
- * preserves the literal key union — this is what `ElementProps<typeof Cls>`
123
- * uses to synthesize `slot:${K}` entries.
124
- *
125
- * @example
126
- * ```ts
127
- * class Card extends HTMLElement {
128
- * // ✅ literal keys flow through — "header" | "footer"
129
- * [SLOTS] = { header: new Slot(), footer: new Slot() } as const;
130
- * }
131
- *
132
- * // ❌ widens — no typed slot:* props
133
- * // [SLOTS] = { header: new Slot(), footer: new Slot() };
134
- * ```
135
- */
136
- const SLOTS = Symbol("slots");
137
- //#endregion
138
- export { Slot as n, resolveNode as r, SLOTS as t };
File without changes