@threadlabs/looma 0.25.7 → 0.26.0

package/vanilla/UiTopBar.js

@@ -1,63 +1,81 @@
-// Generated by HTML Next 1.0.0-alpha.29 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.35 for Vanilla DOM. Do not edit.
+import { attachGeneratedController, buildTemplate, dispose, project, fillSlot } from "@nextwebwg/html-next/generated-runtime";
 import "../styles/ui-top-bar.css";
 
+const T0 = ["",[],["div",["class","leading"],4],["div",["class","title"],4],["div",["class","search"],4],["div",["class","actions"],4]];
+const T1 = ["",[]];
+const T2 = ["",[]];
+const T3 = ["",[]];
+const T4 = ["",[]];
+let P0, P1, P2, P3, P4;
+const S = { n: [], t: [], f: import.meta.url, g: "ui-top-bar" };
+
 export function createUiTopBar(options = {}) {
-  const { attributes = {}, children = [], slots = {} } = options;
-  const projected = [];
+  const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
   const element = document.createElement("header");
   for (const [name, value] of Object.entries(attributes)) {
     if (value === null || value === undefined || value === false) continue;
     element.setAttribute(name, value === true ? "" : String(value));
   }
   element.setAttribute("data-component", "ui-top-bar");
-  const element0 = document.createElement("div");
-  element0.setAttribute("class", "leading");
-  if (slots["leading"] ?? [].length > 0) {
-    for (const child of slots["leading"] ?? []) {
-      const node = typeof child === "string" ? document.createTextNode(child) : child;
-      if (node.nodeType === 1) node.setAttribute("data-slotted", "");
-      projected.push([node, "leading"]);
-      element0.append(node);
-    }
-  } else {
-  }
-  element.append(element0);
-  const element1 = document.createElement("div");
-  element1.setAttribute("class", "title");
-  if (children.length > 0) {
-    for (const child of children) {
-      const node = typeof child === "string" ? document.createTextNode(child) : child;
-      if (node.nodeType === 1) node.setAttribute("data-slotted", "");
-      projected.push([node, ""]);
-      element1.append(node);
-    }
-  } else {
-  }
-  element.append(element1);
-  const element2 = document.createElement("div");
-  element2.setAttribute("class", "search");
-  if (slots["search"] ?? [].length > 0) {
-    for (const child of slots["search"] ?? []) {
-      const node = typeof child === "string" ? document.createTextNode(child) : child;
-      if (node.nodeType === 1) node.setAttribute("data-slotted", "");
-      projected.push([node, "search"]);
-      element2.append(node);
-    }
-  } else {
-  }
-  element.append(element2);
-  const element3 = document.createElement("div");
-  element3.setAttribute("class", "actions");
-  if (slots["actions"] ?? [].length > 0) {
-    for (const child of slots["actions"] ?? []) {
-      const node = typeof child === "string" ? document.createTextNode(child) : child;
-      if (node.nodeType === 1) node.setAttribute("data-slotted", "");
-      projected.push([node, "actions"]);
-      element3.append(node);
-    }
-  } else {
-  }
-  element.append(element3);
+  element.append((P0 ??= buildTemplate(T0)).cloneNode(true));
+  const v = [];
+  const m1 = (d) => {
+    const n = (P1 ??= buildTemplate(T1)).cloneNode(true);
+    const r = { n };
+    p1(r, -1, d);
+    return r;
+  };
+  const p1 = (r, c, d) => {
+  };
+  const m2 = (d) => {
+    const n = (P2 ??= buildTemplate(T2)).cloneNode(true);
+    const r = { n };
+    p2(r, -1, d);
+    return r;
+  };
+  const p2 = (r, c, d) => {
+  };
+  const m3 = (d) => {
+    const n = (P3 ??= buildTemplate(T3)).cloneNode(true);
+    const r = { n };
+    p3(r, -1, d);
+    return r;
+  };
+  const p3 = (r, c, d) => {
+  };
+  const m4 = (d) => {
+    const n = (P4 ??= buildTemplate(T4)).cloneNode(true);
+    const r = { n };
+    p4(r, -1, d);
+    return r;
+  };
+  const p4 = (r, c, d) => {
+  };
+  const p0 = (r, c, d) => {
+    if (r.f0 === undefined) { r.f0 = 1; const at = fillSlot(r.a0, r.e0, "leading", J, false, undefined, d);
+      if (Array.isArray(at)) (r.z ??= []).push(() => { at[0].l.delete(at[1]); dispose(at[1]); }); else if (at !== undefined) { r.b0 = m1(d); at.before(r.b0.n); } }
+    else if (r.b0 !== undefined) p1(r.b0, c, d);
+    if (r.f1 === undefined) { r.f1 = 1; const at = fillSlot(r.a1, r.e1, "", J, false, undefined, d);
+      if (Array.isArray(at)) (r.z ??= []).push(() => { at[0].l.delete(at[1]); dispose(at[1]); }); else if (at !== undefined) { r.b1 = m2(d); at.before(r.b1.n); } }
+    else if (r.b1 !== undefined) p2(r.b1, c, d);
+    if (r.f2 === undefined) { r.f2 = 1; const at = fillSlot(r.a2, r.e2, "search", J, false, undefined, d);
+      if (Array.isArray(at)) (r.z ??= []).push(() => { at[0].l.delete(at[1]); dispose(at[1]); }); else if (at !== undefined) { r.b2 = m3(d); at.before(r.b2.n); } }
+    else if (r.b2 !== undefined) p3(r.b2, c, d);
+    if (r.f3 === undefined) { r.f3 = 1; const at = fillSlot(r.a3, r.e3, "actions", J, false, undefined, d);
+      if (Array.isArray(at)) (r.z ??= []).push(() => { at[0].l.delete(at[1]); dispose(at[1]); }); else if (at !== undefined) { r.b3 = m4(d); at.before(r.b3.n); } }
+    else if (r.b3 !== undefined) p4(r.b3, c, d);
+  };
+  const t0 = element.firstChild;
+  const t1 = t0.firstChild;
+  const t2 = t0.nextSibling;
+  const t3 = t2.firstChild;
+  const t4 = t2.nextSibling;
+  const t5 = t4.firstChild;
+  const t6 = t4.nextSibling.firstChild;
+  const R = { a0: t1, e0: t1.nextSibling, b0: undefined, f0: undefined, a1: t3, e1: t3.nextSibling, b1: undefined, f1: undefined, a2: t5, e2: t5.nextSibling, b2: undefined, f2: undefined, a3: t6, e3: t6.nextSibling, b3: undefined, f3: undefined };
+  const I = {};
+  const J = project(I, children, slots);
+  attachGeneratedController(element, S, v, ((c, d) => p0(R, c, d)), undefined, undefined, I);
   return element;
 }
