@joist/element 4.2.2 → 4.2.3-next.1

package/target/lib/template.d.ts

@@ -1,11 +0,0 @@
-type TemplateValueGetter = (key: string) => string;
-export interface TemplateOpts {
-    value?: TemplateValueGetter;
-    tokenPrefix?: string;
-}
-export interface RenderOpts {
-    refresh?: boolean;
-}
-export declare function template({ tokenPrefix, value }?: TemplateOpts): <T extends HTMLElement>(this: T, opts?: RenderOpts) => void;
-export declare function getTemplateValue(obj: object, key: string): any;
-export {};

package/target/lib/template.js

@@ -1,89 +0,0 @@
-class Updates extends Set {
-}
-export function template({ tokenPrefix = "#:", value } = {}) {
-    let updates = null;
-    return function render(opts) {
-        if (!updates || opts?.refresh) {
-            updates = findUpdates(this, {
-                tokenPrefix,
-                value: value ?? ((key) => getTemplateValue(this, key)),
-            });
-        }
-        else {
-            for (const update of updates) {
-                update();
-            }
-        }
-    };
-}
-function findUpdates(el, opts) {
-    const iterator = document.createTreeWalker(el.shadowRoot ?? el, NodeFilter.SHOW_ELEMENT);
-    const updates = new Updates();
-    while (iterator.nextNode()) {
-        const res = trackElement(iterator.currentNode, updates, opts);
-        if (res !== null) {
-            iterator.currentNode = res;
-        }
-    }
-    return updates;
-}
-function trackElement(node, updates, opts) {
-    const element = node;
-    const getter = opts.value;
-    const tokenPrefix = opts.tokenPrefix;
-    for (const attr of element.attributes) {
-        const nodeValue = attr.value.trim();
-        const realAttributeName = attr.name.replace(tokenPrefix, "");
-        let update = null;
-        if (attr.name.startsWith(`${tokenPrefix}bind`)) {
-            update = () => {
-                const value = getter(attr.value);
-                if (element.textContent !== value) {
-                    element.textContent = getter(attr.value);
-                }
-            };
-        }
-        else if (attr.name.startsWith(tokenPrefix)) {
-            const isBooleanAttr = nodeValue.startsWith("!");
-            const isPositive = nodeValue.startsWith("!!");
-            const propertyKey = nodeValue.replaceAll("!", "");
-            if (isBooleanAttr) {
-                update = () => {
-                    const value = isPositive
-                        ? !!getter(propertyKey)
-                        : !getter(propertyKey);
-                    if (value) {
-                        element.setAttribute(realAttributeName, "");
-                    }
-                    else {
-                        element.removeAttribute(realAttributeName);
-                    }
-                };
-            }
-            else {
-                const realAttribute = document.createAttribute(realAttributeName);
-                element.setAttributeNode(realAttribute);
-                update = () => {
-                    const value = getter(nodeValue);
-                    if (realAttribute.value !== value) {
-                        realAttribute.value = value;
-                    }
-                };
-            }
-        }
-        if (update) {
-            updates.add(update);
-            update();
-        }
-    }
-    return null;
-}
-export function getTemplateValue(obj, key) {
-    const parsed = key.split(".");
-    let pointer = obj;
-    for (const part of parsed) {
-        pointer = pointer[part];
-    }
-    return pointer;
-}
-//# sourceMappingURL=template.js.map

package/target/lib/template.js.map

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

package/target/lib/template.test.js

@@ -1,91 +0,0 @@
-import { assert } from "chai";
-import { template } from "./template.js";
-const TESTS = [
-    function bindableNodes(el, root) {
-        it(`should intialize bindable nodes ${root instanceof ShadowRoot ? "(ShadowDOM)" : "(LightDOM)"}`, () => {
-            el.title = "Hello World";
-            el.ariaLabel = "This is the label";
-            el.ariaDescription = "This is the description";
-            root.innerHTML = `
-        <span #:bind="title"></span>
-        
-        <ul>
-          <li #:bind="ariaLabel"></li>
-          <li #:bind="ariaDescription"></li>
-        </ul>
-      `;
-            const render = template().bind(el);
-            render();
-            assert.equal(root.innerHTML
-                .split("\n")
-                .map((res) => res.trim())
-                .join(""), '<span #:bind="title">Hello World</span><ul><li #:bind="ariaLabel">This is the label</li><li #:bind="ariaDescription">This is the description</li></ul>');
-        });
-    },
-    function attributeNodes(el, root) {
-        it(`should intialize template attributes ${root instanceof ShadowRoot ? "(ShadowDOM)" : "(LightDOM)"}`, () => {
-            el.ariaLabel = "This is the label";
-            el.ariaDescription = "This is the description";
-            root.innerHTML = `
-        <ul #:aria-label="ariaLabel" #:aria-description="ariaDescription"></ul>
-      `;
-            const render = template().bind(el);
-            render();
-            assert.equal(root.innerHTML
-                .split("\n")
-                .map((res) => res.trim())
-                .join(""), '<ul #:aria-label="ariaLabel" #:aria-description="ariaDescription" aria-label="This is the label" aria-description="This is the description"></ul>');
-        });
-    },
-    function customGetter(el, root) {
-        it(`should use custom getter for values ${root instanceof ShadowRoot ? "(ShadowDOM)" : "(LightDOM)"}`, () => {
-            const data = {
-                title: "Hello World",
-                ariaLabel: "This is the label",
-                ariaDescription: "This is the description",
-            };
-            root.innerHTML = `
-        <span #:bind="title"></span>
-        
-        <ul>
-          <li #:bind="ariaLabel"></li>
-          <li #:bind="ariaDescription"></li>
-        </ul>
-      `;
-            const render = template({ value: (key) => data[key] }).bind(el);
-            render();
-            assert.equal(root.innerHTML
-                .split("\n")
-                .map((res) => res.trim())
-                .join(""), '<span #:bind="title">Hello World</span><ul><li #:bind="ariaLabel">This is the label</li><li #:bind="ariaDescription">This is the description</li></ul>');
-        });
-    },
-    function customPrefix(el, root) {
-        it(`should use custom getter for values ${root instanceof ShadowRoot ? "(ShadowDOM)" : "(LightDOM)"}`, () => {
-            el.title = "Hello World";
-            el.ariaLabel = "This is the label";
-            el.ariaDescription = "This is the description";
-            root.innerHTML = `
-        <span x-bind="title"></span>
-        
-        <ul x-aria-label="ariaLabel">
-          <li x-bind="ariaLabel"></li>
-          <li x-bind="ariaDescription"></li>
-        </ul>
-      `;
-            const render = template({ tokenPrefix: "x-" }).bind(el);
-            render();
-            assert.equal(root.innerHTML
-                .split("\n")
-                .map((res) => res.trim())
-                .join(""), '<span x-bind="title">Hello World</span><ul x-aria-label="ariaLabel" aria-label="This is the label"><li x-bind="ariaLabel">This is the label</li><li x-bind="ariaDescription">This is the description</li></ul>');
-        });
-    },
-];
-for (const test of TESTS) {
-    const lightEl = document.createElement("div");
-    test(lightEl, lightEl);
-    const shadowEl = document.createElement("div");
-    test(shadowEl, shadowEl.attachShadow({ mode: "open" }));
-}
-//# sourceMappingURL=template.test.js.map

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

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