wrec 0.27.0 → 0.28.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.
@@ -37,8 +37,8 @@ var r = typeof window < "u" && window.document !== void 0, i = class extends Err
37
37
  static get(e) {
38
38
  return this.#e.get(e);
39
39
  }
40
- #t = Symbol("objectId");
41
- #n = [];
40
+ #t = [];
41
+ #n = Symbol("objectId");
42
42
  #r;
43
43
  #i;
44
44
  #a;
@@ -52,15 +52,15 @@ var r = typeof window < "u" && window.document !== void 0, i = class extends Err
52
52
  if (o) for (let [e, t] of Object.entries(o)) this.addProperty(e, t);
53
53
  e.#e.set(n, this);
54
54
  }
55
- addListener(e, t = {}) {
56
- let n = this.#n.find((t) => t.listenerRef.deref() === e);
57
- if (n) {
58
- let { propertyMap: e } = n;
59
- for (let [n, r] of Object.entries(t)) e[n] = r;
60
- } else this.#n.push({
61
- listenerRef: new WeakRef(e),
62
- propertyMap: t
63
- });
55
+ subscribe(e, t = []) {
56
+ if (this.#t.some((t) => t.callback === e)) throw new i("WrecState subscribe was passed a callback that was already added");
57
+ let n = {
58
+ callback: e,
59
+ statePaths: t
60
+ };
61
+ return this.#t.push(n), () => {
62
+ this.#t = this.#t.filter((e) => e !== n);
63
+ };
64
64
  }
65
65
  addProperty(e, t) {
66
66
  Object.defineProperty(this, e, {
@@ -74,27 +74,20 @@ var r = typeof window < "u" && window.document !== void 0, i = class extends Err
74
74
  }), this.#a[e] = t;
75
75
  }
76
76
  get id() {
77
- return this.#t;
77
+ return this.#n;
78
78
  }
