@avento-space/ts-ui 1.0.0 → 1.1.1

package/dist/components/box.wc.d.ts

@@ -0,0 +1,24 @@
+import { UElement } from '../core/element.js';
+export type BoxAs = 'div' | 'span' | 'section' | 'article' | 'aside' | 'main' | 'header' | 'footer' | 'nav' | 'ul' | 'ol' | 'li' | 'p' | 'a' | 'form' | 'fieldset';
+export interface BoxProps {
+    as?: BoxAs | string;
+    class?: string;
+    id?: string;
+    hidden?: boolean;
+    title?: string;
+    role?: string;
+    tabIndex?: number;
+}
+export declare class UBox extends UElement {
+    static get observedAttributes(): string[];
+    private _as;
+    constructor();
+    get as(): string;
+    set as(val: string);
+    connectedCallback(): void;
+    attributeChangedCallback(name: string, oldVal: string | null, newVal: string | null): void;
+    private _rebuild;
+    private _sync;
+    _mount(): void;
+}
+//# sourceMappingURL=box.wc.d.ts.map

package/dist/components/box.wc.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"box.wc.d.ts","sourceRoot":"","sources":["../../src/components/box.wc.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAG9C,MAAM,MAAM,KAAK,GAAG,KAAK,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,GAAG,QAAQ,GAAG,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,MAAM,GAAG,UAAU,CAAC;AAEnK,MAAM,WAAW,QAAQ;IACvB,EAAE,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,qBAAa,IAAK,SAAQ,QAAQ;IAChC,MAAM,KAAK,kBAAkB,IAAI,MAAM,EAAE,CAExC;IAED,OAAO,CAAC,GAAG,CAAiB;;IAO5B,IAAI,EAAE,IAAI,MAAM,CAAqB;IACrC,IAAI,EAAE,CAAC,GAAG,EAAE,MAAM,EAAmC;IAErD,iBAAiB,IAAI,IAAI;IAKzB,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAQ1F,OAAO,CAAC,QAAQ;IAoBhB,OAAO,CAAC,KAAK;IAOb,MAAM,IAAI,IAAI;CACf"}

package/dist/components/box.wc.js

@@ -0,0 +1,52 @@
+import { UElement } from '../core/element.js';
+import { boxStyles } from './styles.js';
+export class UBox extends UElement {
+    static get observedAttributes() {
+        return ['as'];
+    }
+    constructor() {
+        super();
+        this._as = 'div';
+        this._root.innerHTML = `<style>${boxStyles}</style><div part="box"><slot></slot></div>`;
+    }
+    get as() { return this._as; }
+    set as(val) { this.setAttribute('as', val); }
+    connectedCallback() {
+        super.connectedCallback();
+        this._sync();
+    }
+    attributeChangedCallback(name, oldVal, newVal) {
+        if (oldVal === newVal)
+            return;
+        if (name === 'as') {
+            this._as = newVal ?? 'div';
+            this._rebuild();
+        }
+    }
+    _rebuild() {
+        const children = [];
+        const existing = this._root.querySelector('[part="box"]');
+        if (existing) {
+            const slot = existing.querySelector('slot');
+            if (slot) {
+                const assigned = slot.assignedNodes({ flatten: true });
+                for (const n of assigned)
+                    children.push(n.cloneNode(true));
+            }
+        }
+        const wrapper = document.createElement(this._as);
+        wrapper.setAttribute('part', 'box');
+        const newSlot = document.createElement('slot');
+        wrapper.appendChild(newSlot);
+        this._root.innerHTML = `<style>${boxStyles}</style>`;
+        this._root.appendChild(wrapper);
+    }
+    _sync() {
+        const inner = this._root.querySelector('[part="box"]');
+        if (!inner || inner.tagName.toLowerCase() !== this._as) {
+            this._rebuild();
+        }
+    }
+    _mount() { }
+}
+//# sourceMappingURL=box.wc.js.map

