elements-kit 0.3.3 → 0.3.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.
@@ -2,7 +2,7 @@ import { c as effectScope, g as untracked, p as onCleanup, s as effect } from ".
2
2
  import "./polyfill-CdZVCxdo.mjs";
3
3
  import { isReactive, resolveProps } from "./signals/index.mjs";
4
4
  import { on } from "./utilities/event-listener.mjs";
5
- import { n as Slot, r as resolveNode$1, t as SLOTS } from "./slot-DLjSL6t1.mjs";
5
+ import { n as Slot, r as resolveNode$1, t as SLOTS } from "./slot-Cne__au7.mjs";
6
6
  //#region src/jsx-runtime/constants.ts
7
7
  /**
8
8
  * IDL properties that take precedence over the default `setAttribute` path.
@@ -87,11 +87,15 @@ const ChildProperties = new Set([
87
87
  "innerText",
88
88
  "children"
89
89
  ]);
90
- /** XML namespaces for SVG-namespaced attributes (`xlink:href`, `xml:lang`). */
91
- const SVGNamespace = {
92
- xlink: "http://www.w3.org/1999/xlink",
93
- xml: "http://www.w3.org/XML/1998/namespace"
94
- };
90
+ /**
91
+ * Returns the XML namespace URI for an SVG-namespaced attribute prefix
92
+ * (`xlink:href`, `xml:lang`). Inlined as a function to avoid a 2-entry object
93
+ * allocation and the property lookup on every attribute write.
94
+ */
95
+ function svgNamespace(ns) {
96
+ if (ns === "xlink") return "http://www.w3.org/1999/xlink";
97
+ if (ns === "xml") return "http://www.w3.org/XML/1998/namespace";
98
+ }
95
99
  const ReservedNameSpaces = new Set([
96
100
  "class",
97
101
  "on",
@@ -129,18 +133,16 @@ function applyChildren(node, key, value) {
129
133
  }
130
134
  }
131
135
  function applySlot(slot, value) {
132
- effectScope(() => {
133
- let dispose;
134
- if (typeof value === "function") effect(() => slot.set(resolveChild(value())));
135
- else {
136
- const node = resolveChild(value);
137
- dispose = node[Symbol.dispose];
138
- slot.set(node);
139
- }
140
- onCleanup(() => {
141
- dispose?.();
142
- slot.clear();
143
- });
136
+ let dispose;
137
+ if (typeof value === "function") effect(() => slot.set(resolveChild(value())));
138
+ else {
139
+ const node = resolveChild(value);
140
+ dispose = node[Symbol.dispose];
141
+ slot.set(node);
142
+ }
143
+ onCleanup(() => {
144
+ dispose?.();
145
+ slot.clear();
144
146
  });
145
147
  }
146
148
  const FRAGMENT_POOL_MAX = 4;
@@ -205,16 +207,15 @@ function mountStatic(el, list, kind) {
205
207
  releaseFragment(buffer);
206
208
  if (disposers && disposers.length > 0) {
207
209
  const ds = disposers;
208
- effectScope(() => {
209
- onCleanup(() => ds.forEach((d) => d()));
210
- });
210
+ onCleanup(() => ds.forEach((d) => d()));
211
211
  }
212
212
  }
213
213
  /**
214
214
  * Mounts a single child into `el`. Reactive functions become live slots; other
215
- * values append as-is. Each child owns its own `effectScope` so sibling
216
- * `onCleanup` registrations don't overwrite each other (the signals lib
217
- * supports only one onCleanup per subscriber).
215
+ * values append as-is.
216
+ *
217
+ * Relies on the caller's effectScope (every JSX render sits inside one). The
218
+ * signals lib supports multiple onCleanup per scope, so siblings coexist.
218
219
  *
219
220
  * Also used by `createFunctionElement` when a component returns a reactive
220
221
  * getter or primitive — keeps the component's `effectScope` alive for the
@@ -224,26 +225,25 @@ function mountChild(el, child) {
224
225
  if (typeof child === "function") {
225
226
  const slot = new Slot();
226
227
  el.appendChild(slot.render());
227
- effectScope(() => {
228
- effect(() => slot.set(resolveChild(child())));
229
- onCleanup(() => slot.clear());
230
- });
228
+ effect(() => slot.set(resolveChild(child())));
229
+ onCleanup(() => slot.clear());
231
230
  return;
232
231
  }
233
232
  const node = resolveChild(child);
234
233
  const dispose = node[Symbol.dispose];
235
234
  el.appendChild(node);
236
- if (dispose) effectScope(() => {
237
- onCleanup(dispose);
238
- });
235
+ if (dispose) onCleanup(dispose);
239
236
  }
240
237
  function resolveChild(value) {
238
+ if (value instanceof Node) return value;
239
+ if (typeof value === "string" || typeof value === "number") return document.createTextNode(String(value));
240
+ if (value == null || typeof value === "boolean") return document.createComment("");
241
+ if (typeof value === "function") return resolveChild(value());
241
242
  if (Array.isArray(value)) {
242
243
  const fragment = document.createDocumentFragment();
243
244
  for (const item of value) fragment.appendChild(resolveChild(item));
244
245
  return fragment;
245
246
  }
246
- if (typeof value === "function") return resolveChild(value());
247
247
  return resolveNode$1(value);
248
248
  }
249
249
  /** Normalises the children prop into a flat array. */
@@ -297,7 +297,7 @@ function setProp(node, key, value) {
297
297
  }
298
298
  return;
299
299
  }
300
- const svgNs = SVGNamespace[ns];
300
+ const svgNs = svgNamespace(ns);
301
301
  if (svgNs) {
302
302
  node.setAttributeNS(svgNs, key, String(value ?? ""));
303
303
  return;
package/dist/for.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
  import { c as effectScope, g as untracked, h as trigger, m as signal, p as onCleanup, s as effect } from "./lib-CVfOddra.mjs";
2
2
  import "./signals/index.mjs";
3
- import { n as disposeElement } from "./element-DvqBlRly.mjs";
3
+ import { n as disposeElement } from "./element-Cbzkm_B5.mjs";
4
4
  //#region src/for.ts
5
5
  /**
6
6
  * Keyed list renderer. See {@link ForProps} for prop details.
@@ -1,4 +1,4 @@
1
- import { r as mountChild, t as createElement } from "../element-DvqBlRly.mjs";
1
+ import { r as mountChild, t as createElement } from "../element-Cbzkm_B5.mjs";
2
2
  //#region src/jsx-runtime/fragment.ts
3
3
  /**
4
4
  * Used by the JSX transform for `<>...</>` fragments.
@@ -19,8 +19,8 @@ function resolveNode(c) {
19
19
  * Content between the markers can be replaced dynamically without wrapper elements.
20
20
  */
21
21
  var Slot = class {
22
- #start = document.createComment("{");
23
- #end = document.createComment("}");
22
+ #start;
23
+ #end;
24
24
  #pending;
25
25
  /**
26
26
  * Render the slot as a DocumentFragment.
@@ -38,15 +38,18 @@ var Slot = class {
38
38
  fragment.appendChild(range.extractContents());
39
39
  return fragment;
40
40
  }
41
- fragment.appendChild(this.#start);
42
- fragment.appendChild(this.#end);
41
+ const start = this.#start ??= document.createComment("{");
42
+ const end = this.#end ??= document.createComment("}");
43
+ fragment.appendChild(start);
44
+ fragment.appendChild(end);
43
45
  const initialContent = this.#pending ?? resolveNode(defaultContent);
44
- if (initialContent) fragment.insertBefore(initialContent, this.#end);
46
+ if (initialContent) fragment.insertBefore(initialContent, end);
45
47
  this.#pending = void 0;
46
48
  return fragment;
47
49
  }
48
50
  /** Dispose reactive children and remove all content between the markers. */
49
51
  clear() {
52
+ if (!this.#start || !this.#end) return;
50
53
  let node = this.#start.nextSibling;
51
54
  while (node && node !== this.#end) {
52
55
  const next = node.nextSibling;
@@ -92,7 +95,7 @@ var Slot = class {
92
95
  }
93
96
  /** Whether the slot's comment markers are attached to the DOM. */
94
97
  isMounted() {
95
- return this.#start.parentNode === this.#end.parentNode && !!this.#start.parentNode;
98
+ return !!this.#start && this.#start.parentNode !== null && this.#start.parentNode === this.#end.parentNode;
96
99
  }
97
100
  #isSame(element) {
98
101
  return this.#start.nextSibling === element && this.#end === element.nextSibling;
package/dist/slot.mjs CHANGED
@@ -1,2 +1,2 @@
1
- import { n as Slot, t as SLOTS } from "./slot-DLjSL6t1.mjs";
1
+ import { n as Slot, t as SLOTS } from "./slot-Cne__au7.mjs";
2
2
  export { SLOTS, Slot };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "elements-kit",
3
3
  "type": "module",
4
- "version": "0.3.3",
4
+ "version": "0.3.4",
5
5
  "description": "A lightweight reactive UI library that transforms native HTMLElements into reactive components with signals. Ideal for framework-agnostic applications and web components.",
6
6
  "keywords": [
7
7
  "webcomponents",