juxscript 1.1.362 → 1.1.363

package/dist/lib/components/select.js

@@ -1,111 +0,0 @@
-import generateId from '../utils/idgen.js';
-import { pageState } from '../state/pageState.js';
-class Select {
-    constructor(id, options = {}) {
-        this._element = null;
-        this._wrapper = null;
-        this._onChange = null;
-        this.id = id || generateId();
-        this.opts = { options: [], ...options };
-    }
-    // Fluent API
-    label(value) { this.opts.label = value; return this; }
-    placeholder(value) { this.opts.placeholder = value; return this; }
-    required(value = true) { this.opts.required = value; return this; }
-    disabled(value = true) { this.opts.disabled = value; return this; }
-    multiple(value = true) { this.opts.multiple = value; return this; }
-    style(value) { this.opts.style = value; return this; }
-    class(value) { this.opts.class = value; return this; }
-    options(opts) {
-        this.opts.options = opts;
-        if (this._element)
-            this._rebuildOptions();
-        return this;
-    }
-    value(val) {
-        this.opts.value = val;
-        if (this._element)
-            this._element.value = val;
-        return this;
-    }
-    onChange(fn) {
-        this._onChange = fn;
-        return this;
-    }
-    getValue() {
-        return this._element?.value ?? this.opts.value ?? '';
-    }
-    getSelectedValues() {
-        if (!this._element)
-            return [];
-        return Array.from(this._element.selectedOptions).map(o => o.value);
-    }
-    _rebuildOptions() {
-        if (!this._element)
-            return;
-        this._element.innerHTML = '';
-        if (this.opts.placeholder) {
-            const ph = document.createElement('option');
-            ph.value = '';
-            ph.textContent = this.opts.placeholder;
-            ph.disabled = true;
-            ph.selected = !this.opts.value;
-            this._element.appendChild(ph);
-        }
-        for (const opt of this.opts.options || []) {
-            const o = document.createElement('option');
-            o.value = opt.value;
-            o.textContent = opt.label;
-            if (opt.disabled)
-                o.disabled = true;
-            if (opt.value === this.opts.value)
-                o.selected = true;
-            this._element.appendChild(o);
-        }
-    }
-    render(target) {
-        const wrapper = document.createElement('div');
-        wrapper.className = 'jux-select';
-        wrapper.id = `${this.id}-wrapper`;
-        if (this.opts.class)
-            wrapper.className += ` ${this.opts.class}`;
-        if (this.opts.style)
-            wrapper.setAttribute('style', this.opts.style);
-        if (this.opts.label) {
-            const labelEl = document.createElement('label');
-            labelEl.htmlFor = this.id;
-            labelEl.textContent = this.opts.label;
-            labelEl.className = 'jux-select-label';
-            wrapper.appendChild(labelEl);
-        }
-        const sel = document.createElement('select');
-        sel.id = this.id;
-        sel.className = 'jux-select-element';
-        if (this.opts.required)
-            sel.required = true;
-        if (this.opts.disabled)
-            sel.disabled = true;
-        if (this.opts.multiple)
-            sel.multiple = true;
-        this._element = sel;
-        this._rebuildOptions();
-        sel.addEventListener('change', (e) => {
-            if (this._onChange)
-                this._onChange(sel.value, e);
-        });
-        wrapper.appendChild(sel);
-        this._wrapper = wrapper;
-        const container = target
-            ? (typeof target === 'string' ? document.getElementById(target) || document.querySelector(target) : target)
-            : document.getElementById('app');
-        container?.appendChild(wrapper);
-        return this;
-    }
-}
-export function select(id, options = {}) {
-    const s = new Select(id, options);
-    s.render();
-    pageState.__register(s);
-    return s;
-}
-export { Select };

package/dist/lib/components/sidebar.d.ts

