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 +20 -6
- package/dist/index.d.cts +54 -1
- package/dist/index.d.ts +54 -1
- package/dist/index.js +18 -6
- package/package.json +1 -1
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
|
|
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
|
|
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
|
|
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
|
|
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,
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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,
|
|
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
|
|
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,
|