juxscript 1.1.33 → 1.1.35

package/lib/components/view.ts

@@ -1,190 +0,0 @@
-import { getOrCreateContainer } from './helpers.js';
-
-/**
- * View component options
- */
-export interface ViewOptions {
-  title?: string;
-  description?: string;
-  children?: any[];
-}
-
-/**
- * View component state
- */
-type ViewState = {
-  title: string;
-  description: string;
-  children: any[];
-};
-
-/**
- * View component - container for organizing page content
- *
- * Usage:
- *   const view = jux.view('myView', {
- *     title: 'Dashboard',
- *     description: 'Main dashboard view'
- *   });
- *   view.add(component1);
- *   await view.render();
- */
-export class View {
-  state: ViewState;
-  container: HTMLElement | null = null;
-  _id: string;
-  id: string;
-
-  constructor(id: string, options: ViewOptions = {}) {
-    this._id = id;
-    this.id = id;
-
-    this.state = {
-      title: options.title ?? '',
-      description: options.description ?? '',
-      children: Array.isArray(options.children) ? [...options.children] : []
-    };
-  }
-
-  /* -------------------------
-   * Fluent API
-   * ------------------------- */
-
-  title(value: string): this {
-    this.state.title = value;
-    return this;
-  }
-
-  description(value: string): this {
-    this.state.description = value;
-    return this;
-  }
-
-  add(component: any | any[]): this {
-    if (Array.isArray(component)) {
-      this.state.children.push(...component);
-    } else {
-      this.state.children.push(component);
-    }
-    return this;
-  }
-
-  /* -------------------------
-   * Render
-   * ------------------------- */
-
-  async render(targetId?: string): Promise<this> {
-    let container: HTMLElement;
-
-    if (targetId) {
-      const target = document.querySelector(targetId);
-      if (!target || !(target instanceof HTMLElement)) {
-        throw new Error(`View: Target element "${targetId}" not found`);
-      }
-      container = target;
-    } else {
-      container = getOrCreateContainer(this._id);
-    }
-
-    this.container = container;
-    const { title, description, children } = this.state;
-
-    const view = document.createElement('div');
-    view.className = 'jux-view';
-    view.id = this._id;
-
-    // View header
-    if (title || description) {
-      const header = document.createElement('div');
-      header.className = 'jux-view-header';
-
-      if (title) {
-        const titleEl = document.createElement('h1');
-        titleEl.className = 'jux-view-title';
-        titleEl.textContent = title;
-        header.appendChild(titleEl);
-      }
-
-      if (description) {
-        const descEl = document.createElement('p');
-        descEl.className = 'jux-view-description';
-        descEl.textContent = description;
-        header.appendChild(descEl);
-      }
-
-      view.appendChild(header);
-    }
-
-    // View content
-    const content = document.createElement('div');
-    content.className = 'jux-view-content';
-
-    // Render children
-    for (let i = 0; i < children.length; i++) {
-      const child = children[i];
-      if (!child) continue;
-
-      // Get child ID
-      let childId: string | null = null;
-      if ((child as any).id) {
-        childId = (child as any).id;
-      } else if ((child as any)._id) {
-        childId = (child as any)._id;
-      } else {
-        childId = `${this._id}-child-${i}`;
-      }
-
-      // Create wrapper for child
-      const childWrapper = document.createElement('div');
-      childWrapper.className = 'jux-view-item';
-      childWrapper.id = `${childId}-wrapper`;
-      content.appendChild(childWrapper);
-
-      // Render child INTO the wrapper
-      if (typeof (child as any).render === 'function') {
-        try {
-          // Pass the wrapper element directly
-          const result = (child as any).render(childWrapper);
-          if (result && typeof (result as any).then === 'function') {
-            await result;
-          }
-        } catch (err) {
-          console.error(`View: Error rendering child ${i}:`, err);
-          childWrapper.innerHTML = `<div style="color: #ff6b6b; padding: 1rem;">Error: ${(err as Error).message}</div>`;
-        }
-      } else {
-        // If no render method, try to append directly
-        if (child instanceof HTMLElement) {
-          childWrapper.appendChild(child);
-        }
-      }
-    }
-
-    view.appendChild(content);
-    container.appendChild(view);
-
-    return this;
-  }
-
-  /**
-   * Render to another Jux component's container
-   */
-  async renderTo(juxComponent: any): Promise<this> {
-    if (!juxComponent || typeof juxComponent !== 'object') {
-      throw new Error('View.renderTo: Invalid component - not an object');
-    }
-
-    if (!juxComponent._id || typeof juxComponent._id !== 'string') {
-      throw new Error('View.renderTo: Invalid component - missing _id (not a Jux component)');
-    }
-
-    return this.render(`#${juxComponent._id}`);
-  }
-}
-
-/**
- * Factory helper
- */
-export function view(id: string, options: ViewOptions = {}): View {
-  return new View(id, options);
-}