package/dist/components/box.wc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"box.wc.js","sourceRoot":"","sources":["../../src/components/box.wc.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAcxC,MAAM,OAAO,IAAK,SAAQ,QAAQ;IAChC,MAAM,KAAK,kBAAkB;QAC3B,OAAO,CAAC,IAAI,CAAC,CAAC;IAChB,CAAC;IAID;QACE,KAAK,EAAE,CAAC;QAHF,QAAG,GAAW,KAAK,CAAC;QAI1B,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,UAAU,SAAS,6CAA6C,CAAC;IAC1F,CAAC;IAED,IAAI,EAAE,KAAa,OAAO,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC;IACrC,IAAI,EAAE,CAAC,GAAW,IAAI,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC;IAErD,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,KAAK,EAAE,CAAC;IACf,CAAC;IAED,wBAAwB,CAAC,IAAY,EAAE,MAAqB,EAAE,MAAqB;QACjF,IAAI,MAAM,KAAK,MAAM;YAAE,OAAO;QAC9B,IAAI,IAAI,KAAK,IAAI,EAAE,CAAC;YAClB,IAAI,CAAC,GAAG,GAAG,MAAM,IAAI,KAAK,CAAC;YAC3B,IAAI,CAAC,QAAQ,EAAE,CAAC;QAClB,CAAC;IACH,CAAC;IAEO,QAAQ;QACd,MAAM,QAAQ,GAAW,EAAE,CAAC;QAC5B,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;QAC1D,IAAI,QAAQ,EAAE,CAAC;YACb,MAAM,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;YAC5C,IAAI,IAAI,EAAE,CAAC;gBACT,MAAM,QAAQ,GAAG,IAAI,CAAC,aAAa,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;gBACvD,KAAK,MAAM,CAAC,IAAI,QAAQ;oBAAE,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC;YAC7D,CAAC;QACH,CAAC;QAED,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACjD,OAAO,CAAC,YAAY,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;QACpC,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;QAC/C,OAAO,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;QAE7B,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,UAAU,SAAS,UAAU,CAAC;QACrD,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;IAClC,CAAC;IAEO,KAAK;QACX,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;QACvD,IAAI,CAAC,KAAK,IAAI,KAAK,CAAC,OAAO,CAAC,WAAW,EAAE,KAAK,IAAI,CAAC,GAAG,EAAE,CAAC;YACvD,IAAI,CAAC,QAAQ,EAAE,CAAC;QAClB,CAAC;IACH,CAAC;IAED,MAAM,KAAU,CAAC;CAClB"}

package/dist/components/button.wc.d.ts

@@ -0,0 +1,32 @@
+import { UElement } from '../core/element.js';
+export interface ButtonProps {
+    variant?: 'primary' | 'secondary' | 'ghost' | 'danger';
+    size?: 'sm' | 'md' | 'lg';
+    disabled?: boolean;
+    type?: 'button' | 'submit' | 'reset';
+    class?: string;
+    onClick?: (e: MouseEvent) => void;
+}
+export declare class UButton extends UElement {
+    static get observedAttributes(): string[];
+    private _variant;
+    private _size;
+    private _disabled;
+    private _buttonType;
+    constructor();
+    get variant(): string;
+    set variant(val: string);
+    get size(): string;
+    set size(val: string);
+    get disabled(): boolean;
+    set disabled(val: boolean);
+    get buttonType(): string;
+    set buttonType(val: string);
+    private _updateAttr;
+    attributeChangedCallback(name: string, oldVal: string | null, newVal: string | null): void;
+    connectedCallback(): void;
+    private _sync;
+    _mount(): void;
+}
+export declare function Button(props?: ButtonProps): UButton;
+//# sourceMappingURL=button.wc.d.ts.map