@@ -1,40 +0,0 @@
-interface MenuItem {
-    id: string;
-    label: string;
-    path: string;
-    icon?: string;
-}
-interface MenuOptions {
-    title?: string;
-    logo?: string;
-    footer?: string;
-    width?: string;
-    target?: string;
-    density?: 'dense' | 'normal' | 'inflated';
-}
-interface MenuApi {
-    id: string;
-    title: (val: string) => MenuApi;
-    logo: (val: string) => MenuApi;
-    footer: (val: string) => MenuApi;
-    width: (val: string) => MenuApi;
-    target: (val: string) => MenuApi;
-    density: (val: 'dense' | 'normal' | 'inflated') => MenuApi;
-    section: (label: string, items: (string | MenuItem)[]) => MenuApi;
-    items: (items: (string | MenuItem)[]) => MenuApi;
-    render: () => MenuApi;
-    addSection: (label: string, items: (string | MenuItem)[]) => MenuApi;
-    setTitle: (val: string) => MenuApi;
-    setFooter: (val: string) => MenuApi;
-    show: () => MenuApi;
-    hide: () => MenuApi;
-    toggle: () => MenuApi;
-    getElement: () => HTMLElement | null;
-}
-type SectionInput = string | {
-    label?: string;
-    items?: (string | MenuItem)[];
-};
-export declare function menu(id: string, sections?: SectionInput[], options?: MenuOptions): MenuApi;
-export {};
-//# sourceMappingURL=sidebar.d.ts.map

package/dist/lib/components/sidebar.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"sidebar.d.ts","sourceRoot":"","sources":["../../../lib/components/sidebar.ts"],"names":[],"mappings":"AAEA,UAAU,QAAQ;IACd,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB;AAOD,UAAU,WAAW;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,UAAU,CAAC;CAC7C;AAYD,UAAU,OAAO;IACb,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC;IAChC,IAAI,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC;IAC/B,MAAM,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC;IACjC,KAAK,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC;IAChC,MAAM,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC;IACjC,OAAO,EAAE,CAAC,GAAG,EAAE,OAAO,GAAG,QAAQ,GAAG,UAAU,KAAK,OAAO,CAAC;IAC3D,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC,MAAM,GAAG,QAAQ,CAAC,EAAE,KAAK,OAAO,CAAC;IAClE,KAAK,EAAE,CAAC,KAAK,EAAE,CAAC,MAAM,GAAG,QAAQ,CAAC,EAAE,KAAK,OAAO,CAAC;IACjD,MAAM,EAAE,MAAM,OAAO,CAAC;IACtB,UAAU,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC,MAAM,GAAG,QAAQ,CAAC,EAAE,KAAK,OAAO,CAAC;IACrE,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC;IACnC,SAAS,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,OAAO,CAAC;IACpC,IAAI,EAAE,MAAM,OAAO,CAAC;IACpB,IAAI,EAAE,MAAM,OAAO,CAAC;IACpB,MAAM,EAAE,MAAM,OAAO,CAAC;IACtB,UAAU,EAAE,MAAM,WAAW,GAAG,IAAI,CAAC;CACxC;AAED,KAAK,YAAY,GAAG,MAAM,GAAG;IAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,CAAC,MAAM,GAAG,QAAQ,CAAC,EAAE,CAAA;CAAE,CAAC;AAE/E,wBAAgB,IAAI,CAAC,EAAE,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,YAAY,EAAE,EAAE,OAAO,CAAC,EAAE,WAAW,GAAG,OAAO,CAgJ1F"}

package/dist/lib/components/sidebar.js