-

package/vanilla/UiTree.d.ts

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.29 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.35 for Vanilla DOM. Do not edit.
 export interface UiTreeEventMap {
   reorder: CustomEvent<{ readonly sourceId: string; readonly targetId: string; readonly position: "before" | "inside" | "after"; readonly sourceType: string; readonly targetType: string; readonly sourceScope: string; readonly targetScope: string; readonly trigger: "keyboard" | "pointer" | "programmatic" }>;
   "reorder-rejected": CustomEvent<{ readonly sourceId: string; readonly targetId: string; readonly position: "before" | "inside" | "after"; readonly reason: "max-depth"; readonly maxDepth: number; readonly resultingDepth: number; readonly trigger: "keyboard" | "pointer" | "programmatic" }>;

package/vanilla/UiTree.js

@@ -1,13 +1,17 @@
-// Generated by HTML Next 1.0.0-alpha.29 for Vanilla DOM. Do not edit.
-import { manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
+// Generated by HTML Next 1.0.0-alpha.35 for Vanilla DOM. Do not edit.
+import { attachGeneratedController, buildTemplate, writeAttribute, dispatchDeclared, detailCheck, dispose, formatOf, keywordFormat, hostState, acceptProps, manageProps, project, fillSlot, checkBoolean, checkConstrained, checkFormat, checkInteger, checkList, checkNumber, checkObject, checkString } from "@nextwebwg/html-next/generated-runtime";
 import * as controller from "../components/ui-tree/ui-tree.js";
 import "../styles/ui-tree.css";
 
-const definition = {...{"contract":{"tag":"ui-tree","props":{"density":{"type":{"kind":"terminal","name":"keyword"},"values":["comfortable","compact"],"required":false,"target":{"attribute":"density"},"default":"comfortable"},"hoverExpandDelay":{"type":"number","required":false,"target":{"attribute":"hoverexpanddelay"},"default":700},"label":{"type":"string","required":false,"target":{"attribute":"label"},"default":"Tree"},"marquee":{"type":"boolean","required":false,"target":{"attribute":"marquee"},"default":false},"maxDepth":{"type":"number","required":false,"target":{"attribute":"maxdepth"},"default":0},"moveActivation":{"type":{"kind":"terminal","name":"keyword"},"values":["click","keyboard-touch"],"required":false,"target":{"attribute":"moveactivation"},"default":"click"},"selection":{"type":{"kind":"terminal","name":"keyword"},"values":["none","single","multiple"],"required":false,"target":{"attribute":"selection"},"default":"none"}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"tree"}],"children":[{"kind":"slot"}]},"declarations":[{"kind":"event","name":"reorder","type":"object","shape":{"kind":"object","fields":[{"name":"sourceId","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"targetId","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"position","type":{"kind":"constrained","base":{"kind":"terminal","name":"keyword"},"values":["before","inside","after"]},"optional":false},{"name":"sourceType","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"targetType","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"sourceScope","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"targetScope","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"trigger","type":{"kind":"constrained","base":{"kind":"terminal","name":"keyword"},"values":["keyboard","pointer","programmatic"]},"optional":false}],"open":false},"bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"reorder-rejected","type":"object","shape":{"kind":"object","fields":[{"name":"sourceId","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"targetId","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"position","type":{"kind":"constrained","base":{"kind":"terminal","name":"keyword"},"values":["before","inside","after"]},"optional":false},{"name":"reason","type":{"kind":"constrained","base":{"kind":"terminal","name":"keyword"},"values":["max-depth"]},"optional":false},{"name":"maxDepth","type":{"kind":"terminal","name":"integer"},"optional":false},{"name":"resultingDepth","type":{"kind":"terminal","name":"integer"},"optional":false},{"name":"trigger","type":{"kind":"constrained","base":{"kind":"terminal","name":"keyword"},"values":["keyboard","pointer","programmatic"]},"optional":false}],"open":false},"bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"activate","type":"object","shape":{"kind":"object","fields":[{"name":"id","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"trigger","type":{"kind":"constrained","base":{"kind":"terminal","name":"keyword"},"values":["keyboard","pointer"]},"optional":false}],"open":false},"bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"select","type":"object","shape":{"kind":"object","fields":[{"name":"ids","type":{"kind":"list","item":{"kind":"terminal","name":"string"}},"optional":false},{"name":"trigger","type":{"kind":"constrained","base":{"kind":"terminal","name":"keyword"},"values":["keyboard","pointer","programmatic"]},"optional":false}],"open":false},"bubbles":true,"composed":true,"cancelable":false}],"root":{"kind":"native","element":"div","choices":["div"]}},source:{file:import.meta.url},css:""};
+const T0 = ["",[],4];
+const T1 = ["",[]];
+let P0, P1;
+const S = { n: [], t: [], f: import.meta.url, g: "ui-tree", d: { "reorder": [detailCheck(checkObject([["sourceId", checkString, false], ["targetId", checkString, false], ["position", checkConstrained(checkFormat("keyword", keywordFormat), "keyword", {"values":["before","inside","after"]}), false], ["sourceType", checkString, false], ["targetType", checkString, false], ["sourceScope", checkString, false], ["targetScope", checkString, false], ["trigger", checkConstrained(checkFormat("keyword", keywordFormat), "keyword", {"values":["keyboard","pointer","programmatic"]}), false]], false)), true, true, false], "reorder-rejected": [detailCheck(checkObject([["sourceId", checkString, false], ["targetId", checkString, false], ["position", checkConstrained(checkFormat("keyword", keywordFormat), "keyword", {"values":["before","inside","after"]}), false], ["reason", checkConstrained(checkFormat("keyword", keywordFormat), "keyword", {"values":["max-depth"]}), false], ["maxDepth", checkInteger, false], ["resultingDepth", checkInteger, false], ["trigger", checkConstrained(checkFormat("keyword", keywordFormat), "keyword", {"values":["keyboard","pointer","programmatic"]}), false]], false)), true, true, false], "activate": [detailCheck(checkObject([["id", checkString, false], ["trigger", checkConstrained(checkFormat("keyword", keywordFormat), "keyword", {"values":["keyboard","pointer"]}), false]], false)), true, true, false], "select": [detailCheck(checkObject([["ids", checkList(checkString), false], ["trigger", checkConstrained(checkFormat("keyword", keywordFormat), "keyword", {"values":["keyboard","pointer","programmatic"]}), false]], false)), true, true, false] }, x: dispatchDeclared };
+const D = { props: { "density": { "required":false,"values":["comfortable","compact"],"default":"comfortable", c: checkFormat("keyword", keywordFormat), t: "keyword", j: 0, m: ["p",formatOf(keywordFormat),false] }, "hoverExpandDelay": { "required":false,"default":700, c: checkNumber, t: "number", j: 0, m: "n" }, "label": { "required":false,"default":"Tree", c: checkString, t: "string", j: 0, m: "s" }, "marquee": { "required":false,"default":false, c: checkBoolean, t: "boolean", j: 0, m: "b" }, "maxDepth": { "required":false,"default":0, c: checkNumber, t: "number", j: 0, m: "n" }, "moveActivation": { "required":false,"values":["click","keyboard-touch"],"default":"click", c: checkFormat("keyword", keywordFormat), t: "keyword", j: 0, m: ["p",formatOf(keywordFormat),false] }, "selection": { "required":false,"values":["none","single","multiple"],"default":"none", c: checkFormat("keyword", keywordFormat), t: "keyword", j: 0, m: ["p",formatOf(keywordFormat),false] } } };
+const C = (host) => controller.default(host);
 
-export function createUiTree(options = {}) {
+export function createUiTree(options = {}, html) {
   const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
-  const projected = [];
   const element = document.createElement("div");
   for (const [name, value] of Object.entries(attributes)) {
     if (value === null || value === undefined || value === false) continue;
@@ -15,18 +19,32 @@ export function createUiTree(options = {}) {
   }
   if (!element.hasAttribute("role")) element.setAttribute("role", "tree");
   element.setAttribute("data-component", "ui-tree");
-  if (children.length > 0) {
-    for (const child of children) {
-      const node = typeof child === "string" ? document.createTextNode(child) : child;
-      if (node.nodeType === 1) node.setAttribute("data-slotted", "");
-      projected.push([node, ""]);
-      element.append(node);
+  element.append((P0 ??= buildTemplate(T0)).cloneNode(true));
+  const v = [null, null, null, null, null, null, null];
+  const B = acceptProps(element, D, S.n, v, componentProps, [], html);
+  const m1 = (d) => {
+    const n = (P1 ??= buildTemplate(T1)).cloneNode(true);
+    const r = { n };
+    p1(r, -1, d);
+    return r;
+  };
+  const p1 = (r, c, d) => {
+  };
+  const p0 = (r, c, d) => {
+    if (c & 9) {
+      const x0 = hostState(["marquee","density"], [v[3], v[0]]);
+      const s0 = x0;
+      if (s0 !== r.v0) writeAttribute(r.n, "data-ui-tree-state", (r.v0 = s0) === "" ? null : s0);
     }
-  } else {
-  }
-  manageComponentLifecycle(element, definition, { props: componentProps, projected,
-    controller,
-  });
+    if (r.f0 === undefined) { r.f0 = 1; const at = fillSlot(r.a0, r.e0, "", J, false, undefined, d);
+      if (Array.isArray(at)) (r.z ??= []).push(() => { at[0].l.delete(at[1]); dispose(at[1]); }); else if (at !== undefined) { r.b0 = m1(d); at.before(r.b0.n); } }
+    else if (r.b0 !== undefined) p1(r.b0, c, d);
+  };
+  const t0 = element.firstChild;
+  const R = { n: element, v0: undefined, a0: t0, e0: t0.nextSibling, b0: undefined, f0: undefined };
+  const I = { B };
+  const J = project(I, children, slots);
+  attachGeneratedController(element, S, v, ((c, d) => p0(R, c, d)), C, undefined, I);
+  manageProps(I);
   return element;
 }
-

package/vanilla/UiTreeItem.d.ts

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.29 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.35 for Vanilla DOM. Do not edit.
 export interface UiTreeItemEventMap {
   expand: CustomEvent<{ readonly id: string; readonly expanded: boolean; readonly trigger: "keyboard" | "pointer" | "programmatic" }>;
 }