juxscript 1.1.239 → 1.1.243

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

@@ -1,77 +0,0 @@
-import { BaseComponent } from './BaseComponent.js';
-/**
- * Base state interface for all form inputs
- */
-export interface FormInputState extends Record<string, any> {
-    label: string;
-    required: boolean;
-    disabled: boolean;
-    name: string;
-    style: string;
-    class: string;
-    errorMessage?: string;
-}
-/**
- * Abstract base class for all form input components
- * Extends BaseComponent with form-specific functionality
- */
-export declare abstract class FormInput<TState extends FormInputState> extends BaseComponent<TState> {
-    protected _inputElement: HTMLElement | null;
-    protected _labelElement: HTMLLabelElement | null;
-    protected _errorElement: HTMLElement | null;
-    protected _onValidate?: (value: any) => boolean | string;
-    protected _hasBeenValidated: boolean;
-    /**
-     * Get the current value of the input
-     */
-    abstract getValue(): any;
-    /**
-     * Set the value of the input
-     */
-    abstract setValue(value: any): this;
-    /**
-     * Build the actual input element (input, select, textarea, etc.)
-     */
-    protected abstract _buildInputElement(): HTMLElement;
-    /**
-     * Validate the current value
-     */
-    protected abstract _validateValue(value: any): boolean | string;
-    label(value: string): this;
-    required(value: boolean): this;
-    name(value: string): this;
-    onValidate(handler: (value: any) => boolean | string): this;
-    /**
-     * Validate the current value and show/hide errors
-     */
-    validate(): boolean;
-    /**
-     * Check if current value is valid without showing errors
-     */
-    isValid(): boolean;
-    /**
-     * Show error message
-     */
-    protected _showError(message: string): void;
-    /**
-     * Clear error message
-     */
-    protected _clearError(): void;
-    /**
-     * Build label element with auto-generated text from ID if not provided
-     */
-    protected _renderLabel(): HTMLLabelElement;
-    /**
-     * Build error element
-     */
-    protected _renderError(): HTMLElement;
-    /**
-     * Default update implementation for form inputs
-     */
-    update(prop: string, value: any): void;
-    /**
-     * Wire up two-way sync for value property
-     */
-    protected _wireFormSync(inputElement: HTMLElement, eventName?: string): void;
-}
-//# sourceMappingURL=FormInput.d.ts.map

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