@@ -1,141 +0,0 @@
-import { div, span, nav, pageState } from './tag';
-export function menu(id, sections, options) {
-    const opts = options || {};
-    let _title = opts.title || 'App';
-    let _logo = opts.logo || _title.charAt(0).toUpperCase();
-    let _footer = opts.footer || '';
-    let _width = opts.width || '260px';
-    let _target = opts.target;
-    let _density = opts.density || 'normal';
-    let _sectionCount = 0;
-    let _rendered = false;
-    let _footerRendered = false;
-    const DENSITY = {
-        dense: { headerPad: '10px', itemPad: '4px 10px', labelPad: '6px 10px 2px', footerPad: '8px 12px', gap: '0px', fontSize: '12px', iconSize: '13px' },
-        normal: { headerPad: '16px', itemPad: '8px 12px', labelPad: '8px 12px 4px', footerPad: '12px 16px', gap: '1px', fontSize: '13px', iconSize: '15px' },
-        inflated: { headerPad: '20px', itemPad: '12px 16px', labelPad: '12px 16px 6px', footerPad: '16px 20px', gap: '4px', fontSize: '14px', iconSize: '17px' }
-    };
-    function normalizeItem(item) {
-        if (typeof item === 'string') {
-            const path = item.startsWith('/') ? item : '/' + item;
-            const seg = path.split('/').filter(Boolean).pop() || 'Home';
-            return { id: id + '-' + seg.toLowerCase().replace(/[^a-z0-9]/g, '-'), label: seg.charAt(0).toUpperCase() + seg.slice(1), path: path };
-        }
-        return item;
-    }
-    function normalizeSections(input) {
-        if (!input || !Array.isArray(input) || input.length === 0)
-            return [];
-        const isFlat = input.every((i) => typeof i === 'string' || (typeof i === 'object' && !('items' in i)));
-        if (isFlat)
-            return [{ items: input.map(normalizeItem) }];
-        return input.map((s) => {
-            if (typeof s === 'string')
-                return { items: [normalizeItem(s)] };
-            return { label: s.label, items: (s.items || []).map(normalizeItem) };
-        });
-    }
-    function ensureShell() {
-        if (_rendered)
-            return;
-        _rendered = true;
-        injectStyles();
-        div(id, { class: 'jux-sidebar jux-sidebar--' + _density, style: 'width:' + _width, target: _target });
-        div(id + '-header', { class: 'jux-sidebar-header', target: id });
-        div(id + '-logo', { class: 'jux-sidebar-logo', content: _logo, target: id + '-header' });
-        span(id + '-title', { content: _title, target: id + '-header' });
-    }
-    function renderSection(section) {
-        ensureShell();
-        const i = _sectionCount++;
-        if (i > 0)
-            div(id + '-divider-' + i, { class: 'jux-sidebar-divider', target: id });
-        if (section.label)
-            div(id + '-label-' + i, { class: 'jux-sidebar-label', content: section.label, target: id });
-        nav(id + '-nav-' + i, { target: id, items: section.items });
-    }
-    function renderFooter() {
-        if (_footerRendered || !_footer)
-            return;
-        _footerRendered = true;
-        div(id + '-footer', { class: 'jux-sidebar-footer', content: _footer, target: id });
-    }
-    function injectStyles() {
-        if (document.getElementById('menu-styles'))
-            return;
-        const el = document.createElement('style');
-        el.id = 'menu-styles';
-        el.textContent = '\
-        body { margin: 0; }\
-        .jux-sidebar { display:flex; flex-direction:column; min-height:100vh; background:hsl(var(--card)); color:hsl(var(--card-foreground)); border-right:1px solid hsl(var(--border)); font-family:var(--font-sans,system-ui,sans-serif); }\
-        .jux-sidebar-header { display:flex; align-items:center; gap:8px; font-size:14px; font-weight:600; border-bottom:1px solid hsl(var(--border)); }\
-        .jux-sidebar-logo { width:20px; height:20px; border-radius:6px; background:hsl(var(--primary)); display:flex; align-items:center; justify-content:center; color:hsl(var(--primary-foreground)); font-size:11px; font-weight:700; }\
-        .jux-sidebar-label { font-size:11px; font-weight:500; color:hsl(var(--muted-foreground)); text-transform:uppercase; letter-spacing:0.05em; }\
-        .jux-sidebar-footer { margin-top:auto; border-top:1px solid hsl(var(--border)); font-size:11px; color:hsl(var(--muted-foreground)); }\
-        .jux-sidebar-divider { height:1px; background:hsl(var(--border)); margin:4px 8px; }\
-        .jux-nav-item { display:flex; align-items:center; border-radius:var(--radius,6px); font-weight:500; color:hsl(var(--foreground)); cursor:pointer; transition:background 0.15s; user-select:none; text-decoration:none; }\
-        .jux-nav-item:hover { background:hsl(var(--accent)); color:hsl(var(--accent-foreground)); }\
-        .jux-nav-item--active { background:hsl(var(--accent)); color:hsl(var(--accent-foreground)); font-weight:600; }\
-        .jux-nav-item-icon { text-align:center; flex-shrink:0; }\
-        \
-        .jux-sidebar--dense .jux-sidebar-header { padding:' + DENSITY.dense.headerPad + '; }\
-        .jux-sidebar--dense .jux-sidebar-label { padding:' + DENSITY.dense.labelPad + '; }\
-        .jux-sidebar--dense .jux-sidebar-footer { padding:' + DENSITY.dense.footerPad + '; }\
-        .jux-sidebar--dense .jux-nav-item { padding:' + DENSITY.dense.itemPad + '; margin:' + DENSITY.dense.gap + ' 0; font-size:' + DENSITY.dense.fontSize + '; gap:8px; }\
-        .jux-sidebar--dense .jux-nav-item-icon { width:16px; font-size:' + DENSITY.dense.iconSize + '; }\
-        \
-        .jux-sidebar--normal .jux-sidebar-header { padding:' + DENSITY.normal.headerPad + '; }\
-        .jux-sidebar--normal .jux-sidebar-label { padding:' + DENSITY.normal.labelPad + '; }\
-        .jux-sidebar--normal .jux-sidebar-footer { padding:' + DENSITY.normal.footerPad + '; }\
-        .jux-sidebar--normal .jux-nav-item { padding:' + DENSITY.normal.itemPad + '; margin:' + DENSITY.normal.gap + ' 0; font-size:' + DENSITY.normal.fontSize + '; gap:10px; }\
-        .jux-sidebar--normal .jux-nav-item-icon { width:18px; font-size:' + DENSITY.normal.iconSize + '; }\
-        \
-        .jux-sidebar--inflated .jux-sidebar-header { padding:' + DENSITY.inflated.headerPad + '; }\
-        .jux-sidebar--inflated .jux-sidebar-label { padding:' + DENSITY.inflated.labelPad + '; }\
-        .jux-sidebar--inflated .jux-sidebar-footer { padding:' + DENSITY.inflated.footerPad + '; }\
-        .jux-sidebar--inflated .jux-nav-item { padding:' + DENSITY.inflated.itemPad + '; margin:' + DENSITY.inflated.gap + ' 0; font-size:' + DENSITY.inflated.fontSize + '; gap:12px; }\
-        .jux-sidebar--inflated .jux-nav-item-icon { width:20px; font-size:' + DENSITY.inflated.iconSize + '; }\
-        ';
-        document.head.appendChild(el);
-    }
-    const api = {
-        id: id,
-        title: function (val) { _title = val; return api; },
-        logo: function (val) { _logo = val; return api; },
-        footer: function (val) {
-            _footer = val;
-            if (_rendered)
-                renderFooter();
-            return api;
-        },
-        width: function (val) { _width = val; return api; },
-        target: function (val) { _target = val; return api; },
-        density: function (val) { _density = val; return api; },
-        section: function (label, items) {
-            renderSection({ label: label, items: (items || []).map(normalizeItem) });
-            return api;
-        },
-        items: function (items) {
-            renderSection({ items: (items || []).map(normalizeItem) });
-            return api;
-        },
-        render: function () {
-            ensureShell();
-            renderFooter();
-            return api;
-        },
-        addSection: function (label, items) { return api.section(label, items); },
-        setTitle: function (val) { pageState[id + '-title'].content = val; return api; },
-        setFooter: function (val) { pageState[id + '-footer'].content = val; return api; },
-        show: function () { pageState[id].visible = true; return api; },
-        hide: function () { pageState[id].visible = false; return api; },
-        toggle: function () { pageState[id].visible = !pageState[id].visible; return api; },
-        getElement: function () { return document.getElementById(id); }
-    };
-    if (sections && Array.isArray(sections) && sections.length > 0) {
-        const normalized = normalizeSections(sections);
-        normalized.forEach(renderSection);
-        renderFooter();
-    }
-    return api;
-}

