juxscript 1.1.342 → 1.1.343

package/dist/lib/state/pageState.js

@@ -1,360 +0,0 @@
-// Tracks which reactive block is currently running so we can record dependencies
-let activeReaction = null;
-const reactionDeps = new Map();
-let notifyQueue = [];
-let isNotifying = false;
-class PageState {
-    constructor() {
-        this._registry = new Map();
-        this._nullProxy = new Proxy({}, {
-            get: (_, prop) => {
-                if (typeof prop === 'symbol')
-                    return undefined;
-                return undefined;
-            },
-            set: () => true
-        });
-        this._proxy = new Proxy({}, {
-            get: (_, id) => {
-                if (typeof id === 'symbol')
-                    return undefined;
-                if (id === '__register')
-                    return this._register.bind(this);
-                if (id === '__watch')
-                    return this._watch.bind(this);
-                if (id === '__unregister')
-                    return this._unregister.bind(this);
-                if (id === '__notify')
-                    return this._notify.bind(this);
-                if (id === '__keys')
-                    return () => Array.from(this._registry.keys());
-                const entry = this._registry.get(id);
-                if (!entry)
-                    return this._nullProxy;
-                return this._createComponentProxy(id, entry);
-            },
-            set: (_, id, value) => {
-                if (typeof id === 'symbol')
-                    return false;
-                if (value && typeof value === 'object' && value.id) {
-                    this._register(value);
-                    return true;
-                }
-                return false;
-            }
-        });
-    }
-    _createComponentProxy(id, entry) {
-        return new Proxy({}, {
-            get: (_, prop) => {
-                if (typeof prop === 'symbol')
-                    return undefined;
-                const depKey = `${id}.${prop}`;
-                if (activeReaction) {
-                    if (!reactionDeps.has(activeReaction)) {
-                        reactionDeps.set(activeReaction, new Set());
-                    }
-                    reactionDeps.get(activeReaction).add(depKey);
-                }
-                // Event flags
-                if (prop in entry.events) {
-                    return entry.events[prop];
-                }
-                // Component props
-                if (prop in entry.props) {
-                    return entry.props[prop];
-                }
-                // Special: files for file inputs
-                if (prop === 'files') {
-                    const comp = entry.component;
-                    if (typeof comp.getFiles === 'function') {
-                        return comp.getFiles();
-                    }
-                }
-                // Component methods
-                const comp = entry.component;
-                if (typeof comp[prop] === 'function') {
-                    return comp[prop].bind(comp);
-                }
-                // Getter pattern
-                const getterName = `get${prop.charAt(0).toUpperCase()}${prop.slice(1)}`;
-                if (typeof comp[getterName] === 'function') {
-                    return comp[getterName]();
-                }
-                if (prop in comp) {
-                    return comp[prop];
-                }
-                return undefined;
-            },
-            set: (_, prop, value) => {
-                if (typeof prop === 'symbol')
-                    return false;
-                const depKey = `${id}.${prop}`;
-                const comp = entry.component;
-                // Try setXxx first (e.g. setValue, setContent, setClass)
-                const setterName = `set${prop.charAt(0).toUpperCase()}${prop.slice(1)}`;
-                if (typeof comp[setterName] === 'function') {
-                    comp[setterName](value);
-                }
-                // Fallback: direct DOM manipulation for known props
-                else if (prop === 'value') {
-                    if (typeof comp.setValue === 'function') {
-                        comp.setValue(value);
-                    }
-                    else {
-                        const el = this._findElement(comp);
-                        if (el && 'value' in el) {
-                            el.value = value;
-                        }
-                    }
-                }
-                else if (prop === 'content') {
-                    if (typeof comp.setContent === 'function') {
-                        comp.setContent(value);
-                    }
-                    else {
-                        // Direct DOM update for elements that don't have setContent
-                        const el = this._findElement(comp);
-                        if (el) {
-                            el.textContent = value;
-                        }
-                    }
-                }
-                else if (prop === 'innerHTML') {
-                    if (typeof comp.setInnerHTML === 'function') {
-                        comp.setInnerHTML(value);
-                    }
-                    else {
-                        const el = this._findElement(comp);
-                        if (el) {
-                            el.innerHTML = value;
-                        }
-                    }
-                }
-                else if (prop === 'visible') {
-                    // Prefer wrapper (hides label + input together), fall back to element
-                    let target = null;
-                    if (comp._wrapper instanceof HTMLElement) {
-                        target = comp._wrapper;
-                    }
-                    else {
-                        target = this._findElement(comp);
-                    }
-                    if (target) {
-                        target.style.display = value ? '' : 'none';
-                    }
-                }
-                // Update tracked props
-                entry.props[prop] = value;
-                // Notify listeners
-                this._notify(depKey);
-                return true;
-            }
-        });
-    }
-    _register(component) {
-        const id = component.id;
-        if (!id)
-            return;
-        // Check if already registered — preserve event listeners
-        const existing = this._registry.get(id);
-        if (existing) {
-            // Update component reference and re-seed props
-            existing.component = component;
-            if (component.getValue)
-                existing.props.value = component.getValue();
-            if (component.getContent)
-                existing.props.content = component.getContent();
-            if (component.getValues)
-                existing.props.values = component.getValues();
-            return;
-        }
-        const entry = {
-            component,
-            props: {},
-            events: {},
-            listeners: new Map()
-        };
-        // Seed initial props
-        if (component.getValue)
-            entry.props.value = component.getValue();
-        if (component.getContent)
-            entry.props.content = component.getContent();
-        if (component.getValues)
-            entry.props.values = component.getValues();
-        // Seed visibility — default true
-        entry.props.visible = true;
-        if (component.opts || component.options) {
-            const opts = component.opts || component.options;
-            if ('disabled' in opts)
-                entry.props.disabled = opts.disabled;
-            if ('required' in opts)
-                entry.props.required = opts.required;
-            if ('type' in opts)
-                entry.props.type = opts.type;
-        }
-        entry.props.id = id;
-        this._registry.set(id, entry);
-        // Wire onChange — use internal callback pattern, don't replace
-        if (typeof component.onChange === 'function') {
-            component.onChange((val, e) => {
-                if (Array.isArray(val)) {
-                    entry.props.values = val;
-                    this._notify(`${id}.values`);
-                }
-                else if (typeof val === 'boolean') {
-                    entry.props.checked = val;
-                    this._notify(`${id}.checked`);
-                }
-                else {
-                    entry.props.value = val;
-                    this._notify(`${id}.value`);
-                }
-            });
-        }
-        // Wire DOM events
-        for (const eventName of PageState.WIRE_EVENTS) {
-            this._wireEvent(id, entry, eventName);
-        }
-        // Wire composite state flags: hover, active, focused
-        this._wireStateFlag(id, entry, 'hover', 'mouseenter', 'mouseleave');
-        this._wireStateFlag(id, entry, 'active', 'mousedown', 'mouseup');
-        this._wireStateFlag(id, entry, 'focused', 'focus', 'blur');
-    }
-    _wireEvent(id, entry, eventName) {
-        entry.events[eventName] = false;
-        const el = this._findElement(entry.component);
-        if (!el)
-            return;
-        el.addEventListener(eventName, (e) => {
-            entry.events[eventName] = true;
-            if ((eventName === 'input' || eventName === 'change') && el instanceof HTMLInputElement) {
-                entry.props.value = el.value;
-            }
-            if ((eventName === 'input' || eventName === 'change') && el instanceof HTMLSelectElement) {
-                entry.props.value = el.value;
-            }
-            // For non-input elements (e.g. Store's hidden div), sync value from component
-            if (eventName === 'change' && !(el instanceof HTMLInputElement) && !(el instanceof HTMLSelectElement)) {
-                const comp = entry.component;
-                if (typeof comp.getValue === 'function') {
-                    entry.props.value = comp.getValue();
-                }
-            }
-            this._notify(`${id}.${eventName}`);
-            queueMicrotask(() => {
-                entry.events[eventName] = false;
-            });
-        });
-    }
-    _findElement(component) {
-        if (component._element instanceof HTMLElement)
-            return component._element;
-        if (typeof component.getElement === 'function') {
-            const el = component.getElement();
-            if (el instanceof HTMLElement)
-                return el;
-        }
-        if (component._wrapper instanceof HTMLElement) {
-            const input = component._wrapper.querySelector('input, select, textarea, button');
-            if (input)
-                return input;
-            return component._wrapper;
-        }
-        if (component.id && typeof document !== 'undefined') {
-            const el = document.getElementById(component.id);
-            if (el)
-                return el;
-        }
-        return null;
-    }
-    _wireStateFlag(id, entry, flagName, onEvent, offEvent) {
-        entry.events[flagName] = false;
-        const el = this._findElement(entry.component);
-        if (!el)
-            return;
-        el.addEventListener(onEvent, () => {
-            entry.events[flagName] = true;
-            this._notify(`${id}.${flagName}`);
-        });
-        el.addEventListener(offEvent, () => {
-            entry.events[flagName] = false;
-            this._notify(`${id}.${flagName}`);
-        });
-    }
-    _unregister(id) {
-        this._registry.delete(id);
-    }
-    _notify(depKey) {
-        notifyQueue.push(depKey);
-        // Prevent re-entrant notification loops
-        if (isNotifying)
-            return;
-        isNotifying = true;
-        const eventKeysToReset = [];
-        try {
-            while (notifyQueue.length > 0) {
-                const key = notifyQueue.shift();
-                // For event-style keys, set the flag before firing reactions
-                const dotIdx = key.indexOf('.');
-                if (dotIdx > -1) {
-                    const id = key.substring(0, dotIdx);
-                    const prop = key.substring(dotIdx + 1);
-                    const entry = this._registry.get(id);
-                    if (entry && prop in entry.events) {
-                        entry.events[prop] = true;
-                        eventKeysToReset.push({ entry, prop });
-                    }
-                }
-                for (const [reaction, deps] of reactionDeps.entries()) {
-                    if (deps.has(key)) {
-                        reaction();
-                    }
-                }
-            }
-        }
-        finally {
-            isNotifying = false;
-            // Reset all event flags after all reactions have run
-            for (const { entry, prop } of eventKeysToReset) {
-                queueMicrotask(() => {
-                    entry.events[prop] = false;
-                });
-            }
-        }
-    }
-    _watch(fn) {
-        const reaction = () => {
-            reactionDeps.set(reaction, new Set());
-            activeReaction = reaction;
-            try {
-                const result = fn();
-                if (result && typeof result.catch === 'function') {
-                    result.catch((err) => {
-                        console.error('[pageState] async watch error:', err);
-                    });
-                }
-            }
-            finally {
-                activeReaction = null;
-            }
-        };
-        reaction();
-    }
-    getProxy() {
-        return this._proxy;
-    }
-}
-PageState.WIRE_EVENTS = [
-    'blur', 'focus',
-    'click', 'dblclick',
-    'change', 'input',
-    'keydown', 'keyup', 'keypress',
-    'mouseenter', 'mouseleave',
-    'mousedown', 'mouseup',
-    'submit'
-];
-// Singleton
-const _instance = new PageState();
-export const pageState = _instance.getProxy();
-export { PageState };

