juxscript 1.1.11 → 1.1.14

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 (121) hide show
  1. package/lib/components/alert.d.ts +4 -0
  2. package/lib/components/alert.d.ts.map +1 -1
  3. package/lib/components/alert.js +6 -0
  4. package/lib/components/alert.ts +7 -0
  5. package/lib/components/badge.d.ts +1 -0
  6. package/lib/components/badge.d.ts.map +1 -1
  7. package/lib/components/badge.js +3 -0
  8. package/lib/components/badge.ts +4 -0
  9. package/lib/components/base/BaseComponent.d.ts +23 -9
  10. package/lib/components/base/BaseComponent.d.ts.map +1 -1
  11. package/lib/components/base/BaseComponent.js +12 -11
  12. package/lib/components/base/BaseComponent.ts +37 -11
  13. package/lib/components/base/FormInput.d.ts +4 -0
  14. package/lib/components/base/FormInput.d.ts.map +1 -1
  15. package/lib/components/base/FormInput.js +6 -0
  16. package/lib/components/base/FormInput.ts +7 -0
  17. package/lib/components/button.d.ts +1 -0
  18. package/lib/components/button.d.ts.map +1 -1
  19. package/lib/components/button.js +3 -0
  20. package/lib/components/button.ts +4 -0
  21. package/lib/components/card.d.ts +1 -0
  22. package/lib/components/card.d.ts.map +1 -1
  23. package/lib/components/card.js +3 -0
  24. package/lib/components/card.ts +4 -0
  25. package/lib/components/chart.d.ts +5 -1
  26. package/lib/components/chart.d.ts.map +1 -1
  27. package/lib/components/chart.js +21 -2
  28. package/lib/components/chart.ts +25 -2
  29. package/lib/components/code.d.ts +1 -0
  30. package/lib/components/code.d.ts.map +1 -1
  31. package/lib/components/code.js +3 -0
  32. package/lib/components/code.ts +4 -0
  33. package/lib/components/container.d.ts +1 -0
  34. package/lib/components/container.d.ts.map +1 -1
  35. package/lib/components/container.js +3 -0
  36. package/lib/components/container.ts +4 -0
  37. package/lib/components/dialog.d.ts +1 -0
  38. package/lib/components/dialog.d.ts.map +1 -1
  39. package/lib/components/dialog.js +3 -0
  40. package/lib/components/dialog.ts +4 -0
  41. package/lib/components/divider.d.ts +1 -0
  42. package/lib/components/divider.d.ts.map +1 -1
  43. package/lib/components/divider.js +3 -0
  44. package/lib/components/divider.ts +4 -0
  45. package/lib/components/dropdown.d.ts +1 -0
  46. package/lib/components/dropdown.d.ts.map +1 -1
  47. package/lib/components/dropdown.js +3 -0
  48. package/lib/components/dropdown.ts +4 -0
  49. package/lib/components/element.d.ts +1 -0
  50. package/lib/components/element.d.ts.map +1 -1
  51. package/lib/components/element.js +3 -0
  52. package/lib/components/element.ts +4 -0
  53. package/lib/components/grid.d.ts +1 -0
  54. package/lib/components/grid.d.ts.map +1 -1
  55. package/lib/components/grid.js +3 -0
  56. package/lib/components/grid.ts +4 -0
  57. package/lib/components/guard.d.ts +1 -0
  58. package/lib/components/guard.d.ts.map +1 -1
  59. package/lib/components/guard.js +3 -0
  60. package/lib/components/guard.ts +4 -0
  61. package/lib/components/heading.d.ts +1 -0
  62. package/lib/components/heading.d.ts.map +1 -1
  63. package/lib/components/heading.js +3 -0
  64. package/lib/components/heading.ts +4 -0
  65. package/lib/components/hero.d.ts +5 -0
  66. package/lib/components/hero.d.ts.map +1 -1
  67. package/lib/components/hero.js +57 -52
  68. package/lib/components/hero.ts +68 -68
  69. package/lib/components/icon.d.ts +1 -0
  70. package/lib/components/icon.d.ts.map +1 -1
  71. package/lib/components/icon.js +3 -0
  72. package/lib/components/icon.ts +4 -0
  73. package/lib/components/list.d.ts +1 -0
  74. package/lib/components/list.d.ts.map +1 -1
  75. package/lib/components/list.js +3 -0
  76. package/lib/components/list.ts +4 -0
  77. package/lib/components/loading.d.ts +1 -0
  78. package/lib/components/loading.d.ts.map +1 -1
  79. package/lib/components/loading.js +3 -0
  80. package/lib/components/loading.ts +4 -0
  81. package/lib/components/menu.d.ts +1 -0
  82. package/lib/components/menu.d.ts.map +1 -1
  83. package/lib/components/menu.js +3 -0
  84. package/lib/components/menu.ts +4 -0
  85. package/lib/components/modal.d.ts +1 -0
  86. package/lib/components/modal.d.ts.map +1 -1
  87. package/lib/components/modal.js +3 -0
  88. package/lib/components/modal.ts +4 -0
  89. package/lib/components/nav.d.ts +1 -0
  90. package/lib/components/nav.d.ts.map +1 -1
  91. package/lib/components/nav.js +3 -0
  92. package/lib/components/nav.ts +4 -0
  93. package/lib/components/paragraph.d.ts +1 -0
  94. package/lib/components/paragraph.d.ts.map +1 -1
  95. package/lib/components/paragraph.js +3 -0
  96. package/lib/components/paragraph.ts +4 -0
  97. package/lib/components/progress.d.ts +1 -0
  98. package/lib/components/progress.d.ts.map +1 -1
  99. package/lib/components/progress.js +3 -0
  100. package/lib/components/progress.ts +4 -0
  101. package/lib/components/sidebar.d.ts +1 -0
  102. package/lib/components/sidebar.d.ts.map +1 -1
  103. package/lib/components/sidebar.js +3 -0
  104. package/lib/components/sidebar.ts +4 -0
  105. package/lib/components/table.d.ts +1 -0
  106. package/lib/components/table.d.ts.map +1 -1
  107. package/lib/components/table.js +3 -0
  108. package/lib/components/table.ts +4 -0
  109. package/lib/components/tabs.d.ts +1 -0
  110. package/lib/components/tabs.d.ts.map +1 -1
  111. package/lib/components/tabs.js +3 -0
  112. package/lib/components/tabs.ts +4 -0
  113. package/lib/components/theme-toggle.d.ts +1 -0
  114. package/lib/components/theme-toggle.d.ts.map +1 -1
  115. package/lib/components/theme-toggle.js +3 -0
  116. package/lib/components/theme-toggle.ts +4 -0
  117. package/lib/components/tooltip.d.ts +1 -0
  118. package/lib/components/tooltip.d.ts.map +1 -1
  119. package/lib/components/tooltip.js +3 -0
  120. package/lib/components/tooltip.ts +4 -0
  121. package/package.json +1 -1