package/dist/components/button.wc.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.wc.d.ts","sourceRoot":"","sources":["../../src/components/button.wc.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAG9C,MAAM,WAAW,WAAW;IAC1B,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,OAAO,GAAG,QAAQ,CAAC;IACvD,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;CACnC;AAED,qBAAa,OAAQ,SAAQ,QAAQ;IACnC,MAAM,KAAK,kBAAkB,IAAI,MAAM,EAAE,CAExC;IAED,OAAO,CAAC,QAAQ,CAAqB;IACrC,OAAO,CAAC,KAAK,CAAgB;IAC7B,OAAO,CAAC,SAAS,CAAkB;IACnC,OAAO,CAAC,WAAW,CAAoB;;IAOvC,IAAI,OAAO,IAAI,MAAM,CAA0B;IAC/C,IAAI,OAAO,CAAC,GAAG,EAAE,MAAM,EAA4D;IACnF,IAAI,IAAI,IAAI,MAAM,CAAuB;IACzC,IAAI,IAAI,CAAC,GAAG,EAAE,MAAM,EAAsD;IAC1E,IAAI,QAAQ,IAAI,OAAO,CAA2B;IAClD,IAAI,QAAQ,CAAC,GAAG,EAAE,OAAO,EAA0E;IACnG,IAAI,UAAU,IAAI,MAAM,CAA6B;IACrD,IAAI,UAAU,CAAC,GAAG,EAAE,MAAM,EAA4D;IAEtF,OAAO,CAAC,WAAW;IAKnB,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAW1F,iBAAiB,IAAI,IAAI;IAKzB,OAAO,CAAC,KAAK;IASb,MAAM,IAAI,IAAI;CAOf;AAED,wBAAgB,MAAM,CAAC,KAAK,GAAE,WAAgB,GAAG,OAAO,CAQvD"}

package/dist/components/button.wc.js

@@ -0,0 +1,91 @@
+import { UElement } from '../core/element.js';
+import { buttonStyles } from './styles.js';
+export class UButton extends UElement {
+    static get observedAttributes() {
+        return ['variant', 'size', 'disabled', 'type'];
+    }
+    constructor() {
+        super();
+        this._variant = 'primary';
+        this._size = 'md';
+        this._disabled = false;
+        this._buttonType = 'button';
+        this._root.innerHTML = `<style>${buttonStyles}</style><button part="button"><slot></slot></button>`;
+    }
+    get variant() { return this._variant; }
+    set variant(val) { this._variant = val; this._updateAttr('variant', val); }
+    get size() { return this._size; }
+    set size(val) { this._size = val; this._updateAttr('size', val); }
+    get disabled() { return this._disabled; }
+    set disabled(val) { this._disabled = val; this._updateAttr('disabled', val ? '' : null); }
+    get buttonType() { return this._buttonType; }
+    set buttonType(val) { this._buttonType = val; this._updateAttr('type', val); }
+    _updateAttr(name, val) {
+        if (val === null) {
+            this.removeAttribute(name);
+        }
+        else {
+            this.setAttribute(name, val);
+        }
+    }
+    attributeChangedCallback(name, oldVal, newVal) {
+        if (oldVal === newVal)
+            return;
+        switch (name) {
+            case 'variant':
+                this._variant = newVal ?? 'primary';
+                break;
+            case 'size':
+                this._size = newVal ?? 'md';
+                break;
+            case 'disabled':
+                this._disabled = newVal !== null;
+                break;
+            case 'type':
+                this._buttonType = newVal ?? 'button';
+                break;
+        }
+        this._sync();
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this._sync();
+    }
+    _sync() {
+        const btn = this._root.querySelector('button');
+        btn.className = `btn btn-${this._variant} btn-${this._size}`;
+        btn.disabled = this._disabled;
+        btn.type = this._buttonType;
+        if (this._disabled) {
+            this.setAttribute('disabled', '');
+        }
+        else {
+            this.removeAttribute('disabled');
+        }
+    }
+    _mount() {
+        const btn = this._root.querySelector('button');
+        btn.addEventListener('click', (e) => {
+            if (this._disabled) {
+                e.stopPropagation();
+                return;
+            }
+            this.dispatchEvent(new CustomEvent('u-click', { bubbles: true, composed: true }));
+        });
+    }
+}
+export function Button(props = {}) {
+    const el = new UButton();
+    if (props.variant)
+        el.variant = props.variant;
+    if (props.size)
+        el.size = props.size;
+    if (props.disabled != null)
+        el.disabled = props.disabled;
+    if (props.type)
+        el.buttonType = props.type;
+    if (props.onClick)
+        el.addEventListener('click', props.onClick);
+    return el;
+}
+//# sourceMappingURL=button.wc.js.map

