@e280/sly 0.2.0-0 → 0.2.0-10

package/x/ops/op.d.ts

@@ -6,7 +6,7 @@ export declare class Op<V> {
     static ready<V>(value: V): Op<V>;
     static error<V>(error: any): Op<V>;
     static promise<V>(promise: Promise<V>): Op<V>;
-    static fn<V>(fn: () => Promise<V>): Op<V>;
+    static load<V>(fn: () => Promise<V>): Op<V>;
     static all<V>(...ops: Op<V>[]): Pod<V[]>;
     readonly signal: Signal<Pod<V>>;
     constructor(pod?: Pod<V>);
@@ -18,7 +18,7 @@ export declare class Op<V> {
     setReady(value: V): Promise<void>;
     setError(error: any): Promise<void>;
     promise(promise: Promise<V>): Promise<V | undefined>;
-    fn(fn: () => Promise<V>): Promise<V | undefined>;
+    load(fn: () => Promise<V>): Promise<V | undefined>;
     get pod(): Pod<V>;
     set pod(p: Pod<V>);
     get status(): "loading" | "ready" | "error";

package/x/ops/op.js

@@ -10,7 +10,7 @@ export class Op {
         op.promise(promise);
         return op;
     }
-    static fn(fn) {
+    static load(fn) {
         return this.promise(fn());
     }
     static all(...ops) {
@@ -58,7 +58,7 @@ export class Op {
                 await this.setError(error);
         }
     }
-    async fn(fn) {
+    async load(fn) {
         return this.promise(fn());
     }
     get pod() {

package/x/ops/op.js.map

@@ -1 +1 @@
-{"version":3,"file":"op.js","sourceRoot":"","sources":["../../s/ops/op.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"op.js","sourceRoot":"","sources":["../../s/ops/op.ts"],"names":[],"mappings":"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"}

package/x/ui/base/css-reset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"css-reset.js","sourceRoot":"","sources":["../../../s/ui/base/css-reset.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAiB,MAAM,KAAK,CAAA;AAEvC,MAAM,CAAC,MAAM,QAAQ,GAAmB,GAAG,CAAA;;;;;;;;;;;;;;;;CAgB1C,CAAA"}

package/x/{views → ui/base}/use.d.ts

@@ -1,6 +1,7 @@
 import { CSSResultGroup } from "lit";
-import { Op } from "../ops/op.js";
-import { AttrSpec } from "./attributes.js";
+import { SignalOptions } from "@e280/strata/signals";
+import { Op } from "../../ops/op.js";
+import { Attrs } from "../../dom/types.js";
 export declare const _wrap: unique symbol;
 export declare const _disconnect: unique symbol;
 export declare const _reconnect: unique symbol;
@@ -10,6 +11,7 @@ export declare class Use {
     shadow: ShadowRoot;
     renderNow: () => void;
     render: () => Promise<void>;
+    attrs: Attrs;
     [_wrap]<R>(fn: () => R): R;
     [_disconnect](): void;
     [_reconnect](): void;
@@ -20,15 +22,20 @@ export declare class Use {
     styles(...styles: CSSResultGroup[]): void;
     /** alias for 'styles' */
     css(...styles: CSSResultGroup[]): void;
-    attrs<A extends AttrSpec>(spec: A): import("./attributes.js").AttrTypes<A>;
     once<V>(fn: () => V): V;
     mount(fn: () => () => void): void;
     life<V>(fn: () => [result: V, dispose: () => void]): V;
     wake<V>(fn: () => V): V;
     op: {
         <V>(f: () => Promise<V>): Op<V>;
-        fn: <V>(f: () => Promise<V>) => Op<V>;
+        load: <V>(f: () => Promise<V>) => Op<V>;
         promise<V>(p: Promise<V>): Op<V>;
     };
-    signal<V>(value: V): import("@e280/strata/signals").Signal<V>;
+    signal: {
+        <V>(value: V, options?: Partial<SignalOptions>): import("@e280/strata/signals").SignalFn<V>;
+        derived<V>(formula: () => V, options?: Partial<SignalOptions>): import("@e280/strata/signals").DerivedFn<V>;
+        lazy<V>(formula: () => V, options?: Partial<SignalOptions>): import("@e280/strata/signals").LazyFn<V>;
+    };
+    derived<V>(formula: () => V, options?: Partial<SignalOptions>): import("@e280/strata/signals").DerivedFn<V>;
+    lazy<V>(formula: () => V, options?: Partial<SignalOptions>): import("@e280/strata/signals").LazyFn<V>;
 }

package/x/{views → ui/base}/use.js

@@ -1,9 +1,9 @@
 import { defer, MapG } from "@e280/stz";
 import { signal } from "@e280/strata/signals";
-import { Op } from "../ops/op.js";
+import { Op } from "../../ops/op.js";
+import { dom } from "../../dom/dom.js";
 import { Mounts } from "./utils/mounts.js";
 import { applyStyles } from "./utils/apply-styles.js";
-import { attributes, onAttrChange } from "./attributes.js";
 export const _wrap = Symbol();
 export const _disconnect = Symbol();
 export const _reconnect = Symbol();
@@ -12,6 +12,7 @@ export class Use {
     shadow;
     renderNow;
     render;
+    attrs;
     #runs = 0;
     #position = 0;
     #values = new MapG();
@@ -38,6 +39,7 @@ export class Use {
         this.shadow = shadow;
         this.renderNow = renderNow;
         this.render = render;
+        this.attrs = dom.attrs(this.element);
     }
     get renderCount() {
         return this.#runs;
@@ -55,10 +57,6 @@ export class Use {
     css(...styles) {
         return this.styles(...styles);
     }
-    attrs(spec) {
-        this.mount(() => onAttrChange(this.element, this.render));
-        return this.once(() => attributes(this.element, spec));
-    }
     once(fn) {
         return this.#values.guarantee(this.#position++, fn);
     }
@@ -80,14 +78,30 @@ export class Use {
     op = (() => {
         const that = this;
         function op(f) {
-            return that.once(() => Op.fn(f));
+            return that.once(() => Op.load(f));
         }
-        op.fn = op;
+        op.load = op;
         op.promise = (p) => this.once(() => Op.promise(p));
         return op;
     })();
-    signal(value) {
-        return this.once(() => signal(value));
+    signal = (() => {
+        const that = this;
+        function sig(value, options) {
+            return that.once(() => signal(value, options));
+        }
+        sig.derived = function derived(formula, options) {
+            return that.once(() => signal.derived(formula, options));
+        };
+        sig.lazy = function lazy(formula, options) {
+            return that.once(() => signal.lazy(formula, options));
+        };
+        return sig;
+    })();
+    derived(formula, options) {
+        return this.once(() => signal.derived(formula, options));
+    }
+    lazy(formula, options) {
+        return this.once(() => signal.lazy(formula, options));
     }
 }
 //# sourceMappingURL=use.js.map

package/x/ui/base/use.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use.js","sourceRoot":"","sources":["../../../s/ui/base/use.ts"],"names":[],"mappings":"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"}

package/x/ui/base/utils/apply-styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"apply-styles.js","sourceRoot":"","sources":["../../../../s/ui/base/utils/apply-styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,WAAW,EAAqC,kBAAkB,EAAC,MAAM,KAAK,CAAA;AAEtF,MAAM,UAAU,WAAW,CAAC,MAAkB,EAAE,MAAuB;IACtE,WAAW,CAAC,MAAM,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC,CAAA;AAC3C,CAAC;AAED,SAAS,aAAa,CAAC,MAAuB;IAC7C,MAAM,aAAa,GAAG,EAAE,CAAA;IAExB,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC;QAC3B,MAAM,GAAG,GAAG,IAAI,GAAG,CAAE,MAAyB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,OAAO,EAAE,CAAC,CAAA;QACxE,KAAK,MAAM,CAAC,IAAI,GAAG;YAClB,aAAa,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAsB,CAAC,CAAC,CAAA;IACnE,CAAC;SACI,IAAI,MAAM,KAAK,SAAS;QAC5B,aAAa,CAAC,IAAI,CAAC,kBAAkB,CAAC,MAAM,CAAC,CAAC,CAAA;IAE/C,OAAO,aAAa,CAAA;AACrB,CAAC"}

package/x/ui/base/utils/attr-watcher.d.ts

@@ -0,0 +1,8 @@
+export declare class AttrWatcher {
+    #private;
+    private element;
+    private response;
+    constructor(element: HTMLElement, response: () => void);
+    start(): void;
+    stop(): void;
+}

package/x/ui/base/utils/attr-watcher.js

@@ -0,0 +1,20 @@
+import { dom } from "../../../dom/dom.js";
+export class AttrWatcher {
+    element;
+    response;
+    #stopper;
+    constructor(element, response) {
+        this.element = element;
+        this.response = response;
+    }
+    start() {
+        if (!this.#stopper)
+            this.#stopper = dom.attrs(this.element).on(this.response);
+    }
+    stop() {
+        if (this.#stopper)
+            this.#stopper();
+        this.#stopper = undefined;
+    }
+}
+//# sourceMappingURL=attr-watcher.js.map

package/x/ui/base/utils/attr-watcher.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"attr-watcher.js","sourceRoot":"","sources":["../../../../s/ui/base/utils/attr-watcher.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAC,MAAM,qBAAqB,CAAA;AAEvC,MAAM,OAAO,WAAW;IAId;IACA;IAJT,QAAQ,CAA0B;IAElC,YACS,OAAoB,EACpB,QAAoB;QADpB,YAAO,GAAP,OAAO,CAAa;QACpB,aAAQ,GAAR,QAAQ,CAAY;IAC1B,CAAC;IAEJ,KAAK;QACJ,IAAI,CAAC,IAAI,CAAC,QAAQ;YACjB,IAAI,CAAC,QAAQ,GAAG,GAAG,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;IAC3D,CAAC;IAED,IAAI;QACH,IAAI,IAAI,CAAC,QAAQ;YAAE,IAAI,CAAC,QAAQ,EAAE,CAAA;QAClC,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAA;IAC1B,CAAC;CACD"}

package/x/ui/base/utils/mounts.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mounts.js","sourceRoot":"","sources":["../../../../s/ui/base/utils/mounts.ts"],"names":[],"mappings":"AACA,MAAM,OAAO,MAAM;IAClB,SAAS,GAAyB,EAAE,CAAA;IACpC,WAAW,GAAmB,EAAE,CAAA;IAEhC,KAAK,CAAC,KAAuB;QAC5B,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QAC1B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,CAAA;IAC/B,CAAC;IAED,UAAU;QACT,KAAK,MAAM,OAAO,IAAI,IAAI,CAAC,WAAW;YACrC,OAAO,EAAE,CAAA;QACV,IAAI,CAAC,WAAW,GAAG,EAAE,CAAA;IACtB,CAAC;IAED,UAAU;QACT,KAAK,MAAM,KAAK,IAAI,IAAI,CAAC,SAAS;YACjC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,CAAA;IAChC,CAAC;CACD"}

package/x/ui/base/utils/reactor.d.ts

@@ -0,0 +1,5 @@
+export declare class Reactor {
+    #private;
+    effect<R>(collect: () => R, respond: () => Promise<void>): R;
+    clear(): void;
+}

package/x/ui/base/utils/reactor.js

@@ -0,0 +1,17 @@
+import { MapG } from "@e280/stz";
+import { tracker } from "@e280/strata";
+export class Reactor {
+    #map = new MapG();
+    effect(collect, respond) {
+        const { seen, result } = tracker.observe(collect);
+        for (const item of seen)
+            this.#map.guarantee(item, () => tracker.subscribe(item, respond));
+        return result;
+    }
+    clear() {
+        for (const dispose of this.#map.values())
+            dispose();
+        this.#map.clear();
+    }
+}
+//# sourceMappingURL=reactor.js.map

package/x/ui/base/utils/reactor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reactor.js","sourceRoot":"","sources":["../../../../s/ui/base/utils/reactor.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,WAAW,CAAA;AAC9B,OAAO,EAAC,OAAO,EAAC,MAAM,cAAc,CAAA;AAEpC,MAAM,OAAO,OAAO;IACnB,IAAI,GAAG,IAAI,IAAI,EAAmB,CAAA;IAElC,MAAM,CAAI,OAAgB,EAAE,OAA4B;QACvD,MAAM,EAAC,IAAI,EAAE,MAAM,EAAC,GAAG,OAAO,CAAC,OAAO,CAAC,OAAO,CAAC,CAAA;QAC/C,KAAK,MAAM,IAAI,IAAI,IAAI;YACtB,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,SAAS,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC,CAAA;QAClE,OAAO,MAAM,CAAA;IACd,CAAC;IAED,KAAK;QACJ,KAAK,MAAM,OAAO,IAAI,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE;YACvC,OAAO,EAAE,CAAA;QACV,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,CAAA;IAClB,CAAC;CACD"}

package/x/ui/base-element.d.ts

@@ -0,0 +1,19 @@
+import { CSSResultGroup } from "lit";
+import { Content } from "./types.js";
+import { Use } from "./base/use.js";
+export declare class BaseElement extends HTMLElement {
+    #private;
+    static styles: CSSResultGroup | undefined;
+    readonly shadow: ShadowRoot;
+    /** create the shadow root. override this if you want to change the shadow root settings. */
+    createShadow(): ShadowRoot;
+    constructor();
+    /** return some content to render. */
+    render(_use: Use): Content;
+    /** immediately perform a fresh render into the shadow root. */
+    updateNow: () => void;
+    /** request a rerender which will happen soon (debounced). */
+    update: import("@e280/stz").DebounceReturn<() => void>;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+}

package/x/ui/base-element.js

@@ -0,0 +1,52 @@
+import { debounce } from "@e280/stz";
+import { dom } from "../dom/dom.js";
+import { Reactor } from "./base/utils/reactor.js";
+import { AttrWatcher } from "./base/utils/attr-watcher.js";
+import { applyStyles } from "./base/utils/apply-styles.js";
+import { Use, _disconnect, _reconnect, _wrap } from "./base/use.js";
+export class BaseElement extends HTMLElement {
+    static styles;
+    shadow;
+    #use;
+    #mountCount = 0;
+    #reactor = new Reactor();
+    #attrWatcher = new AttrWatcher(this, () => this.update());
+    /** create the shadow root. override this if you want to change the shadow root settings. */
+    createShadow() {
+        return this.attachShadow({ mode: "open" });
+    }
+    constructor() {
+        super();
+        this.shadow = this.createShadow();
+        this.#use = new Use(this, this.shadow, this.updateNow, this.update);
+    }
+    /** return some content to render. */
+    render(_use) { }
+    /** immediately perform a fresh render into the shadow root. */
+    updateNow = () => {
+        this.#use[_wrap](() => {
+            dom.render(this.shadow, this.#reactor.effect(() => this.render(this.#use), this.update));
+        });
+    };
+    /** request a rerender which will happen soon (debounced). */
+    update = debounce(0, this.updateNow);
+    connectedCallback() {
+        if (this.#mountCount === 0) {
+            const styles = this.constructor.styles;
+            if (styles)
+                applyStyles(this.shadow, styles);
+            this.updateNow();
+        }
+        else {
+            this.#use[_reconnect]();
+        }
+        this.#attrWatcher.start();
+        this.#mountCount++;
+    }
+    disconnectedCallback() {
+        this.#use[_disconnect]();
+        this.#reactor.clear();
+        this.#attrWatcher.stop();
+    }
+}
+//# sourceMappingURL=base-element.js.map

package/x/ui/base-element.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"base-element.js","sourceRoot":"","sources":["../../s/ui/base-element.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,QAAQ,EAAC,MAAM,WAAW,CAAA;AAGlC,OAAO,EAAC,GAAG,EAAC,MAAM,eAAe,CAAA;AAEjC,OAAO,EAAC,OAAO,EAAC,MAAM,yBAAyB,CAAA;AAC/C,OAAO,EAAC,WAAW,EAAC,MAAM,8BAA8B,CAAA;AACxD,OAAO,EAAC,WAAW,EAAC,MAAM,8BAA8B,CAAA;AACxD,OAAO,EAAC,GAAG,EAAE,WAAW,EAAE,UAAU,EAAE,KAAK,EAAC,MAAM,eAAe,CAAA;AAEjE,MAAM,OAAO,WAAY,SAAQ,WAAW;IAC3C,MAAM,CAAC,MAAM,CAA4B;IAEhC,MAAM,CAAY;IAE3B,IAAI,CAAK;IACT,WAAW,GAAG,CAAC,CAAA;IACf,QAAQ,GAAG,IAAI,OAAO,EAAE,CAAA;IACxB,YAAY,GAAG,IAAI,WAAW,CAAC,IAAI,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,CAAA;IAEzD,4FAA4F;IAC5F,YAAY;QACX,OAAO,IAAI,CAAC,YAAY,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC,CAAA;IACzC,CAAC;IAED;QACC,KAAK,EAAE,CAAA;QACP,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,YAAY,EAAE,CAAA;QACjC,IAAI,CAAC,IAAI,GAAG,IAAI,GAAG,CAClB,IAAI,EACJ,IAAI,CAAC,MAAM,EACX,IAAI,CAAC,SAAS,EACd,IAAI,CAAC,MAAM,CACX,CAAA;IACF,CAAC;IAED,qCAAqC;IACrC,MAAM,CAAC,IAAS,IAAY,CAAC;IAE7B,+DAA+D;IAC/D,SAAS,GAAG,GAAG,EAAE;QAChB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,EAAE;YACrB,GAAG,CAAC,MAAM,CACT,IAAI,CAAC,MAAM,EACX,IAAI,CAAC,QAAQ,CAAC,MAAM,CACnB,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,EAC5B,IAAI,CAAC,MAAM,CACX,CACD,CAAA;QACF,CAAC,CAAC,CAAA;IACH,CAAC,CAAA;IAED,6DAA6D;IAC7D,MAAM,GAAG,QAAQ,CAAC,CAAC,EAAE,IAAI,CAAC,SAAS,CAAC,CAAA;IAEpC,iBAAiB;QAChB,IAAI,IAAI,CAAC,WAAW,KAAK,CAAC,EAAE,CAAC;YAC5B,MAAM,MAAM,GAAI,IAAI,CAAC,WAAmB,CAAC,MAAM,CAAA;YAC/C,IAAI,MAAM;gBAAE,WAAW,CAAC,IAAI,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;YAC5C,IAAI,CAAC,SAAS,EAAE,CAAA;QACjB,CAAC;aACI,CAAC;YACL,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE,CAAA;QACxB,CAAC;QACD,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,CAAA;QACzB,IAAI,CAAC,WAAW,EAAE,CAAA;IACnB,CAAC;IAED,oBAAoB;QACnB,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,CAAA;QACxB,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAA;QACrB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAA;IACzB,CAAC;CACD"}

package/x/ui/types.d.ts

@@ -0,0 +1,20 @@
+import { TemplateResult } from "lit";
+import { Constructor } from "@e280/stz";
+import { DirectiveResult } from "lit/directive.js";
+import { Use } from "./base/use.js";
+import { ViewChain } from "./view/parts/chain.js";
+import { BaseElement } from "./base-element.js";
+export type Content = TemplateResult | DirectiveResult | HTMLElement | string | null | undefined | void | Content[];
+export type AttrValue = string | boolean | number | undefined | null | void;
+export type ViewFn<Props extends any[]> = ((use: Use) => (...props: Props) => Content);
+export type View<Props extends any[]> = {
+    (...props: Props): DirectiveResult;
+    props: (...props: Props) => ViewChain<Props>;
+    component: <B extends Constructor<BaseElement>>(Base: B) => {
+        props: (propFn: (component: InstanceType<B>) => Props) => (ComponentClass<B, Props>);
+    };
+};
+export type ComponentClass<B extends Constructor<BaseElement>, Props extends any[]> = {
+    view: View<Props>;
+    new (): InstanceType<B>;
+} & B;

package/x/{views → ui}/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../s/views/types.ts"],"names":[],"mappings":""}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../s/ui/types.ts"],"names":[],"mappings":""}

package/x/ui/view/make-component.d.ts

@@ -0,0 +1,5 @@
+import { Constructor } from "@e280/stz";
+import { ComponentClass, ViewFn } from "../types.js";
+import { BaseElement } from "../base-element.js";
+/** make a component from a BaseElement and a view. */
+export declare function makeComponent<B extends Constructor<BaseElement>, Props extends any[]>(settings: ShadowRootInit, Base: B, propFn: (component: InstanceType<B>) => Props, viewFn: ViewFn<Props>): ComponentClass<B, Props>;

package/x/ui/view/make-component.js

@@ -0,0 +1,16 @@
+import { makeView } from "./make-view.js";
+import { Reactor } from "../base/utils/reactor.js";
+/** make a component from a BaseElement and a view. */
+export function makeComponent(settings, Base, propFn, viewFn) {
+    return class Component extends Base {
+        static view = makeView(viewFn, settings);
+        #reactor = new Reactor();
+        createShadow() {
+            return this.attachShadow(settings);
+        }
+        render(use) {
+            return viewFn(use)(...this.#reactor.effect(() => propFn(this), () => this.update()));
+        }
+    };
+}
+//# sourceMappingURL=make-component.js.map

package/x/ui/view/make-component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"make-component.js","sourceRoot":"","sources":["../../../s/ui/view/make-component.ts"],"names":[],"mappings":"AAIA,OAAO,EAAC,QAAQ,EAAC,MAAM,gBAAgB,CAAA;AACvC,OAAO,EAAC,OAAO,EAAC,MAAM,0BAA0B,CAAA;AAGhD,sDAAsD;AACtD,MAAM,UAAU,aAAa,CAC3B,QAAwB,EACxB,IAAO,EACP,MAA6C,EAC7C,MAAqB;IAGtB,OAAO,MAAM,SAAU,SAAQ,IAAI;QAClC,MAAM,CAAC,IAAI,GAAG,QAAQ,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAA;QACxC,QAAQ,GAAG,IAAI,OAAO,EAAE,CAAA;QAExB,YAAY;YACX,OAAO,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAA;QACnC,CAAC;QAED,MAAM,CAAC,GAAQ;YACd,OAAO,MAAM,CAAC,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,CACzC,GAAG,EAAE,CAAC,MAAM,CAAC,IAAW,CAAC,EACzB,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,CACnB,CAAC,CAAA;QACH,CAAC;KACkC,CAAA;AACrC,CAAC"}

package/x/ui/view/make-view.d.ts

@@ -0,0 +1,2 @@
+import { View, ViewFn } from "../types.js";
+export declare function makeView<Props extends any[]>(viewFn: ViewFn<Props>, settings: ShadowRootInit): View<Props>;

package/x/ui/view/make-view.js

@@ -0,0 +1,16 @@
+import { ViewChain } from "./parts/chain.js";
+import { ViewContext } from "./parts/context.js";
+import { makeComponent } from "./make-component.js";
+import { makeViewDirective } from "./parts/directive.js";
+export function makeView(viewFn, settings) {
+    const renderDirective = makeViewDirective(viewFn, settings);
+    function v(...props) {
+        return renderDirective(new ViewContext(props));
+    }
+    v.props = (...props) => new ViewChain(new ViewContext(props), renderDirective);
+    v.component = (Base) => ({
+        props: (propFn) => (makeComponent(settings, Base, propFn, viewFn))
+    });
+    return v;
+}
+//# sourceMappingURL=make-view.js.map

package/x/ui/view/make-view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"make-view.js","sourceRoot":"","sources":["../../../s/ui/view/make-view.ts"],"names":[],"mappings":"AAIA,OAAO,EAAC,SAAS,EAAC,MAAM,kBAAkB,CAAA;AAC1C,OAAO,EAAC,WAAW,EAAC,MAAM,oBAAoB,CAAA;AAC9C,OAAO,EAAC,aAAa,EAAC,MAAM,qBAAqB,CAAA;AAEjD,OAAO,EAAC,iBAAiB,EAAC,MAAM,sBAAsB,CAAA;AAEtD,MAAM,UAAU,QAAQ,CACtB,MAAqB,EACrB,QAAwB;IAGzB,MAAM,eAAe,GAAG,iBAAiB,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAA;IAE3D,SAAS,CAAC,CAAC,GAAG,KAAY;QACzB,OAAO,eAAe,CAAC,IAAI,WAAW,CAAC,KAAK,CAAC,CAAC,CAAA;IAC/C,CAAC;IAED,CAAC,CAAC,KAAK,GAAG,CAAC,GAAG,KAAY,EAAE,EAAE,CAAC,IAAI,SAAS,CAC3C,IAAI,WAAW,CAAC,KAAK,CAAC,EACtB,eAAe,CACf,CAAA;IAED,CAAC,CAAC,SAAS,GAAG,CAAqC,IAAO,EAAE,EAAE,CAAC,CAAC;QAC/D,KAAK,EAAE,CAAC,MAA6C,EAAE,EAAE,CAAC,CACzD,aAAa,CACZ,QAAQ,EACR,IAAI,EACJ,MAAM,EACN,MAAM,CACN,CACD;KACD,CAAC,CAAA;IAEF,OAAO,CAAC,CAAA;AACT,CAAC"}

package/x/ui/view/parts/apply-attrs.d.ts

@@ -0,0 +1,2 @@
+import { AttrValue } from "../../types.js";
+export declare function applyAttrs(element: HTMLElement, attrs: Map<string, AttrValue>): void;

package/x/{views/utils → ui/view/parts}/apply-attrs.js

@@ -1,8 +1,6 @@
 export function applyAttrs(element, attrs) {
     for (const [key, value] of Object.entries(attrs)) {
-        if (value === undefined)
-            element.removeAttribute(key);
-        else if (value === null)
+        if (value === undefined || value === null)
             element.removeAttribute(key);
         else if (typeof value === "string")
             element.setAttribute(key, value);
@@ -15,7 +13,7 @@ export function applyAttrs(element, attrs) {
                 element.removeAttribute(key);
         }
         else
-            console.warn(`invalid attribute type ${key} is ${typeof value}`);
+            console.warn(`invalid attribute "${key}" type is "${typeof value}"`);
     }
 }
 //# sourceMappingURL=apply-attrs.js.map

package/x/ui/view/parts/apply-attrs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"apply-attrs.js","sourceRoot":"","sources":["../../../../s/ui/view/parts/apply-attrs.ts"],"names":[],"mappings":"AAGA,MAAM,UAAU,UAAU,CACxB,OAAoB,EACpB,KAA6B;IAG9B,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;QAClD,IAAI,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,IAAI;YACxC,OAAO,CAAC,eAAe,CAAC,GAAG,CAAC,CAAA;aAExB,IAAI,OAAO,KAAK,KAAK,QAAQ;YACjC,OAAO,CAAC,YAAY,CAAC,GAAG,EAAE,KAAK,CAAC,CAAA;aAE5B,IAAI,OAAO,KAAK,KAAK,QAAQ;YACjC,OAAO,CAAC,YAAY,CAAC,GAAG,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAA;aAEvC,IAAI,OAAO,KAAK,KAAK,SAAS,EAAE,CAAC;YACrC,IAAI,KAAK,KAAK,IAAI;gBACjB,OAAO,CAAC,YAAY,CAAC,GAAG,EAAE,EAAE,CAAC,CAAA;;gBAE7B,OAAO,CAAC,eAAe,CAAC,GAAG,CAAC,CAAA;QAC9B,CAAC;;YAGA,OAAO,CAAC,IAAI,CAAC,sBAAsB,GAAG,cAAc,OAAO,KAAK,GAAG,CAAC,CAAA;IACtE,CAAC;AACF,CAAC"}

package/x/ui/view/parts/capsule.d.ts

@@ -0,0 +1,13 @@
+import { ViewFn } from "../../types.js";
+import { SlyView } from "./sly-view.js";
+import { ViewContext } from "./context.js";
+/** controls the rendering of view context into an element. */
+export declare class ViewCapsule<Props extends any[]> {
+    #private;
+    private viewFn;
+    private settings;
+    constructor(viewFn: ViewFn<Props>, settings: ShadowRootInit);
+    update(context: ViewContext<Props>): SlyView;
+    disconnected(): void;
+    reconnected(): void;
+}

package/x/ui/view/parts/capsule.js

@@ -0,0 +1,49 @@
+import { debounce } from "@e280/stz";
+import { SlyView } from "./sly-view.js";
+import { dom } from "../../../dom/dom.js";
+import { applyAttrs } from "./apply-attrs.js";
+import { Reactor } from "../../base/utils/reactor.js";
+import { AttrWatcher } from "../../base/utils/attr-watcher.js";
+import { _disconnect, _reconnect, _wrap, Use } from "../../base/use.js";
+/** controls the rendering of view context into an element. */
+export class ViewCapsule {
+    viewFn;
+    settings;
+    #element = SlyView.make();
+    #reactor = new Reactor();
+    #use;
+    #shadow;
+    #context;
+    #attrWatcher = new AttrWatcher(this.#element, () => this.#renderDebounced());
+    constructor(viewFn, settings) {
+        this.viewFn = viewFn;
+        this.settings = settings;
+        this.#shadow = this.#element.attachShadow(this.settings);
+        this.#use = new Use(this.#element, this.#shadow, this.#renderNow, this.#renderDebounced);
+    }
+    update(context) {
+        this.#context = context;
+        this.#renderNow();
+        return this.#element;
+    }
+    #renderNow = () => {
+        this.#use[_wrap](() => {
+            const content = this.#reactor.effect(() => this.viewFn(this.#use)(...this.#context.props), () => this.#renderDebounced());
+            applyAttrs(this.#element, this.#context.attrs);
+            dom.render(this.#shadow, content);
+            dom.render(this.#element, this.#context.children);
+            this.#attrWatcher.start();
+        });
+    };
+    #renderDebounced = debounce(0, this.#renderNow);
+    disconnected() {
+        this.#use[_disconnect]();
+        this.#reactor.clear();
+        this.#attrWatcher.stop();
+    }
+    reconnected() {
+        this.#use[_reconnect]();
+        this.#attrWatcher.start();
+    }
+}
+//# sourceMappingURL=capsule.js.map

package/x/ui/view/parts/capsule.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"capsule.js","sourceRoot":"","sources":["../../../../s/ui/view/parts/capsule.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,QAAQ,EAAC,MAAM,WAAW,CAAA;AAElC,OAAO,EAAC,OAAO,EAAC,MAAM,eAAe,CAAA;AACrC,OAAO,EAAC,GAAG,EAAC,MAAM,qBAAqB,CAAA;AAEvC,OAAO,EAAC,UAAU,EAAC,MAAM,kBAAkB,CAAA;AAC3C,OAAO,EAAC,OAAO,EAAC,MAAM,6BAA6B,CAAA;AACnD,OAAO,EAAC,WAAW,EAAC,MAAM,kCAAkC,CAAA;AAC5D,OAAO,EAAC,WAAW,EAAE,UAAU,EAAE,KAAK,EAAE,GAAG,EAAC,MAAM,mBAAmB,CAAA;AAErE,8DAA8D;AAC9D,MAAM,OAAO,WAAW;IAUb;IACA;IAVV,QAAQ,GAAG,OAAO,CAAC,IAAI,EAAE,CAAA;IACzB,QAAQ,GAAG,IAAI,OAAO,EAAE,CAAA;IAExB,IAAI,CAAK;IACT,OAAO,CAAY;IACnB,QAAQ,CAAqB;IAC7B,YAAY,GAAG,IAAI,WAAW,CAAC,IAAI,CAAC,QAAQ,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE,CAAC,CAAA;IAE5E,YACU,MAAqB,EACrB,QAAwB;QADxB,WAAM,GAAN,MAAM,CAAe;QACrB,aAAQ,GAAR,QAAQ,CAAgB;QAEjC,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;QACxD,IAAI,CAAC,IAAI,GAAG,IAAI,GAAG,CAClB,IAAI,CAAC,QAAQ,EACb,IAAI,CAAC,OAAO,EACZ,IAAI,CAAC,UAAU,EACf,IAAI,CAAC,gBAAgB,CACrB,CAAA;IACF,CAAC;IAED,MAAM,CAAC,OAA2B;QACjC,IAAI,CAAC,QAAQ,GAAG,OAAO,CAAA;QACvB,IAAI,CAAC,UAAU,EAAE,CAAA;QACjB,OAAO,IAAI,CAAC,QAAQ,CAAA;IACrB,CAAC;IAED,UAAU,GAAG,GAAG,EAAE;QACjB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,EAAE;YACrB,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,CACnC,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,EACpD,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE,CAC7B,CAAA;YACD,UAAU,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAA;YAC9C,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,EAAE,OAAO,CAAC,CAAA;YACjC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAA;YACjD,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,CAAA;QAC1B,CAAC,CAAC,CAAA;IACH,CAAC,CAAA;IAED,gBAAgB,GAAG,QAAQ,CAAC,CAAC,EAAE,IAAI,CAAC,UAAU,CAAC,CAAA;IAE/C,YAAY;QACX,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,CAAA;QACxB,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,CAAA;QACrB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAA;IACzB,CAAC;IAED,WAAW;QACV,IAAI,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE,CAAA;QACvB,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,CAAA;IAC1B,CAAC;CACD"}

package/x/ui/view/parts/chain.d.ts

@@ -0,0 +1,11 @@
+import { DirectiveResult } from "lit/async-directive.js";
+import { ViewContext } from "./context.js";
+import { AttrValue, Content } from "../../types.js";
+/** provides fluent chaining interface for adding context to rendering a view, think view.props().attr().children().render() */
+export declare class ViewChain<Props extends any[]> {
+    #private;
+    constructor(context: ViewContext<Props>, renderDirective: (context: ViewContext<Props>) => DirectiveResult);
+    attr(key: string, value: AttrValue): this;
+    children(...contents: Content[]): this;
+    render(): DirectiveResult<import("lit-html/directive.js").DirectiveClass>;
+}

package/x/ui/view/parts/chain.js

@@ -0,0 +1,21 @@
+/** provides fluent chaining interface for adding context to rendering a view, think view.props().attr().children().render() */
+export class ViewChain {
+    #render;
+    #context;
+    constructor(context, renderDirective) {
+        this.#context = context;
+        this.#render = renderDirective;
+    }
+    attr(key, value) {
+        this.#context.attrs.set(key, value);
+        return this;
+    }
+    children(...contents) {
+        this.#context.children.push(...contents);
+        return this;
+    }
+    render() {
+        return this.#render(this.#context);
+    }
+}
+//# sourceMappingURL=chain.js.map

package/x/ui/view/parts/chain.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chain.js","sourceRoot":"","sources":["../../../../s/ui/view/parts/chain.ts"],"names":[],"mappings":"AAKA,+HAA+H;AAC/H,MAAM,OAAO,SAAS;IACrB,OAAO,CAAkD;IACzD,QAAQ,CAAoB;IAE5B,YACE,OAA2B,EAC3B,eAAiE;QAElE,IAAI,CAAC,QAAQ,GAAG,OAAO,CAAA;QACvB,IAAI,CAAC,OAAO,GAAG,eAAe,CAAA;IAC/B,CAAC;IAED,IAAI,CAAC,GAAW,EAAE,KAAgB;QACjC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,EAAE,KAAK,CAAC,CAAA;QACnC,OAAO,IAAI,CAAA;IACZ,CAAC;IAED,QAAQ,CAAC,GAAG,QAAmB;QAC9B,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,QAAQ,CAAC,CAAA;QACxC,OAAO,IAAI,CAAA;IACZ,CAAC;IAED,MAAM;QACL,OAAO,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;IACnC,CAAC;CACD"}

package/x/ui/view/parts/context.d.ts

@@ -0,0 +1,8 @@
+import { AttrValue, Content } from "../../types.js";
+/** the information we need to render a view. */
+export declare class ViewContext<Props extends any[]> {
+    props: Props;
+    attrs: Map<string, AttrValue>;
+    children: Content[];
+    constructor(props: Props);
+}

package/x/ui/view/parts/context.js

@@ -0,0 +1,10 @@
+/** the information we need to render a view. */
+export class ViewContext {
+    props;
+    attrs = new Map();
+    children = [];
+    constructor(props) {
+        this.props = props;
+    }
+}
+//# sourceMappingURL=context.js.map

package/x/ui/view/parts/context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","sourceRoot":"","sources":["../../../../s/ui/view/parts/context.ts"],"names":[],"mappings":"AAGA,gDAAgD;AAChD,MAAM,OAAO,WAAW;IAGJ;IAFnB,KAAK,GAAG,IAAI,GAAG,EAAqB,CAAA;IACpC,QAAQ,GAAc,EAAE,CAAA;IACxB,YAAmB,KAAY;QAAZ,UAAK,GAAL,KAAK,CAAO;IAAG,CAAC;CACnC"}

package/x/ui/view/parts/directive.d.ts

@@ -0,0 +1,5 @@
+import { DirectiveResult } from "lit/async-directive.js";
+import { ViewFn } from "../../types.js";
+import { ViewContext } from "./context.js";
+/** creates a lit directive fn, which when called, emits a funky lit thing to inject in your html templates. */
+export declare function makeViewDirective<Props extends any[]>(viewFn: ViewFn<Props>, settings: ShadowRootInit): (context: ViewContext<Props>) => DirectiveResult;

package/x/ui/view/parts/directive.js

@@ -0,0 +1,18 @@
+import { AsyncDirective, directive } from "lit/async-directive.js";
+import { ViewCapsule } from "./capsule.js";
+/** creates a lit directive fn, which when called, emits a funky lit thing to inject in your html templates. */
+export function makeViewDirective(viewFn, settings) {
+    return directive(class ViewDirective extends AsyncDirective {
+        #capsule = new ViewCapsule(viewFn, settings);
+        render(context) {
+            return this.#capsule.update(context);
+        }
+        disconnected() {
+            this.#capsule.disconnected();
+        }
+        reconnected() {
+            this.#capsule.reconnected();
+        }
+    });
+}
+//# sourceMappingURL=directive.js.map

package/x/ui/view/parts/directive.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"directive.js","sourceRoot":"","sources":["../../../../s/ui/view/parts/directive.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,cAAc,EAAE,SAAS,EAAkB,MAAM,wBAAwB,CAAA;AAEjF,OAAO,EAAC,WAAW,EAAC,MAAM,cAAc,CAAA;AAGxC,+GAA+G;AAC/G,MAAM,UAAU,iBAAiB,CAC/B,MAAqB,EACrB,QAAwB;IAGzB,OAAO,SAAS,CAAC,MAAM,aAAc,SAAQ,cAAc;QAC1D,QAAQ,GAAG,IAAI,WAAW,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAA;QAE5C,MAAM,CAAC,OAA2B;YACjC,OAAO,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,OAAO,CAAC,CAAA;QACrC,CAAC;QAED,YAAY;YACX,IAAI,CAAC,QAAQ,CAAC,YAAY,EAAE,CAAA;QAC7B,CAAC;QAED,WAAW;YACV,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE,CAAA;QAC5B,CAAC;KACD,CAAqD,CAAA;AACvD,CAAC"}

package/x/ui/view/parts/sly-view.d.ts

@@ -0,0 +1,5 @@
+/** <sly-view> element that views are rendered into. */
+export declare class SlyView extends HTMLElement {
+    #private;
+    static make(): SlyView;
+}