thunderous 2.4.3 → 2.4.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/dist/index.cjs CHANGED
@@ -20,6 +20,8 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
20
20
  // src/index.ts
21
21
  var index_exports = {};
22
22
  __export(index_exports, {
23
+ clearRenderState: () => clearRenderState,
24
+ clearServerCss: () => clearServerCss,
23
25
  clientOnlyCallback: () => clientOnlyCallback,
24
26
  createEffect: () => createEffect,
25
27
  createRegistry: () => createRegistry,
@@ -184,6 +186,9 @@ var serverDefineFns = /* @__PURE__ */ new Set();
184
186
  var onServerDefine = (fn) => {
185
187
  serverDefineFns.add(fn);
186
188
  };
189
+ var clearServerCss = () => {
190
+ serverCss.clear();
191
+ };
187
192
  var serverDefine = ({
188
193
  tagName,
189
194
  serverRender,
@@ -332,6 +337,13 @@ var renderState = {
332
337
  propertyMap: /* @__PURE__ */ new Map(),
333
338
  registry: typeof customElements !== "undefined" ? customElements : {}
334
339
  };
340
+ var clearRenderState = () => {
341
+ renderState.signalMap.clear();
342
+ renderState.callbackMap.clear();
343
+ renderState.propertyMap.clear();
344
+ renderState.fragmentMap.clear();
345
+ renderState.childrenMap.clear();
346
+ };
335
347
  var logPropertyWarning = (propName, element) => {
336
348
  console.warn(
337
349
  `Property "${propName}" does not exist on element:`,
@@ -341,7 +353,7 @@ var logPropertyWarning = (propName, element) => {
341
353
  };
342
354
  var asNodeList = (value, parent) => {
343
355
  if (typeof value === "string") return [new Text(value)];
344
- if (value instanceof DocumentFragment) return [...value.children];
356
+ if (value instanceof DocumentFragment) return Array.from(value.children);
345
357
  if (Array.isArray(value)) {
346
358
  const nodeList = [];
347
359
  let count = 0;
@@ -407,7 +419,7 @@ var processValue = (value) => {
407
419
  return String(value);
408
420
  };
409
421
  var evaluateBindings = (element, fragment) => {
410
- for (const child of [...element.childNodes]) {
422
+ for (const child of Array.from(element.childNodes)) {
411
423
  if (child instanceof Text && SIGNAL_BINDING_REGEX.test(child.data)) {
412
424
  const textList = child.data.split(SIGNAL_BINDING_REGEX);
413
425
  const nextSibling = child.nextSibling;
@@ -486,10 +498,10 @@ var evaluateBindings = (element, fragment) => {
486
498
  persistedChild.remove();
487
499
  continue;
488
500
  }
489
- for (const attr of [...persistedChild.attributes]) {
501
+ for (const attr of Array.from(persistedChild.attributes)) {
490
502
  if (!newChild.hasAttribute(attr.name)) persistedChild.removeAttribute(attr.name);
491
503
  }
492
- for (const newAttr of [...newChild.attributes]) {
504
+ for (const newAttr of Array.from(newChild.attributes)) {
493
505
  const oldAttrValue = persistedChild.getAttribute(newAttr.name);
494
506
  if (oldAttrValue?.startsWith("this.__customCallbackFns")) continue;
495
507
  persistedChild.setAttribute(newAttr.name, newAttr.value);
@@ -504,7 +516,7 @@ var evaluateBindings = (element, fragment) => {
504
516
  };
505
517
  const bindFragment = (signal2) => {
506
518
  const initialFragment = signal2();
507
- renderState.childrenMap.set(initialFragment, [...initialFragment.childNodes]);
519
+ renderState.childrenMap.set(initialFragment, Array.from(initialFragment.childNodes));
508
520
  createEffect(({ destroy }) => {
509
521
  const result = signal2();
510
522
  const cachedChildren = renderState.childrenMap.get(initialFragment);
@@ -546,7 +558,7 @@ var evaluateBindings = (element, fragment) => {
546
558
  child.replaceWith(childFragment);
547
559
  }
548
560
  } else if (child instanceof Element) {
549
- for (const attr of [...child.attributes]) {
561
+ for (const attr of Array.from(child.attributes)) {
550
562
  const attrName = attr.name;
551
563
  if (SIGNAL_BINDING_REGEX.test(attr.value)) {
552
564
  const textList = attr.value.split(SIGNAL_BINDING_REGEX);
@@ -1176,6 +1188,8 @@ var createRegistry = (args) => {
1176
1188
  };
1177
1189
  // Annotate the CommonJS export names for ESM import in node:
1178
1190
  0 && (module.exports = {
1191
+ clearRenderState,
1192
+ clearServerCss,
1179
1193
  clientOnlyCallback,
1180
1194
  createEffect,
1181
1195
  createRegistry,
package/dist/index.d.cts CHANGED
@@ -143,7 +143,41 @@ declare const customElement: <Props extends CustomElementProps>(render: RenderFu
143
143
  */
144
144
  declare const createRegistry: (args?: RegistryArgs) => RegistryResult;
145
145
 
146
+ /**
147
+ * Add a callback to handle each call to `define()` on the server.
148
+ *
149
+ * This enables you to intercept those definitions and respond to them,
150
+ * for example to inject declarative shadow DOM templates.
151
+ *
152
+ * @example
153
+ * ```ts
154
+ * let response = originalResponse;
155
+ * onServerDefine((tagName, htmlString) => {
156
+ * // ...
157
+ * response = htmlString.replace(tagName, `my-${tagName}`);
158
+ * });
159
+ * ```
160
+ */
146
161
  declare const onServerDefine: (fn: ServerDefineFn) => void;
162
+ /**
163
+ * Thunderous tracks its state using several maps to associate values with
164
+ * their respective elements.
165
+ *
166
+ * This function clears the map that tracks CSS on the server side, to prevent
167
+ * memory leaks and purge stale data from previous renders.
168
+ *
169
+ * If you are building a framework or plugin that depends on Thunderous, you
170
+ * should call this function before every render. Otherwise, the map will
171
+ * accumulate stale data and may create significant performance issues.
172
+ *
173
+ * @example
174
+ * ```ts
175
+ * import { clearServerCss } from 'thunderous'
176
+ *
177
+ * clearServerCss();
178
+ * ```
179
+ */
180
+ declare const clearServerCss: () => void;
147
181
  declare const insertTemplates: (tagName: string, template: string, inputString: string) => string;
148
182
  declare const clientOnlyCallback: (fn: (() => void) | (() => Promise<void>)) => void | Promise<void>;
149
183
 
@@ -178,10 +212,29 @@ declare const derived: <T>(fn: () => T, options?: SignalOptions) => SignalGetter
178
212
  */
179
213
  declare const createEffect: <T = unknown>(fn: Effect<T>, value?: T) => void;
180
214
 
215
+ /**
216
+ * Thunderous tracks its state using several maps to associate values with
217
+ * their respective elements.
218
+ *
219
+ * This function clears the maps tracking render state, to prevent memory
220
+ * leaks and purge stale data from previous renders.
221
+ *
222
+ * If you are building a framework or plugin that depends on Thunderous, you
223
+ * should call this function before every render. Otherwise, the maps will
224
+ * accumulate stale data and may create significant performance issues.
225
+ *
226
+ * @example
227
+ * ```ts
228
+ * import { clearRenderState } from 'thunderous'
229
+ *
230
+ * clearRenderState();
231
+ * ```
232
+ */
233
+ declare const clearRenderState: () => void;
181
234
  /**
182
235
  * A tagged template function for creating DocumentFragment instances.
183
236
  */
184
237
  declare const html: (strings: TemplateStringsArray, ...values: unknown[]) => DocumentFragment;
185
238
  declare const css: (strings: TemplateStringsArray, ...values: unknown[]) => Styles;
186
239
 
187
- export { type ElementResult, type HTMLCustomElement, type RegistryResult, type RenderArgs, type RenderFunction, type Signal, type SignalGetter, type SignalSetter, clientOnlyCallback, createEffect, createRegistry, createSignal, css, customElement, derived, html, insertTemplates, onServerDefine };
240
+ export { type ElementResult, type HTMLCustomElement, type RegistryResult, type RenderArgs, type RenderFunction, type Signal, type SignalGetter, type SignalSetter, clearRenderState, clearServerCss, clientOnlyCallback, createEffect, createRegistry, createSignal, css, customElement, derived, html, insertTemplates, onServerDefine };
package/dist/index.d.ts CHANGED
@@ -143,7 +143,41 @@ declare const customElement: <Props extends CustomElementProps>(render: RenderFu
143
143
  */
144
144
  declare const createRegistry: (args?: RegistryArgs) => RegistryResult;
145
145
 
146
+ /**
147
+ * Add a callback to handle each call to `define()` on the server.
148
+ *
149
+ * This enables you to intercept those definitions and respond to them,
150
+ * for example to inject declarative shadow DOM templates.
151
+ *
152
+ * @example
153
+ * ```ts
154
+ * let response = originalResponse;
155
+ * onServerDefine((tagName, htmlString) => {
156
+ * // ...
157
+ * response = htmlString.replace(tagName, `my-${tagName}`);
158
+ * });
159
+ * ```
160
+ */
146
161
  declare const onServerDefine: (fn: ServerDefineFn) => void;
162
+ /**
163
+ * Thunderous tracks its state using several maps to associate values with
164
+ * their respective elements.
165
+ *
166
+ * This function clears the map that tracks CSS on the server side, to prevent
167
+ * memory leaks and purge stale data from previous renders.
168
+ *
169
+ * If you are building a framework or plugin that depends on Thunderous, you
170
+ * should call this function before every render. Otherwise, the map will
171
+ * accumulate stale data and may create significant performance issues.
172
+ *
173
+ * @example
174
+ * ```ts
175
+ * import { clearServerCss } from 'thunderous'
176
+ *
177
+ * clearServerCss();
178
+ * ```
179
+ */
180
+ declare const clearServerCss: () => void;
147
181
  declare const insertTemplates: (tagName: string, template: string, inputString: string) => string;
148
182
  declare const clientOnlyCallback: (fn: (() => void) | (() => Promise<void>)) => void | Promise<void>;
149
183
 
@@ -178,10 +212,29 @@ declare const derived: <T>(fn: () => T, options?: SignalOptions) => SignalGetter
178
212
  */
179
213
  declare const createEffect: <T = unknown>(fn: Effect<T>, value?: T) => void;
180
214
 
215
+ /**
216
+ * Thunderous tracks its state using several maps to associate values with
217
+ * their respective elements.
218
+ *
219
+ * This function clears the maps tracking render state, to prevent memory
220
+ * leaks and purge stale data from previous renders.
221
+ *
222
+ * If you are building a framework or plugin that depends on Thunderous, you
223
+ * should call this function before every render. Otherwise, the maps will
224
+ * accumulate stale data and may create significant performance issues.
225
+ *
226
+ * @example
227
+ * ```ts
228
+ * import { clearRenderState } from 'thunderous'
229
+ *
230
+ * clearRenderState();
231
+ * ```
232
+ */
233
+ declare const clearRenderState: () => void;
181
234
  /**
182
235
  * A tagged template function for creating DocumentFragment instances.
183
236
  */
184
237
  declare const html: (strings: TemplateStringsArray, ...values: unknown[]) => DocumentFragment;
185
238
  declare const css: (strings: TemplateStringsArray, ...values: unknown[]) => Styles;
186
239
 
187
- export { type ElementResult, type HTMLCustomElement, type RegistryResult, type RenderArgs, type RenderFunction, type Signal, type SignalGetter, type SignalSetter, clientOnlyCallback, createEffect, createRegistry, createSignal, css, customElement, derived, html, insertTemplates, onServerDefine };
240
+ export { type ElementResult, type HTMLCustomElement, type RegistryResult, type RenderArgs, type RenderFunction, type Signal, type SignalGetter, type SignalSetter, clearRenderState, clearServerCss, clientOnlyCallback, createEffect, createRegistry, createSignal, css, customElement, derived, html, insertTemplates, onServerDefine };
package/dist/index.js CHANGED
@@ -149,6 +149,9 @@ var serverDefineFns = /* @__PURE__ */ new Set();
149
149
  var onServerDefine = (fn) => {
150
150
  serverDefineFns.add(fn);
151
151
  };
152
+ var clearServerCss = () => {
153
+ serverCss.clear();
154
+ };
152
155
  var serverDefine = ({
153
156
  tagName,
154
157
  serverRender,
@@ -297,6 +300,13 @@ var renderState = {
297
300
  propertyMap: /* @__PURE__ */ new Map(),
298
301
  registry: typeof customElements !== "undefined" ? customElements : {}
299
302
  };
303
+ var clearRenderState = () => {
304
+ renderState.signalMap.clear();
305
+ renderState.callbackMap.clear();
306
+ renderState.propertyMap.clear();
307
+ renderState.fragmentMap.clear();
308
+ renderState.childrenMap.clear();
309
+ };
300
310
  var logPropertyWarning = (propName, element) => {
301
311
  console.warn(
302
312
  `Property "${propName}" does not exist on element:`,
@@ -306,7 +316,7 @@ var logPropertyWarning = (propName, element) => {
306
316
  };
307
317
  var asNodeList = (value, parent) => {
308
318
  if (typeof value === "string") return [new Text(value)];
309
- if (value instanceof DocumentFragment) return [...value.children];
319
+ if (value instanceof DocumentFragment) return Array.from(value.children);
310
320
  if (Array.isArray(value)) {
311
321
  const nodeList = [];
312
322
  let count = 0;
@@ -372,7 +382,7 @@ var processValue = (value) => {
372
382
  return String(value);
373
383
  };
374
384
  var evaluateBindings = (element, fragment) => {
375
- for (const child of [...element.childNodes]) {
385
+ for (const child of Array.from(element.childNodes)) {
376
386
  if (child instanceof Text && SIGNAL_BINDING_REGEX.test(child.data)) {
377
387
  const textList = child.data.split(SIGNAL_BINDING_REGEX);
378
388
  const nextSibling = child.nextSibling;
@@ -451,10 +461,10 @@ var evaluateBindings = (element, fragment) => {
451
461
  persistedChild.remove();
452
462
  continue;
453
463
  }
454
- for (const attr of [...persistedChild.attributes]) {
464
+ for (const attr of Array.from(persistedChild.attributes)) {
455
465
  if (!newChild.hasAttribute(attr.name)) persistedChild.removeAttribute(attr.name);
456
466
  }
457
- for (const newAttr of [...newChild.attributes]) {
467
+ for (const newAttr of Array.from(newChild.attributes)) {
458
468
  const oldAttrValue = persistedChild.getAttribute(newAttr.name);
459
469
  if (oldAttrValue?.startsWith("this.__customCallbackFns")) continue;
460
470
  persistedChild.setAttribute(newAttr.name, newAttr.value);
@@ -469,7 +479,7 @@ var evaluateBindings = (element, fragment) => {
469
479
  };
470
480
  const bindFragment = (signal2) => {
471
481
  const initialFragment = signal2();
472
- renderState.childrenMap.set(initialFragment, [...initialFragment.childNodes]);
482
+ renderState.childrenMap.set(initialFragment, Array.from(initialFragment.childNodes));
473
483
  createEffect(({ destroy }) => {
474
484
  const result = signal2();
475
485
  const cachedChildren = renderState.childrenMap.get(initialFragment);
@@ -511,7 +521,7 @@ var evaluateBindings = (element, fragment) => {
511
521
  child.replaceWith(childFragment);
512
522
  }
513
523
  } else if (child instanceof Element) {
514
- for (const attr of [...child.attributes]) {
524
+ for (const attr of Array.from(child.attributes)) {
515
525
  const attrName = attr.name;
516
526
  if (SIGNAL_BINDING_REGEX.test(attr.value)) {
517
527
  const textList = attr.value.split(SIGNAL_BINDING_REGEX);
@@ -1140,6 +1150,8 @@ var createRegistry = (args) => {
1140
1150
  };
1141
1151
  };
1142
1152
  export {
1153
+ clearRenderState,
1154
+ clearServerCss,
1143
1155
  clientOnlyCallback,
1144
1156
  createEffect,
1145
1157
  createRegistry,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "thunderous",
3
- "version": "2.4.3",
3
+ "version": "2.4.4",
4
4
  "description": "A lightweight, functional web components library that brings the power of signals to your UI.",
5
5
  "type": "module",
6
6
  "main": "./dist/index.cjs",