@threadlabs/looma 0.25.6 → 0.26.0

package/vanilla/UiNavItem.js

@@ -1,85 +1,36 @@
-// Generated by HTML Next 1.0.0-alpha.29 for Vanilla DOM. Do not edit.
-import { componentRootIndex, manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
+// Generated by HTML Next 1.0.0-alpha.35 for Vanilla DOM. Do not edit.
+import { attachGeneratedController, buildTemplate, NONCONFORMING, readIndex, textCall, toAttribute, writeAttribute, writeUrlAttribute, dispose, formatOf, keywordFormat, hostState, acceptProps, manageProps, project, fillSlot, armElement, replaceRoot, checkFormat, checkString } from "@nextwebwg/html-next/generated-runtime";
 import "../styles/ui-nav-item.css";
 
-const definition = {...{"contract":{"tag":"ui-nav-item","props":{"as":{"type":{"kind":"terminal","name":"keyword"},"values":["button","a"],"required":false,"target":{"attribute":"as"},"default":"button"},"current":{"type":{"kind":"terminal","name":"keyword"},"values":["true","false","page","step","location"],"required":false,"target":{"attribute":"current"},"default":"false"},"density":{"type":{"kind":"terminal","name":"keyword"},"values":["comfortable","compact"],"required":false,"target":{"attribute":"density"},"default":"comfortable"},"href":{"type":"string","required":false,"target":{"attribute":"href"}},"rel":{"type":"string","required":false,"target":{"attribute":"rel"}},"target":{"type":"string","required":false,"target":{"attribute":"target"}},"variant":{"type":{"kind":"terminal","name":"keyword"},"values":["surface","line"],"required":false,"target":{"attribute":"variant"},"default":"surface"}}},"template":{"kind":"element","name":"template","attributes":[],"children":[{"kind":"element","name":"a","attributes":[{"kind":"attribute","name":"href","expression":"href","expressionPlan":{"source":"href","ast":{"kind":"id","name":"href"},"dependencies":["href"]}},{"kind":"attribute","name":"target","expression":"target","expressionPlan":{"source":"target","ast":{"kind":"id","name":"target"},"dependencies":["target"]}},{"kind":"attribute","name":"rel","expression":"rel","expressionPlan":{"source":"rel","ast":{"kind":"id","name":"rel"},"dependencies":["rel"]}},{"kind":"attribute","name":"aria-current","expression":"{ true: 'page', false: null, page: 'page', step: 'step', location: 'location' }[concat(current)]","expressionPlan":{"source":"{ true: 'page', false: null, page: 'page', step: 'step', location: 'location' }[concat(current)]","ast":{"kind":"index","object":{"kind":"object","pairs":[{"key":"true","value":{"kind":"literal","value":"page"}},{"key":"false","value":{"kind":"literal","value":null}},{"key":"page","value":{"kind":"literal","value":"page"}},{"key":"step","value":{"kind":"literal","value":"step"}},{"key":"location","value":{"kind":"literal","value":"location"}}]},"index":{"kind":"call","fn":"concat","args":[{"kind":"id","name":"current"}]}},"dependencies":["current"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"indicator"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"leading"}],"children":[{"kind":"slot","fallback":[],"name":"leading"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"content"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"label"}],"children":[{"kind":"slot"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"description"}],"children":[{"kind":"slot","fallback":[],"name":"description"}]}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"trailing"}],"children":[{"kind":"slot","fallback":[],"name":"trailing"}]}],"flow":{"kind":"when","test":"as = 'a'","testPlan":{"source":"as = 'a'","ast":{"kind":"binary","op":"=","left":{"kind":"id","name":"as"},"right":{"kind":"literal","value":"a"}},"dependencies":["as"]}}},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"aria-current","expression":"{ true: 'page', false: null, page: 'page', step: 'step', location: 'location' }[concat(current)]","expressionPlan":{"source":"{ true: 'page', false: null, page: 'page', step: 'step', location: 'location' }[concat(current)]","ast":{"kind":"index","object":{"kind":"object","pairs":[{"key":"true","value":{"kind":"literal","value":"page"}},{"key":"false","value":{"kind":"literal","value":null}},{"key":"page","value":{"kind":"literal","value":"page"}},{"key":"step","value":{"kind":"literal","value":"step"}},{"key":"location","value":{"kind":"literal","value":"location"}}]},"index":{"kind":"call","fn":"concat","args":[{"kind":"id","name":"current"}]}},"dependencies":["current"]}}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"indicator"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"leading"}],"children":[{"kind":"slot","fallback":[],"name":"leading"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"content"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"label"}],"children":[{"kind":"slot"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"description"}],"children":[{"kind":"slot","fallback":[],"name":"description"}]}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"trailing"}],"children":[{"kind":"slot","fallback":[],"name":"trailing"}]}],"flow":{"kind":"else"}}],"flow":{"kind":"match"}},"declarations":[],"root":{"kind":"native","element":"button","choices":["a","button"]}},source:{file:import.meta.url},css:""};
+const T0 = ["",[],["span",["class","indicator","aria-hidden","true"]],["span",["class","leading"],4],["span",["class","content"],["span",["class","label"],4],["span",["class","description"],4]],["span",["class","trailing"],4]];
+const T1 = ["",[]];
+const T2 = ["",[]];
+const T3 = ["",[]];
+const T4 = ["",[]];
+const T5 = ["",[],["span",["class","indicator","aria-hidden","true"]],["span",["class","leading"],4],["span",["class","content"],["span",["class","label"],4],["span",["class","description"],4]],["span",["class","trailing"],4]];
+const T6 = ["",[]];
+const T7 = ["",[]];
+const T8 = ["",[]];
+const T9 = ["",[]];
+let P0, P1, P2, P3, P4, P5, P6, P7, P8, P9;
+const S = { n: [], t: [], f: import.meta.url, g: "ui-nav-item" };
+const A = [["a",{},[],"",[],["data-ui-nav-item-state","data-as","data-current","data-density","data-href","data-rel","data-target","data-variant","href","target","rel","aria-current"]],["button",{"type":"button"},[],"",[],["data-ui-nav-item-state","data-as","data-current","data-density","data-href","data-rel","data-target","data-variant","aria-current"]]];
+const Q = [[],[]];
+const D = { props: { "as": { "required":false,"values":["button","a"],"default":"button", c: checkFormat("keyword", keywordFormat), t: "keyword", j: 0, m: ["p",formatOf(keywordFormat),false] }, "current": { "required":false,"values":["true","false","page","step","location"],"default":"false", 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] }, "href": { "required":false, c: checkString, t: "string", j: 0, m: "s" }, "rel": { "required":false, c: checkString, t: "string", j: 0, m: "s" }, "target": { "required":false, c: checkString, t: "string", j: 0, m: "s" }, "variant": { "required":false,"values":["surface","line"],"default":"surface", c: checkFormat("keyword", keywordFormat), t: "keyword", j: 0, m: ["p",formatOf(keywordFormat),false] } } };
 