package/dist/lib/components/store.d.ts

@@ -1,78 +0,0 @@
-interface StoreOptions {
-    db: string;
-    table: string;
-    version?: number;
-    keyPath?: string;
-    autoIncrement?: boolean;
-    indexes?: Array<{
-        name: string;
-        keyPath: string | string[];
-        unique?: boolean;
-    }>;
-    auto?: boolean;
-}
-declare class Store {
-    id: string;
-    options: StoreOptions;
-    _element: HTMLElement;
-    private _db;
-    private _value;
-    private _loading;
-    private _error;
-    private _onChange;
-    private _ready;
-    constructor(id: string, options: StoreOptions);
-    private _open;
-    private _tx;
-    private _notifyChange;
-    onChange(fn: (value: any[]) => void): this;
-    getElement(): HTMLElement;
-    getValue(): any[];
-    getLoading(): boolean;
-    getError(): string | null;
-    getCount(): number;
-    setValue(val: any[]): this;
-    getAll(): Promise<any[]>;
-    get(key: IDBValidKey): Promise<any>;
-    query(indexName: string, value: IDBValidKey): Promise<any[]>;
-    put(record: any): Promise<IDBValidKey>;
-    add(record: any): Promise<IDBValidKey>;
-    putMany(records: any[]): Promise<void>;
-    delete(key: IDBValidKey): Promise<void>;
-    clear(): Promise<void>;
-    refresh(): Promise<any[]>;
-}
-/**
- * Create a reactive IndexedDB store that integrates with pageState.
- *
- * @example
- * // Basic usage
- * const todos = await jux.store('todos', { db: 'myapp', table: 'todos' });
- * // pageState['todos'].value → [{ id: 1, text: 'Buy milk', done: false }, ...]
- *
- * // With indexes
- * const users = await jux.store('users', {
- *     db: 'myapp',
- *     table: 'users',
- *     indexes: [{ name: 'by_email', keyPath: 'email', unique: true }]
- * });
- *
- * // Write
- * await pageState['todos'].add({ text: 'New item', done: false });
- * await pageState['todos'].put({ id: 1, text: 'Updated', done: true });
- * await pageState['todos'].delete(1);
- *
- * // Query by index
- * const results = await pageState['users'].query('by_email', 'alice@example.com');
- *
- * // React to changes
- * pageState.__watch(() => {
- *     const items = pageState['todos'].value;
- *     if (items) {
- *         pageState['count'].content = `${items.length} items`;
- *     }
- * });
- */
-export declare function store(id: string, options: StoreOptions): Promise<Store>;
-export { Store, StoreOptions };
-//# sourceMappingURL=store.d.ts.map