package/dist/components/button.wc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.wc.js","sourceRoot":"","sources":["../../src/components/button.wc.ts"],"names":[],"mappings":"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"}

package/dist/components/index.d.ts

@@ -1,9 +1,11 @@
-export { Button } from './button.js';
-export type { ButtonProps } from './button.js';
-export { Input, createControlledInput } from './input.js';
-export type { InputProps } from './input.js';
-export { List, VirtualList } from './list.js';
-export type { ListProps, VirtualListProps } from './list.js';
-export { Portal, setPortalRoot } from './portal.js';
-export type { PortalProps } from './portal.js';
+export { UButton } from './button.wc.js';
+export type { ButtonProps } from './button.wc.js';
+export { UInput, createControlledInput } from './input.wc.js';
+export type { InputProps } from './input.wc.js';
+export { UBox } from './box.wc.js';
+export type { BoxProps, BoxAs } from './box.wc.js';
+export { UList, UVirtualList } from './list.wc.js';
+export type { ListProps, VirtualListProps } from './list.wc.js';
+export { UPortal, setPortalRoot } from './portal.wc.js';
+export type { PortalProps } from './portal.wc.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,YAAY,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAC;AAC1D,YAAY,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAC7C,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAC9C,YAAY,EAAE,SAAS,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAC7D,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AACpD,YAAY,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AACzC,YAAY,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAC9D,YAAY,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AACnC,YAAY,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AACnD,YAAY,EAAE,SAAS,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAChE,OAAO,EAAE,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AACxD,YAAY,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/components/index.js

@@ -1,5 +1,6 @@
-export { Button } from './button.js';
-export { Input, createControlledInput } from './input.js';
-export { List, VirtualList } from './list.js';
-export { Portal, setPortalRoot } from './portal.js';
+export { UButton } from './button.wc.js';
+export { UInput, createControlledInput } from './input.wc.js';
+export { UBox } from './box.wc.js';
+export { UList, UVirtualList } from './list.wc.js';
+export { UPortal, setPortalRoot } from './portal.wc.js';
 //# sourceMappingURL=index.js.map

package/dist/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,KAAK,EAAE,qBAAqB,EAAE,MAAM,YAAY,CAAC;AAE1D,OAAO,EAAE,IAAI,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAE9C,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAEzC,OAAO,EAAE,MAAM,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAE9D,OAAO,EAAE,IAAI,EAAE,MAAM,aAAa,CAAC;AAEnC,OAAO,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAEnD,OAAO,EAAE,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/components/input.wc.d.ts

@@ -0,0 +1,45 @@
+import { UElement } from '../core/element.js';
+export interface InputProps {
+    value?: string;
+    placeholder?: string;
+    disabled?: boolean;
+    readonly?: boolean;
+    type?: 'text' | 'password' | 'email' | 'number' | 'search' | 'tel' | 'url';
+    name?: string;
+    class?: string;
+    onInput?: (value: string) => void;
+    onChange?: (value: string) => void;
+    onFocus?: () => void;
+    onBlur?: () => void;
+}
+export declare class UInput extends UElement {
+    static get observedAttributes(): string[];
+    private _placeholder;
+    private _disabled;
+    private _readonly;
+    private _inputType;
+    private _inputName;
+    constructor();
+    get value(): string;
+    set value(val: string);
+    get placeholder(): string;
+    set placeholder(val: string);
+    get disabled(): boolean;
+    set disabled(val: boolean);
+    get readonly(): boolean;
+    set readonly(val: boolean);
+    get inputType(): string;
+    set inputType(val: string);
+    get inputName(): string;
+    set inputName(val: string);
+    connectedCallback(): void;
+    attributeChangedCallback(name: string, oldVal: string | null, newVal: string | null): void;
+    private _sync;
+    _mount(): void;
+}
+export declare function createControlledInput(initialValue?: string): {
+    component: (props?: Omit<InputProps, "value" | "onInput">) => UInput;
+    value: import("../index.js").WritableSignal<string>;
+    reset: () => void;
+};
+//# sourceMappingURL=input.wc.d.ts.map

