juxscript 1.1.39 → 1.1.41

package/lib/components/code.d.ts

@@ -1,12 +1,12 @@
 import { BaseComponent } from './base/BaseComponent.js';
 export interface CodeOptions {
-    code?: string;
+    content?: string;
     language?: string;
     style?: string;
     class?: string;
 }
 type CodeState = {
-    code: string;
+    content: string;
     language: string;
     style: string;
     class: string;
@@ -16,7 +16,7 @@ export declare class Code extends BaseComponent<CodeState> {
     protected getTriggerEvents(): readonly string[];
     protected getCallbackEvents(): readonly string[];
     update(prop: string, value: any): void;
-    code(value: string): this;
+    content(value: string): this;
     language(value: string): this;
     render(targetId?: string | HTMLElement | BaseComponent<any>): this;
 }

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

@@ -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;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,WAAW,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,IAAI;CA4DnE;AAED,wBAAgB,IAAI,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,WAAgB,GAAG,IAAI,CAEhE"}
+{"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,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,KAAK,SAAS,GAAG;IACf,OAAO,EAAE,MAAM,CAAC;IAChB,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;IAQtC,OAAO,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK5B,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAS7B,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,IAAI;CA4DnE;AAED,wBAAgB,IAAI,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,WAAgB,GAAG,IAAI,CAEhE"}

package/lib/components/code.js

@@ -5,7 +5,7 @@ const CALLBACK_EVENTS = [];
 export class Code extends BaseComponent {
     constructor(id, options = {}) {
         super(id, {
-            code: options.code ?? '',
+            content: options.content ?? '',
             language: options.language ?? 'javascript',
             style: options.style ?? '',
             class: options.class ?? ''
@@ -23,9 +23,8 @@ export class Code extends BaseComponent {
     /* ═════════════════════════════════════════════════════════════════
      * FLUENT API
      * ═════════════════════════════════════════════════════════════════ */
-    // ✅ Inherited from BaseComponent
-    code(value) {
-        this.state.code = value;
+    content(value) {
+        this.state.content = value;
         return this;
     }
     language(value) {
@@ -37,7 +36,7 @@ export class Code extends BaseComponent {
      * ═════════════════════════════════════════════════════════════════ */
     render(targetId) {
         const container = this._setupContainer(targetId);
-        const { code, language, style, class: className } = this.state;
+        const { content, language, style, class: className } = this.state;
         const wrapper = document.createElement('div');
         wrapper.className = 'jux-code';
         wrapper.id = this._id;
@@ -48,18 +47,18 @@ export class Code extends BaseComponent {
         const pre = document.createElement('pre');
         const codeEl = document.createElement('code');
         codeEl.className = `language-${language}`;
-        codeEl.textContent = code;
+        codeEl.textContent = content;
         pre.appendChild(codeEl);
         wrapper.appendChild(pre);
         this._wireStandardEvents(wrapper);
         // Wire sync bindings
         this._syncBindings.forEach(({ property, stateObj, toState, toComponent }) => {
-            if (property === 'code') {
+            if (property === 'content') {
                 const transform = toComponent || ((v) => String(v));
                 stateObj.subscribe((val) => {
                     const transformed = transform(val);
                     codeEl.textContent = transformed;
-                    this.state.code = transformed;
+                    this.state.content = transformed;
                     if (window.Prism) {
                         window.Prism.highlightElement(codeEl);
                     }

package/lib/components/code.ts

@@ -5,14 +5,14 @@ const TRIGGER_EVENTS = [] as const;
 const CALLBACK_EVENTS = [] as const;
 
 export interface CodeOptions {
-  code?: string;
+  content?: string;
   language?: string;
   style?: string;
   class?: string;
 }
 
 type CodeState = {
-  code: string;
+  content: string;
   language: string;
   style: string;
   class: string;
@@ -21,7 +21,7 @@ type CodeState = {
 export class Code extends BaseComponent<CodeState> {
   constructor(id: string, options: CodeOptions = {}) {
     super(id, {
-      code: options.code ?? '',
+      content: options.content ?? '',
       language: options.language ?? 'javascript',
       style: options.style ?? '',
       class: options.class ?? ''
@@ -44,10 +44,8 @@ export class Code extends BaseComponent<CodeState> {
    * FLUENT API
    * ═════════════════════════════════════════════════════════════════ */
 
-  // ✅ Inherited from BaseComponent
-
-  code(value: string): this {
-    this.state.code = value;
+  content(value: string): this {
+    this.state.content = value;
     return this;
   }
 
@@ -63,7 +61,7 @@ export class Code extends BaseComponent<CodeState> {
   render(targetId?: string | HTMLElement | BaseComponent<any>): this {
     const container = this._setupContainer(targetId);
 
-    const { code, language, style, class: className } = this.state;
+    const { content, language, style, class: className } = this.state;
 
     const wrapper = document.createElement('div');
     wrapper.className = 'jux-code';
@@ -74,7 +72,7 @@ export class Code extends BaseComponent<CodeState> {
     const pre = document.createElement('pre');
     const codeEl = document.createElement('code');
     codeEl.className = `language-${language}`;
-    codeEl.textContent = code;
+    codeEl.textContent = content;
     pre.appendChild(codeEl);
     wrapper.appendChild(pre);
 
@@ -82,13 +80,13 @@ export class Code extends BaseComponent<CodeState> {
 
     // Wire sync bindings
     this._syncBindings.forEach(({ property, stateObj, toState, toComponent }) => {
-      if (property === 'code') {
+      if (property === 'content') {
         const transform = toComponent || ((v: any) => String(v));
 
         stateObj.subscribe((val: any) => {
           const transformed = transform(val);
           codeEl.textContent = transformed;
-          this.state.code = transformed;
+          this.state.content = transformed;
 
           if ((window as any).Prism) {
             (window as any).Prism.highlightElement(codeEl);

package/lib/components/tabs.d.ts

@@ -34,6 +34,11 @@ export declare class Tabs extends BaseComponent<TabsState> {
      * Update content of a specific tab by ID
      */
     updateTabContent(tabId: string, content: string | BaseComponent<any>): this;
+    /**
+     * ✅ NEW: Append content to a specific tab
+     * Accepts single item or array of strings/BaseComponents
+     */
+    addTabContent(tabId: string, content: string | BaseComponent<any> | Array<string | BaseComponent<any>>): this;
     /**
      * Get tab by ID
      */

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

@@ -1 +1 @@
-{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["tabs.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAMnE,MAAM,WAAW,GAAG;IAClB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC;IACrC,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,WAAW;IAC1B,IAAI,CAAC,EAAE,GAAG,EAAE,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,WAAW,CAAC;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,KAAK,SAAS,GAAG,SAAS,GAAG;IAC3B,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,qBAAa,IAAK,SAAQ,aAAa,CAAC,SAAS,CAAC;IAChD,OAAO,CAAC,YAAY,CAA4B;gBAEpC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,WAAgB;IAUjD,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAQhD,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,IAAI;IAuBtC,OAAO,CAAC,gBAAgB;IAsBxB,OAAO,CAAC,YAAY;IAoEpB,IAAI,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI;IAKxB,MAAM,CAAC,GAAG,EAAE,GAAG,GAAG,IAAI;IAKtB,SAAS,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAW9B,SAAS,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK9B,OAAO,CAAC,KAAK,EAAE,SAAS,GAAG,OAAO,GAAG,WAAW,GAAG,IAAI;IAKvD;;OAEG;IACH,gBAAgB,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,IAAI;IAqB3E;;OAEG;IACH,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,GAAG,GAAG,SAAS;IAItC;;OAEG;IACH,aAAa,IAAI,GAAG,GAAG,SAAS;IAQhC,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,IAAI;CA+EnE;AAED,wBAAgB,IAAI,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,WAAgB,GAAG,IAAI,CAEhE"}
+{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["tabs.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAMnE,MAAM,WAAW,GAAG;IAClB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC;IACrC,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,WAAW;IAC1B,IAAI,CAAC,EAAE,GAAG,EAAE,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,WAAW,CAAC;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,KAAK,SAAS,GAAG,SAAS,GAAG;IAC3B,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,qBAAa,IAAK,SAAQ,aAAa,CAAC,SAAS,CAAC;IAChD,OAAO,CAAC,YAAY,CAA4B;gBAEpC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,WAAgB;IAUjD,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAQhD,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,IAAI;IAuBtC,OAAO,CAAC,gBAAgB;IAsBxB,OAAO,CAAC,YAAY;IAoEpB,IAAI,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI;IAKxB,MAAM,CAAC,GAAG,EAAE,GAAG,GAAG,IAAI;IAKtB,SAAS,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAW9B,SAAS,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK9B,OAAO,CAAC,KAAK,EAAE,SAAS,GAAG,OAAO,GAAG,WAAW,GAAG,IAAI;IAKvD;;OAEG;IACH,gBAAgB,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,IAAI;IAqB3E;;;OAGG;IACH,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,MAAM,GAAG,aAAa,CAAC,GAAG,CAAC,CAAC,GAAG,IAAI;IA2B7G;;OAEG;IACH,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,GAAG,GAAG,SAAS;IAItC;;OAEG;IACH,aAAa,IAAI,GAAG,GAAG,SAAS;IAQhC,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,IAAI;CA+EnE;AAED,wBAAgB,IAAI,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,WAAgB,GAAG,IAAI,CAEhE"}

package/lib/components/tabs.js

@@ -163,6 +163,34 @@ export class Tabs extends BaseComponent {
         }
         return this;
     }
+    /**
+     * ✅ NEW: Append content to a specific tab
+     * Accepts single item or array of strings/BaseComponents
+     */
+    addTabContent(tabId, content) {
+        const panel = document.getElementById(`${this._id}-${tabId}-panel`);
+        if (!panel) {
+            console.warn(`[Tabs] Panel not found for tab: ${tabId}`);
+            return this;
+        }
+        // Normalize to array
+        const items = Array.isArray(content) ? content : [content];
+        items.forEach(item => {
+            if (typeof item === 'string') {
+                // Append HTML string
+                const tempDiv = document.createElement('div');
+                tempDiv.innerHTML = item;
+                while (tempDiv.firstChild) {
+                    panel.appendChild(tempDiv.firstChild);
+                }
+            }
+            else if (item instanceof BaseComponent) {
+                // Render component into panel
+                item.render(`#${panel.id}`);
+            }
+        });
+        return this;
+    }
     /**
      * Get tab by ID
      */

package/lib/components/tabs.ts

@@ -218,6 +218,37 @@ export class Tabs extends BaseComponent<TabsState> {
     return this;
   }
 
+  /**
+   * ✅ NEW: Append content to a specific tab
+   * Accepts single item or array of strings/BaseComponents
+   */
+  addTabContent(tabId: string, content: string | BaseComponent<any> | Array<string | BaseComponent<any>>): this {
+    const panel = document.getElementById(`${this._id}-${tabId}-panel`);
+    if (!panel) {
+      console.warn(`[Tabs] Panel not found for tab: ${tabId}`);
+      return this;
+    }
+
+    // Normalize to array
+    const items = Array.isArray(content) ? content : [content];
+
+    items.forEach(item => {
+      if (typeof item === 'string') {
+        // Append HTML string
+        const tempDiv = document.createElement('div');
+        tempDiv.innerHTML = item;
+        while (tempDiv.firstChild) {
+          panel.appendChild(tempDiv.firstChild);
+        }
+      } else if (item instanceof BaseComponent) {
+        // Render component into panel
+        item.render(`#${panel.id}`);
+      }
+    });
+
+    return this;
+  }
+
   /**
    * Get tab by ID
    */

package/package.json

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