package/dist/lib/components/store.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"store.d.ts","sourceRoot":"","sources":["../../../lib/components/store.ts"],"names":[],"mappings":"AAGA,UAAU,YAAY;IAClB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,CAAC,EAAE,KAAK,CAAC;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,OAAO,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;QAAC,MAAM,CAAC,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IAChF,IAAI,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,cAAM,KAAK;IACP,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,YAAY,CAAC;IACtB,QAAQ,EAAE,WAAW,CAAC;IACtB,OAAO,CAAC,GAAG,CAA4B;IACvC,OAAO,CAAC,MAAM,CAAa;IAC3B,OAAO,CAAC,QAAQ,CAAkB;IAClC,OAAO,CAAC,MAAM,CAAuB;IACrC,OAAO,CAAC,SAAS,CAAyC;IAC1D,OAAO,CAAC,MAAM,CAAgB;gBAElB,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,YAAY;IA0B7C,OAAO,CAAC,KAAK;IAgCb,OAAO,CAAC,GAAG;IAOX,OAAO,CAAC,aAAa;IAoBrB,QAAQ,CAAC,EAAE,EAAE,CAAC,KAAK,EAAE,GAAG,EAAE,KAAK,IAAI,GAAG,IAAI;IAK1C,UAAU,IAAI,WAAW;IACzB,QAAQ,IAAI,GAAG,EAAE;IACjB,UAAU,IAAI,OAAO;IACrB,QAAQ,IAAI,MAAM,GAAG,IAAI;IACzB,QAAQ,IAAI,MAAM;IAElB,QAAQ,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI;IAUpB,MAAM,IAAI,OAAO,CAAC,GAAG,EAAE,CAAC;IAwBxB,GAAG,CAAC,GAAG,EAAE,WAAW,GAAG,OAAO,CAAC,GAAG,CAAC;IAWnC,KAAK,CAAC,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,WAAW,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC;IAiB5D,GAAG,CAAC,MAAM,EAAE,GAAG,GAAG,OAAO,CAAC,WAAW,CAAC;IActC,GAAG,CAAC,MAAM,EAAE,GAAG,GAAG,OAAO,CAAC,WAAW,CAAC;IActC,OAAO,CAAC,OAAO,EAAE,GAAG,EAAE,GAAG,OAAO,CAAC,IAAI,CAAC;IAuBtC,MAAM,CAAC,GAAG,EAAE,WAAW,GAAG,OAAO,CAAC,IAAI,CAAC;IAcvC,KAAK,IAAI,OAAO,CAAC,IAAI,CAAC;IAoBtB,OAAO,IAAI,OAAO,CAAC,GAAG,EAAE,CAAC;CAGlC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,wBAAsB,KAAK,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,YAAY,GAAG,OAAO,CAAC,KAAK,CAAC,CAU7E;AAED,OAAO,EAAE,KAAK,EAAE,YAAY,EAAE,CAAC"}