@@ -1 +0,0 @@
-{"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,171 +0,0 @@
-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
- */
-export class FormInput extends BaseComponent {
-    constructor() {
-        super(...arguments);
-        this._inputElement = null;
-        this._labelElement = null;
-        this._errorElement = null;
-        this._hasBeenValidated = false; // NEW: Track if user has submitted/validated
-    }
-    /* ═════════════════════════════════════════════════════════════════
-     * COMMON FORM INPUT API
-     * ═════════════════════════════════════════════════════════════════ */
-    label(value) {
-        this.state.label = value;
-        if (this._labelElement) {
-            this._labelElement.textContent = value;
-        }
-        return this;
-    }
-    required(value) {
-        this.state.required = value;
-        return this;
-    }
-    name(value) {
-        this.state.name = value;
-        return this;
-    }
-    onValidate(handler) {
-        this._onValidate = handler;
-        return this;
-    }
-    /* ═════════════════════════════════════════════════════════════════
-     * VALIDATION
-     * ═════════════════════════════════════════════════════════════════ */
-    /**
-     * Validate the current value and show/hide errors
-     */
-    validate() {
-        this._hasBeenValidated = true; // Mark as validated
-        const value = this.getValue();
-        const result = this._validateValue(value);
-        if (result === true) {
-            this._clearError();
-            return true;
-        }
-        else {
-            this._showError(result);
-            return false;
-        }
-    }
-    /**
-     * Check if current value is valid without showing errors
-     */
-    isValid() {
-        const value = this.getValue();
-        return this._validateValue(value) === true;
-    }
-    /**
-     * Show error message
-     */
-    _showError(message) {
-        if (this._errorElement) {
-            this._errorElement.textContent = message;
-            this._errorElement.style.display = 'block';
-        }
-        if (this._inputElement) {
-            this._inputElement.classList.add('jux-input-invalid');
-        }
-        this.state.errorMessage = message;
-    }
-    /**
-     * Clear error message
-     */
-    _clearError() {
-        if (this._errorElement) {
-            this._errorElement.textContent = '';
-            this._errorElement.style.display = 'none';
-        }
-        if (this._inputElement) {
-            this._inputElement.classList.remove('jux-input-invalid');
-        }
-        this.state.errorMessage = undefined;
-    }
-    /* ═════════════════════════════════════════════════════════════════
-     * COMMON RENDER HELPERS
-     * ═════════════════════════════════════════════════════════════════ */
-    /**
-     * 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`;
-        // ✅ 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';
-            requiredSpan.textContent = ' *';
-            labelEl.appendChild(requiredSpan);
-        }
-        this._labelElement = labelEl;
-        return labelEl;
-    }
-    /**
-     * Build error element
-     */
-    _renderError() {
-        const errorEl = document.createElement('div');
-        errorEl.className = 'jux-input-error';
-        errorEl.id = `${this._id}-error`;
-        errorEl.style.display = 'none';
-        this._errorElement = errorEl;
-        return errorEl;
-    }
-    /**
-     * Default update implementation for form inputs
-     */
-    update(prop, value) {
-        // No reactive updates needed - form inputs handle their own state
-    }
-    /**
-     * Wire up two-way sync for value property
-     */
-    _wireFormSync(inputElement, eventName = 'input') {
-        const valueSync = this._syncBindings.find(b => b.property === 'value');
-        if (valueSync) {
-            const { stateObj, toState, toComponent } = valueSync;
-            // Default transforms
-            const transformToState = toState || ((v) => v);
-            const transformToComponent = toComponent || ((v) => v);
-            let isUpdating = false;
-            // State → Component
-            stateObj.subscribe((val) => {
-                if (isUpdating)
-                    return;
-                const transformed = transformToComponent(val);
-                this.setValue(transformed);
-            });
-            // Component → State
-            inputElement.addEventListener(eventName, () => {
-                if (isUpdating)
-                    return;
-                isUpdating = true;
-                const value = this.getValue();
-                const transformed = transformToState(value);
-                this._clearError();
-                stateObj.set(transformed);
-                setTimeout(() => { isUpdating = false; }, 0);
-            });
-        }
-        else {
-            // Default behavior without sync
-            inputElement.addEventListener(eventName, () => {
-                this._clearError();
-            });
-        }
-        // Only validate on blur IF the field has been validated before (e.g., after submit)
-        inputElement.addEventListener('blur', () => {
-            if (this._hasBeenValidated) {
-                this.validate();
-            }
-        });
-    }
-}

package/lib/components/base/FormInput.ts

@@ -1,237 +0,0 @@
-import { BaseComponent } from './BaseComponent.js';
-import { formatIdAsLabel } from '../../utils/formatId.js';  // ✅ Import utility
-
-/**
- * Base state interface for all form inputs
- */
-export interface FormInputState extends Record<string, any> {
-    label: string;
-    required: boolean;
-    disabled: boolean;
-    name: string;
-    style: string;
-    class: string;
-    errorMessage?: string;
-}
-
-/**
- * Abstract base class for all form input components
- * Extends BaseComponent with form-specific functionality
- */
-export abstract class FormInput<TState extends FormInputState> extends BaseComponent<TState> {
-    protected _inputElement: HTMLElement | null = null;
-    protected _labelElement: HTMLLabelElement | null = null;
-    protected _errorElement: HTMLElement | null = null;
-    protected _onValidate?: (value: any) => boolean | string;
-    protected _hasBeenValidated: boolean = false;  // NEW: Track if user has submitted/validated
-
-    /* ═════════════════════════════════════════════════════════════════
-     * ABSTRACT METHODS (Child must implement)
-     * ═════════════════════════════════════════════════════════════════ */
-
-    /**
-     * Get the current value of the input
-     */
-    abstract getValue(): any;
-
-    /**
-     * Set the value of the input
-     */
-    abstract setValue(value: any): this;
-
-    /**
-     * Build the actual input element (input, select, textarea, etc.)
-     */
-    protected abstract _buildInputElement(): HTMLElement;
-
-    /**
-     * Validate the current value
-     */
-    protected abstract _validateValue(value: any): boolean | string;
-
-    /* ═════════════════════════════════════════════════════════════════
-     * COMMON FORM INPUT API
-     * ═════════════════════════════════════════════════════════════════ */
-
-    label(value: string): this {
-        this.state.label = value;
-        if (this._labelElement) {
-            this._labelElement.textContent = value;
-        }
-        return this;
-    }
-
-    required(value: boolean): this {
-        this.state.required = value;
-        return this;
-    }
-
-    name(value: string): this {
-        this.state.name = value;
-        return this;
-    }
-
-    onValidate(handler: (value: any) => boolean | string): this {
-        this._onValidate = handler;
-        return this;
-    }
-
-    /* ═════════════════════════════════════════════════════════════════
-     * VALIDATION
-     * ═════════════════════════════════════════════════════════════════ */
-
-    /**
-     * Validate the current value and show/hide errors
-     */
-    validate(): boolean {
-        this._hasBeenValidated = true;  // Mark as validated
-        const value = this.getValue();
-        const result = this._validateValue(value);
-
-        if (result === true) {
-            this._clearError();
-            return true;
-        } else {
-            this._showError(result as string);
-            return false;
-        }
-    }
-
-    /**
-     * Check if current value is valid without showing errors
-     */
-    isValid(): boolean {
-        const value = this.getValue();
-        return this._validateValue(value) === true;
-    }
-
-    /**
-     * Show error message
-     */
-    protected _showError(message: string): void {
-        if (this._errorElement) {
-            this._errorElement.textContent = message;
-            this._errorElement.style.display = 'block';
-        }
-
-        if (this._inputElement) {
-            this._inputElement.classList.add('jux-input-invalid');
-        }
-
-        this.state.errorMessage = message;
-    }
-
-    /**
-     * Clear error message
-     */
-    protected _clearError(): void {
-        if (this._errorElement) {
-            this._errorElement.textContent = '';
-            this._errorElement.style.display = 'none';
-        }
-
-        if (this._inputElement) {
-            this._inputElement.classList.remove('jux-input-invalid');
-        }
-
-        this.state.errorMessage = undefined;
-    }
-
-    /* ═════════════════════════════════════════════════════════════════
-     * COMMON RENDER HELPERS
-     * ═════════════════════════════════════════════════════════════════ */
-
-    /**
-     * Build label element with auto-generated text from ID if not provided
-     */
-    protected _renderLabel(): HTMLLabelElement {
-        const { label, required } = this.state;
-
-        const labelEl = document.createElement('label');
-        labelEl.className = 'jux-input-label';
-        labelEl.htmlFor = `${this._id}-input`;
-
-        // ✅ 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';
-            requiredSpan.textContent = ' *';
-            labelEl.appendChild(requiredSpan);
-        }
-
-        this._labelElement = labelEl;
-        return labelEl;
-    }
-
-    /**
-     * Build error element
-     */
-    protected _renderError(): HTMLElement {
-        const errorEl = document.createElement('div');
-        errorEl.className = 'jux-input-error';
-        errorEl.id = `${this._id}-error`;
-        errorEl.style.display = 'none';
-
-        this._errorElement = errorEl;
-        return errorEl;
-    }
-
-    /**
-     * Default update implementation for form inputs
-     */
-    update(prop: string, value: any): void {
-        // No reactive updates needed - form inputs handle their own state
-    }
-
-    /**
-     * Wire up two-way sync for value property
-     */
-    protected _wireFormSync(inputElement: HTMLElement, eventName: string = 'input'): void {
-        const valueSync = this._syncBindings.find(b => b.property === 'value');
-
-        if (valueSync) {
-            const { stateObj, toState, toComponent } = valueSync;
-
-            // Default transforms
-            const transformToState = toState || ((v: any) => v);
-            const transformToComponent = toComponent || ((v: any) => v);
-
-            let isUpdating = false;
-
-            // State → Component
-            stateObj.subscribe((val: any) => {
-                if (isUpdating) return;
-                const transformed = transformToComponent(val);
-                this.setValue(transformed);
-            });
-
-            // Component → State
-            inputElement.addEventListener(eventName, () => {
-                if (isUpdating) return;
-                isUpdating = true;
-
-                const value = this.getValue();
-                const transformed = transformToState(value);
-                this._clearError();
-
-                stateObj.set(transformed);
-
-                setTimeout(() => { isUpdating = false; }, 0);
-            });
-        } else {
-            // Default behavior without sync
-            inputElement.addEventListener(eventName, () => {
-                this._clearError();
-            });
-        }
-
-        // Only validate on blur IF the field has been validated before (e.g., after submit)
-        inputElement.addEventListener('blur', () => {
-            if (this._hasBeenValidated) {
-                this.validate();
-            }
-        });
-    }
-}