-export function createUiNavItem(options = {}) {
+export function createUiNavItem(options = {}, html) {
   const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
-  const projected = [];
-  const root = componentRootIndex(definition, componentProps);
+  const v = [null, null, null, null, null, null, null];
+  acceptProps(undefined, D, S.n, v, componentProps, [], html);
+  let a = ((v[0] === "a") ? 0 : 1);
   let element;
-  if (root === 0) {
+  if (a === 0) {
     element = document.createElement("a");
     for (const [name, value] of Object.entries(attributes)) {
       if (value === null || value === undefined || value === false) continue;
       element.setAttribute(name, value === true ? "" : String(value));
     }
-    const value0 = componentProps["href"] === undefined ? null : componentProps["href"];
-    if (value0 === null || value0 === undefined) element.removeAttribute("href");
-    else element.setAttribute("href", String(value0));
-    const value1 = componentProps["target"] === undefined ? null : componentProps["target"];
-    if (value1 === null || value1 === undefined) element.removeAttribute("target");
-    else element.setAttribute("target", String(value1));
-    const value2 = componentProps["rel"] === undefined ? null : componentProps["rel"];
-    if (value2 === null || value2 === undefined) element.removeAttribute("rel");
-    else element.setAttribute("rel", String(value2));
     element.setAttribute("data-component", "ui-nav-item");
-    const element0 = document.createElement("span");
-    element0.setAttribute("class", "indicator");
-    element0.setAttribute("aria-hidden", "true");
-    element.append(element0);
-    const element1 = document.createElement("span");
-    element1.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"]);
-        element1.append(node);
-      }
-    } else {
-    }
-    element.append(element1);
-    const element2 = document.createElement("span");
-    element2.setAttribute("class", "content");
-    const element3 = document.createElement("span");
-    element3.setAttribute("class", "label");
-    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, ""]);
-        element3.append(node);
-      }
-    } else {
-    }
-    element2.append(element3);
-    const element4 = document.createElement("span");
-    element4.setAttribute("class", "description");
-    if (slots["description"] ?? [].length > 0) {
-      for (const child of slots["description"] ?? []) {
-        const node = typeof child === "string" ? document.createTextNode(child) : child;
-        if (node.nodeType === 1) node.setAttribute("data-slotted", "");
-        projected.push([node, "description"]);
-        element4.append(node);
-      }
-    } else {
-    }
-    element2.append(element4);
-    element.append(element2);
-    const element5 = document.createElement("span");
-    element5.setAttribute("class", "trailing");
-    if (slots["trailing"] ?? [].length > 0) {
-      for (const child of slots["trailing"] ?? []) {
-        const node = typeof child === "string" ? document.createTextNode(child) : child;
-        if (node.nodeType === 1) node.setAttribute("data-slotted", "");
-        projected.push([node, "trailing"]);
-        element5.append(node);
-      }
-    } else {
-    }
-    element.append(element5);
   } else {
     element = document.createElement("button");
     for (const [name, value] of Object.entries(attributes)) {
@@ -88,64 +39,189 @@ export function createUiNavItem(options = {}) {
     }
     if (!element.hasAttribute("type")) element.setAttribute("type", "button");
     element.setAttribute("data-component", "ui-nav-item");
-    const element6 = document.createElement("span");
-    element6.setAttribute("class", "indicator");
-    element6.setAttribute("aria-hidden", "true");
-    element.append(element6);
-    const element7 = document.createElement("span");
-    element7.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"]);
-        element7.append(node);
-      }
-    } else {
+  }
+  const B = acceptProps(element, D, S.n, v, componentProps, Q[a], 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 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 m6 = (d) => {
+    const n = (P6 ??= buildTemplate(T6)).cloneNode(true);
+    const r = { n };
+    p6(r, -1, d);
+    return r;
+  };
+  const p6 = (r, c, d) => {
+  };
+  const m7 = (d) => {
+    const n = (P7 ??= buildTemplate(T7)).cloneNode(true);
+    const r = { n };
+    p7(r, -1, d);
+    return r;
+  };
+  const p7 = (r, c, d) => {
+  };
+  const m8 = (d) => {
+    const n = (P8 ??= buildTemplate(T8)).cloneNode(true);
+    const r = { n };
+    p8(r, -1, d);
+    return r;
+  };
+  const p8 = (r, c, d) => {
+  };
+  const m9 = (d) => {
+    const n = (P9 ??= buildTemplate(T9)).cloneNode(true);
+    const r = { n };
+    p9(r, -1, d);
+    return r;
+  };
+  const p9 = (r, c, d) => {
+  };
+  const m0 = (n, d) => {
+    n.append((P0 ??= buildTemplate(T0)).cloneNode(true));
+    const t0 = n.firstChild.nextSibling;
+    const t1 = t0.firstChild;
+    const t2 = t0.nextSibling;
+    const t3 = t2.firstChild;
+    const t4 = t3.firstChild;
+    const t5 = t3.nextSibling.firstChild;
+    const t6 = t2.nextSibling.firstChild;
+    const r = { n, v0: undefined, v1: undefined, v2: undefined, v3: undefined, v4: undefined, a1: t1, e0: t1.nextSibling, b0: undefined, f0: undefined, a2: t4, e1: t4.nextSibling, b1: undefined, f1: undefined, a3: t5, e2: t5.nextSibling, b2: undefined, f2: undefined, a4: t6, e3: t6.nextSibling, b3: undefined, f3: undefined };
+    p0(r, -1, d);
+    return r;
+  };
+  const p0 = (r, c, d) => {
+    if (c & 8) {
+      const x0 = v[3];
+      const s0 = toAttribute(x0, "href");
+      if (s0 !== r.v0) writeUrlAttribute(r.n, "href", r.v0 = s0);
+    }
+    if (c & 32) {
+      const x1 = v[5];
+      const s1 = toAttribute(x1, "target");
+      if (s1 !== r.v1) writeAttribute(r.n, "target", r.v1 = s1);
+    }
+    if (c & 16) {
+      const x2 = v[4];
+      const s2 = toAttribute(x2, "rel");
+      if (s2 !== r.v2) writeAttribute(r.n, "rel", r.v2 = s2);
     }
-    element.append(element7);
-    const element8 = document.createElement("span");
-    element8.setAttribute("class", "content");
-    const element9 = document.createElement("span");
-    element9.setAttribute("class", "label");
-    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, ""]);
-        element9.append(node);
+    if (c & 1073741826) {
+      const x3 = readIndex({ "true": "page", "false": null, "page": "page", "step": "step", "location": "location" }, textCall("concat", [v[1]]));
+      if (x3 !== NONCONFORMING) {
+        const s3 = toAttribute(x3, "aria-current");
+        if (s3 !== r.v3) writeAttribute(r.n, "aria-current", r.v3 = s3);
       }
-    } else {
     }