package/dist/lib/components/store.js

@@ -1,248 +0,0 @@
-import generateId from '../utils/idgen.js';
-import { pageState } from '../state/pageState.js';
-class Store {
-    constructor(id, options) {
-        this._db = null;
-        this._value = [];
-        this._loading = false;
-        this._error = null;
-        this._onChange = null;
-        this.id = id || generateId();
-        this.options = {
-            version: 1,
-            keyPath: 'id',
-            autoIncrement: true,
-            auto: true,
-            ...options
-        };
-        // Create a hidden DOM element so pageState can wire events
-        this._element = document.createElement('div');
-        this._element.id = this.id;
-        this._element.setAttribute('data-jux-store', this.options.table);
-        this._element.setAttribute('data-count', '0');
-        this._element.setAttribute('data-loading', 'false');
-        this._element.style.display = 'none';
-        (document.getElementById('app') || document.body).appendChild(this._element);
-        this._ready = this._open();
-    }
-    // ═══════════════════════════════════════════════════════════
-    // INTERNAL: Open / ensure DB
-    // ═══════════════════════════════════════════════════════════
-    _open() {
-        return new Promise((resolve, reject) => {
-            const req = indexedDB.open(this.options.db, this.options.version);
-            req.onupgradeneeded = (e) => {
-                const db = e.target.result;
-                if (!db.objectStoreNames.contains(this.options.table)) {
-                    const store = db.createObjectStore(this.options.table, {
-                        keyPath: this.options.keyPath,
-                        autoIncrement: this.options.autoIncrement
-                    });
-                    if (this.options.indexes) {
-                        for (const idx of this.options.indexes) {
-                            store.createIndex(idx.name, idx.keyPath, { unique: idx.unique ?? false });
-                        }
-                    }
-                }
-            };
-            req.onsuccess = (e) => {
-                this._db = e.target.result;
-                resolve();
-            };
-            req.onerror = (e) => {
-                this._error = `IndexedDB open failed: ${e.target.error?.message}`;
-                console.error(`❌ jux.store('${this.id}'):`, this._error);
-                reject(new Error(this._error));
-            };
-        });
-    }
-    _tx(mode) {
-        if (!this._db)
-            throw new Error('Database not open');
-        return this._db
-            .transaction(this.options.table, mode)
-            .objectStore(this.options.table);
-    }
-    _notifyChange() {
-        // Update DOM element metadata
-        this._element.setAttribute('data-count', String(this._value.length));
-        this._element.setAttribute('data-loading', String(this._loading));
-        if (this._error) {
-            this._element.setAttribute('data-error', this._error);
-        }
-        else {
-            this._element.removeAttribute('data-error');
-        }
-        if (this._onChange)
-            this._onChange(this._value);
-        // Dispatch a real DOM change event — pageState._wireEvent picks this up
-        this._element.dispatchEvent(new Event('change', { bubbles: false }));
-    }
-    // ═══════════════════════════════════════════════════════════
-    // PAGESTATE INTEGRATION
-    // ═══════════════════════════════════════════════════════════
-    onChange(fn) {
-        this._onChange = fn;
-        return this;
-    }
-    getElement() { return this._element; }
-    getValue() { return this._value; }
-    getLoading() { return this._loading; }
-    getError() { return this._error; }
-    getCount() { return this._value.length; }
-    setValue(val) {
-        this._value = val;
-        this._notifyChange();
-        return this;
-    }
-    // ═══════════════════════════════════════════════════════════
-    // READ
-    // ═══════════════════════════════════════════════════════════
-    async getAll() {
-        await this._ready;
-        this._loading = true;
-        this._error = null;
-        return new Promise((resolve, reject) => {
-            const req = this._tx('readonly').getAll();
-            req.onsuccess = () => {
-                this._value = req.result;
-                this._loading = false;
-                this._notifyChange();
-                resolve(this._value);
-            };
-            req.onerror = () => {
-                this._loading = false;
-                this._error = req.error?.message ?? 'getAll failed';
-                this._notifyChange();
-                reject(new Error(this._error));
-            };
-        });
-    }
-    async get(key) {
-        await this._ready;
-        return new Promise((resolve, reject) => {
-            const req = this._tx('readonly').get(key);
-            req.onsuccess = () => resolve(req.result ?? null);
-            req.onerror = () => reject(new Error(req.error?.message ?? 'get failed'));
-        });
-    }
-    async query(indexName, value) {
-        await this._ready;
-        return new Promise((resolve, reject) => {
-            const store = this._tx('readonly');
-            const index = store.index(indexName);
-            const req = index.getAll(value);
-            req.onsuccess = () => resolve(req.result);
-            req.onerror = () => reject(new Error(req.error?.message ?? 'query failed'));
-        });
-    }
-    // ═══════════════════════════════════════════════════════════
-    // WRITE
-    // ═══════════════════════════════════════════════════════════
-    async put(record) {
-        await this._ready;
-        return new Promise((resolve, reject) => {
-            const req = this._tx('readwrite').put(record);
-            req.onsuccess = () => {
-                this.getAll().then(() => resolve(req.result));
-            };
-            req.onerror = () => reject(new Error(req.error?.message ?? 'put failed'));
-        });
-    }
-    async add(record) {
-        await this._ready;
-        return new Promise((resolve, reject) => {
-            const req = this._tx('readwrite').add(record);
-            req.onsuccess = () => {
-                this.getAll().then(() => resolve(req.result));
-            };
-            req.onerror = () => reject(new Error(req.error?.message ?? 'add failed'));
-        });
-    }
-    async putMany(records) {
-        await this._ready;
-        return new Promise((resolve, reject) => {
-            const tx = this._db.transaction(this.options.table, 'readwrite');
-            const store = tx.objectStore(this.options.table);
-            for (const record of records) {
-                store.put(record);
-            }
-            tx.oncomplete = () => {
-                this.getAll().then(() => resolve());
-            };
-            tx.onerror = () => reject(new Error(tx.error?.message ?? 'putMany failed'));
-        });
-    }
-    // ═══════════════════════════════════════════════════════════
-    // DELETE
-    // ═══════════════════════════════════════════════════════════
-    async delete(key) {
-        await this._ready;
-        return new Promise((resolve, reject) => {
-            const req = this._tx('readwrite').delete(key);
-            req.onsuccess = () => {
-                this.getAll().then(() => resolve());
-            };
-            req.onerror = () => reject(new Error(req.error?.message ?? 'delete failed'));
-        });
-    }
-    async clear() {
-        await this._ready;
-        return new Promise((resolve, reject) => {
-            const req = this._tx('readwrite').clear();
-            req.onsuccess = () => {
-                this._value = [];
-                this._notifyChange();
-                resolve();
-            };
-            req.onerror = () => reject(new Error(req.error?.message ?? 'clear failed'));
-        });
-    }
-    // ═══════════════════════════════════════════════════════════
-    // REFRESH (alias for getAll, matches data.ts pattern)
-    // ═══════════════════════════════════════════════════════════
-    async refresh() {
-        return this.getAll();
-    }
-}
-/**
- * Create a reactive IndexedDB store that integrates with pageState.
- *
- * @example
- * // Basic usage
- * const todos = await jux.store('todos', { db: 'myapp', table: 'todos' });
- * // pageState['todos'].value → [{ id: 1, text: 'Buy milk', done: false }, ...]
- *
- * // With indexes
- * const users = await jux.store('users', {
- *     db: 'myapp',
- *     table: 'users',
- *     indexes: [{ name: 'by_email', keyPath: 'email', unique: true }]
- * });
- *
- * // Write
- * await pageState['todos'].add({ text: 'New item', done: false });
- * await pageState['todos'].put({ id: 1, text: 'Updated', done: true });
- * await pageState['todos'].delete(1);
- *
- * // Query by index
- * const results = await pageState['users'].query('by_email', 'alice@example.com');
- *
- * // React to changes
- * pageState.__watch(() => {
- *     const items = pageState['todos'].value;
- *     if (items) {
- *         pageState['count'].content = `${items.length} items`;
- *     }
- * });
- */
-export async function store(id, options) {
-    const s = new Store(id, options);
-    pageState.__register(s);
-    if (options.auto !== false) {
-        await s.getAll();
-        pageState.__register(s);
-    }
-    return s;
-}
-export { Store };

