thunderous 2.0.8 → 2.1.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 (5) hide show
  1. package/dist/index.cjs +32 -7
  2. package/dist/index.d.cts +1 -1
  3. package/dist/index.d.ts +1 -1
  4. package/dist/index.js +32 -7
  5. package/package.json +5 -2
package/dist/index.cjs CHANGED
@@ -295,6 +295,13 @@ var logValueError = (value) => {
295
295
  value
296
296
  );
297
297
  };
298
+ var logPropertyWarning = (propName, element) => {
299
+ console.warn(
300
+ `Property "${propName}" does not exist on element:`,
301
+ element,
302
+ "\n\nThunderous will attempt to set the property anyway, but this may result in unexpected behavior. Please make sure the property exists on the element prior to setting it."
303
+ );
304
+ };
298
305
  var arrayToDocumentFragment = (array, parent, uniqueKey) => {
299
306
  const documentFragment = new DocumentFragment();
300
307
  let count = 0;
@@ -377,7 +384,6 @@ var evaluateBindings = (element, fragment) => {
377
384
  const signal = uniqueKey !== text ? renderState.signalMap.get(uniqueKey) : void 0;
378
385
  const newValue = signal !== void 0 ? signal() : text;
379
386
  const newNode = createNewNode(newValue, element, uniqueKey);
380
- const clone = newNode.cloneNode(true);
381
387
  if (i === 0) {
382
388
  child.replaceWith(newNode);
383
389
  } else {
@@ -434,22 +440,31 @@ var evaluateBindings = (element, fragment) => {
434
440
  }
435
441
  } else if (child instanceof Element) {
436
442
  for (const attr of child.attributes) {
443
+ const attrName = attr.name;
437
444
  if (SIGNAL_BINDING_REGEX.test(attr.value)) {
438
445
  const textList = attr.value.split(SIGNAL_BINDING_REGEX);
439
446
  createEffect(() => {
440
447
  let newText = "";
441
448
  let hasNull = false;
449
+ let signal;
442
450
  for (const text of textList) {
443
451
  const uniqueKey = text.replace(/\{\{signal:(.+)\}\}/, "$1");
444
- const signal = uniqueKey !== text ? renderState.signalMap.get(uniqueKey) : void 0;
452
+ signal = uniqueKey !== text ? renderState.signalMap.get(uniqueKey) : void 0;
445
453
  const value = signal !== void 0 ? signal() : text;
446
454
  if (value === null) hasNull = true;
447
455
  newText += String(value);
448
456
  }
449
- if (hasNull && newText === "null") {
450
- child.removeAttribute(attr.name);
457
+ if (hasNull && newText === "null" || attrName.startsWith("prop:")) {
458
+ child.removeAttribute(attrName);
451
459
  } else {
452
- child.setAttribute(attr.name, newText);
460
+ child.setAttribute(attrName, newText);
461
+ }
462
+ if (attrName.startsWith("prop:")) {
463
+ child.removeAttribute(attrName);
464
+ const propName = attrName.replace("prop:", "");
465
+ if (!(propName in child)) logPropertyWarning(propName, child);
466
+ const newValue = hasNull && newText === "null" ? null : newText;
467
+ child[propName] = signal !== void 0 ? signal() : newValue;
453
468
  }
454
469
  });
455
470
  } else if (LEGACY_CALLBACK_BINDING_REGEX.test(attr.value)) {
@@ -471,10 +486,20 @@ var evaluateBindings = (element, fragment) => {
471
486
  child.__customCallbackFns.set(uniqueKey, callback);
472
487
  }
473
488
  }
474
- if (uniqueKey !== "") {
475
- child.setAttribute(attr.name, `this.__customCallbackFns.get('${uniqueKey}')(event)`);
489
+ if (uniqueKey !== "" && !attrName.startsWith("prop:")) {
490
+ child.setAttribute(attrName, `this.__customCallbackFns.get('${uniqueKey}')(event)`);
491
+ } else if (attrName.startsWith("prop:")) {
492
+ child.removeAttribute(attrName);
493
+ const propName = attrName.replace("prop:", "");
494
+ if (!(propName in child)) logPropertyWarning(propName, child);
495
+ child[propName] = child.__customCallbackFns.get(uniqueKey);
476
496
  }
477
497
  });
498
+ } else if (attrName.startsWith("prop:")) {
499
+ child.removeAttribute(attrName);
500
+ const propName = attrName.replace("prop:", "");
501
+ if (!(propName in child)) logPropertyWarning(propName, child);
502
+ child[propName] = attr.value;
478
503
  }
479
504
  }
480
505
  evaluateBindings(child, fragment);
package/dist/index.d.cts CHANGED
@@ -2,7 +2,7 @@ declare global {
2
2
  interface DocumentFragment {
3
3
  host: HTMLElement;
4
4
  }
5
- interface Element {
5
+ interface Node {
6
6
  __customCallbackFns?: Map<string, AnyFn>;
7
7
  }
8
8
  interface CustomElementRegistry {
package/dist/index.d.ts CHANGED
@@ -2,7 +2,7 @@ declare global {
2
2
  interface DocumentFragment {
3
3
  host: HTMLElement;
4
4
  }
5
- interface Element {
5
+ interface Node {
6
6
  __customCallbackFns?: Map<string, AnyFn>;
7
7
  }
8
8
  interface CustomElementRegistry {
package/dist/index.js CHANGED
@@ -260,6 +260,13 @@ var logValueError = (value) => {
260
260
  value
261
261
  );
262
262
  };
263
+ var logPropertyWarning = (propName, element) => {
264
+ console.warn(
265
+ `Property "${propName}" does not exist on element:`,
266
+ element,
267
+ "\n\nThunderous will attempt to set the property anyway, but this may result in unexpected behavior. Please make sure the property exists on the element prior to setting it."
268
+ );
269
+ };
263
270
  var arrayToDocumentFragment = (array, parent, uniqueKey) => {
264
271
  const documentFragment = new DocumentFragment();
265
272
  let count = 0;
@@ -342,7 +349,6 @@ var evaluateBindings = (element, fragment) => {
342
349
  const signal = uniqueKey !== text ? renderState.signalMap.get(uniqueKey) : void 0;
343
350
  const newValue = signal !== void 0 ? signal() : text;
344
351
  const newNode = createNewNode(newValue, element, uniqueKey);
345
- const clone = newNode.cloneNode(true);
346
352
  if (i === 0) {
347
353
  child.replaceWith(newNode);
348
354
  } else {
@@ -399,22 +405,31 @@ var evaluateBindings = (element, fragment) => {
399
405
  }
400
406
  } else if (child instanceof Element) {
401
407
  for (const attr of child.attributes) {
408
+ const attrName = attr.name;
402
409
  if (SIGNAL_BINDING_REGEX.test(attr.value)) {
403
410
  const textList = attr.value.split(SIGNAL_BINDING_REGEX);
404
411
  createEffect(() => {
405
412
  let newText = "";
406
413
  let hasNull = false;
414
+ let signal;
407
415
  for (const text of textList) {
408
416
  const uniqueKey = text.replace(/\{\{signal:(.+)\}\}/, "$1");
409
- const signal = uniqueKey !== text ? renderState.signalMap.get(uniqueKey) : void 0;
417
+ signal = uniqueKey !== text ? renderState.signalMap.get(uniqueKey) : void 0;
410
418
  const value = signal !== void 0 ? signal() : text;
411
419
  if (value === null) hasNull = true;
412
420
  newText += String(value);
413
421
  }
414
- if (hasNull && newText === "null") {
415
- child.removeAttribute(attr.name);
422
+ if (hasNull && newText === "null" || attrName.startsWith("prop:")) {
423
+ child.removeAttribute(attrName);
416
424
  } else {
417
- child.setAttribute(attr.name, newText);
425
+ child.setAttribute(attrName, newText);
426
+ }
427
+ if (attrName.startsWith("prop:")) {
428
+ child.removeAttribute(attrName);
429
+ const propName = attrName.replace("prop:", "");
430
+ if (!(propName in child)) logPropertyWarning(propName, child);
431
+ const newValue = hasNull && newText === "null" ? null : newText;
432
+ child[propName] = signal !== void 0 ? signal() : newValue;
418
433
  }
419
434
  });
420
435
  } else if (LEGACY_CALLBACK_BINDING_REGEX.test(attr.value)) {
@@ -436,10 +451,20 @@ var evaluateBindings = (element, fragment) => {
436
451
  child.__customCallbackFns.set(uniqueKey, callback);
437
452
  }
438
453
  }
439
- if (uniqueKey !== "") {
440
- child.setAttribute(attr.name, `this.__customCallbackFns.get('${uniqueKey}')(event)`);
454
+ if (uniqueKey !== "" && !attrName.startsWith("prop:")) {
455
+ child.setAttribute(attrName, `this.__customCallbackFns.get('${uniqueKey}')(event)`);
456
+ } else if (attrName.startsWith("prop:")) {
457
+ child.removeAttribute(attrName);
458
+ const propName = attrName.replace("prop:", "");
459
+ if (!(propName in child)) logPropertyWarning(propName, child);
460
+ child[propName] = child.__customCallbackFns.get(uniqueKey);
441
461
  }
442
462
  });
463
+ } else if (attrName.startsWith("prop:")) {
464
+ child.removeAttribute(attrName);
465
+ const propName = attrName.replace("prop:", "");
466
+ if (!(propName in child)) logPropertyWarning(propName, child);
467
+ child[propName] = attr.value;
443
468
  }
444
469
  }
445
470
  evaluateBindings(child, fragment);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "thunderous",
3
- "version": "2.0.8",
3
+ "version": "2.1.0",
4
4
  "description": "",
5
5
  "type": "module",
6
6
  "main": "./dist/index.cjs",
@@ -35,7 +35,10 @@
35
35
  "www": "cd www && npm run dev",
36
36
  "build": "tsup src/index.ts --format cjs,esm --dts --no-clean",
37
37
  "test": "find src -name '*.test.ts' | xargs c8 node --import tsx --test",
38
- "lint": "tsc && eslint ."
38
+ "lint": "tsc && eslint .",
39
+ "version:patch": "npm run build && npm version patch && cd demo && npm version patch && cd ../www && npm version patch && git add -A && git commit -m 'bump version'",
40
+ "version:minor": "npm run build && npm version minor && cd demo && npm version minor && cd ../www && npm version minor && git add -A && git commit -m 'bump version'",
41
+ "version:major": "npm run build && npm version major && cd demo && npm version major && cd ../www && npm version major && git add -A && git commit -m 'bump version'"
39
42
  },
40
43
  "devDependencies": {
41
44
  "@types/dompurify": "^3.2.0",