juxscript 1.1.77 → 1.1.79

package/dom-structure-map.json

@@ -1,6 +1,6 @@
 {
   "totalComponents": 63,
-  "generatedAt": "2026-02-11T22:32:45.675Z",
+  "generatedAt": "2026-02-12T02:37:11.919Z",
   "components": [
     {
       "file": "alert.js",

package/index.d.ts

@@ -44,6 +44,7 @@ import { renderIcon, renderEmoji } from './lib/components/icons.js';
 import { state } from './lib/reactivity/state.js';
 import { registry } from './lib/components/registry.js';
 import { stateHistory } from './lib/components/history/StateHistory.js';
+import { eventChain } from './lib/components/event-chain.js';
 export { state, registry, stateHistory };
 export declare const jux: {
     alert: typeof alert;
@@ -198,5 +199,6 @@ export declare const jux: {
     renderIcon: typeof renderIcon;
     renderEmoji: typeof renderEmoji;
     getOrCreateContainer: typeof getOrCreateContainer;
+    eventChain: typeof eventChain;
 };
 //# sourceMappingURL=index.d.ts.map

package/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"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"}

package/index.js

@@ -46,6 +46,7 @@ import { renderIcon, renderEmoji } from './lib/components/icons.js';
 import { state } from './lib/reactivity/state.js';
 import { registry } from './lib/components/registry.js'; // ✅ Import registry
 import { stateHistory } from './lib/components/history/StateHistory.js'; // ✅ Import history
+import { eventChain } from './lib/components/event-chain.js';
 export { state, registry, stateHistory }; // ✅ Export history
 // Utilities
 export const jux = {
@@ -95,5 +96,6 @@ export const jux = {
     fetch: fetchAPI,
     renderIcon,
     renderEmoji,
-    getOrCreateContainer
+    getOrCreateContainer,
+    eventChain
 };

package/lib/components/base/FormInput.d.ts

@@ -58,7 +58,7 @@ export declare abstract class FormInput<TState extends FormInputState> extends B
      */
     protected _clearError(): void;
     /**
-     * Build label element
+     * Build label element with auto-generated text from ID if not provided
      */
     protected _renderLabel(): HTMLLabelElement;
     /**

package/lib/components/base/FormInput.d.ts.map

@@ -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,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"}
+{"version":3,"file":"FormInput.d.ts","sourceRoot":"","sources":["FormInput.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAGnD;;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;IAqB1C;;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"}

package/lib/components/base/FormInput.js

@@ -1,4 +1,5 @@
 import { BaseComponent } from './BaseComponent.js';
+import { formatIdAsLabel } from '../../utils/formatId.js'; // ✅ Import utility
 /**
  * Abstract base class for all form input components
  * Extends BaseComponent with form-specific functionality
@@ -89,14 +90,15 @@ export class FormInput extends BaseComponent {
      * COMMON RENDER HELPERS
      * ═════════════════════════════════════════════════════════════════ */
     /**
-     * Build label element
+     * Build label element with auto-generated text from ID if not provided
      */
     _renderLabel() {
         const { label, required } = this.state;
         const labelEl = document.createElement('label');
         labelEl.className = 'jux-input-label';
         labelEl.htmlFor = `${this._id}-input`;
-        labelEl.textContent = label;
+        // ✅ Use provided label or auto-generate from ID
+        labelEl.textContent = label || formatIdAsLabel(this._id);
         if (required) {
             const requiredSpan = document.createElement('span');
             requiredSpan.className = 'jux-input-required';

package/lib/components/base/FormInput.ts

@@ -1,4 +1,5 @@
 import { BaseComponent } from './BaseComponent.js';
+import { formatIdAsLabel } from '../../utils/formatId.js';  // ✅ Import utility
 
 /**
  * Base state interface for all form inputs
@@ -141,7 +142,7 @@ export abstract class FormInput<TState extends FormInputState> extends BaseCompo
      * ═════════════════════════════════════════════════════════════════ */
 
     /**
-     * Build label element
+     * Build label element with auto-generated text from ID if not provided
      */
     protected _renderLabel(): HTMLLabelElement {
         const { label, required } = this.state;
@@ -149,7 +150,9 @@ export abstract class FormInput<TState extends FormInputState> extends BaseCompo
         const labelEl = document.createElement('label');
         labelEl.className = 'jux-input-label';
         labelEl.htmlFor = `${this._id}-input`;
-        labelEl.textContent = label;
+        
+        // ✅ Use provided label or auto-generate from ID
+        labelEl.textContent = label || formatIdAsLabel(this._id);
 
         if (required) {
             const requiredSpan = document.createElement('span');

package/lib/components/button.d.ts.map

@@ -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;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,WAAW,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,IAAI;CAkDnE;AAED,wBAAgB,MAAM,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,aAAa,GAAG,MAAM,CAElE"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAQxD,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,WAAW,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,IAAI;CAkDnE;AAED,wBAAgB,MAAM,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,aAAa,GAAG,MAAM,CAElE"}

package/lib/components/button.js

@@ -1,5 +1,6 @@
 import { BaseComponent } from './base/BaseComponent.js';
 import { renderIcon } from './icons.js';
+import { formatIdAsLabel } from '../utils/formatId.js'; // ✅ Import utility
 // Event definitions
 const TRIGGER_EVENTS = [];
 const CALLBACK_EVENTS = ['click']; // ✅ Button fires click events
@@ -7,7 +8,7 @@ export class Button extends BaseComponent {
     constructor(id, options) {
         const opts = options || {};
         super(id, {
-            label: opts.label ?? 'Button',
+            label: opts.label ?? formatIdAsLabel(id), // ✅ Use utility for default
             icon: opts.icon ?? '',
             variant: opts.variant ?? 'primary',
             size: opts.size ?? 'medium',

package/lib/components/button.ts

@@ -1,5 +1,6 @@
 import { BaseComponent } from './base/BaseComponent.js';
 import { renderIcon } from './icons.js';
+import { formatIdAsLabel } from '../utils/formatId.js';  // ✅ Import utility
 
 // Event definitions
 const TRIGGER_EVENTS = [] as const;
@@ -40,7 +41,7 @@ export class Button extends BaseComponent<ButtonState> {
     const opts = options || {};
 
     super(id, {
-      label: opts.label ?? 'Button',
+      label: opts.label ?? formatIdAsLabel(id),  // ✅ Use utility for default
       icon: opts.icon ?? '',
       variant: opts.variant ?? 'primary',
       size: opts.size ?? 'medium',

package/lib/components/event-chain.d.ts

@@ -0,0 +1,9 @@
+export declare class EventChain {
+    #private;
+    constructor();
+    register(event: string, callback: Function): void;
+    trigger(event: string, ...args: any[]): void;
+    unregister(event: string, callback: Function): void;
+}
+export declare function eventChain(): EventChain;
+//# sourceMappingURL=event-chain.d.ts.map

package/lib/components/event-chain.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"event-chain.d.ts","sourceRoot":"","sources":["event-chain.ts"],"names":[],"mappings":"AACA,qBAAa,UAAU;;;IAMnB,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,GAAG,IAAI;IAOjD,OAAO,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,EAAE,GAAG,EAAE,GAAG,IAAI;IAO5C,UAAU,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,GAAG,IAAI;CAMtD;AAED,wBAAgB,UAAU,IAAI,UAAU,CAEvC"}

package/lib/components/event-chain.js

@@ -0,0 +1,33 @@
+var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f) throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var _EventChain_registeredEvents;
+export class EventChain {
+    constructor() {
+        _EventChain_registeredEvents.set(this, {});
+    }
+    register(event, callback) {
+        if (!__classPrivateFieldGet(this, _EventChain_registeredEvents, "f")[event]) {
+            __classPrivateFieldGet(this, _EventChain_registeredEvents, "f")[event] = [];
+        }
+        __classPrivateFieldGet(this, _EventChain_registeredEvents, "f")[event].push(callback);
+    }
+    trigger(event, ...args) {
+        const callbacks = __classPrivateFieldGet(this, _EventChain_registeredEvents, "f")[event];
+        if (callbacks) {
+            callbacks.forEach(callback => callback(...args));
+        }
+    }
+    unregister(event, callback) {
+        const callbacks = __classPrivateFieldGet(this, _EventChain_registeredEvents, "f")[event];
+        if (callbacks) {
+            __classPrivateFieldGet(this, _EventChain_registeredEvents, "f")[event] = callbacks.filter(cb => cb !== callback);
+        }
+    }
+}
+_EventChain_registeredEvents = new WeakMap();
+export function eventChain() {
+    return new EventChain();
+}

package/lib/components/event-chain.ts

@@ -0,0 +1,32 @@
+
+export class EventChain {
+
+    constructor() {
+    }
+    #registeredEvents: { [key: string]: Function[] } = {};
+
+    register(event: string, callback: Function): void {
+        if (!this.#registeredEvents[event]) {
+            this.#registeredEvents[event] = [];
+        }
+        this.#registeredEvents[event].push(callback);
+    }
+
+    trigger(event: string, ...args: any[]): void {
+        const callbacks = this.#registeredEvents[event];
+        if (callbacks) {
+            callbacks.forEach(callback => callback(...args));
+        }
+    }
+
+    unregister(event: string, callback: Function): void {
+        const callbacks = this.#registeredEvents[event];
+        if (callbacks) {
+            this.#registeredEvents[event] = callbacks.filter(cb => cb !== callback);
+        }
+    }
+}
+
+export function eventChain(): EventChain {
+    return new EventChain();
+}

package/lib/components/input.js

@@ -9,7 +9,7 @@ export class Input extends FormInput {
             type: options.type ?? 'text',
             value: options.value ?? '',
             placeholder: options.placeholder ?? '',
-            label: options.label ?? '',
+            label: options.label ?? '', // ✅ Empty string = auto-generate in _renderLabel()
             icon: options.icon ?? '',
             required: options.required ?? false,
             disabled: options.disabled ?? false,

package/lib/components/input.ts

@@ -47,7 +47,7 @@ export class Input extends FormInput<InputState> {
       type: options.type ?? 'text',
       value: options.value ?? '',
       placeholder: options.placeholder ?? '',
-      label: options.label ?? '',
+      label: options.label ?? '',  // ✅ Empty string = auto-generate in _renderLabel()
       icon: options.icon ?? '',
       required: options.required ?? false,
       disabled: options.disabled ?? false,

package/lib/utils/formatId.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Convert a component ID to a human-readable label
+ *
+ * Examples:
+ *   'btn-1' → 'Btn 1'
+ *   'btn1' → 'Btn1'
+ *   'btn-primary-1' → 'Btn Primary 1'
+ *   'user-email-input' → 'User Email Input'
+ *   'firstName' → 'First Name'
+ *   'first_name' → 'First Name'
+ *
+ * @param id - Component ID (kebab-case, snake_case, or camelCase)
+ * @returns Human-readable label with proper capitalization
+ */
+export declare function formatIdAsLabel(id: string): string;
+//# sourceMappingURL=formatId.d.ts.map

package/lib/utils/formatId.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"formatId.d.ts","sourceRoot":"","sources":["formatId.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AACH,wBAAgB,eAAe,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,CAalD"}

package/lib/utils/formatId.js

@@ -0,0 +1,27 @@
+/**
+ * Convert a component ID to a human-readable label
+ *
+ * Examples:
+ *   'btn-1' → 'Btn 1'
+ *   'btn1' → 'Btn1'
+ *   'btn-primary-1' → 'Btn Primary 1'
+ *   'user-email-input' → 'User Email Input'
+ *   'firstName' → 'First Name'
+ *   'first_name' → 'First Name'
+ *
+ * @param id - Component ID (kebab-case, snake_case, or camelCase)
+ * @returns Human-readable label with proper capitalization
+ */
+export function formatIdAsLabel(id) {
+    if (!id)
+        return '';
+    // Split by common delimiters: hyphens, underscores, or camelCase boundaries
+    const words = id
+        .replace(/([a-z])([A-Z])/g, '$1 $2') // camelCase → separate words
+        .split(/[-_\s]+/) // Split by hyphens, underscores, spaces
+        .filter(word => word.length > 0);
+    // Capitalize first letter of each word
+    return words
+        .map(word => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase())
+        .join(' ');
+}

package/lib/utils/formatId.ts

@@ -0,0 +1,28 @@
+/**
+ * Convert a component ID to a human-readable label
+ * 
+ * Examples:
+ *   'btn-1' → 'Btn 1'
+ *   'btn1' → 'Btn1'
+ *   'btn-primary-1' → 'Btn Primary 1'
+ *   'user-email-input' → 'User Email Input'
+ *   'firstName' → 'First Name'
+ *   'first_name' → 'First Name'
+ * 
+ * @param id - Component ID (kebab-case, snake_case, or camelCase)
+ * @returns Human-readable label with proper capitalization
+ */
+export function formatIdAsLabel(id: string): string {
+    if (!id) return '';
+
+    // Split by common delimiters: hyphens, underscores, or camelCase boundaries
+    const words = id
+        .replace(/([a-z])([A-Z])/g, '$1 $2')  // camelCase → separate words
+        .split(/[-_\s]+/)                      // Split by hyphens, underscores, spaces
+        .filter(word => word.length > 0);
+
+    // Capitalize first letter of each word
+    return words
+        .map(word => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase())
+        .join(' ');
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "juxscript",
-  "version": "1.1.77",
+  "version": "1.1.79",
   "type": "module",
   "description": "A JavaScript UX authorship platform",
   "main": "index.js",