package/lib/components/blueprint.d.ts

@@ -1,40 +0,0 @@
-import { BaseComponent, BaseState } from './base/BaseComponent.js';
-export interface BlueprintOptions {
-    structureData?: any;
-    classData?: any;
-    filter?: string;
-    showMethods?: boolean;
-    expandAll?: boolean;
-    theme?: 'light' | 'dark' | 'auto';
-    style?: string;
-    class?: string;
-}
-interface BlueprintState extends BaseState {
-    structureData: any;
-    classData: any;
-    filter: string;
-    showMethods: boolean;
-    expandAll: boolean;
-    theme: string;
-    expandedComponents: Set<string>;
-}
-export declare class Blueprint extends BaseComponent<BlueprintState> {
-    constructor(id: string, options?: BlueprintOptions);
-    protected getTriggerEvents(): readonly string[];
-    protected getCallbackEvents(): readonly string[];
-    structureData(data: any): this;
-    classData(data: any): this;
-    filter(value: string): this;
-    showMethods(value: boolean): this;
-    expandAll(value: boolean): this;
-    theme(value: 'light' | 'dark' | 'auto'): this;
-    toggleComponent(componentFile: string): this;
-    private _renderHierarchy;
-    private _renderComponentCard;
-    update(prop: string, value: any): void;
-    private _rebuildContent;
-    render(targetId?: string | HTMLElement | BaseComponent<any>): this;
-}
-export declare function blueprint(id: string, options?: BlueprintOptions): Blueprint;
-export {};
-//# sourceMappingURL=blueprint.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"blueprint.d.ts","sourceRoot":"","sources":["blueprint.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAMnE,MAAM,WAAW,gBAAgB;IAC7B,aAAa,CAAC,EAAE,GAAG,CAAC;IACpB,SAAS,CAAC,EAAE,GAAG,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,UAAU,cAAe,SAAQ,SAAS;IACtC,aAAa,EAAE,GAAG,CAAC;IACnB,SAAS,EAAE,GAAG,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,OAAO,CAAC;IACrB,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,kBAAkB,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;CACnC;AASD,qBAAa,SAAU,SAAQ,aAAa,CAAC,cAAc,CAAC;gBAC5C,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,gBAAqB;IActD,SAAS,CAAC,gBAAgB,IAAI,SAAS,MAAM,EAAE;IAI/C,SAAS,CAAC,iBAAiB,IAAI,SAAS,MAAM,EAAE;IAQhD,aAAa,CAAC,IAAI,EAAE,GAAG,GAAG,IAAI;IAK9B,SAAS,CAAC,IAAI,EAAE,GAAG,GAAG,IAAI;IAK1B,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAK3B,WAAW,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAKjC,SAAS,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAK/B,KAAK,CAAC,KAAK,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,GAAG,IAAI;IAK7C,eAAe,CAAC,aAAa,EAAE,MAAM,GAAG,IAAI;IAc5C,OAAO,CAAC,gBAAgB;IA2DxB,OAAO,CAAC,oBAAoB;IA6F5B,MAAM,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG,IAAI;IAwBtC,OAAO,CAAC,eAAe;IAyCvB,MAAM,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,IAAI;CA8FrE;AAED,wBAAgB,SAAS,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,GAAE,gBAAqB,GAAG,SAAS,CAE/E"}