package/dist/components/input.wc.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.wc.d.ts","sourceRoot":"","sources":["../../src/components/input.wc.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAI9C,MAAM,WAAW,UAAU;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,OAAO,GAAG,QAAQ,GAAG,QAAQ,GAAG,KAAK,GAAG,KAAK,CAAC;IAC3E,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,qBAAa,MAAO,SAAQ,QAAQ;IAClC,MAAM,KAAK,kBAAkB,IAAI,MAAM,EAAE,CAExC;IAED,OAAO,CAAC,YAAY,CAAc;IAClC,OAAO,CAAC,SAAS,CAAkB;IACnC,OAAO,CAAC,SAAS,CAAkB;IACnC,OAAO,CAAC,UAAU,CAAkB;IACpC,OAAO,CAAC,UAAU,CAAc;;IAOhC,IAAI,KAAK,IAAI,MAAM,CAElB;IACD,IAAI,KAAK,CAAC,GAAG,EAAE,MAAM,EAGpB;IAED,IAAI,WAAW,IAAI,MAAM,CAA8B;IACvD,IAAI,WAAW,CAAC,GAAG,EAAE,MAAM,EAAqE;IAEhG,IAAI,QAAQ,IAAI,OAAO,CAA2B;IAClD,IAAI,QAAQ,CAAC,GAAG,EAAE,OAAO,EAIxB;IAED,IAAI,QAAQ,IAAI,OAAO,CAA2B;IAClD,IAAI,QAAQ,CAAC,GAAG,EAAE,OAAO,EAIxB;IAED,IAAI,SAAS,IAAI,MAAM,CAA4B;IACnD,IAAI,SAAS,CAAC,GAAG,EAAE,MAAM,EAA4D;IAErF,IAAI,SAAS,IAAI,MAAM,CAA4B;IACnD,IAAI,SAAS,CAAC,GAAG,EAAE,MAAM,EAA4D;IAErF,iBAAiB,IAAI,IAAI;IAKzB,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAY1F,OAAO,CAAC,KAAK;IAUb,MAAM,IAAI,IAAI;CAuBf;AAED,wBAAgB,qBAAqB,CAAC,YAAY,SAAK;wBAG3B,IAAI,CAAC,UAAU,EAAE,OAAO,GAAG,SAAS,CAAC;;;EAiBhE"}

package/dist/components/input.wc.js