-    element8.append(element9);
-    const element10 = document.createElement("span");
-    element10.setAttribute("class", "description");
-    if (slots["description"] ?? [].length > 0) {
-      for (const child of slots["description"] ?? []) {
-        const node = typeof child === "string" ? document.createTextNode(child) : child;
-        if (node.nodeType === 1) node.setAttribute("data-slotted", "");
-        projected.push([node, "description"]);
-        element10.append(node);
+    if (c & 68) {
+      const x4 = hostState(["variant","density"], [v[6], v[2]]);
+      const s4 = x4;
+      if (s4 !== r.v4) writeAttribute(r.n, "data-ui-nav-item-state", (r.v4 = s4) === "" ? null : s4);
+    }
+    if (r.f0 === undefined) { r.f0 = 1; const at = fillSlot(r.a1, 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.a2, 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.a3, r.e2, "description", 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.a4, r.e3, "trailing", 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 m5 = (n, d) => {
+    n.append((P5 ??= buildTemplate(T5)).cloneNode(true));
+    const t0 = n.firstChild.nextSibling;
+    const t1 = t0.firstChild;
+    const t2 = t0.nextSibling;
+    const t3 = t2.firstChild;
+    const t4 = t3.firstChild;
+    const t5 = t3.nextSibling.firstChild;
+    const t6 = t2.nextSibling.firstChild;
+    const r = { n, v0: undefined, v1: undefined, a1: t1, e0: t1.nextSibling, b0: undefined, f0: undefined, a2: t4, e1: t4.nextSibling, b1: undefined, f1: undefined, a3: t5, e2: t5.nextSibling, b2: undefined, f2: undefined, a4: t6, e3: t6.nextSibling, b3: undefined, f3: undefined };
+    p5(r, -1, d);
+    return r;
+  };
+  const p5 = (r, c, d) => {
+    if (c & 1073741826) {
+      const x0 = readIndex({ "true": "page", "false": null, "page": "page", "step": "step", "location": "location" }, textCall("concat", [v[1]]));
+      if (x0 !== NONCONFORMING) {
+        const s0 = toAttribute(x0, "aria-current");
+        if (s0 !== r.v0) writeAttribute(r.n, "aria-current", r.v0 = s0);
       }
-    } else {
     }
-    element8.append(element10);
-    element.append(element8);
-    const element11 = document.createElement("span");
-    element11.setAttribute("class", "trailing");
-    if (slots["trailing"] ?? [].length > 0) {
-      for (const child of slots["trailing"] ?? []) {
-        const node = typeof child === "string" ? document.createTextNode(child) : child;
-        if (node.nodeType === 1) node.setAttribute("data-slotted", "");
-        projected.push([node, "trailing"]);
-        element11.append(node);
+    if (c & 68) {
+      const x1 = hostState(["variant","density"], [v[6], v[2]]);
+      const s1 = x1;
+      if (s1 !== r.v1) writeAttribute(r.n, "data-ui-nav-item-state", (r.v1 = s1) === "" ? null : s1);
+    }
+    if (r.f0 === undefined) { r.f0 = 1; const at = fillSlot(r.a1, 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 = m6(d); at.before(r.b0.n); } }
+    else if (r.b0 !== undefined) p6(r.b0, c, d);
+    if (r.f1 === undefined) { r.f1 = 1; const at = fillSlot(r.a2, 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 = m7(d); at.before(r.b1.n); } }
+    else if (r.b1 !== undefined) p7(r.b1, c, d);
+    if (r.f2 === undefined) { r.f2 = 1; const at = fillSlot(r.a3, r.e2, "description", 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 = m8(d); at.before(r.b2.n); } }
+    else if (r.b2 !== undefined) p8(r.b2, c, d);
+    if (r.f3 === undefined) { r.f3 = 1; const at = fillSlot(r.a4, r.e3, "trailing", 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 = m9(d); at.before(r.b3.n); } }
+    else if (r.b3 !== undefined) p9(r.b3, c, d);
+  };
+  const M = [m0, m5], N = [p0, p5];
+  let R;
+  const p = (c, d) => {
+    if (R === null) return;
+    if (R === undefined) { R = M[a](element, d); return; }
+    if (c & 1) {
+      const t = ((v[0] === "a") ? 0 : 1);
+      if (t !== a) {
+        dispose(R);
+        for (const key in I.r) delete I.r[key];
+        const previous = I.e, next = armElement(previous, A[a], A[t]);
+        I.B.b = Q[t];
+        a = t;
+        R = null;
+        R = M[t](next, d);
+        replaceRoot(I, previous, next);
+        return;
       }
-    } else {
     }
-    element.append(element11);
-  }
-  manageComponentLifecycle(element, definition, { props: componentProps, projected,
-  });
+    N[a](R, c, d);
+  };
+  const I = { B };
+  const J = project(I, children, slots);
+  attachGeneratedController(element, S, v, p, undefined, undefined, I);
+  manageProps(I);
   return element;
 }
-

package/vanilla/UiPageHeader.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 UiPageHeaderEventMap {
 }
 export interface UiPageHeaderElement extends HTMLElement {

package/vanilla/UiPageHeader.js

@@ -1,81 +1,103 @@
-// Generated by HTML Next 1.0.0-alpha.29 for Vanilla DOM. Do not edit.
-import { manageGeneratedProp } from "@nextwebwg/html-next/generated-runtime";
+// Generated by HTML Next 1.0.0-alpha.35 for Vanilla DOM. Do not edit.
+import { attachGeneratedController, buildTemplate, writeAttribute, dispose, formatOf, keywordFormat, hostState, acceptProps, manageProps, project, fillSlot, checkFormat } from "@nextwebwg/html-next/generated-runtime";
 import "../styles/ui-page-header.css";
 
-export function createUiPageHeader(options = {}) {
+const T0 = ["",[],["span",["class","leading"],4],["span",["class","copy"],["span",["class","eyebrow"],4],["h1",["class","title"],4],["span",["class","description"],4]],["span",["class","actions"],4]];
+const T1 = ["",[]];
+const T2 = ["",[]];
+const T3 = ["",[]];
+const T4 = ["",[]];
+const T5 = ["",[]];
+let P0, P1, P2, P3, P4, P5;
+const S = { n: [], t: [], f: import.meta.url, g: "ui-page-header" };
+const D = { props: { "align": { "required":false,"values":["start","center"],"default":"start", c: checkFormat("keyword", keywordFormat), t: "keyword", j: 0, m: ["p",formatOf(keywordFormat),false] } } };
+
+export function createUiPageHeader(options = {}, html) {
   const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
-  const projected = [];
-  const prop0 = componentProps["align"] === undefined ? "start" : componentProps["align"];
   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-page-header");
-  const element0 = document.createElement("span");
-  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("span");
-  element1.setAttribute("class", "copy");
-  const element2 = document.createElement("span");
-  element2.setAttribute("class", "eyebrow");
-  if (slots["eyebrow"] ?? [].length > 0) {
-    for (const child of slots["eyebrow"] ?? []) {
-      const node = typeof child === "string" ? document.createTextNode(child) : child;
-      if (node.nodeType === 1) node.setAttribute("data-slotted", "");
-      projected.push([node, "eyebrow"]);
-      element2.append(node);
+  element.append((P0 ??= buildTemplate(T0)).cloneNode(true));
+  const v = [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 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 m5 = (d) => {
+    const n = (P5 ??= buildTemplate(T5)).cloneNode(true);
+    const r = { n };
+    p5(r, -1, d);
+    return r;
+  };
+  const p5 = (r, c, d) => {
+  };
+  const p0 = (r, c, d) => {
+    if (c & 1) {
+      const x0 = hostState(["align"], [v[0]]);
+      const s0 = x0;
+      if (s0 !== r.v0) writeAttribute(r.n, "data-ui-page-header-state", (r.v0 = s0) === "" ? null : s0);
     }
-  } else {
-  }
-  element1.append(element2);
-  const element3 = document.createElement("h1");
-  element3.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, ""]);
-      element3.append(node);
-    }
-  } else {
-  }
-  element1.append(element3);
-  const element4 = document.createElement("span");
-  element4.setAttribute("class", "description");
-  if (slots["description"] ?? [].length > 0) {
-    for (const child of slots["description"] ?? []) {
-      const node = typeof child === "string" ? document.createTextNode(child) : child;
-      if (node.nodeType === 1) node.setAttribute("data-slotted", "");
-      projected.push([node, "description"]);
-      element4.append(node);
-    }
-  } else {
-  }
-  element1.append(element4);
-  element.append(element1);
-  const element5 = document.createElement("span");
-  element5.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"]);
-      element5.append(node);
-    }
-  } else {
-  }
-  element.append(element5);
-  manageGeneratedProp(element, { name: "align", attribute: "data-align", value: componentProps["align"], default: "start", type: ["start","center"], required: false });
+    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, "eyebrow", 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, "", 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, "description", 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);
+    if (r.f4 === undefined) { r.f4 = 1; const at = fillSlot(r.a4, r.e4, "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.b4 = m5(d); at.before(r.b4.n); } }
+    else if (r.b4 !== undefined) p5(r.b4, c, d);
+  };
+  const t0 = element.firstChild;
+  const t1 = t0.firstChild;
+  const t2 = t0.nextSibling;
+  const t3 = t2.firstChild;
+  const t4 = t3.firstChild;
+  const t5 = t3.nextSibling;
+  const t6 = t5.firstChild;
+  const t7 = t5.nextSibling.firstChild;
+  const t8 = t2.nextSibling.firstChild;
+  const R = { n: element, v0: undefined, a0: t1, e0: t1.nextSibling, b0: undefined, f0: undefined, a1: t4, e1: t4.nextSibling, b1: undefined, f1: undefined, a2: t6, e2: t6.nextSibling, b2: undefined, f2: undefined, a3: t7, e3: t7.nextSibling, b3: undefined, f3: undefined, a4: t8, e4: t8.nextSibling, b4: undefined, f4: undefined };
+  const I = { B };
+  const J = project(I, children, slots);
+  attachGeneratedController(element, S, v, ((c, d) => p0(R, c, d)), undefined, undefined, I);
+  manageProps(I);
   return element;
 }
-

package/vanilla/UiPopover.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 UiPopoverEventMap {
   open: CustomEvent<{ readonly open: boolean; readonly reason: "action" | "programmatic" | "light-dismiss" | "escape"; readonly trigger: "keyboard" | "pointer" | "programmatic" }>;
   close: CustomEvent<{ readonly open: boolean; readonly reason: "action" | "programmatic" | "light-dismiss" | "escape"; readonly trigger: "keyboard" | "pointer" | "programmatic" }>;