@@ -25,6 +25,10 @@ export declare class Alert extends BaseComponent<AlertState> {
25
25
  type(value: 'info' | 'success' | 'warning' | 'error'): this;
26
26
  dismissible(value: boolean): this;
27
27
  icon(value: string): this;
28
+ /**
29
+ * Reactive update hook
30
+ */
31
+ update(prop: string, value: any): void;
28
32
  render(targetId?: string): this;
29
33
  }
30
34
  export declare function alert(id: string, options?: AlertOptions): Alert;
@@ -1 +1 @@
1
- {"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["alert.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAOxD,MAAM,WAAW,YAAY;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;IAChD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,KAAK,UAAU,GAAG;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,OAAO,CAAC;IACrB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,qBAAa,KAAM,SAAQ,aAAa,CAAC,UAAU,CAAC;IAChD,OAAO,CAAC,MAAM,CAA4B;gBAE9B,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,YAAiB;IAYlD,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAiBhD,OAAO,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK5B,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,IAAI;IAK3D,WAAW,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAKjC,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IASzB,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI;CA6GlC;AAED,wBAAgB,KAAK,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,YAAiB,GAAG,KAAK,CAEnE"}
1
+ {"version":3,"file":"alert.d.ts","sourceRoot":"","sources":["alert.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAOxD,MAAM,WAAW,YAAY;IACzB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;IAChD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,KAAK,UAAU,GAAG;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,OAAO,CAAC;IACrB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,qBAAa,KAAM,SAAQ,aAAa,CAAC,UAAU,CAAC;IAChD,OAAO,CAAC,MAAM,CAA4B;gBAE9B,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,YAAiB;IAYlD,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAiBhD,OAAO,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK5B,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,IAAI;IAK3D,WAAW,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAKjC,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAKzB;;OAEG;IACH,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,IAAI;IAQtC,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI;CA6GlC;AAED,wBAAgB,KAAK,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,YAAiB,GAAG,KAAK,CAEnE"}
@@ -49,6 +49,12 @@ export class Alert extends BaseComponent {
49
49
  this.state.icon = value;
50
50
  return this;
51
51
  }
52
+ /**
53
+ * Reactive update hook
54
+ */
55
+ update(prop, value) {
56
+ // No reactive updates needed - Alert is rendered once
57
+ }
52
58
  /* ═════════════════════════════════════════════════════════════════
53
59
  * RENDER
54
60
  * ═════════════════════════════════════════════════════════════════ */
@@ -80,6 +80,13 @@ export class Alert extends BaseComponent<AlertState> {
80
80
  return this;
81
81
  }
82
82
 
83
+ /**
84
+ * Reactive update hook
85
+ */
86
+ update(prop: string, value: any): void {
87
+ // No reactive updates needed - Alert is rendered once
88
+ }
89
+
83
90
  /* ═════════════════════════════════════════════════════════════════
84
91
  * RENDER
85
92
  * ═════════════════════════════════════════════════════════════════ */
@@ -17,6 +17,7 @@ export declare class Badge extends BaseComponent<BadgeState> {
17
17
  constructor(id: string, options?: BadgeOptions);
18
18
  protected getTriggerEvents(): readonly string[];
19
19
  protected getCallbackEvents(): readonly string[];
20
+ update(prop: string, value: any): void;
20
21
  label(value: string): this;
21
22
  variant(value: 'default' | 'success' | 'warning' | 'error' | 'info'): this;
22
23
  pill(value: boolean): this;
@@ -1 +1 @@
1
- {"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["badge.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAMxD,MAAM,WAAW,YAAY;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;IAC/D,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,KAAK,UAAU,GAAG;IACd,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,qBAAa,KAAM,SAAQ,aAAa,CAAC,UAAU,CAAC;gBACpC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,YAAiB;IAUlD,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAUhD,KAAK,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK1B,OAAO,CAAC,KAAK,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,GAAG,IAAI;IAK1E,IAAI,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAS1B,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI;CA8BlC;AAED,wBAAgB,KAAK,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,YAAiB,GAAG,KAAK,CAEnE"}
1
+ {"version":3,"file":"badge.d.ts","sourceRoot":"","sources":["badge.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAMxD,MAAM,WAAW,YAAY;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;IAC/D,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,KAAK,UAAU,GAAG;IACd,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,qBAAa,KAAM,SAAQ,aAAa,CAAC,UAAU,CAAC;gBACpC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,YAAiB;IAUlD,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAIhD,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,IAAI;IAUtC,KAAK,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK1B,OAAO,CAAC,KAAK,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,GAAG,IAAI;IAK1E,IAAI,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAS1B,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI;CA8BlC;AAED,wBAAgB,KAAK,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,YAAiB,GAAG,KAAK,CAEnE"}
@@ -18,6 +18,9 @@ export class Badge extends BaseComponent {
18
18
  getCallbackEvents() {
19
19
  return CALLBACK_EVENTS;
20
20
  }
21
+ update(prop, value) {
22
+ // No reactive updates needed
23
+ }
21
24
  /* ═════════════════════════════════════════════════════════════════
22
25
  * FLUENT API
23
26
  * ═════════════════════════════════════════════════════════════════ */
@@ -39,6 +39,10 @@ export class Badge extends BaseComponent<BadgeState> {
39
39
  return CALLBACK_EVENTS;
40
40
  }
41
41
 
42
+ update(prop: string, value: any): void {
43
+ // No reactive updates needed
44
+ }
45
+
42
46
  /* ═════════════════════════════════════════════════════════════════
43
47
  * FLUENT API
44
48
  * ═════════════════════════════════════════════════════════════════ */
@@ -29,6 +29,29 @@ export declare abstract class BaseComponent<TState extends Record<string, any>>
29
29
  protected abstract getTriggerEvents(): readonly string[];
30
30
  protected abstract getCallbackEvents(): readonly string[];
31
31
  abstract render(targetId?: string): this;
32
+ /**
33
+ * REACTIVE UPDATE HOOK (REQUIRED - PUBLIC)
34
+ * Called automatically when this.state[prop] changes via the Proxy.
35
+ * Every component MUST implement this to handle state changes.
36
+ *
37
+ * This is PUBLIC because:
38
+ * - Components may need to call it manually
39
+ * - Allows external updates without full re-render
40
+ * - Part of the component's public API
41
+ *
42
+ * @param prop - The state property that changed
43
+ * @param value - The new value
44
+ *
45
+ * @example
46
+ * update(prop: string, value: any): void {
47
+ * const el = document.getElementById(this._id);
48
+ * if (!el) return;
49
+ *
50
+ * if (prop === 'label') el.textContent = value;
51
+ * if (prop === 'visible') el.style.display = value ? '' : 'none';
52
+ * }
53
+ */
54
+ abstract update(prop: string, value: any): void;
32
55
  /**
33
56
  * Set component style
34
57
  */
@@ -127,15 +150,6 @@ export declare abstract class BaseComponent<TState extends Record<string, any>>
127
150
  renderTo(juxComponent: any): this;
128
151
  /**
129
152
  * ✅ Read-only accessor for component state
130
- * Provides clear separation between setters (fluent methods) and getters
131
- *
132
- * @example
133
- * const myCard = card('example')
134
- * .title('Hello') // ✅ SETTER (fluent)
135
- * .content('World'); // ✅ SETTER (fluent)
136
- *
137
- * console.log(myCard.props.title); // ✅ GETTER: 'Hello'
138
- * console.log(myCard.props.content); // ✅ GETTER: 'World'
139
153
  */
140
154
  get props(): Readonly<TState>;
141
155
  }
@@ -1 +1 @@
1
- {"version":3,"file":"BaseComponent.d.ts","sourceRoot":"","sources":["BaseComponent.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"BaseComponent.d.ts","sourceRoot":"","sources":["BaseComponent.ts"],"names":[],"mappings":"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"}
@@ -18,7 +18,17 @@ export class BaseComponent {
18
18
  this._callbackHandlers = new Map();
19
19
  this._id = id;
20
20
  this.id = id;
21
- this.state = initialState;
21
+ // ✨ REACTIVE PROXY: Intercept state changes to trigger view updates automatically
22
+ this.state = new Proxy(initialState, {
23
+ set: (target, prop, value) => {
24
+ const key = prop;
25
+ if (target[key] !== value) {
26
+ target[key] = value;
27
+ this.update(prop, value);
28
+ }
29
+ return true;
30
+ }
31
+ });
22
32
  }
23
33
  /* ═════════════════════════════════════════════════════════════════
24
34
  * COMMON FLUENT API (Inherited by all components)
@@ -277,7 +287,7 @@ export class BaseComponent {
277
287
  handler(...args);
278
288
  }
279
289
  else {
280
- console.warn(`🔍 No handler found for "${eventName}"`);
290
+ // console.warn(`🔍 No handler found for "${eventName}"`);
281
291
  }
282
292
  }
283
293
  /* ═════════════════════════════════════════════════════════════════
@@ -347,15 +357,6 @@ export class BaseComponent {
347
357
  * ═════════════════════════════════════════════════════════════════ */
348
358
  /**
349
359
  * ✅ Read-only accessor for component state
350
- * Provides clear separation between setters (fluent methods) and getters
351
- *
352
- * @example
353
- * const myCard = card('example')
354
- * .title('Hello') // ✅ SETTER (fluent)
355
- * .content('World'); // ✅ SETTER (fluent)
356
- *
357
- * console.log(myCard.props.title); // ✅ GETTER: 'Hello'
358
- * console.log(myCard.props.content); // ✅ GETTER: 'World'
359
360
  */
360
361
  get props() {
361
362
  return this.state;
@@ -31,7 +31,18 @@ export abstract class BaseComponent<TState extends Record<string, any>> {
31
31
  constructor(id: string, initialState: TState) {
32
32
  this._id = id;
33
33
  this.id = id;
34
- this.state = initialState;
34
+
35
+ // ✨ REACTIVE PROXY: Intercept state changes to trigger view updates automatically
36
+ this.state = new Proxy(initialState, {
37
+ set: (target, prop, value) => {
38
+ const key = prop as keyof TState;
39
+ if (target[key] !== value) {
40
+ target[key] = value;
41
+ this.update(prop as string, value);
42
+ }
43
+ return true;
44
+ }
45
+ });
35
46
  }
36
47
 
37
48
  /* ═════════════════════════════════════════════════════════════════
@@ -42,6 +53,30 @@ export abstract class BaseComponent<TState extends Record<string, any>> {
42
53
  protected abstract getCallbackEvents(): readonly string[];
43
54
  abstract render(targetId?: string): this;
44
55
 
56
+ /**
57
+ * REACTIVE UPDATE HOOK (REQUIRED - PUBLIC)
58
+ * Called automatically when this.state[prop] changes via the Proxy.
59
+ * Every component MUST implement this to handle state changes.
60
+ *
61
+ * This is PUBLIC because:
62
+ * - Components may need to call it manually
63
+ * - Allows external updates without full re-render
64
+ * - Part of the component's public API
65
+ *
66
+ * @param prop - The state property that changed
67
+ * @param value - The new value
68
+ *
69
+ * @example
70
+ * update(prop: string, value: any): void {
71
+ * const el = document.getElementById(this._id);
72
+ * if (!el) return;
73
+ *
74
+ * if (prop === 'label') el.textContent = value;
75
+ * if (prop === 'visible') el.style.display = value ? '' : 'none';
76
+ * }
77
+ */
78
+ abstract update(prop: string, value: any): void;
79
+
45
80
  /* ═════════════════════════════════════════════════════════════════
46
81
  * COMMON FLUENT API (Inherited by all components)
47
82
  * ═════════════════════════════════════════════════════════════════ */
@@ -324,7 +359,7 @@ export abstract class BaseComponent<TState extends Record<string, any>> {
324
359
  const handler = this._callbackHandlers.get(eventName)!;
325
360
  handler(...args);
326
361
  } else {
327
- console.warn(`🔍 No handler found for "${eventName}"`);
362
+ // console.warn(`🔍 No handler found for "${eventName}"`);
328
363
  }
329
364
  }
330
365
 
@@ -405,15 +440,6 @@ export abstract class BaseComponent<TState extends Record<string, any>> {
405
440
 
406
441
  /**
407
442
  * ✅ Read-only accessor for component state
408
- * Provides clear separation between setters (fluent methods) and getters
409
- *
410
- * @example
411
- * const myCard = card('example')
412
- * .title('Hello') // ✅ SETTER (fluent)
413
- * .content('World'); // ✅ SETTER (fluent)
414
- *
415
- * console.log(myCard.props.title); // ✅ GETTER: 'Hello'
416
- * console.log(myCard.props.content); // ✅ GETTER: 'World'
417
443
  */
418
444
  get props(): Readonly<TState> {
419
445
  return this.state as Readonly<TState>;
@@ -65,6 +65,10 @@ export declare abstract class FormInput<TState extends FormInputState> extends B
65
65
  * Build error element
66
66
  */
67
67
  protected _renderError(): HTMLElement;
68
+ /**
69
+ * Default update implementation for form inputs
70
+ */
71
+ update(prop: string, value: any): void;
68
72
  /**
69
73
  * Wire up two-way sync for value property
70
74
  */
@@ -1 +1 @@
1
- {"version":3,"file":"FormInput.d.ts","sourceRoot":"","sources":["FormInput.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEnD;;GAEG;AACH,MAAM,WAAW,cAAe,SAAQ,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;IACvD,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,CAAC;CACzB;AAED;;;GAGG;AACH,8BAAsB,SAAS,CAAC,MAAM,SAAS,cAAc,CAAE,SAAQ,aAAa,CAAC,MAAM,CAAC;IACxF,SAAS,CAAC,aAAa,EAAE,WAAW,GAAG,IAAI,CAAQ;IACnD,SAAS,CAAC,aAAa,EAAE,gBAAgB,GAAG,IAAI,CAAQ;IACxD,SAAS,CAAC,aAAa,EAAE,WAAW,GAAG,IAAI,CAAQ;IACnD,SAAS,CAAC,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,OAAO,GAAG,MAAM,CAAC;IACzD,SAAS,CAAC,iBAAiB,EAAE,OAAO,CAAS;IAM7C;;OAEG;IACH,QAAQ,CAAC,QAAQ,IAAI,GAAG;IAExB;;OAEG;IACH,QAAQ,CAAC,QAAQ,CAAC,KAAK,EAAE,GAAG,GAAG,IAAI;IAEnC;;OAEG;IACH,SAAS,CAAC,QAAQ,CAAC,kBAAkB,IAAI,WAAW;IAEpD;;OAEG;IACH,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC,KAAK,EAAE,GAAG,GAAG,OAAO,GAAG,MAAM;IAM/D,KAAK,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAQ1B,QAAQ,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAK9B,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAKzB,UAAU,CAAC,OAAO,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,OAAO,GAAG,MAAM,GAAG,IAAI;IAS3D;;OAEG;IACH,QAAQ,IAAI,OAAO;IAcnB;;OAEG;IACH,OAAO,IAAI,OAAO;IAKlB;;OAEG;IACH,SAAS,CAAC,UAAU,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI;IAa3C;;OAEG;IACH,SAAS,CAAC,WAAW,IAAI,IAAI;IAiB7B;;OAEG;IACH,SAAS,CAAC,YAAY,IAAI,gBAAgB;IAmB1C;;OAEG;IACH,SAAS,CAAC,YAAY,IAAI,WAAW;IAUrC;;OAEG;IACH,SAAS,CAAC,aAAa,CAAC,YAAY,EAAE,WAAW,EAAE,SAAS,GAAE,MAAgB,GAAG,IAAI;CA8CxF"}
1
+ {"version":3,"file":"FormInput.d.ts","sourceRoot":"","sources":["FormInput.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEnD;;GAEG;AACH,MAAM,WAAW,cAAe,SAAQ,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;IACvD,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,CAAC;CACzB;AAED;;;GAGG;AACH,8BAAsB,SAAS,CAAC,MAAM,SAAS,cAAc,CAAE,SAAQ,aAAa,CAAC,MAAM,CAAC;IACxF,SAAS,CAAC,aAAa,EAAE,WAAW,GAAG,IAAI,CAAQ;IACnD,SAAS,CAAC,aAAa,EAAE,gBAAgB,GAAG,IAAI,CAAQ;IACxD,SAAS,CAAC,aAAa,EAAE,WAAW,GAAG,IAAI,CAAQ;IACnD,SAAS,CAAC,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,OAAO,GAAG,MAAM,CAAC;IACzD,SAAS,CAAC,iBAAiB,EAAE,OAAO,CAAS;IAM7C;;OAEG;IACH,QAAQ,CAAC,QAAQ,IAAI,GAAG;IAExB;;OAEG;IACH,QAAQ,CAAC,QAAQ,CAAC,KAAK,EAAE,GAAG,GAAG,IAAI;IAEnC;;OAEG;IACH,SAAS,CAAC,QAAQ,CAAC,kBAAkB,IAAI,WAAW;IAEpD;;OAEG;IACH,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC,KAAK,EAAE,GAAG,GAAG,OAAO,GAAG,MAAM;IAM/D,KAAK,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAQ1B,QAAQ,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAK9B,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAKzB,UAAU,CAAC,OAAO,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,OAAO,GAAG,MAAM,GAAG,IAAI;IAS3D;;OAEG;IACH,QAAQ,IAAI,OAAO;IAcnB;;OAEG;IACH,OAAO,IAAI,OAAO;IAKlB;;OAEG;IACH,SAAS,CAAC,UAAU,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI;IAa3C;;OAEG;IACH,SAAS,CAAC,WAAW,IAAI,IAAI;IAiB7B;;OAEG;IACH,SAAS,CAAC,YAAY,IAAI,gBAAgB;IAmB1C;;OAEG;IACH,SAAS,CAAC,YAAY,IAAI,WAAW;IAUrC;;OAEG;IACH,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,IAAI;IAItC;;OAEG;IACH,SAAS,CAAC,aAAa,CAAC,YAAY,EAAE,WAAW,EAAE,SAAS,GAAE,MAAgB,GAAG,IAAI;CA8CxF"}
@@ -117,6 +117,12 @@ export class FormInput extends BaseComponent {
117
117
  this._errorElement = errorEl;
118
118
  return errorEl;
119
119
  }
120
+ /**
121
+ * Default update implementation for form inputs
122
+ */
123
+ update(prop, value) {
124
+ // No reactive updates needed - form inputs handle their own state
125
+ }
120
126
  /**
121
127
  * Wire up two-way sync for value property
122
128
  */
@@ -175,6 +175,13 @@ export abstract class FormInput<TState extends FormInputState> extends BaseCompo
175
175
  return errorEl;
176
176
  }
177
177
 
178
+ /**
179
+ * Default update implementation for form inputs
180
+ */
181
+ update(prop: string, value: any): void {
182
+ // No reactive updates needed - form inputs handle their own state
183
+ }
184
+
178
185
  /**
179
186
  * Wire up two-way sync for value property
180
187
  */
@@ -37,6 +37,7 @@ export declare class Button extends BaseComponent<ButtonState> {
37
37
  iconPosition(value: 'left' | 'right'): this;
38
38
  fullWidth(value: boolean): this;
39
39
  type(value: 'button' | 'submit' | 'reset'): this;
40
+ update(prop: string, value: any): void;
40
41
  /**
41
42
  * Override visible() to update the actual button element
42
43
  */
@@ -1 +1 @@
1
- {"version":3,"file":"button.d.ts","sourceRoot":"","sources":["button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAOxD,MAAM,WAAW,aAAa;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,CAAC;IAChG,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAChC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,KAAK,WAAW,GAAG;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,OAAO,CAAC;IACnB,IAAI,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,qBAAa,MAAO,SAAQ,aAAa,CAAC,WAAW,CAAC;IACpD,OAAO,CAAC,cAAc,CAAkC;gBAE5C,EAAE,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,aAAa;IAkB/C,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAUhD,KAAK,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK1B,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAKzB,OAAO,CAAC,KAAK,EAAE,SAAS,GAAG,WAAW,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,IAAI;IAK3G,IAAI,CAAC,KAAK,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,IAAI;IAK/C,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,GAAG,IAAI;IAK3C,SAAS,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAK/B,IAAI,CAAC,KAAK,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,GAAG,IAAI;IAShD;;OAEG;IACH,OAAO,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAW7B,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI;CAkDhC;AAED,wBAAgB,MAAM,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,aAAa,GAAG,MAAM,CAElE"}
1
+ {"version":3,"file":"button.d.ts","sourceRoot":"","sources":["button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAOxD,MAAM,WAAW,aAAa;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,CAAC;IAChG,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAChC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,KAAK,WAAW,GAAG;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,OAAO,CAAC;IACjB,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,OAAO,CAAC;IACnB,IAAI,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,qBAAa,MAAO,SAAQ,aAAa,CAAC,WAAW,CAAC;IACpD,OAAO,CAAC,cAAc,CAAkC;gBAE5C,EAAE,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,aAAa;IAkB/C,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAUhD,KAAK,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK1B,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAKzB,OAAO,CAAC,KAAK,EAAE,SAAS,GAAG,WAAW,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,IAAI;IAK3G,IAAI,CAAC,KAAK,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,IAAI;IAK/C,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,GAAG,IAAI;IAK3C,SAAS,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAK/B,IAAI,CAAC,KAAK,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,GAAG,IAAI;IAKhD,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,IAAI;IAQtC;;OAEG;IACH,OAAO,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAW7B,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI;CAkDhC;AAED,wBAAgB,MAAM,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,aAAa,GAAG,MAAM,CAElE"}
@@ -59,6 +59,9 @@ export class Button extends BaseComponent {
59
59
  this.state.type = value;
60
60
  return this;
61
61
  }
62
+ update(prop, value) {
63
+ // No reactive updates needed
64
+ }
62
65
  /* ═════════════════════════════════════════════════════════════════
63
66
  * RENDER
64
67
  * ═════════════════════════════════════════════════════════════════ */
@@ -103,6 +103,10 @@ export class Button extends BaseComponent<ButtonState> {
103
103
  return this;
104
104
  }
105
105
 
106
+ update(prop: string, value: any): void {
107
+ // No reactive updates needed
108
+ }
109
+
106
110
  /* ═════════════════════════════════════════════════════════════════
107
111
  * RENDER
108
112
  * ═════════════════════════════════════════════════════════════════ */
@@ -28,6 +28,7 @@ export declare class Card extends BaseComponent<CardState> {
28
28
  footer(value: string): this;
29
29
  icon(value: string): this;
30
30
  render(targetId?: string): this;
31
+ update(prop: string, value: any): void;
31
32
  }
32
33
  export declare function card(id: string, options?: CardOptions): Card;
33
34
  export {};
@@ -1 +1 @@
1
- {"version":3,"file":"card.d.ts","sourceRoot":"","sources":["card.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAOxD,MAAM,WAAW,WAAW;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,KAAK,SAAS,GAAG;IACf,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,OAAO,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,qBAAa,IAAK,SAAQ,aAAa,CAAC,SAAS,CAAC;gBACpC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,WAAgB;IAajD,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAUhD,KAAK,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK1B,OAAO,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK5B,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK3B,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IASzB,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI;CAuFhC;AAED,wBAAgB,IAAI,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,WAAgB,GAAG,IAAI,CAEhE"}
1
+ {"version":3,"file":"card.d.ts","sourceRoot":"","sources":["card.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAOxD,MAAM,WAAW,WAAW;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,KAAK,SAAS,GAAG;IACf,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,OAAO,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,qBAAa,IAAK,SAAQ,aAAa,CAAC,SAAS,CAAC;gBACpC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,WAAgB;IAajD,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAUhD,KAAK,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK1B,OAAO,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK5B,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK3B,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IASzB,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI;IAwF/B,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,IAAI;CAGvC;AAED,wBAAgB,IAAI,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,WAAgB,GAAG,IAAI,CAEhE"}
@@ -121,6 +121,9 @@ export class Card extends BaseComponent {
121
121
  container.appendChild(card);
122
122
  return this;
123
123
  }
124
+ update(prop, value) {
125
+ // No reactive updates needed
126
+ }
124
127
  }
125
128
  export function card(id, options = {}) {
126
129
  return new Card(id, options);
@@ -166,6 +166,10 @@ export class Card extends BaseComponent<CardState> {
166
166
  container.appendChild(card);
167
167
  return this;
168
168
  }
169
+
170
+ update(prop: string, value: any): void {
171
+ // No reactive updates needed
172
+ }
169
173
  }
170
174
 
171
175
  export function card(id: string, options: CardOptions = {}): Card {
@@ -32,11 +32,15 @@ export declare class ChartComponent extends BaseComponent<ChartState> {
32
32
  title(text: string, display?: boolean): this;
33
33
  legend(display?: boolean, position?: 'top' | 'bottom' | 'left' | 'right'): this;
34
34
  tooltip(enabled?: boolean): this;
35
- update(mode?: 'resize' | 'reset' | 'none' | 'hide' | 'show' | 'default'): this;
35
+ /**
36
+ * Update chart with new data or configuration
37
+ */
38
+ updateChart(mode?: 'resize' | 'reset' | 'none' | 'hide' | 'show' | 'default'): this;
36
39
  reset(): this;
37
40
  destroy(): this;
38
41
  getChart(): Chart | null;
39
42
  render(targetId?: string): this;
43
+ update(prop: string, value: any): void;
40
44
  }
41
45
  /**
42
46
  * Factory function for creating chart components
@@ -1 +1 @@
1
- {"version":3,"file":"chart.d.ts","sourceRoot":"","sources":["chart.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AACxD,OAAO,EAAE,KAAK,EAAsB,SAAS,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAI9F,MAAM,WAAW,UAAU;IACvB,IAAI,EAAE,SAAS,CAAC;IAChB,IAAI,EAAE,SAAS,CAAC;IAChB,OAAO,EAAE,YAAY,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;;GAGG;AACH,qBAAa,cAAe,SAAQ,aAAa,CAAC,UAAU,CAAC;IACzD,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAyB;IAC/D,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,eAAe,CAAsD;IAC7F,OAAO,CAAC,aAAa,CAAsB;gBAE/B,EAAE,EAAE,MAAM,EAAE,IAAI,GAAE,SAAiB,EAAE,OAAO,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC;IAS9E,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAQhD,IAAI,CAAC,KAAK,EAAE,SAAS,GAAG,IAAI;IAoB5B,IAAI,CAAC,KAAK,EAAE,SAAS,GAAG,IAAI;IAS5B,MAAM,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI;IAS7B,QAAQ,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI;IAS5B,UAAU,CAAC,OAAO,EAAE,GAAG,GAAG,IAAI;IAa9B,OAAO,CAAC,KAAK,EAAE,YAAY,GAAG,IAAI;IASlC,UAAU,CAAC,KAAK,GAAE,OAAc,GAAG,IAAI;IAIvC,mBAAmB,CAAC,KAAK,GAAE,OAAc,GAAG,IAAI;IAIhD,KAAK,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,GAAE,OAAc,GAAG,IAAI;IASlD,MAAM,CAAC,OAAO,GAAE,OAAc,EAAE,QAAQ,GAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAe,GAAG,IAAI;IAS5F,OAAO,CAAC,OAAO,GAAE,OAAc,GAAG,IAAI;IAatC,MAAM,CAAC,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,GAAG,IAAI;IAQ9E,KAAK,IAAI,IAAI;IAOb,OAAO,IAAI,IAAI;IASf,QAAQ,IAAI,KAAK,GAAG,IAAI;IAQxB,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI;CAqClC;AAED;;GAEG;AACH,wBAAgB,KAAK,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,GAAE,SAAiB,EAAE,OAAO,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,GAAG,cAAc,CAExG"}
1
+ {"version":3,"file":"chart.d.ts","sourceRoot":"","sources":["chart.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AACxD,OAAO,EAAE,KAAK,EAAsB,SAAS,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAI9F,MAAM,WAAW,UAAU;IACvB,IAAI,EAAE,SAAS,CAAC;IAChB,IAAI,EAAE,SAAS,CAAC;IAChB,OAAO,EAAE,YAAY,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;;GAGG;AACH,qBAAa,cAAe,SAAQ,aAAa,CAAC,UAAU,CAAC;IACzD,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,cAAc,CAAyB;IAC/D,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,eAAe,CAAsD;IAC7F,OAAO,CAAC,aAAa,CAAsB;gBAE/B,EAAE,EAAE,MAAM,EAAE,IAAI,GAAE,SAAiB,EAAE,OAAO,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC;IAS9E,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAQhD,IAAI,CAAC,KAAK,EAAE,SAAS,GAAG,IAAI;IAoB5B,IAAI,CAAC,KAAK,EAAE,SAAS,GAAG,IAAI;IAS5B,MAAM,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI;IAS7B,QAAQ,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI;IAS5B,UAAU,CAAC,OAAO,EAAE,GAAG,GAAG,IAAI;IAa9B,OAAO,CAAC,KAAK,EAAE,YAAY,GAAG,IAAI;IASlC,UAAU,CAAC,KAAK,GAAE,OAAc,GAAG,IAAI;IAIvC,mBAAmB,CAAC,KAAK,GAAE,OAAc,GAAG,IAAI;IAIhD,KAAK,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,GAAE,OAAc,GAAG,IAAI;IASlD,MAAM,CAAC,OAAO,GAAE,OAAc,EAAE,QAAQ,GAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAe,GAAG,IAAI;IAS5F,OAAO,CAAC,OAAO,GAAE,OAAc,GAAG,IAAI;IAatC;;OAEG;IACH,WAAW,CAAC,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,GAAG,IAAI;IAOnF,KAAK,IAAI,IAAI;IAOb,OAAO,IAAI,IAAI;IASf,QAAQ,IAAI,KAAK,GAAG,IAAI;IAQxB,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI;IAuD/B,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,IAAI;CAGzC;AAED;;GAEG;AACH,wBAAgB,KAAK,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,GAAE,SAAiB,EAAE,OAAO,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,GAAG,cAAc,CAExG"}
@@ -117,10 +117,12 @@ export class ChartComponent extends BaseComponent {
117
117
  /* ═════════════════════════════════════════════════════════════════
118
118
  * CHART OPERATIONS
119
119
  * ═════════════════════════════════════════════════════════════════ */
120
- update(mode) {
120
+ /**
121
+ * Update chart with new data or configuration
122
+ */
123
+ updateChart(mode) {
121
124
  if (this.chartInstance) {
122
125
  this.chartInstance.update(mode);
123
- this._triggerCallback('update', this.chartInstance);
124
126
  }
125
127
  return this;
126
128
  }
@@ -169,12 +171,29 @@ export class ChartComponent extends BaseComponent {
169
171
  options: this.state.options
170
172
  };
171
173
  this.chartInstance = new Chart(canvas, config);
174
+ // Wire sync for data
175
+ this._syncBindings.forEach(({ property, stateObj, toState, toComponent }) => {
176
+ if (property === 'data') {
177
+ const transform = toComponent || ((v) => v);
178
+ stateObj.subscribe((val) => {
179
+ const transformed = transform(val);
180
+ this.state.data = transformed;
181
+ if (this.chartInstance) {
182
+ this.chartInstance.data = transformed;
183
+ this.chartInstance.update();
184
+ }
185
+ });
186
+ }
187
+ });
172
188
  // Wire events and syncs
173
189
  this._wireStandardEvents(container);
174
190
  this._wireAllSyncs();
175
191
  this._triggerCallback('render', this.chartInstance);
176
192
  return this;
177
193
  }
194
+ update(prop, value) {
195
+ // No reactive updates needed - uses manual updateChart()
196
+ }
178
197
  }
179
198
  ChartComponent.TRIGGER_EVENTS = [];
180
199
  ChartComponent.CALLBACK_EVENTS = ['render', 'update', 'destroy'];
@@ -152,10 +152,12 @@ export class ChartComponent extends BaseComponent<ChartState> {
152
152
  * CHART OPERATIONS
153
153
  * ═════════════════════════════════════════════════════════════════ */
154
154
 
155
- update(mode?: 'resize' | 'reset' | 'none' | 'hide' | 'show' | 'default'): this {
155
+ /**
156
+ * Update chart with new data or configuration
157
+ */
158
+ updateChart(mode?: 'resize' | 'reset' | 'none' | 'hide' | 'show' | 'default'): this {
156
159
  if (this.chartInstance) {
157
160
  this.chartInstance.update(mode);
158
- this._triggerCallback('update', this.chartInstance);
159
161
  }
160
162
  return this;
161
163
  }
@@ -213,6 +215,23 @@ export class ChartComponent extends BaseComponent<ChartState> {
213
215
 
214
216
  this.chartInstance = new Chart(canvas, config);
215
217
 
218
+ // Wire sync for data
219
+ this._syncBindings.forEach(({ property, stateObj, toState, toComponent }) => {
220
+ if (property === 'data') {
221
+ const transform = toComponent || ((v: any) => v);
222
+
223
+ stateObj.subscribe((val: any) => {
224
+ const transformed = transform(val);
225
+ this.state.data = transformed;
226
+
227
+ if (this.chartInstance) {
228
+ this.chartInstance.data = transformed;
229
+ this.chartInstance.update();
230
+ }
231
+ });
232
+ }
233
+ });
234
+
216
235
  // Wire events and syncs
217
236
  this._wireStandardEvents(container);
218
237
  this._wireAllSyncs();
@@ -221,6 +240,10 @@ export class ChartComponent extends BaseComponent<ChartState> {
221
240
 
222
241
  return this;
223
242
  }
243
+
244
+ update(prop: string, value: any): void {
245
+ // No reactive updates needed - uses manual updateChart()
246
+ }
224
247
  }
225
248
 
226
249
  /**
@@ -15,6 +15,7 @@ export declare class Code extends BaseComponent<CodeState> {
15
15
  constructor(id: string, options?: CodeOptions);
16
16
  protected getTriggerEvents(): readonly string[];
17
17
  protected getCallbackEvents(): readonly string[];
18
+ update(prop: string, value: any): void;
18
19
  code(value: string): this;
19
20
  language(value: string): this;
20
21
  render(targetId?: string): this;
@@ -1 +1 @@
1
- {"version":3,"file":"code.d.ts","sourceRoot":"","sources":["code.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAMxD,MAAM,WAAW,WAAW;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,KAAK,SAAS,GAAG;IACf,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,qBAAa,IAAK,SAAQ,aAAa,CAAC,SAAS,CAAC;gBACpC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,WAAgB;IASjD,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAUhD,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAKzB,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAS7B,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI;CA4DhC;AAED,wBAAgB,IAAI,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,WAAgB,GAAG,IAAI,CAEhE"}
1
+ {"version":3,"file":"code.d.ts","sourceRoot":"","sources":["code.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAMxD,MAAM,WAAW,WAAW;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,KAAK,SAAS,GAAG;IACf,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,qBAAa,IAAK,SAAQ,aAAa,CAAC,SAAS,CAAC;gBACpC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,WAAgB;IASjD,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAIhD,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,IAAI;IAUtC,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAKzB,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAS7B,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI;CA4DhC;AAED,wBAAgB,IAAI,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,WAAgB,GAAG,IAAI,CAEhE"}
@@ -17,6 +17,9 @@ export class Code extends BaseComponent {
17
17
  getCallbackEvents() {
18
18
  return CALLBACK_EVENTS;
19
19
  }
20
+ update(prop, value) {
21
+ // No reactive updates needed
22
+ }
20
23
  /* ═════════════════════════════════════════════════════════════════
21
24
  * FLUENT API
22
25
  * ═════════════════════════════════════════════════════════════════ */
@@ -36,6 +36,10 @@ export class Code extends BaseComponent<CodeState> {
36
36
  return CALLBACK_EVENTS;
37
37
  }
38
38
 
39
+ update(prop: string, value: any): void {
40
+ // No reactive updates needed
41
+ }
42
+
39
43
  /* ═════════════════════════════════════════════════════════════════
40
44
  * FLUENT API
41
45
  * ═════════════════════════════════════════════════════════════════ */
@@ -28,6 +28,7 @@ export declare class Container extends BaseComponent<ContainerState> {
28
28
  constructor(id: string, options?: ContainerOptions);
29
29
  protected getTriggerEvents(): readonly string[];
30
30
  protected getCallbackEvents(): readonly string[];
31
+ update(prop: string, value: any): void;
31
32
  direction(value: 'row' | 'column'): this;
32
33
  gap(value: string | number): this;
33
34
  align(value: 'start' | 'center' | 'end' | 'stretch'): this;
@@ -1 +1 @@
1
- {"version":3,"file":"container.d.ts","sourceRoot":"","sources":["container.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAMxD;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IAC7B,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;IAC/C,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,eAAe,GAAG,cAAc,GAAG,cAAc,CAAC;CAC1F;AAED;;GAEG;AACH,KAAK,cAAc,GAAG;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IAC7B,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF;;GAEG;AACH,qBAAa,SAAU,SAAQ,aAAa,CAAC,cAAc,CAAC;gBAC9C,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,gBAAqB;IAWtD,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAgBhD,SAAS,CAAC,KAAK,EAAE,KAAK,GAAG,QAAQ,GAAG,IAAI;IAKxC,GAAG,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI;IAKjC,KAAK,CAAC,KAAK,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,GAAG,IAAI;IAK1D,OAAO,CAAC,KAAK,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,eAAe,GAAG,cAAc,GAAG,cAAc,GAAG,IAAI;IASpG,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI;CA2ChC;AAED;;GAEG;AACH,wBAAgB,SAAS,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,gBAAqB,GAAG,SAAS,CAE/E"}
1
+ {"version":3,"file":"container.d.ts","sourceRoot":"","sources":["container.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAMxD;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IAC7B,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,CAAC;IAC/C,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,eAAe,GAAG,cAAc,GAAG,cAAc,CAAC;CAC1F;AAED;;GAEG;AACH,KAAK,cAAc,GAAG;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IAC7B,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF;;GAEG;AACH,qBAAa,SAAU,SAAQ,aAAa,CAAC,cAAc,CAAC;gBAC9C,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,gBAAqB;IAWtD,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAIhD,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,IAAI;IAgBtC,SAAS,CAAC,KAAK,EAAE,KAAK,GAAG,QAAQ,GAAG,IAAI;IAKxC,GAAG,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI;IAKjC,KAAK,CAAC,KAAK,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,SAAS,GAAG,IAAI;IAK1D,OAAO,CAAC,KAAK,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,GAAG,eAAe,GAAG,cAAc,GAAG,cAAc,GAAG,IAAI;IASpG,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI;CA2ChC;AAED;;GAEG;AACH,wBAAgB,SAAS,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,gBAAqB,GAAG,SAAS,CAE/E"}
@@ -22,6 +22,9 @@ export class Container extends BaseComponent {
22
22
  getCallbackEvents() {
23
23
  return CALLBACK_EVENTS;
24
24
  }
25
+ update(prop, value) {
26
+ // No reactive updates needed
27
+ }
25
28
  /* -------------------------
26
29
  * Fluent API
27
30
  * ------------------------- */
@@ -51,6 +51,10 @@ export class Container extends BaseComponent<ContainerState> {
51
51
  return CALLBACK_EVENTS;
52
52
  }
53
53
 
54
+ update(prop: string, value: any): void {
55
+ // No reactive updates needed
56
+ }
57
+
54
58
  /* -------------------------
55
59
  * Fluent API
56
60
  * ------------------------- */
@@ -31,6 +31,7 @@ export declare class Dialog extends BaseComponent<DialogState> {
31
31
  variant(value: 'default' | 'danger' | 'warning'): this;
32
32
  open(): this;
33
33
  close(): this;
34
+ update(prop: string, value: any): void;
34
35
  render(targetId?: string): this;
35
36
  }
36
37
  export declare function dialog(id: string, options?: DialogOptions): Dialog;