79
79
  log() {
80
80
  console.log("WrecState:", this.#r);
81
81
  for (let [e, t] of Object.entries(this.#a)) console.log(` ${e} = ${JSON.stringify(t)}`);
82
82
  }
83
83
  #o(e, t, n) {
84
- let i = /* @__PURE__ */ new Set();
85
- for (let a of this.#n) {
86
- let o = a.listenerRef.deref();
87
- if (!o) i.add(a);
88
- else if (r && o instanceof HTMLElement && !o.isConnected) i.add(a);
89
- else {
90
- let { propertyMap: r } = a, i = Object.keys(r);
91
- (i.length === 0 || i.includes(e)) && o.changed(e, r[e], n, t, this);
92
- }
93
- }
94
- this.#n = this.#n.filter((e) => !i.has(e));
95
- }
96
- removeListener(e) {
97
- this.#n = this.#n.filter((t) => t.listenerRef.deref() !== e);
84
+ let r = {
85
+ state: this,
86
+ statePath: e,
87
+ oldValue: t,
88
+ newValue: n
89
+ };
90
+ for (let { callback: t, statePaths: n } of this.#t) (n.length === 0 || n.includes(e)) && t(r);
98
91
  }
99
92
  };
100
93
  r && process.env.NODE_ENV === "development" && (window.WrecState = a);
@@ -285,6 +278,7 @@ var U = class e extends p {
285
278
  #s = null;
286
279
  #c = /* @__PURE__ */ new Map();
287
280
  #l = /* @__PURE__ */ new Map();
281
+ #u = /* @__PURE__ */ new Map();
288
282
  static define(e) {
289
283
  if (this.elementName = e, m.get(e)) throw new h(`custom element ${e} is already defined`);
290
284
  m.define(e, this);
@@ -292,13 +286,13 @@ var U = class e extends p {
292
286
  constructor() {
293
287
  super(), this.attachShadow({ mode: "open" });
294
288
  let e = this.#n;
295
- this.#b("attrToPropMap") || (e.attrToPropMap = /* @__PURE__ */ new Map()), this.#b("properties") || (e.properties = {}), this.#b("propToAttrMap") || (e.propToAttrMap = /* @__PURE__ */ new Map()), this.#b("propToComputedMap") || (e.propToComputedMap = /* @__PURE__ */ new Map()), this.#b("propToExprsMap") || (e.propToExprsMap = /* @__PURE__ */ new Map());
289
+ this.#x("attrToPropMap") || (e.attrToPropMap = /* @__PURE__ */ new Map()), this.#x("properties") || (e.properties = {}), this.#x("propToAttrMap") || (e.propToAttrMap = /* @__PURE__ */ new Map()), this.#x("propToComputedMap") || (e.propToComputedMap = /* @__PURE__ */ new Map()), this.#x("propToExprsMap") || (e.propToExprsMap = /* @__PURE__ */ new Map());
296
290
  }
297
291
  attributeChangedCallback(t, n, r) {
298
- t === "disabled" && this.#m();
292
+ t === "disabled" && this.#h();
299
293
  let i = e.getPropName(t);
300
- if (!this.#S(i) && this.#x(i)) {
301
- let e = this.#P(i, r);
294
+ if (!this.#C(i) && this.#S(i)) {
295
+ let e = this.#F(i, r);
302
296
  this[i] = e;
303
297
  let t = this.#i[i];
304
298
  t && this.setFormValue(t, String(e));
@@ -319,21 +313,21 @@ var U = class e extends p {
319
313
  }
320
314
  for (let e of i) {
321
315
  let r = a[e];
322
- this.#O(e, this.#_(r));
316
+ this.#k(e, this.#v(r));
323
317
  let i = t.get(e) ?? [];
324
318
  for (let e of i) n.add(e);
325
319
  }
326
320
  for (;;) {
327
321
  let e = !1;
328
322
  for (let t of i) {
329
- let n = a[t], r = this.#_(n), i = this[t];
330
- JSON.stringify(r) !== JSON.stringify(i) && (this.#O(t, r), e = !0);
323
+ let n = a[t], r = this.#v(n), i = this[t];
324
+ JSON.stringify(r) !== JSON.stringify(i) && (this.#k(t, r), e = !0);
331
325
  }
332
326
  if (!e) break;
333
327
  }
334
- this.#g([...n]), this.#e = !1;
328
+ this.#_([...n]), this.#e = !1;
335
329
  }
336
- async #u() {
330
+ async #d() {
337
331
  let e = this.#n, { template: t } = e;
338
332
  t || (t = e.template = document.createElement("template"), t.innerHTML = e.buildHTML()), await H(t), this.shadowRoot.replaceChildren(t.content.cloneNode(!0));
339
333
  }
@@ -348,36 +342,36 @@ var U = class e extends p {
348
342
  this[t] = n;
349
343
  }
350
344
  async connectedCallback() {
351
- this.#B(), this.#f(), await this.#u(), this.hasAttribute("disabled") && this.#m(), this.#W(this.shadowRoot), this.#C(this.shadowRoot), this.#z(), this.#d(), this.ready();
345
+ this.#V(), this.#p(), await this.#d(), this.hasAttribute("disabled") && this.#h(), this.#G(this.shadowRoot), this.#w(this.shadowRoot), this.#B(), this.#f(), this.ready();
352
346
  }
353
- #d() {
347
+ #f() {
354
348
  let { properties: e } = this.#n;
355
- for (let [t, { computed: n }] of Object.entries(e)) n && this.#O(t, this.#_(n));
349
+ for (let [t, { computed: n }] of Object.entries(e)) n && this.#k(t, this.#v(n));
356
350
  }
357
- #f() {
351
+ #p() {
358
352
  let { observedAttributes: e, properties: t } = this.#n;
359
- for (let [n, r] of Object.entries(t)) r.computed || this.#p(n, r, e);
360
- for (let [n, r] of Object.entries(t)) r.computed && this.#p(n, r, e);
353
+ for (let [n, r] of Object.entries(t)) r.computed || this.#m(n, r, e);
354
+ for (let [n, r] of Object.entries(t)) r.computed && this.#m(n, r, e);
361
355
  }
362
- #p(t, n, r) {
356
+ #m(t, n, r) {
363
357
  if (t === "class" || t === "style") throw new h(`"${t}" is a reserved property`);
364
358
  let i = e.getAttrName(t), a = this.hasAttribute(i);
365
- n.required && !a && this.#j(this, i, "is a required attribute");
359
+ n.required && !a && this.#M(this, i, "is a required attribute");
366
360
  let o = n.value;
367
361
  this.hasOwnProperty(t) && (o = this[t], delete this[t]);
368
- let { type: c } = n, l = c === Boolean ? o || a : r.includes(i) && a ? this.#N(t, i) : o ?? O(n), u = "#" + t;
369
- this[u] = l, n.computed && this.#D(t, n), Object.defineProperty(this, t, {
362
+ let { type: c } = n, l = c === Boolean ? o || a : r.includes(i) && a ? this.#P(t, i) : o ?? O(n), u = "#" + t;
363
+ this[u] = l, n.computed && this.#O(t, n), Object.defineProperty(this, t, {
370
364
  enumerable: !0,
371
365
  get() {
372
366
  return this[u];
373
367
  },
374
368
  set(e) {
375
- n.computed && !this.#t.has(t) && this.#j(null, t, "is a computed property and cannot be set directly"), c === Number && typeof e == "string" && (e = R(e));
369
+ n.computed && !this.#t.has(t) && this.#M(null, t, "is a computed property and cannot be set directly"), c === Number && typeof e == "string" && (e = R(e));
376
370
  let r = this[u];
377
371
  if (e === r) return;
378
- this.#U(t, c, e), this[u] = e;
372
+ this.#W(t, c, e), this[u] = e;
379
373
  let a = this.#l.get(t);
380
- a && s(a.state, a.stateProp, e), this.#F(t, c, e, i), this.#e || (this.#I(t), this.#E(t)), this.#R(t, e);
374
+ a && s(a.state, a.stateProp, e), this.#I(t, c, e, i), this.#e || (this.#L(t), this.#D(t)), this.#z(t, e);
381
375
  let o = this.#i[t];
382
376
  o && this.setFormValue(o, String(e)), this.propertyChangedCallback(t, r, e), n.dispatch && this.dispatch("change", {
383
377
  tagName: this.localName,
@@ -388,13 +382,13 @@ var U = class e extends p {
388
382
  }
389
383
  });
390
384
  }
391
- #m() {
385
+ #h() {
392
386
  let e = this.hasAttribute("disabled"), t = A(this.shadowRoot);
393
387
  for (let n of t) E(n) && (n.disabled = e);
394
388
  }
395
389
  disconnectedCallback() {
396
- for (let { state: e } of this.#l.values()) e.removeListener(this);
397
- this.#r.clear(), this.#o.clear(), this.#c.clear(), this.#l.clear();
390
+ for (let { unsubscribe: e } of this.#u.values()) e();
391
+ this.#r.clear(), this.#o.clear(), this.#c.clear(), this.#l.clear(), this.#u.clear();
398
392
  }
399
393
  dispatch(e, t) {
400
394
  this.dispatchEvent(new CustomEvent(e, {
@@ -406,34 +400,34 @@ var U = class e extends p {
406
400
  displayIfSet(e, t = "block") {
407
401
  return `display: ${e == null ? "none" : t}`;
408
402
  }
409
- #h(t) {
403
+ #g(t) {
410
404
  let n = t instanceof e;
411
405
  for (let r of t.getAttributeNames()) {
412
406
  let i = t.getAttribute(r);
413
407
  if (r === "ref") {
414
- this.#A(t, i);
408
+ this.#j(t, i);
415
409
  continue;
416
410
  }
417
- let a = this.#T(t, i);
411
+ let a = this.#E(t, i);
418
412
  if (a) {
419
413
  let i = this[a];
420
- i === void 0 && this.#M(t, r, a);
421
- let [o, s] = r.split(":"), c = e.getPropName(o), l = this.#S(a);
422
- n && t.#S(c) || (t[c] = i), o === "value" && (s ? (t["on" + s] === void 0 && this.#j(t, r, "refers to an unsupported event name"), t.setAttribute(o, this[a])) : s = "change"), n && !l && t.#c.set(e.getPropName(o), a);
414
+ i === void 0 && this.#N(t, r, a);
415
+ let [o, s] = r.split(":"), c = e.getPropName(o), l = this.#C(a);
416
+ n && t.#C(c) || (t[c] = i), o === "value" && (s ? (t["on" + s] === void 0 && this.#M(t, r, "refers to an unsupported event name"), t.setAttribute(o, this[a])) : s = "change"), n && !l && t.#c.set(e.getPropName(o), a);
423
417
  }
424
- this.#k(i, t, r);
418
+ this.#A(i, t, r);
425
419
  }
426
420
  }
427
- #g(e) {
421
+ #_(e) {
428
422
  for (let t of e) {
429
- let e = this.#_(t), n = this.#r.get(t) ?? [], r = /* @__PURE__ */ new Set();
423
+ let e = this.#v(t), n = this.#r.get(t) ?? [], r = /* @__PURE__ */ new Set();
430
424
  for (let t of n) {
431
425
  let n = t instanceof HTMLElement || t instanceof CSSStyleRule ? t : t.element;
432
426
  if (n instanceof HTMLElement && !n.isConnected) {
433
427
  r.add(t);
434
428
  continue;
435
429
  }
436
- if (t instanceof HTMLElement) this.#L(t, e);
430
+ if (t instanceof HTMLElement) this.#R(t, e);
437
431
  else if (!(t instanceof CSSStyleRule)) {
438
432
  let { element: n, attrName: r } = t;
439
433
  n instanceof CSSStyleRule ? n.style.setProperty(r, e) : B(n, r, e);
@@ -445,11 +439,11 @@ var U = class e extends p {
445
439
  }
446
440
  }
447
441
  }
448
- #_(e) {
442
+ #v(e) {
449
443
  let { context: t } = this.#n;
450
444
  return Function("context", `const {${Object.keys(t).join(",")}} = context; return ${e};`).call(this, t);
451
445
  }
452
- #v(e) {
446
+ #y(e) {
453
447
  let { localName: t } = e;
454
448
  if (t === "style") {
455
449
  let { sheet: t } = e, n = t?.cssRules ?? [], r = Array.from(n);
@@ -457,13 +451,13 @@ var U = class e extends p {
457
451
  let t = Array.from(e.style);
458
452
  for (let n of t) if (n.startsWith("--")) {
459
453
  let t = e.style.getPropertyValue(n);
460
- this.#k(t, e, n);
454
+ this.#A(t, e, n);
461
455
  }
462
456
  }
463
457
  } else {
464
458
  let t = "";
465
459
  if (P(e)) {
466
- this.#k(e.textContent, e);
460
+ this.#A(e.textContent, e);
467
461
  let n = e.textContent?.match(b);
468
462
  n && (t = n[1]);
469
463
  } else {
@@ -471,8 +465,8 @@ var U = class e extends p {
471
465
  n && (t = n.textContent?.trim() ?? "");
472
466
  }
473
467
  if (t) {
474
- let n = this.#T(e, t);
475
- n && P(e) ? e.textContent = this[n] : this.#k(t, e);
468
+ let n = this.#E(e, t);
469
+ n && P(e) ? e.textContent = this[n] : this.#A(t, e);
476
470
  }
477
471
  }
478
472
  }
@@ -480,7 +474,7 @@ var U = class e extends p {
480
474
  let e = this.getAttribute("form-assoc");
481
475
  if (!e) {
482
476
  let t = this.getAttribute("name");
483
- if (t) if (this.#x("value")) e = `value:${t}`;
477
+ if (t) if (this.#S("value")) e = `value:${t}`;
484
478
  else return;
485
479
  else return;
486
480
  }
@@ -501,7 +495,7 @@ var U = class e extends p {
501
495
  let e = this.#o;
502
496
  for (let t of Object.keys(e)) {
503
497
  let n = e[t];
504
- S.test(n) && (n = this.#_(n)), this[t] = n;
498
+ S.test(n) && (n = this.#v(n)), this[t] = n;
505
499
  }
506
500
  }
507
501
  static getAttrName(e) {
@@ -512,55 +506,55 @@ var U = class e extends p {
512
506
  let t = this.attrToPropMap.get(e);
513
507
  return t || (t = e.replace(/-([a-z])/g, (e, t) => t.toUpperCase()), this.attrToPropMap.set(e, t)), t;
514
508
  }
515
- #y(e, t, n) {
509
+ #b(e, t, n) {
516
510
  if (n.length !== 1) return;
517
511
  let [r] = n;
518
512
  if (!S.test(r)) return;
519
513
  let i = F(e) || P(e), [a, o] = (t ?? "").split(":");
520
514
  if (!(i && a === "value" || P(e))) return;
521
- o ? e["on" + o] === void 0 && this.#j(e, t, "refers to an unsupported event name") : o = "change";
515
+ o ? e["on" + o] === void 0 && this.#M(e, t, "refers to an unsupported event name") : o = "change";
522
516
  let s = j(r);
523
517
  e.addEventListener(o, (e) => {
524
518
  let { target: t } = e;
525
519
  if (!t) return;
526
520
  let n = t.value, { type: r } = this.#n.properties[s];
527
- this[s] = r === Number ? R(n) : n, this.#E(s);
521
+ this[s] = r === Number ? R(n) : n, this.#D(s);
528
522
  });
529
523
  }
530
- #b(e) {
524
+ #x(e) {
531
525
  return Object.hasOwn(this.#n, e);
532
526
  }
533
- #x(e) {
527
+ #S(e) {
534
528
  return !!this.#n.properties[e];
535
529
  }
536
- #S(e) {
530
+ #C(e) {
537
531
  return !!this.#n.properties[e]?.computed;
538
532
  }
539
- #C(e) {
533
+ #w(e) {
540
534
  let t = Array.from(e.querySelectorAll("*"));
541
- for (let e of t) this.#h(e), e.firstElementChild || this.#v(e);
535
+ for (let e of t) this.#g(e), e.firstElementChild || this.#y(e);
542
536
  }
543
- #w() {
537
+ #T() {
544
538
  if (this.#n.formAssociated || this.closest("form") === null) return;
545
539
  let e = this.#n.name;
546
- this.#j(this, void 0, `inside form, class ${e} requires "static formAssociated = true;"`);
540
+ this.#M(this, void 0, `inside form, class ${e} requires "static formAssociated = true;"`);
547
541
  }
548
542
  static get observedAttributes() {
549
543
  let t = Object.entries(this.properties || {}).filter(([e, t]) => !t.computed).map(([t]) => e.getAttrName(t));
550
544
  return t.includes("disabled") || t.push("disabled"), t;
551
545
  }
552
546
  propertyChangedCallback(e, t, n) {}
553
- #T(e, t) {
547
+ #E(e, t) {
554
548
  if (!t || !S.test(t)) return;
555
549
  let n = j(t);
556
- return this[n] === void 0 && this.#M(e, "", n), n;
550
+ return this[n] === void 0 && this.#N(e, "", n), n;
557
551
  }
558
- #E(e) {
552
+ #D(e) {
559
553
  let t = this.#n.propToExprsMap.get(e) || [];
560
- this.#g(t);
554
+ this.#_(t);
561
555
  }
562
556
  ready() {}
563
- #D(e, t) {
557
+ #O(e, t) {
564
558
  let n = this.#n, r = n.propToComputedMap;
565
559
  function i(t, n) {
566
560
  let i = r.get(t);
@@ -569,7 +563,7 @@ var U = class e extends p {
569
563
  let { computed: a } = t, o = a.match(C) || [];
570
564
  for (let t of o) {
571
565
  let n = j(t);
572
- this[n] === void 0 && this.#M(null, e, n), typeof this[n] != "function" && i(n, a);
566
+ this[n] === void 0 && this.#N(null, e, n), typeof this[n] != "function" && i(n, a);
573
567
  }
574
568
  for (let t of a.matchAll(y)) {
575
569
  let r = t[1];
@@ -577,7 +571,7 @@ var U = class e extends p {
577
571
  for (let [e, t] of Object.entries(n.properties)) V(t.usedBy)?.includes(r) && i(e, a);
578
572
  }
579
573
  }
580
- #O(e, t) {
574
+ #k(e, t) {
581
575
  this.#t.add(e);
582
576
  try {
583
577
  this[e] = t;
@@ -585,9 +579,9 @@ var U = class e extends p {
585
579
  this.#t.delete(e);
586
580
  }
587
581
  }
588
- #k(e, t, n = void 0) {
582
+ #A(e, t, n = void 0) {
589
583
  if (!e) return;
590
- let r = this.#V(t, n, e);
584
+ let r = this.#H(t, n, e);
591
585
  if (!r) {
592
586
  let r = e.replaceAll("this..", "this.");
593
587
  n ? B(t, n, r) : "textContent" in t && (t.textContent = r);
@@ -608,13 +602,13 @@ var U = class e extends p {
608
602
  a || (a = [], this.#r.set(e, a)), a.push(n ? {
609
603
  element: t,
610
604
  attrName: n
611
- } : t), t instanceof HTMLElement && this.#y(t, n, r);
612
- let o = this.#_(e);
613
- n ? B(t, n, o) : this.#L(t, o);
605
+ } : t), t instanceof HTMLElement && this.#b(t, n, r);
606
+ let o = this.#v(e);
607
+ n ? B(t, n, o) : this.#R(t, o);
614
608
  }
615
- #A(e, t) {
609
+ #j(e, t) {
616
610
  let n = t?.trim() ?? "", r = this.#n.properties[n];
617
- r || this.#M(e, "ref", n), r.type !== p && this.#j(e, "ref", `refers to property "${n}" whose type is not HTMLElement`), this[n] && this.#j(e, "ref", `is a duplicate reference to the property "${n}"`), this[n] = e, e.removeAttribute("ref");
611
+ r || this.#N(e, "ref", n), r.type !== p && this.#M(e, "ref", `refers to property "${n}" whose type is not HTMLElement`), this[n] && this.#M(e, "ref", `is a duplicate reference to the property "${n}"`), this[n] = e, e.removeAttribute("ref");
618
612
  }
619
613
  setAttributeSafe(e, t) {
620
614
  this.hasAttribute(e) || this.setAttribute(e, t);
@@ -625,24 +619,24 @@ var U = class e extends p {
625
619
  static ssr(e = {}) {
626
620
  throw new h("SSR is not available in the browser build.");
627
621
  }
628
- #j(e, t, n) {
622
+ #M(e, t, n) {
629
623
  let r = e instanceof HTMLElement ? e.localName : "CSS rule";
630
624
  throw new h(`component ${this.#n.elementName}` + (e ? `, element "${r}"` : "") + (t ? `, attribute "${t}"` : "") + ` ${n}`);
631
625
  }
632
- #M(e, t, n) {
633
- this.#j(e, t, `refers to missing property "${n}"`);
626
+ #N(e, t, n) {
627
+ this.#M(e, t, `refers to missing property "${n}"`);
634
628
  }
635
- #N(e, t) {
636
- return this.#P(e, this.getAttribute(t));
629
+ #P(e, t) {
630
+ return this.#F(e, this.getAttribute(t));
637
631
  }
638
- #P(t, n) {
632
+ #F(t, n) {
639
633
  if (n?.match(C)) return n;
640
634
  let r = this.#n.properties[t], { type: i, values: a } = r;
641
- if (i || this.#j(null, t, "does not specify its type"), n === null) return i === Boolean ? !1 : O(r);
635
+ if (i || this.#M(null, t, "does not specify its type"), n === null) return i === Boolean ? !1 : O(r);
642
636
  if (i === String) {
643
637
  if (a && !a.includes(n)) {
644
638
  let e = a.map((e) => `"${e}"`).join(", ");
645
- this.#j(null, t, `must be one of ${e}`);
639
+ this.#M(null, t, `must be one of ${e}`);
646
640
  }
647
641
  return n;
648
642
  }
@@ -651,26 +645,26 @@ var U = class e extends p {
651
645
  if (n === "true") return !0;
652
646
  if (n === "false" || n === "null") return !1;
653
647
  let r = e.getAttrName(t);
654
- return n && n !== r && this.#j(null, t, "is a Boolean attribute, so its value must match attribute name or be missing"), n === "" || n === r;
648
+ return n && n !== r && this.#M(null, t, "is a Boolean attribute, so its value must match attribute name or be missing"), n === "" || n === r;
655
649
  }
656
650
  }
657
- #F(e, t, n, r) {
658
- N(n) && !this.#S(e) && n !== (t === Boolean ? this.hasAttribute(r) : this.#N(e, r)) && z(this, r || e, n);
651
+ #I(e, t, n, r) {
652
+ N(n) && !this.#C(e) && n !== (t === Boolean ? this.hasAttribute(r) : this.#P(e, r)) && z(this, r || e, n);
659
653
  }
660
- #I(e) {
654
+ #L(e) {
661
655
  let t = this.#n.propToComputedMap.get(e) || [];
662
- for (let [e, n] of t) this.#O(e, this.#_(n));
656
+ for (let [e, n] of t) this.#k(e, this.#v(n));
663
657
  }
664
- #L(e, t) {
658
+ #R(e, t) {
665
659
  if (t === void 0) return;
666
660
  let n = e instanceof HTMLElement;
667
661
  Array.isArray(t) && (t = t.join(""));
668
662
  let r = typeof t;
669
- r !== "string" && r !== "number" && this.#j(e, void 0, " computed content is not a string or number");
663
+ r !== "string" && r !== "number" && this.#M(e, void 0, " computed content is not a string or number");
670
664
  let i = String(t);
671
- e instanceof HTMLElement && P(e) ? e.value = i : n && r === "string" && i.trim().startsWith("<") ? (e.innerHTML = d(i), this.#W(e), this.#C(e)) : n && (e.textContent = i);
665
+ e instanceof HTMLElement && P(e) ? e.value = i : n && r === "string" && i.trim().startsWith("<") ? (e.innerHTML = d(i), this.#G(e), this.#w(e)) : n && (e.textContent = i);
672
666
  }
673
- #R(e, t) {
667
+ #z(e, t) {
674
668
  let n = this.#c.get(e);
675
669
  if (!n) return;
676
670
  let r = this.getRootNode();
@@ -680,7 +674,7 @@ var U = class e extends p {
680
674
  let a = i;
681
675
  a[n] = t;
682
676
  }
683
- #z() {
677
+ #B() {
684
678
  let e = this.#n;
685
679
  function t() {
686
680
  let t = /* @__PURE__ */ new Map();
@@ -710,60 +704,72 @@ var U = class e extends p {
710
704
  t = {};
711
705
  for (let n of Object.keys(e)) t[n] = n;
712
706
  }
713
- this.#H(e, t);
714
- for (let [n, r] of Object.entries(t)) if (this.#x(r)) {
707
+ this.#U(e, t);
708
+ for (let [n, r] of Object.entries(t)) if (this.#S(r)) {
715
709
  let t = o(e, n);
716
710
  t !== void 0 && (this[r] = t), this.#l.set(r, {
717
711
  state: e,
718
712
  stateProp: n
719
713
  });
720
714
  }
721
- e.addListener(this, t);
715
+ let n = this.#u.get(e), r = {
716
+ ...n?.map,
717
+ ...t
718
+ };
719
+ n?.unsubscribe();
720
+ let i = e.subscribe(({ statePath: e, newValue: t }) => {
721
+ let n = r[e];
722
+ n && (this[n] = t);
723
+ }, Object.keys(r));
724
+ this.#u.set(e, {
725
+ map: r,
726
+ unsubscribe: i
727
+ });
722
728
  }
723
- #B() {
729
+ #V() {
724
730
  let t = new Set(Object.keys(this.#n.properties));
725
731
  for (let n of this.getAttributeNames()) if (!f.has(n) && !n.startsWith("on") && n !== "ref") {
726
732
  if (n === "form-assoc") {
727
- this.#w();
733
+ this.#T();
728
734
  continue;
729
735
  }
730
736
  if (!t.has(e.getPropName(n))) {
731
737
  if (n === "name") {
732
- this.#w();
738
+ this.#T();
733
739
  continue;
734
740
  }
735
- this.#j(null, n, "is not a supported attribute");
741
+ this.#M(null, n, "is not a supported attribute");
736
742
  }
737
743
  }
738
744
  }
739
- #V(e, t, n) {
745
+ #H(e, t, n) {
740
746
  let r = n.match(C);
741
747
  if (r) return r.forEach((n) => {
742
748
  let r = j(n);
743
- this[r] === void 0 && this.#M(e, t, r);
749
+ this[r] === void 0 && this.#N(e, t, r);
744
750
  }), r;
745
751
  }
746
- #H(e, t) {
752
+ #U(e, t) {
747
753
  for (let [n, r] of Object.entries(t)) {
748
754
  let t = o(e, n);
749
- t === void 0 && this.#j(this, void 0, `invalid state path "${n}"`), t = this[r], this.#x(r) || this.#j(null, r, "refers to missing property in useState map");
755
+ t === void 0 && this.#M(this, void 0, `invalid state path "${n}"`), t = this[r], this.#S(r) || this.#M(null, r, "refers to missing property in useState map");
750
756
  }
751
757
  }
752
- #U(e, t, n) {
758
+ #W(e, t, n) {
753
759
  let { values: r } = this.#n.properties[e];
754
760
  if (r) {
755
761
  let i;
756
- t === String ? typeof n == "string" ? r.includes(n) || (i = `must be one of ${r.map((e) => `"${e}"`).join(", ")}`) : i = `value is a ${typeof n}, but type is String` : i = "declares allowed values, but its type is not String", i && this.#j(null, e, i);
762
+ t === String ? typeof n == "string" ? r.includes(n) || (i = `must be one of ${r.map((e) => `"${e}"`).join(", ")}`) : i = `value is a ${typeof n}, but type is String` : i = "declares allowed values, but its type is not String", i && this.#M(null, e, i);
757
763
  }
758
764
  if (n instanceof t) return;
759
765
  let i = typeof n;
760
766
  if (i === "object") {
761
767
  let { constructor: r } = n;
762
- i = r.name, r !== t && this.#j(null, e, `was set to a ${i}, but must be a ${t.name}`);
768
+ i = r.name, r !== t && this.#M(null, e, `was set to a ${i}, but must be a ${t.name}`);
763
769
  }
764
- i !== t.name.toLowerCase() && this.#j(null, e, `was set to a ${i}, but must be a ${t.name}`);
770
+ i !== t.name.toLowerCase() && this.#M(null, e, `was set to a ${i}, but must be a ${t.name}`);
765
771
  }
766
- #W(e) {
772
+ #G(e) {
767
773
  let t = Array.from(e.querySelectorAll("*"));
768
774
  for (let e of t) {
769
775
  let t = [];
@@ -773,9 +779,9 @@ var U = class e extends p {
773
779
  let i = r.slice(2);
774
780
  i = i[0].toLowerCase() + i.slice(1).toLowerCase();
775
781
  let a = n.value;
776
- this.#V(e, r, a);
782
+ this.#H(e, r, a);
777
783
  let o;
778
- typeof this[a] == "function" ? o = (e) => this[a](e) : (this.#V(e, r, a), o = () => this.#_(a)), e.addEventListener(i, o), t.push(r);
784
+ typeof this[a] == "function" ? o = (e) => this[a](e) : (this.#H(e, r, a), o = () => this.#v(a)), e.addEventListener(i, o), t.push(r);
779
785
  }
780
786
  }
781
787
  for (let n of t) e.removeAttribute(n);
@@ -1,4 +1,4 @@
1
- import { a as e, i as t, n, r, t as i } from "./wrec-Cc-aiaWO.js";
1
+ import { a as e, i as t, n, r, t as i } from "./wrec-S6tBBntE.js";
2
2
  //#region \0rolldown/runtime.js
3
3
  var a = Object.defineProperty, o = Object.getOwnPropertyDescriptor, s = Object.getOwnPropertyNames, c = Object.prototype.hasOwnProperty, l = (e, t) => () => (e && (t = e(e = 0)), t), u = (e, t) => () => (t || e((t = { exports: {} }).exports, t), t.exports), d = (e, t) => {
4
4
  let n = {};
package/dist/wrec.es.js CHANGED
@@ -1,2 +1,2 @@
1
- import { a as e, i as t, n, r, t as i } from "./wrec-Cc-aiaWO.js";
1
+ import { a as e, i as t, n, r, t as i } from "./wrec-S6tBBntE.js";
2
2
  export { i as Wrec, e as WrecState, n as createElement, r as css, t as html };
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "wrec",
3
3
  "description": "a small library that greatly simplifies building web components",
4
4
  "author": "R. Mark Volkmann",
5
- "version": "0.27.0",
5
+ "version": "0.28.0",
6
6
  "license": "MIT",
7
7
  "repository": {
8
8
  "type": "git",