package/dist/lib/utils/codeHighlight.d.ts

@@ -1,7 +0,0 @@
-/**
- * Lightweight syntax highlighter for JS/TS code blocks.
- * Returns HTML string with <span class="jux-hl-xxx"> wrappers.
- */
-export declare function highlightCode(code: string): string;
-export default highlightCode;
-//# sourceMappingURL=codeHighlight.d.ts.map

package/dist/lib/utils/codeHighlight.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"codeHighlight.d.ts","sourceRoot":"","sources":["../../../lib/utils/codeHighlight.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAcH,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAmFlD;AAED,eAAe,aAAa,CAAC"}

package/dist/lib/utils/codeHighlight.js

@@ -1,105 +0,0 @@
-/**
- * Lightweight syntax highlighter for JS/TS code blocks.
- * Returns HTML string with <span class="jux-hl-xxx"> wrappers.
- */
-const KEYWORDS = new Set([
-    'const', 'let', 'var', 'function', 'return', 'if', 'else', 'for', 'while', 'do',
-    'switch', 'case', 'break', 'continue', 'new', 'delete', 'typeof', 'instanceof',
-    'import', 'export', 'from', 'default', 'class', 'extends', 'super', 'this',
-    'try', 'catch', 'finally', 'throw', 'async', 'await', 'yield',
-    'true', 'false', 'null', 'undefined', 'void', 'of', 'in'
-]);
-function escapeHtml(str) {
-    return str.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
-}
-export function highlightCode(code) {
-    const out = [];
-    let i = 0;
-    const len = code.length;
-    while (i < len) {
-        const ch = code[i];
-        // Single-line comment
-        if (ch === '/' && code[i + 1] === '/') {
-            let end = code.indexOf('\n', i);
-            if (end === -1)
-                end = len;
-            out.push(`<span class="jux-hl-comment">${escapeHtml(code.slice(i, end))}</span>`);
-            i = end;
-            continue;
-        }
-        // Multi-line comment
-        if (ch === '/' && code[i + 1] === '*') {
-            let end = code.indexOf('*/', i + 2);
-            if (end === -1)
-                end = len;
-            else
-                end += 2;
-            out.push(`<span class="jux-hl-comment">${escapeHtml(code.slice(i, end))}</span>`);
-            i = end;
-            continue;
-        }
-        // Strings (single, double, backtick)
-        if (ch === '"' || ch === "'" || ch === '`') {
-            const quote = ch;
-            let j = i + 1;
-            while (j < len) {
-                if (code[j] === '\\') {
-                    j += 2;
-                    continue;
-                }
-                if (code[j] === quote) {
-                    j++;
-                    break;
-                }
-                j++;
-            }
-            out.push(`<span class="jux-hl-string">${escapeHtml(code.slice(i, j))}</span>`);
-            i = j;
-            continue;
-        }
-        // Numbers
-        if (/[0-9]/.test(ch) && (i === 0 || !/[a-zA-Z_$]/.test(code[i - 1]))) {
-            let j = i;
-            while (j < len && /[0-9a-fA-FxXoObB._]/.test(code[j]))
-                j++;
-            out.push(`<span class="jux-hl-number">${escapeHtml(code.slice(i, j))}</span>`);
-            i = j;
-            continue;
-        }
-        // Identifiers / keywords
-        if (/[a-zA-Z_$]/.test(ch)) {
-            let j = i;
-            while (j < len && /[a-zA-Z0-9_$]/.test(code[j]))
-                j++;
-            const word = code.slice(i, j);
-            if (KEYWORDS.has(word)) {
-                out.push(`<span class="jux-hl-keyword">${escapeHtml(word)}</span>`);
-            }
-            else {
-                // Check if it's a function call
-                let k = j;
-                while (k < len && code[k] === ' ')
-                    k++;
-                if (code[k] === '(') {
-                    out.push(`<span class="jux-hl-fn">${escapeHtml(word)}</span>`);
-                }
-                else {
-                    out.push(`<span class="jux-hl-ident">${escapeHtml(word)}</span>`);
-                }
-            }
-            i = j;
-            continue;
-        }
-        // Punctuation / operators
-        if (/[{}()\[\];,.:?!<>=+\-*/%&|^~@#]/.test(ch)) {
-            out.push(`<span class="jux-hl-punct">${escapeHtml(ch)}</span>`);
-            i++;
-            continue;
-        }
-        // Whitespace & everything else
-        out.push(escapeHtml(ch));
-        i++;
-    }
-    return out.join('');
-}
-export default highlightCode;

package/dist/lib/utils/codeparser.d.ts

@@ -1,29 +0,0 @@
-export interface ParsedLine {
-    lineNumber: number;
-    html: string;
-    raw: string;
-}
-/**
- * Escape HTML entities
- */
-declare function escapeHtml(text: string): string;
-/**
- * Parse code into lines - CHARACTER-BY-CHARACTER TOKENIZATION
- */
-export declare function parseCode(code: string, language?: string): ParsedLine[];
-/**
- * Render a parsed line
- */
-export declare function renderLineWithTokens(parsedLine: ParsedLine): string;
-/**
- * Generate CSS for syntax highlighting
- */
-export declare function getSyntaxHighlightCSS(): string;
-declare const _default: {
-    parse: typeof parseCode;
-    renderLine: typeof renderLineWithTokens;
-    getCSS: typeof getSyntaxHighlightCSS;
-    escapeHtml: typeof escapeHtml;
-};
-export default _default;
-//# sourceMappingURL=codeparser.d.ts.map

package/dist/lib/utils/codeparser.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"codeparser.d.ts","sourceRoot":"","sources":["../../../lib/utils/codeparser.ts"],"names":[],"mappings":"AA2DA,MAAM,WAAW,UAAU;IACvB,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;CACf;AAED;;GAEG;AACH,iBAAS,UAAU,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAOxC;AAED;;GAEG;AACH,wBAAgB,SAAS,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,GAAE,MAAqB,GAAG,UAAU,EAAE,CAQrF;AAuPD;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,UAAU,EAAE,UAAU,GAAG,MAAM,CAEnE;AAED;;GAEG;AACH,wBAAgB,qBAAqB,IAAI,MAAM,CAyD9C;;;;;;;AAED,wBAKE"}