@threadlabs/looma 0.25.6 → 0.26.0

package/vanilla/UiTabs.js

@@ -1,57 +1,112 @@
-// 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, KeyedList, NONCONFORMING, readMember, textCall, toAttribute, toText, trackContainer, writeAttribute, writeText, dispatchDeclared, detailCheck, dispose, formatOf, keywordFormat, hostState, acceptProps, manageProps, project, fillSlot, checkBoolean, checkConstrained, checkFormat, checkObject, checkString } from "@nextwebwg/html-next/generated-runtime";
 import * as controller from "../components/ui-tabs/ui-tabs.js";
 import "../styles/ui-tabs.css";
 
-const definition = {...{"contract":{"tag":"ui-tabs","props":{"activation":{"type":{"kind":"terminal","name":"keyword"},"values":["auto","manual"],"required":false,"target":{"attribute":"activation"},"default":"auto"},"density":{"type":{"kind":"terminal","name":"keyword"},"values":["comfortable","compact"],"required":false,"target":{"attribute":"density"},"default":"comfortable"},"label":{"type":"string","required":false,"target":{"attribute":"aria-label"},"default":"Tabs"},"orientation":{"type":{"kind":"terminal","name":"keyword"},"values":["horizontal","vertical"],"required":false,"target":{"attribute":"aria-orientation"},"default":"horizontal"},"stretch":{"type":"boolean","required":false,"target":{"attribute":"stretch"},"default":false},"value":{"type":"string","required":false,"target":{"attribute":"value"},"default":""}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"list"},{"kind":"literal","name":"role","value":"tablist"},{"kind":"attribute","name":"aria-label","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}},{"kind":"attribute","name":"aria-orientation","expression":"orientation","expressionPlan":{"source":"orientation","ast":{"kind":"id","name":"orientation"},"dependencies":["orientation"]}}],"children":[{"kind":"slot","fallback":[{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"role","value":"tab"},{"kind":"attribute","name":"id","expression":"concat(tab.id, '-tab')","expressionPlan":{"source":"concat(tab.id, '-tab')","ast":{"kind":"call","fn":"concat","args":[{"kind":"member","object":{"kind":"id","name":"tab"},"key":"id"},{"kind":"literal","value":"-tab"}]},"dependencies":["tab.id"]}},{"kind":"attribute","name":"value","expression":"tab.id","expressionPlan":{"source":"tab.id","ast":{"kind":"member","object":{"kind":"id","name":"tab"},"key":"id"},"dependencies":["tab.id"]}},{"kind":"attribute","name":"aria-controls","expression":"tab.id","expressionPlan":{"source":"tab.id","ast":{"kind":"member","object":{"kind":"id","name":"tab"},"key":"id"},"dependencies":["tab.id"]}},{"kind":"attribute","name":"aria-selected","expression":"tab.id = internalValue","expressionPlan":{"source":"tab.id = internalValue","ast":{"kind":"binary","op":"=","left":{"kind":"member","object":{"kind":"id","name":"tab"},"key":"id"},"right":{"kind":"id","name":"internalValue"}},"dependencies":["internalValue","tab.id"]}},{"kind":"directive","name":"value","expression":"tab.label","expressionPlan":{"source":"tab.label","ast":{"kind":"member","object":{"kind":"id","name":"tab"},"key":"label"},"dependencies":["tab.label"]}}],"children":[],"flow":{"kind":"each","item":"tab","list":"tabs","listPlan":{"source":"tabs","ast":{"kind":"id","name":"tabs"},"dependencies":["tabs"]},"key":"tab.id","keyPlan":{"source":"tab.id","ast":{"kind":"member","object":{"kind":"id","name":"tab"},"key":"id"},"dependencies":["tab.id"]}}}],"name":"tab"}],"ref":"list"},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"panels"}],"children":[{"kind":"slot"}],"ref":"panels"}]},"declarations":[{"kind":"state","name":"internalValue","type":"string","value":"","expression":{"source":"\"\"","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"state","name":"tabs","type":"list(object({ id: string, label: string }))","value":"[]","expression":{"source":"[]","ast":{"kind":"array","items":[]},"dependencies":[]}},{"kind":"event","name":"select","type":"object","shape":{"kind":"object","fields":[{"name":"value","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"previousValue","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}],"root":{"kind":"native","element":"div","choices":["div"]}},source:{file:import.meta.url},css:""};
+const T0 = ["",[],["div",["class","list","role","tablist"],4],["div",["class","panels"],4]];
+const T1 = ["",[],2];
+const T2 = ["button",["type","button","role","tab"],0];
+const T3 = ["",[]];
+let P0, P1, P2, P3;
+const E = new Map();
+const S = { n: ["internalValue","tabs"], t: ["s",["l",["o",["id","s","label","s"]]]], f: import.meta.url, g: "ui-tabs", d: { "select": [detailCheck(checkObject([["value", checkString, false], ["previousValue", checkString, false], ["trigger", checkConstrained(checkFormat("keyword", keywordFormat), "keyword", {"values":["keyboard","pointer","programmatic"]}), false]], false)), true, true, false] }, x: dispatchDeclared };
+const D = { props: { "activation": { "required":false,"values":["auto","manual"],"default":"auto", c: checkFormat("keyword", keywordFormat), t: "keyword", j: 0, m: ["p",formatOf(keywordFormat),false] }, "density": { "required":false,"values":["comfortable","compact"],"default":"comfortable", c: checkFormat("keyword", keywordFormat), t: "keyword", j: 0, m: ["p",formatOf(keywordFormat),false] }, "label": { "required":false,"default":"Tabs", c: checkString, t: "string", j: 0, m: "s" }, "orientation": { "required":false,"values":["horizontal","vertical"],"default":"horizontal", c: checkFormat("keyword", keywordFormat), t: "keyword", j: 0, m: ["p",formatOf(keywordFormat),false] }, "stretch": { "required":false,"default":false, c: checkBoolean, t: "boolean", j: 0, m: "b" }, "value": { "required":false,"default":"", c: checkString, t: "string", j: 0, m: "s" } } };
+const C = (host) => controller.default(host);
 
-export function createUiTabs(options = {}) {
+export function createUiTabs(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;
     element.setAttribute(name, value === true ? "" : String(value));
   }
   element.setAttribute("data-component", "ui-tabs");
-  const element0 = document.createElement("div");
-  element0.setAttribute("class", "list");
-  element0.setAttribute("role", "tablist");
-  const value0 = componentProps["label"] === undefined ? "Tabs" : componentProps["label"];
-  if (value0 === null || value0 === undefined) element0.removeAttribute("aria-label");
-  else element0.setAttribute("aria-label", String(value0));
-  const value1 = componentProps["orientation"] === undefined ? "horizontal" : componentProps["orientation"];
-  if (value1 === null || value1 === undefined) element0.removeAttribute("aria-orientation");
-  else element0.setAttribute("aria-orientation", String(value1));
-  if (slots["tab"] ?? [].length > 0) {
-    for (const child of slots["tab"] ?? []) {
-      const node = typeof child === "string" ? document.createTextNode(child) : child;
-      if (node.nodeType === 1) node.setAttribute("data-slotted", "");
-      projected.push([node, "tab"]);
-      element0.append(node);
+  element.append((P0 ??= buildTemplate(T0)).cloneNode(true));
+  const v = ["", [], 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 t0 = n.firstChild;
+    const r = { n, L0: new KeyedList(t0, t0.nextSibling, m2, p2, (o) => readMember(o, "id"), "tab") };
+    p1(r, -1, d);
+    return r;
+  };
+  const p1 = (r, c, d) => {
+    if (c & 1073741826) r.L0.update(v[1], d, c);
+    if (c !== -1 && c & 1) r.L0.each(c, d);
+  };
+  const m2 = (o, j, l) => {
+    const n = (P2 ??= buildTemplate(T2)).cloneNode(true);
+    const r = { k: undefined, i: o, n, x: 0, y: 0, w: 0, v0: null, v1: null, v2: null, v3: null, v4: undefined };
+    p2(r, -1, E);
+    return r;
+  };
+  const p2 = (r, c, d) => {
+    const o = r.i;
+    if (c & 1073741824) {
+      r.w = 0;
+      const x0 = textCall("concat", [trackContainer(r, readMember(o, "id")), "-tab"]);
+      if (x0 !== NONCONFORMING) {
+        const s0 = toAttribute(x0, "id");
+        if (s0 !== r.v0) writeAttribute(r.n, "id", r.v0 = s0);
+      }
+      const x1 = trackContainer(r, readMember(o, "id"));
+      const s1 = toAttribute(x1, "value");
+      if (s1 !== r.v1) writeAttribute(r.n, "value", r.v1 = s1);
+      const s2 = toAttribute(x1, "aria-controls");
+      if (s2 !== r.v2) writeAttribute(r.n, "aria-controls", r.v2 = s2);
+      const x2 = trackContainer(r, readMember(o, "label"));
+      const s4 = toText(x2);
+      if (s4 !== r.v4) writeText(r.n, r.v4 = s4);
     }
-  } else {
-  const element1 = document.createElement("button");
-  element1.setAttribute("type", "button");
-  element1.setAttribute("role", "tab");
-  element0.append(element1);
-  }
-  element.append(element0);
-  const element2 = document.createElement("div");
-  element2.setAttribute("class", "panels");
-  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, ""]);
-      element2.append(node);
+    if (c & 1073741825) {
+      const x3 = (readMember(o, "id") === v[0]);
+      const s3 = toAttribute(x3, "aria-selected");
+      if (s3 !== r.v3) writeAttribute(r.n, "aria-selected", r.v3 = s3);
     }
-  } else {
-  }
-  element.append(element2);
-  manageComponentLifecycle(element, definition, { props: componentProps, projected,
-    controller,
-  });
+  };
+  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 p0 = (r, c, d) => {
+    if (c & 16) {
+      const x0 = v[4];
+      const s0 = toAttribute(x0, "aria-label");
+      if (s0 !== r.v0) writeAttribute(r.a0, "aria-label", r.v0 = s0);
+    }
+    if (c & 1073741856) {
+      const x1 = v[5];
+      const s1 = toAttribute(x1, "aria-orientation");
+      if (s1 !== r.v1) writeAttribute(r.a0, "aria-orientation", r.v1 = s1);
+    }
+    if (c & 104) {
+      const x2 = hostState(["density","stretch","orientation"], [v[3], v[6], v[5]]);
+      const s2 = x2;
+      if (s2 !== r.v2) writeAttribute(r.n, "data-ui-tabs-state", (r.v2 = s2) === "" ? null : s2);
+    }
+    if (r.f0 === undefined) { r.f0 = 1; const at = fillSlot(r.a1, r.e0, "tab", J, true, 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.a3, 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 = m3(d); at.before(r.b1.n); } }
+    else if (r.b1 !== undefined) p3(r.b1, c, d);
+  };
+  const t0 = element.firstChild;
+  const t1 = t0.firstChild;
+  const t2 = t0.nextSibling;
+  const t3 = t2.firstChild;
+  const R = { n: element, a0: t0, v0: null, v1: null, v2: undefined, a1: t1, e0: t1.nextSibling, b0: undefined, f0: undefined, a3: t3, e1: t3.nextSibling, b1: undefined, f1: undefined };
+  const I = { B };
+  const J = project(I, children, slots);
+  I.R = new Set();
+  attachGeneratedController(element, S, v, (c, d) => { ((c, d) => p0(R, c, d))(c, d); for (const f of I.R) f(c, d); }, C, undefined, I);
+  manageProps(I);
+  I.r["list"] = t0;
+  I.r["panels"] = t2;
   return element;
 }
-

package/vanilla/UiText.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 UiTextEventMap {
 }
 export interface UiTextElement extends HTMLElement {