package/dist/lib/components/style.d.ts

@@ -1,27 +0,0 @@
-declare class Style {
-    id: string;
-    private _element;
-    constructor(id: string, css: string);
-    /** Replace the entire stylesheet content */
-    setContent(css: string): this;
-    /** Append additional CSS rules */
-    append(css: string): this;
-    /** Get current CSS content */
-    getContent(): string;
-    /** Remove the style tag from the document */
-    remove(): void;
-    getElement(): HTMLStyleElement;
-}
-/**
- * Inject a CSS string into the document head.
- *
- * @example
- * jux.style('my-styles', `
- *   .sidebar { background: hsl(var(--card)); }
- *   .nav-item:hover { background: hsl(var(--accent)); }
- * `);
- */
-export declare function style(id: string, css: string): Style;
-export { Style };
-export default style;
-//# sourceMappingURL=style.d.ts.map

package/dist/lib/components/style.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"style.d.ts","sourceRoot":"","sources":["../../../lib/components/style.ts"],"names":[],"mappings":"AAEA,cAAM,KAAK;IACP,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,CAAC,QAAQ,CAAmB;gBAEvB,EAAE,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM;IASnC,4CAA4C;IAC5C,UAAU,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAK7B,kCAAkC;IAClC,MAAM,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAKzB,8BAA8B;IAC9B,UAAU,IAAI,MAAM;IAIpB,6CAA6C;IAC7C,MAAM,IAAI,IAAI;IAId,UAAU,IAAI,gBAAgB;CAGjC;AAED;;;;;;;;GAQG;AACH,wBAAgB,KAAK,CAAC,EAAE,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,KAAK,CAQpD;AAED,OAAO,EAAE,KAAK,EAAE,CAAC;AACjB,eAAe,KAAK,CAAC"}