@@ -0,0 +1,130 @@
+import { UElement } from '../core/element.js';
+import { signal, effect } from '../core/signal.js';
+import { inputStyles } from './styles.js';
+export class UInput extends UElement {
+    static get observedAttributes() {
+        return ['placeholder', 'disabled', 'readonly', 'type', 'name'];
+    }
+    constructor() {
+        super();
+        this._placeholder = '';
+        this._disabled = false;
+        this._readonly = false;
+        this._inputType = 'text';
+        this._inputName = '';
+        this._root.innerHTML = `<style>${inputStyles}</style><div class="input-wrapper"><input part="input" /></div>`;
+    }
+    get value() {
+        return this._root.querySelector('input')?.value ?? '';
+    }
+    set value(val) {
+        const input = this._root.querySelector('input');
+        if (input)
+            input.value = val;
+    }
+    get placeholder() { return this._placeholder; }
+    set placeholder(val) { this._placeholder = val; this.setAttribute('placeholder', val); }
+    get disabled() { return this._disabled; }
+    set disabled(val) {
+        this._disabled = val;
+        if (val)
+            this.setAttribute('disabled', '');
+        else
+            this.removeAttribute('disabled');
+    }
+    get readonly() { return this._readonly; }
+    set readonly(val) {
+        this._readonly = val;
+        if (val)
+            this.setAttribute('readonly', '');
+        else
+            this.removeAttribute('readonly');
+    }
+    get inputType() { return this._inputType; }
+    set inputType(val) { this._inputType = val; this.setAttribute('type', val); }
+    get inputName() { return this._inputName; }
+    set inputName(val) { this._inputName = val; this.setAttribute('name', val); }
+    connectedCallback() {
+        super.connectedCallback();
+        this._sync();
+    }
+    attributeChangedCallback(name, oldVal, newVal) {
+        if (oldVal === newVal)
+            return;
+        switch (name) {
+            case 'placeholder':
+                this._placeholder = newVal ?? '';
+                break;
+            case 'disabled':
+                this._disabled = newVal !== null;
+                break;
+            case 'readonly':
+                this._readonly = newVal !== null;
+                break;
+            case 'type':
+                this._inputType = newVal ?? 'text';
+                break;
+            case 'name':
+                this._inputName = newVal ?? '';
+                break;
+        }
+        this._sync();
+    }
+    _sync() {
+        const input = this._root.querySelector('input');
+        if (!input)
+            return;
+        input.placeholder = this._placeholder;
+        input.disabled = this._disabled;
+        input.readOnly = this._readonly;
+        input.type = this._inputType;
+        input.name = this._inputName;
+    }
+    _mount() {
+        const input = this._root.querySelector('input');
+        input.addEventListener('input', () => {
+            this.dispatchEvent(new CustomEvent('u-input', {
+                detail: { value: input.value },
+                bubbles: true,
+                composed: true,
+            }));
+        });
+        input.addEventListener('change', () => {
+            this.dispatchEvent(new CustomEvent('u-change', {
+                detail: { value: input.value },
+                bubbles: true,
+                composed: true,
+            }));
+        });
+        input.addEventListener('focus', () => {
+            this.dispatchEvent(new CustomEvent('u-focus', { bubbles: true, composed: true }));
+        });
+        input.addEventListener('blur', () => {
+            this.dispatchEvent(new CustomEvent('u-blur', { bubbles: true, composed: true }));
+        });
+    }
+}
+export function createControlledInput(initialValue = '') {
+    const state = signal(initialValue);
+    const component = (props = {}) => {
+        const el = new UInput();
+        if (props.placeholder)
+            el.placeholder = props.placeholder;
+        if (props.disabled != null)
+            el.disabled = props.disabled;
+        if (props.type)
+            el.inputType = props.type;
+        if (props.name)
+            el.inputName = props.name;
+        el.value = state.get();
+        effect(() => {
+            el.value = state.get();
+        });
+        el.addEventListener('u-input', ((e) => {
+            state.set(e.detail.value);
+        }));
+        return el;
+    };
+    return { component, value: state, reset: () => state.set(initialValue) };
+}
+//# sourceMappingURL=input.wc.js.map

package/dist/components/input.wc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.wc.js","sourceRoot":"","sources":["../../src/components/input.wc.ts"],"names":[],"mappings":"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"}

package/dist/components/list.wc.d.ts

@@ -0,0 +1,49 @@
+import { UElement } from '../core/element.js';
+export interface ListProps {
+    items?: any[];
+    renderItem?: (item: any, index: number) => HTMLElement | string;
+    emptyState?: string;
+}
+export declare class UList extends UElement {
+    private _items;
+    private _renderItem;
+    private _emptyText;
+    constructor();
+    get items(): any[];
+    set items(val: any[]);
+    get renderItem(): ((item: any, index: number) => HTMLElement | string) | null;
+    set renderItem(fn: ((item: any, index: number) => HTMLElement | string) | null);
+    get emptyState(): string;
+    set emptyState(val: string);
+    private _renderList;
+    _mount(): void;
+}
+export interface VirtualListProps {
+    items: any[];
+    renderItem: (item: any, index: number) => HTMLElement;
+    itemHeight: number;
+    containerHeight: number;
+    overscan?: number;
+}
+export declare class UVirtualList extends UElement {
+    static get observedAttributes(): string[];
+    private _items;
+    private _renderItem;
+    private _itemHeight;
+    private _containerHeight;
+    private _overscan;
+    constructor();
+    get items(): any[];
+    set items(val: any[]);
+    get renderItem(): ((item: any, index: number) => HTMLElement) | null;
+    set renderItem(fn: ((item: any, index: number) => HTMLElement) | null);
+    get itemHeight(): number;
+    set itemHeight(val: number);
+    get containerHeight(): number;
+    set containerHeight(val: number);
+    connectedCallback(): void;
+    attributeChangedCallback(name: string, oldVal: string | null, newVal: string | null): void;
+    private _render;
+    _mount(): void;
+}
+//# sourceMappingURL=list.wc.d.ts.map

