@joist/templating 4.5.0 → 4.7.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@joist/templating",
-  "version": "4.5.0",
+  "version": "4.7.0",
   "type": "module",
   "main": "./target/lib.js",
   "module": "./target/lib.js",

package/src/lib/bind.ts

@@ -1,4 +1,5 @@
-import { instanceMetadataStore, observe, ObserveOpts } from "@joist/observable";
+import { instanceMetadataStore, observe } from "@joist/observable";
+import type { ObserveOpts } from "@joist/observable";
 
 export interface BindOpts<This, Value> extends ObserveOpts<This, Value> {
   /**
@@ -15,7 +16,7 @@ export function bind<This extends HTMLElement, Value>(opts: BindOpts<This, Value
   ): ClassAccessorDecoratorResult<This, Value> {
     const internalObserve = observe(opts)(base, ctx);
 
-    return {
+    const accessorResult: ClassAccessorDecoratorResult<This, Value> = {
       init(value) {
         this.addEventListener("joist::value", (e) => {
           if (e.expression.bindTo === ctx.name) {
@@ -57,8 +58,16 @@ export function bind<This extends HTMLElement, Value>(opts: BindOpts<This, Value
 
         return value;
       },
-      get: internalObserve.get,
-      set: internalObserve.set,
     };
+
+    if (internalObserve.get) {
+      accessorResult.get = internalObserve.get;
+    }
+
+    if (internalObserve.set) {
+      accessorResult.set = internalObserve.set;
+    }
+
+    return accessorResult;
   };
 }

package/src/lib/elements/async.element.ts

@@ -29,9 +29,9 @@ export class JoistAsyncElement extends HTMLElement {
   #templates = queryAll<HTMLTemplateElement>("template", this);
   #currentNodes: Node[] = [];
   #cachedTemplates: {
-    loading?: HTMLTemplateElement;
-    error?: HTMLTemplateElement;
-    success?: HTMLTemplateElement;
+    loading: HTMLTemplateElement | undefined;
+    error: HTMLTemplateElement | undefined;
+    success: HTMLTemplateElement | undefined;
   } = {
     loading: undefined,
     error: undefined,
@@ -95,7 +95,7 @@ export class JoistAsyncElement extends HTMLElement {
   #handleState(state: AsyncState): void {
     this.#clean();
 
-    let template: HTMLTemplateElement | undefined = undefined;
+    let template: HTMLTemplateElement | undefined;
 
     this.state = state;
 

package/src/lib/elements/bind.element.test.ts

@@ -57,8 +57,8 @@ it("should pass props to specified child", () => {
 
   const anchor = element.querySelectorAll("a");
 
-  assert.equal(anchor[0].getAttribute("href"), null);
-  assert.equal(anchor[1].getAttribute("href"), "#foo");
+  assert.equal(anchor[0]!.getAttribute("href"), null);
+  assert.equal(anchor[1]!.getAttribute("href"), "#foo");
 });
 
 it("should be case sensitive", () => {

package/src/lib/elements/bind.element.ts

@@ -8,10 +8,12 @@ export class JAttrToken extends JExpression {
 
   constructor(binding: string) {
     const [mapTo, bindTo] = binding.split(":");
+    const source = bindTo ?? mapTo ?? "";
+    const target = mapTo ?? bindTo ?? "";
 
-    super(bindTo ?? mapTo);
+    super(source);
 
-    this.mapTo = mapTo;
+    this.mapTo = target;
   }
 }
 

package/src/lib/elements/for.element.test.ts

@@ -33,8 +33,8 @@ it("should iterate over an iterable", () => {
   const listItems = element.querySelectorAll("li");
 
   assert.equal(listItems.length, 2);
-  assert.equal(listItems[0].textContent?.trim(), "Hello");
-  assert.equal(listItems[1].textContent?.trim(), "World");
+  assert.equal(listItems[0]!.textContent?.trim(), "Hello");
+  assert.equal(listItems[1]!.textContent?.trim(), "World");
 });
 
 it("should handle empty arrays", () => {
@@ -101,8 +101,8 @@ it("should update when items are added or removed", () => {
 
   const items = element.querySelectorAll("j-val");
   assert.equal(items.length, 2);
-  assert.equal(items[0].textContent?.trim(), "First");
-  assert.equal(items[1].textContent?.trim(), "Third");
+  assert.equal(items[0]!.textContent?.trim(), "First");
+  assert.equal(items[1]!.textContent?.trim(), "Third");
 });
 
 it("should provide index and position information", () => {
@@ -130,15 +130,15 @@ it("should provide index and position information", () => {
   const items = element.querySelectorAll(".item");
   assert.equal(items.length, 3);
   assert.equal(
-    items[0].textContent?.trim().replaceAll("\n", "").replaceAll(" ", ""),
+    items[0]!.textContent?.trim().replaceAll("\n", "").replaceAll(" ", ""),
     "A(index:0,position:1)",
   );
   assert.equal(
-    items[1].textContent?.trim().replaceAll("\n", "").replaceAll(" ", ""),
+    items[1]!.textContent?.trim().replaceAll("\n", "").replaceAll(" ", ""),
     "B(index:1,position:2)",
   );
   assert.equal(
-    items[2].textContent?.trim().replaceAll("\n", "").replaceAll(" ", ""),
+    items[2]!.textContent?.trim().replaceAll("\n", "").replaceAll(" ", ""),
     "C(index:2,position:3)",
   );
 });
@@ -218,9 +218,9 @@ it("should maintain DOM order when items are reordered", () => {
 
   const items = element.querySelectorAll("j-val");
   assert.equal(items.length, 3);
-  assert.equal(items[0].textContent?.trim(), "Third");
-  assert.equal(items[1].textContent?.trim(), "First");
-  assert.equal(items[2].textContent?.trim(), "Second");
+  assert.equal(items[0]!.textContent?.trim(), "Third");
+  assert.equal(items[1]!.textContent?.trim(), "First");
+  assert.equal(items[2]!.textContent?.trim(), "Second");
 });
 
 it("should wait for depends-on before dispatching events", async () => {

package/src/lib/elements/for.element.ts

@@ -1,7 +1,9 @@
 import { attr, element, query, css, html } from "@joist/element";
-import { Change, Changes, effect, observe } from "@joist/observable";
+import { effect, observe } from "@joist/observable";
+import type { Change, Changes } from "@joist/observable";
 
-import { BindChange, JoistValueEvent } from "../events.js";
+import { JoistValueEvent } from "../events.js";
+import type { BindChange } from "../events.js";
 import { JExpression } from "../expression.js";
 
 export interface EachCtx<T> {
@@ -186,7 +188,7 @@ export class JoistForElement extends HTMLElement {
         scope.each = { position: index + 1, index, value };
       }
 
-      const child = this.children[index + 1];
+      const child = this.children[index + 1] ?? null;
 
       if (child !== scope.host) {
         this.insertBefore(scope.host, child);

package/src/lib/elements/if.element.ts

@@ -38,9 +38,11 @@ export class JoistIfElement extends HTMLElement {
       throw new Error("When using two templates, one must have the else attribute");
     }
 
-    if (templates.length === 2 && templates[0].hasAttribute("else")) {
+    if (templates.length === 2 && templates[0]!.hasAttribute("else")) {
       // Swap templates to ensure if template is first
-      [templates[0], templates[1]] = [templates[1], templates[0]];
+      const first = templates[0]!;
+      templates[0] = templates[1]!;
+      templates[1] = first;
     }
 
     const token = new JExpression(this.bind);

package/src/lib/events.ts

@@ -9,8 +9,8 @@ declare global {
 }
 
 export interface BindChange<T> extends Change<T> {
-  alwaysUpdate?: boolean;
-  firstChange?: boolean;
+  alwaysUpdate?: boolean | undefined;
+  firstChange?: boolean | undefined;
 }
 
 export class JoistValueEvent extends Event {

package/src/lib/expression.ts

@@ -2,8 +2,8 @@ type ComparisonOperator = "==" | "!=" | ">" | "<";
 
 interface TokenParts {
   path: string[];
-  value?: string;
-  operator?: ComparisonOperator;
+  value?: string | undefined;
+  operator?: ComparisonOperator | undefined;
 }
 
 /**
@@ -113,8 +113,9 @@ export class JExpression {
     for (const operator of operators) {
       if (this.rawToken.includes(operator)) {
         const [tokenPart, value] = this.rawToken.split(operator).map((part) => part.trim());
+
         return {
-          path: tokenPart.split("."),
+          path: tokenPart?.split(".") ?? [],
           value,
           operator,
         };

package/target/lib/bind.d.ts

@@ -1,5 +0,0 @@
-import { ObserveOpts } from "@joist/observable";
-export interface BindOpts<This, Value> extends ObserveOpts<This, Value> {
-    alwaysUpdate?: boolean;
-}
-export declare function bind<This extends HTMLElement, Value>(opts?: BindOpts<This, Value>): (base: ClassAccessorDecoratorTarget<This, Value>, ctx: ClassAccessorDecoratorContext<This, Value>) => ClassAccessorDecoratorResult<This, Value>;

package/target/lib/bind.js

@@ -1,45 +0,0 @@
-import { instanceMetadataStore, observe } from "@joist/observable";
-export function bind(opts = {}) {
-    return function bindDecorator(base, ctx) {
-        const internalObserve = observe(opts)(base, ctx);
-        return {
-            init(value) {
-                this.addEventListener("joist::value", (e) => {
-                    if (e.expression.bindTo === ctx.name) {
-                        const instanceMeta = instanceMetadataStore.read(this);
-                        e.stopPropagation();
-                        e.update({
-                            oldValue: null,
-                            newValue: ctx.access.get(this),
-                            alwaysUpdate: opts.alwaysUpdate,
-                            firstChange: true,
-                        });
-                        const name = ctx.name;
-                        instanceMeta.bindings.add((changes) => {
-                            const change = changes.get(name);
-                            if (change) {
-                                e.update({ ...change, alwaysUpdate: opts.alwaysUpdate, firstChange: false });
-                            }
-                            else if (opts.alwaysUpdate) {
-                                const value = ctx.access.get(this);
-                                e.update({
-                                    oldValue: value,
-                                    newValue: value,
-                                    alwaysUpdate: opts.alwaysUpdate,
-                                    firstChange: false,
-                                });
-                            }
-                        });
-                    }
-                });
-                if (internalObserve.init) {
-                    return internalObserve.init.call(this, value);
-                }
-                return value;
-            },
-            get: internalObserve.get,
-            set: internalObserve.set,
-        };
-    };
-}
-//# sourceMappingURL=bind.js.map

package/target/lib/bind.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"bind.js","sourceRoot":"","sources":["../../src/lib/bind.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,OAAO,EAAe,MAAM,mBAAmB,CAAC;AAUhF,MAAM,UAAU,IAAI,CAAkC,OAA8B,EAAE;IACpF,OAAO,SAAS,aAAa,CAC3B,IAA+C,EAC/C,GAA+C;QAE/C,MAAM,eAAe,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;QAEjD,OAAO;YACL,IAAI,CAAC,KAAK;gBACR,IAAI,CAAC,gBAAgB,CAAC,cAAc,EAAE,CAAC,CAAC,EAAE,EAAE;oBAC1C,IAAI,CAAC,CAAC,UAAU,CAAC,MAAM,KAAK,GAAG,CAAC,IAAI,EAAE,CAAC;wBACrC,MAAM,YAAY,GAAG,qBAAqB,CAAC,IAAI,CAAO,IAAI,CAAC,CAAC;wBAE5D,CAAC,CAAC,eAAe,EAAE,CAAC;wBAEpB,CAAC,CAAC,MAAM,CAAC;4BACP,QAAQ,EAAE,IAAI;4BACd,QAAQ,EAAE,GAAG,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC;4BAC9B,YAAY,EAAE,IAAI,CAAC,YAAY;4BAC/B,WAAW,EAAE,IAAI;yBAClB,CAAC,CAAC;wBAEH,MAAM,IAAI,GAAG,GAAG,CAAC,IAAkB,CAAC;wBAEpC,YAAY,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE;4BACpC,MAAM,MAAM,GAAG,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;4BAEjC,IAAI,MAAM,EAAE,CAAC;gCACX,CAAC,CAAC,MAAM,CAAC,EAAE,GAAG,MAAM,EAAE,YAAY,EAAE,IAAI,CAAC,YAAY,EAAE,WAAW,EAAE,KAAK,EAAE,CAAC,CAAC;4BAC/E,CAAC;iCAAM,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;gCAC7B,MAAM,KAAK,GAAG,GAAG,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;gCAEnC,CAAC,CAAC,MAAM,CAAC;oCACP,QAAQ,EAAE,KAAK;oCACf,QAAQ,EAAE,KAAK;oCACf,YAAY,EAAE,IAAI,CAAC,YAAY;oCAC/B,WAAW,EAAE,KAAK;iCACnB,CAAC,CAAC;4BACL,CAAC;wBACH,CAAC,CAAC,CAAC;oBACL,CAAC;gBACH,CAAC,CAAC,CAAC;gBAEH,IAAI,eAAe,CAAC,IAAI,EAAE,CAAC;oBACzB,OAAO,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,KAAK,CAAU,CAAC;gBACzD,CAAC;gBAED,OAAO,KAAK,CAAC;YACf,CAAC;YACD,GAAG,EAAE,eAAe,CAAC,GAAG;YACxB,GAAG,EAAE,eAAe,CAAC,GAAG;SACzB,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC"}

package/target/lib/bind.test.d.ts

@@ -1 +0,0 @@
-export {};

package/target/lib/bind.test.js

@@ -1,76 +0,0 @@
-import { __esDecorate, __runInitializers } from "tslib";
-import { assert } from "chai";
-import { bind } from "./bind.js";
-import { JoistValueEvent } from "./events.js";
-import { JExpression } from "./expression.js";
-describe("bind decorator", () => {
-    let TestElement = (() => {
-        let _classSuper = HTMLElement;
-        let _value_decorators;
-        let _value_initializers = [];
-        let _value_extraInitializers = [];
-        let _alwaysUpdateValue_decorators;
-        let _alwaysUpdateValue_initializers = [];
-        let _alwaysUpdateValue_extraInitializers = [];
-        return class TestElement extends _classSuper {
-            static {
-                const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
-                _value_decorators = [bind()];
-                _alwaysUpdateValue_decorators = [bind({ alwaysUpdate: true })];
-                __esDecorate(this, null, _value_decorators, { kind: "accessor", name: "value", static: false, private: false, access: { has: obj => "value" in obj, get: obj => obj.value, set: (obj, value) => { obj.value = value; } }, metadata: _metadata }, _value_initializers, _value_extraInitializers);
-                __esDecorate(this, null, _alwaysUpdateValue_decorators, { kind: "accessor", name: "alwaysUpdateValue", static: false, private: false, access: { has: obj => "alwaysUpdateValue" in obj, get: obj => obj.alwaysUpdateValue, set: (obj, value) => { obj.alwaysUpdateValue = value; } }, metadata: _metadata }, _alwaysUpdateValue_initializers, _alwaysUpdateValue_extraInitializers);
-                if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
-            }
-            #value_accessor_storage = __runInitializers(this, _value_initializers, "initial");
-            get value() { return this.#value_accessor_storage; }
-            set value(value) { this.#value_accessor_storage = value; }
-            #alwaysUpdateValue_accessor_storage = (__runInitializers(this, _value_extraInitializers), __runInitializers(this, _alwaysUpdateValue_initializers, "initial"));
-            get alwaysUpdateValue() { return this.#alwaysUpdateValue_accessor_storage; }
-            set alwaysUpdateValue(value) { this.#alwaysUpdateValue_accessor_storage = value; }
-            constructor() {
-                super(...arguments);
-                __runInitializers(this, _alwaysUpdateValue_extraInitializers);
-            }
-        };
-    })();
-    customElements.define("test-element", TestElement);
-    it("should initialize with default value", () => {
-        const element = new TestElement();
-        assert.equal(element.value, "initial");
-    });
-    it("should update value and trigger binding", async () => {
-        const element = new TestElement();
-        let oldValue = null;
-        let newValue = null;
-        element.dispatchEvent(new JoistValueEvent(new JExpression("value"), (update) => {
-            oldValue = update.oldValue;
-            newValue = update.newValue;
-        }));
-        assert.equal(oldValue, null);
-        assert.equal(newValue, "initial");
-        element.value = "updated";
-        await Promise.resolve();
-        assert.equal(oldValue, "initial");
-        assert.equal(newValue, "updated");
-    });
-    it("should trigger binding on every change with alwaysUpdate option", async () => {
-        const element = new TestElement();
-        let bindingCount = 0;
-        let oldValue;
-        let newValue;
-        element.dispatchEvent(new JoistValueEvent(new JExpression("alwaysUpdateValue"), (update) => {
-            bindingCount++;
-            oldValue = update.oldValue;
-            newValue = update.newValue;
-        }));
-        assert.equal(bindingCount, 1);
-        assert.equal(oldValue, null);
-        assert.equal(newValue, "initial");
-        element.value = "something else";
-        await Promise.resolve();
-        assert.equal(bindingCount, 2);
-        assert.equal(oldValue, "initial");
-        assert.equal(newValue, "initial");
-    });
-});
-//# sourceMappingURL=bind.test.js.map

package/target/lib/bind.test.js.map

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

package/target/lib/define.d.ts

@@ -1,16 +0,0 @@
-import { JoistAsyncElement } from "./elements/async.element.js";
-import { JoistForElement } from "./elements/for.element.js";
-import { JoistIfElement } from "./elements/if.element.js";
-import { JoistBindElement } from "./elements/bind.element.js";
-import { JoistValueElement } from "./elements/value.element.js";
-import { JoistScopeElement } from "./elements/scope.element.js";
-declare global {
-    interface HTMLElementTagNameMap {
-        "j-async": JoistAsyncElement;
-        "j-for": JoistForElement;
-        "j-if": JoistIfElement;
-        "j-bind": JoistBindElement;
-        "j-val": JoistValueElement;
-        "j-scope": JoistScopeElement;
-    }
-}

package/target/lib/define.js

@@ -1,14 +0,0 @@
-import { define } from "@joist/element/define.js";
-import { JoistAsyncElement } from "./elements/async.element.js";
-import { JoistForElement } from "./elements/for.element.js";
-import { JoistIfElement } from "./elements/if.element.js";
-import { JoistBindElement } from "./elements/bind.element.js";
-import { JoistValueElement } from "./elements/value.element.js";
-import { JoistScopeElement } from "./elements/scope.element.js";
-define({ tagName: "j-async" }, JoistAsyncElement);
-define({ tagName: "j-for" }, JoistForElement);
-define({ tagName: "j-if" }, JoistIfElement);
-define({ tagName: "j-bind" }, JoistBindElement);
-define({ tagName: "j-val" }, JoistValueElement);
-define({ tagName: "j-scope" }, JoistScopeElement);
-//# sourceMappingURL=define.js.map

package/target/lib/define.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"define.js","sourceRoot":"","sources":["../../src/lib/define.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAChE,OAAO,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAC5D,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAC1D,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAC9D,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAChE,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAahE,MAAM,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,iBAAiB,CAAC,CAAC;AAClD,MAAM,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE,eAAe,CAAC,CAAC;AAC9C,MAAM,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,cAAc,CAAC,CAAC;AAC5C,MAAM,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,gBAAgB,CAAC,CAAC;AAChD,MAAM,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE,iBAAiB,CAAC,CAAC;AAChD,MAAM,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,iBAAiB,CAAC,CAAC"}

package/target/lib/elements/async.element.d.ts

@@ -1,13 +0,0 @@
-export type AsyncState<T = unknown, E = unknown> = {
-    status: "loading" | "error" | "success";
-    data?: T;
-    error?: E;
-};
-export declare class JoistAsyncElement extends HTMLElement {
-    #private;
-    accessor bind: string;
-    accessor dependsOn: string;
-    accessor state: AsyncState | null;
-    connectedCallback(): Promise<void>;
-    disconnectedCallback(): void;
-}

package/target/lib/elements/async.element.js

@@ -1,133 +0,0 @@
-import { __esDecorate, __runInitializers } from "tslib";
-import { attr, element, queryAll, css, html } from "@joist/element";
-import { bind } from "../bind.js";
-import { JoistValueEvent } from "../events.js";
-import { JExpression } from "../expression.js";
-let JoistAsyncElement = (() => {
-    let _classDecorators = [element({
-            shadowDom: [css `:host{display: contents;}`, html `<slot></slot>`],
-        })];
-    let _classDescriptor;
-    let _classExtraInitializers = [];
-    let _classThis;
-    let _classSuper = HTMLElement;
-    let _bind_decorators;
-    let _bind_initializers = [];
-    let _bind_extraInitializers = [];
-    let _dependsOn_decorators;
-    let _dependsOn_initializers = [];
-    let _dependsOn_extraInitializers = [];
-    let _state_decorators;
-    let _state_initializers = [];
-    let _state_extraInitializers = [];
-    var JoistAsyncElement = class extends _classSuper {
-        static { _classThis = this; }
-        static {
-            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
-            _bind_decorators = [attr()];
-            _dependsOn_decorators = [attr({
-                    name: "depends-on",
-                })];
-            _state_decorators = [bind()];
-            __esDecorate(this, null, _bind_decorators, { kind: "accessor", name: "bind", static: false, private: false, access: { has: obj => "bind" in obj, get: obj => obj.bind, set: (obj, value) => { obj.bind = value; } }, metadata: _metadata }, _bind_initializers, _bind_extraInitializers);
-            __esDecorate(this, null, _dependsOn_decorators, { kind: "accessor", name: "dependsOn", static: false, private: false, access: { has: obj => "dependsOn" in obj, get: obj => obj.dependsOn, set: (obj, value) => { obj.dependsOn = value; } }, metadata: _metadata }, _dependsOn_initializers, _dependsOn_extraInitializers);
-            __esDecorate(this, null, _state_decorators, { kind: "accessor", name: "state", static: false, private: false, access: { has: obj => "state" in obj, get: obj => obj.state, set: (obj, value) => { obj.state = value; } }, metadata: _metadata }, _state_initializers, _state_extraInitializers);
-            __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
-            JoistAsyncElement = _classThis = _classDescriptor.value;
-            if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
-            __runInitializers(_classThis, _classExtraInitializers);
-        }
-        #bind_accessor_storage = __runInitializers(this, _bind_initializers, "");
-        get bind() { return this.#bind_accessor_storage; }
-        set bind(value) { this.#bind_accessor_storage = value; }
-        #dependsOn_accessor_storage = (__runInitializers(this, _bind_extraInitializers), __runInitializers(this, _dependsOn_initializers, ""));
-        get dependsOn() { return this.#dependsOn_accessor_storage; }
-        set dependsOn(value) { this.#dependsOn_accessor_storage = value; }
-        #state_accessor_storage = (__runInitializers(this, _dependsOn_extraInitializers), __runInitializers(this, _state_initializers, null));
-        get state() { return this.#state_accessor_storage; }
-        set state(value) { this.#state_accessor_storage = value; }
-        #templates = (__runInitializers(this, _state_extraInitializers), queryAll("template", this));
-        #currentNodes = [];
-        #cachedTemplates = {
-            loading: undefined,
-            error: undefined,
-            success: undefined,
-        };
-        async connectedCallback() {
-            this.#clean();
-            const templates = Array.from(this.#templates());
-            this.#cachedTemplates = {
-                loading: templates.find((t) => t.hasAttribute("loading")),
-                error: templates.find((t) => t.hasAttribute("error")),
-                success: templates.find((t) => t.hasAttribute("success")),
-            };
-            if (this.dependsOn) {
-                await Promise.all(this.dependsOn.split(",").map((tag) => window.customElements.whenDefined(tag)));
-            }
-            const token = new JExpression(this.bind);
-            this.dispatchEvent(new JoistValueEvent(token, ({ newValue, oldValue }) => {
-                if (newValue !== oldValue) {
-                    if (newValue instanceof Promise) {
-                        this.#handlePromise(newValue);
-                    }
-                    else if (this.#isAsyncState(newValue)) {
-                        this.#handleState(newValue);
-                    }
-                    else {
-                        console.warn("j-async bind value must be a Promise or AsyncState");
-                    }
-                }
-            }));
-        }
-        #isAsyncState(value) {
-            return (typeof value === "object" &&
-                value !== null &&
-                "status" in value &&
-                (value.status === "loading" || value.status === "error" || value.status === "success"));
-        }
-        async #handlePromise(promise) {
-            try {
-                this.#handleState({ status: "loading" });
-                const data = await promise;
-                this.#handleState({ status: "success", data });
-            }
-            catch (error) {
-                this.#handleState({ status: "error", error });
-            }
-        }
-        #handleState(state) {
-            this.#clean();
-            let template = undefined;
-            this.state = state;
-            switch (state.status) {
-                case "loading":
-                    template = this.#cachedTemplates.loading;
-                    break;
-                case "error":
-                    template = this.#cachedTemplates.error;
-                    break;
-                case "success":
-                    template = this.#cachedTemplates.success;
-                    break;
-            }
-            if (template) {
-                const content = document.importNode(template.content, true);
-                const nodes = Array.from(content.childNodes);
-                this.appendChild(content);
-                this.#currentNodes = nodes;
-            }
-        }
-        #clean() {
-            for (const node of this.#currentNodes) {
-                node.parentNode?.removeChild(node);
-            }
-            this.#currentNodes = [];
-        }
-        disconnectedCallback() {
-            this.#clean();
-        }
-    };
-    return JoistAsyncElement = _classThis;
-})();
-export { JoistAsyncElement };
-//# sourceMappingURL=async.element.js.map

package/target/lib/elements/async.element.js.map

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

package/target/lib/elements/async.element.test.d.ts

@@ -1 +0,0 @@
-import "../define.js";