package/dist/components/list.wc.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"list.wc.d.ts","sourceRoot":"","sources":["../../src/components/list.wc.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAG9C,MAAM,WAAW,SAAS;IACxB,KAAK,CAAC,EAAE,GAAG,EAAE,CAAC;IACd,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,KAAK,WAAW,GAAG,MAAM,CAAC;IAChE,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,qBAAa,KAAM,SAAQ,QAAQ;IACjC,OAAO,CAAC,MAAM,CAAa;IAC3B,OAAO,CAAC,WAAW,CAAqE;IACxF,OAAO,CAAC,UAAU,CAAc;;IAOhC,IAAI,KAAK,IAAI,GAAG,EAAE,CAAwB;IAC1C,IAAI,KAAK,CAAC,GAAG,EAAE,GAAG,EAAE,EAGnB;IAED,IAAI,UAAU,IAAI,CAAC,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,KAAK,WAAW,GAAG,MAAM,CAAC,GAAG,IAAI,CAE5E;IACD,IAAI,UAAU,CAAC,EAAE,EAAE,CAAC,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,KAAK,WAAW,GAAG,MAAM,CAAC,GAAG,IAAI,EAG7E;IAED,IAAI,UAAU,IAAI,MAAM,CAA4B;IACpD,IAAI,UAAU,CAAC,GAAG,EAAE,MAAM,EAAgD;IAE1E,OAAO,CAAC,WAAW;IAuBnB,MAAM,IAAI,IAAI;CACf;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,GAAG,EAAE,CAAC;IACb,UAAU,EAAE,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,KAAK,WAAW,CAAC;IACtD,UAAU,EAAE,MAAM,CAAC;IACnB,eAAe,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,qBAAa,YAAa,SAAQ,QAAQ;IACxC,MAAM,KAAK,kBAAkB,IAAI,MAAM,EAAE,CAExC;IAED,OAAO,CAAC,MAAM,CAAa;IAC3B,OAAO,CAAC,WAAW,CAA4D;IAC/E,OAAO,CAAC,WAAW,CAAc;IACjC,OAAO,CAAC,gBAAgB,CAAe;IACvC,OAAO,CAAC,SAAS,CAAa;;IAW9B,IAAI,KAAK,IAAI,GAAG,EAAE,CAAwB;IAC1C,IAAI,KAAK,CAAC,GAAG,EAAE,GAAG,EAAE,EAAwC;IAC5D,IAAI,UAAU,IAAI,CAAC,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,KAAK,WAAW,CAAC,GAAG,IAAI,CAA6B;IACjG,IAAI,UAAU,CAAC,EAAE,EADC,CAAC,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,KAAK,WAAW,CAAC,GAAG,IAC/C,EAA4C;IAC7D,IAAI,UAAU,IAAI,MAAM,CAA6B;IACrD,IAAI,UAAU,CAAC,GAAG,EAAE,MAAM,EAA4E;IACtG,IAAI,eAAe,IAAI,MAAM,CAAkC;IAC/D,IAAI,eAAe,CAAC,GAAG,EAAE,MAAM,EAAsF;IAErH,iBAAiB,IAAI,IAAI;IAOzB,wBAAwB,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI;IAU1F,OAAO,CAAC,OAAO;IAsBf,MAAM,IAAI,IAAI;CACf"}

package/dist/components/list.wc.js

@@ -0,0 +1,120 @@
+import { UElement } from '../core/element.js';
+import { listStyles } from './styles.js';
+export class UList extends UElement {
+    constructor() {
+        super();
+        this._items = [];
+        this._renderItem = null;
+        this._emptyText = '';
+        this._root.innerHTML = `<style>${listStyles}</style><ul part="list"><slot></slot></ul>`;
+    }
+    get items() { return this._items; }
+    set items(val) {
+        this._items = val;
+        this._renderList();
+    }
+    get renderItem() {
+        return this._renderItem;
+    }
+    set renderItem(fn) {
+        this._renderItem = fn;
+        this._renderList();
+    }
+    get emptyState() { return this._emptyText; }
+    set emptyState(val) { this._emptyText = val; this._renderList(); }
+    _renderList() {
+        if (!this._renderItem)
+            return;
+        const ul = this._root.querySelector('ul');
+        if (this._items.length === 0 && this._emptyText) {
+            ul.innerHTML = `<li class="list-empty">${this._emptyText}</li>`;
+            return;
+        }
+        ul.innerHTML = '';
+        for (let i = 0; i < this._items.length; i++) {
+            const li = document.createElement('li');
+            li.setAttribute('part', 'item');
+            const content = this._renderItem(this._items[i], i);
+            if (typeof content === 'string') {
+                li.textContent = content;
+            }
+            else {
+                li.appendChild(content);
+            }
+            ul.appendChild(li);
+        }
+    }
+    _mount() { }
+}
+export class UVirtualList extends UElement {
+    static get observedAttributes() {
+        return ['item-height', 'container-height', 'overscan'];
+    }
+    constructor() {
+        super();
+        this._items = [];
+        this._renderItem = null;
+        this._itemHeight = 40;
+        this._containerHeight = 400;
+        this._overscan = 3;
+        this._root.innerHTML = `<style>${listStyles}
+:host { overflow-y: auto; position: relative; }
+.viewport { position: relative; width: 100%; }
+.item { position: absolute; left: 0; right: 0; }
+</style><div class="viewport" part="viewport"></div>`;
+    }
+    get items() { return this._items; }
+    set items(val) { this._items = val; this._render(); }
+    get renderItem() { return this._renderItem; }
+    set renderItem(fn) { this._renderItem = fn; this._render(); }
+    get itemHeight() { return this._itemHeight; }
+    set itemHeight(val) { this._itemHeight = val; this.setAttribute('item-height', String(val)); }
+    get containerHeight() { return this._containerHeight; }
+    set containerHeight(val) { this._containerHeight = val; this.setAttribute('container-height', String(val)); }
+    connectedCallback() {
+        super.connectedCallback();
+        this.style.height = `${this._containerHeight}px`;
+        this.addEventListener('scroll', () => this._render());
+        this._render();
+    }
+    attributeChangedCallback(name, oldVal, newVal) {
+        if (oldVal === newVal)
+            return;
+        switch (name) {
+            case 'item-height':
+                this._itemHeight = Number(newVal) || 40;
+                break;
+            case 'container-height':
+                this._containerHeight = Number(newVal) || 400;
+                this.style.height = `${this._containerHeight}px`;
+                break;
+            case 'overscan':
+                this._overscan = Number(newVal) || 3;
+                break;
+        }
+        this._render();
+    }
+    _render() {
+        if (!this._renderItem)
+            return;
+        const viewport = this._root.querySelector('.viewport');
+        const scrollTop = this.scrollTop;
+        const totalHeight = this._items.length * this._itemHeight;
+        const visibleCount = Math.ceil(this._containerHeight / this._itemHeight) + this._overscan * 2;
+        const startIndex = Math.max(0, Math.floor(scrollTop / this._itemHeight) - this._overscan);
+        const endIndex = Math.min(this._items.length, startIndex + visibleCount);
+        viewport.style.height = `${totalHeight}px`;
+        viewport.innerHTML = '';
+        for (let i = startIndex; i < endIndex; i++) {
+            const div = document.createElement('div');
+            div.className = 'item';
+            div.style.top = `${i * this._itemHeight}px`;
+            div.style.height = `${this._itemHeight}px`;
+            const content = this._renderItem(this._items[i], i);
+            div.appendChild(content);
+            viewport.appendChild(div);
+        }
+    }
+    _mount() { }
+}
+//# sourceMappingURL=list.wc.js.map

package/dist/components/list.wc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"list.wc.js","sourceRoot":"","sources":["../../src/components/list.wc.ts"],"names":[],"mappings":"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"}