@threadlabs/looma 0.25.7 → 0.26.1

package/vanilla/UiContainer.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 UiContainerEventMap {
 }
 export interface UiContainerElement extends HTMLDivElement {

package/vanilla/UiContainer.js

@@ -1,31 +1,47 @@
-// Generated by HTML Next 1.0.0-alpha.29 for Vanilla DOM. Do not edit.
-import { manageGeneratedProps } 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-container.css";
 
-export function createUiContainer(options = {}) {
+const T0 = ["",[],4];
+const T1 = ["",[]];
+let P0, P1;
+const S = { n: [], t: [], f: import.meta.url, g: "ui-container" };
+const D = { props: { "gutters": { "required":false,"values":["s","m","l"], c: checkFormat("keyword", keywordFormat), t: "keyword", j: 0, m: ["p",formatOf(keywordFormat),false] }, "measure": { "required":false,"values":["narrow","wide"], c: checkFormat("keyword", keywordFormat), t: "keyword", j: 0, m: ["p",formatOf(keywordFormat),false] } } };
+
+export function createUiContainer(options = {}, html) {
   const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
-  const projected = [];
-  const prop0 = componentProps["gutters"] === undefined ? undefined : componentProps["gutters"];
-  const prop1 = componentProps["measure"] === undefined ? undefined : componentProps["measure"];
   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-container");
-  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];
+  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 & 3) {
+      const x0 = hostState(["measure","gutters"], [v[1], v[0]]);
+      const s0 = x0;
+      if (s0 !== r.v0) writeAttribute(r.n, "data-ui-container-state", (r.v0 = s0) === "" ? null : s0);
     }
-  } else {
-  }
-  manageGeneratedProps(element, [
-    { name: "gutters", attribute: "data-gutters", value: componentProps["gutters"], type: ["s","m","l"], required: false },
-    { name: "measure", attribute: "data-measure", value: componentProps["measure"], type: ["narrow","wide"], required: false },
-  ]);
+    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)), undefined, undefined, I);
+  manageProps(I);
   return element;
 }
-

package/vanilla/UiContextMenu.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 UiContextMenuEventMap {
   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" }>;

package/vanilla/UiContextMenu.js

@@ -1,36 +1,47 @@
-// 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, dispatchDeclared, detailCheck, dispose, keywordFormat, acceptProps, manageProps, project, fillSlot, checkBoolean, checkConstrained, checkFormat, checkObject, checkString } from "@nextwebwg/html-next/generated-runtime";
 import * as controller from "../components/ui-context-menu/ui-context-menu.js";
 import "../styles/ui-context-menu.css";
 
-const definition = {...{"contract":{"tag":"ui-context-menu","props":{"for":{"type":"string","required":false,"target":{"attribute":"for"},"default":""},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"default":false}}},"template":{"kind":"element","name":"span","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"menu"},{"kind":"literal","name":"role","value":"menu"},{"kind":"literal","name":"aria-orientation","value":"vertical"}],"children":[{"kind":"slot"}],"ref":"menu"}]},"declarations":[{"kind":"state","name":"internalOpen","type":"boolean","value":"false","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"open","type":"object","shape":{"kind":"object","fields":[{"name":"open","type":{"kind":"terminal","name":"boolean"},"optional":false},{"name":"reason","type":{"kind":"constrained","base":{"kind":"terminal","name":"keyword"},"values":["action","programmatic","light-dismiss","escape"]},"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":"close","type":"object","shape":{"kind":"object","fields":[{"name":"open","type":{"kind":"terminal","name":"boolean"},"optional":false},{"name":"reason","type":{"kind":"constrained","base":{"kind":"terminal","name":"keyword"},"values":["action","programmatic","light-dismiss","escape"]},"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":"select","type":"object","shape":{"kind":"object","fields":[{"name":"value","type":{"kind":"terminal","name":"string"},"optional":false},{"name":"checked","type":{"kind":"terminal","name":"boolean"},"optional":true},{"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":"span","choices":["span"]}},source:{file:import.meta.url},css:""};
+const T0 = ["",[],["div",["class","menu","role","menu","aria-orientation","vertical"],4]];
+const T1 = ["",[]];
+let P0, P1;
+const S = { n: ["internalOpen"], t: ["b"], f: import.meta.url, g: "ui-context-menu", d: { "open": [detailCheck(checkObject([["open", checkBoolean, false], ["reason", checkConstrained(checkFormat("keyword", keywordFormat), "keyword", {"values":["action","programmatic","light-dismiss","escape"]}), false], ["trigger", checkConstrained(checkFormat("keyword", keywordFormat), "keyword", {"values":["keyboard","pointer","programmatic"]}), false]], false)), true, true, false], "close": [detailCheck(checkObject([["open", checkBoolean, false], ["reason", checkConstrained(checkFormat("keyword", keywordFormat), "keyword", {"values":["action","programmatic","light-dismiss","escape"]}), false], ["trigger", checkConstrained(checkFormat("keyword", keywordFormat), "keyword", {"values":["keyboard","pointer","programmatic"]}), false]], false)), true, true, false], "select": [detailCheck(checkObject([["value", checkString, false], ["checked", checkBoolean, true], ["trigger", checkConstrained(checkFormat("keyword", keywordFormat), "keyword", {"values":["keyboard","pointer","programmatic"]}), false]], false)), true, true, false] }, x: dispatchDeclared };
+const D = { props: { "for": { "required":false,"default":"", c: checkString, t: "string", j: 0, m: "s" }, "open": { "required":false,"default":false, c: checkBoolean, t: "boolean", j: 0, m: "b" } } };
+const C = (host) => controller.default(host);
 
-export function createUiContextMenu(options = {}) {
+export function createUiContextMenu(options = {}, html) {
   const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
-  const projected = [];
   const element = document.createElement("span");
   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-context-menu");
-  const element0 = document.createElement("div");
-  element0.setAttribute("class", "menu");
-  element0.setAttribute("role", "menu");
-  element0.setAttribute("aria-orientation", "vertical");
-  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, ""]);
-      element0.append(node);
-    }
-  } else {
-  }
-  element.append(element0);
-  manageComponentLifecycle(element, definition, { props: componentProps, projected,
-    controller,
-  });
+  element.append((P0 ??= buildTemplate(T0)).cloneNode(true));
+  const v = [false, 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 (r.f0 === undefined) { r.f0 = 1; const at = fillSlot(r.a1, 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 t1 = t0.firstChild;
+  const R = { a1: t1, e0: t1.nextSibling, b0: undefined, f0: 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["menu"] = t0;
   return element;
 }
-

package/vanilla/UiCover.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 UiCoverEventMap {
 }
 export interface UiCoverElement extends HTMLDivElement {

package/vanilla/UiCover.js

@@ -1,27 +1,47 @@
-// 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-cover.css";
 
-export function createUiCover(options = {}) {
+const T0 = ["",[],4];
+const T1 = ["",[]];
+let P0, P1;
+const S = { n: [], t: [], f: import.meta.url, g: "ui-cover" };
+const D = { props: { "size": { "required":false,"values":["screen","fill"],"default":"screen", c: checkFormat("keyword", keywordFormat), t: "keyword", j: 0, m: ["p",formatOf(keywordFormat),false] } } };
+
+export function createUiCover(options = {}, html) {
   const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
-  const projected = [];
-  const prop0 = componentProps["size"] === undefined ? "screen" : componentProps["size"];
   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-cover");
-  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];
+  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 & 1) {
+      const x0 = hostState(["size"], [v[0]]);
+      const s0 = x0;
+      if (s0 !== r.v0) writeAttribute(r.n, "data-ui-cover-state", (r.v0 = s0) === "" ? null : s0);
     }
-  } else {
-  }
-  manageGeneratedProp(element, { name: "size", attribute: "data-size", value: componentProps["size"], default: "screen", type: ["screen","fill"], required: false });
+    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)), undefined, undefined, I);
+  manageProps(I);
   return element;
 }
-

package/vanilla/UiDescriptionItem.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 UiDescriptionItemEventMap {
 }
 export interface UiDescriptionItemElement extends HTMLDivElement {

package/vanilla/UiDescriptionItem.js

@@ -1,36 +1,49 @@
-// 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, toText, dispose, acceptProps, manageProps, project, fillSlot, checkString } from "@nextwebwg/html-next/generated-runtime";
 import "../styles/ui-description-item.css";
 
-export function createUiDescriptionItem(options = {}) {
+const T0 = ["",[],["dt",[],0],["dd",[],4]];
+const T1 = ["",[]];
+let P0, P1;
+const S = { n: [], t: [], f: import.meta.url, g: "ui-description-item" };
+const D = { props: { "term": { "required":false,"default":"", c: checkString, t: "string", j: 0, m: "s" } } };
+
+export function createUiDescriptionItem(options = {}, html) {
   const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
-  const projected = [];
-  const prop0 = componentProps["term"] === undefined ? "" : componentProps["term"];
   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-description-item");
-  const element0 = document.createElement("dt");
-  const text1 = document.createTextNode("");
-  element0.append(text1);
-  text1.data = prop0 == null ? "" : String(prop0);
-  element.append(element0);
-  const element2 = document.createElement("dd");
-  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);
+  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 p0 = (r, c, d) => {
+    if (c & 1) {
+      const x0 = v[0];
+      const s0 = toText(x0);
+      if (s0 !== r.v0) r.a0.data = r.v0 = s0;
     }
-  } else {
-  }
-  element.append(element2);
-  manageGeneratedProp(element, { name: "term", attribute: "data-term", value: componentProps["term"], default: "", type: "string", required: false }, (value) => {
-      text1.textContent = value == null ? "" : String(value);
-  });
+    if (r.f0 === undefined) { r.f0 = 1; const at = fillSlot(r.a1, 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 t1 = t0.firstChild;
+  const t2 = t0.nextSibling.firstChild;
+  const R = { a0: t1, v0: "", a1: t2, e0: t2.nextSibling, b0: undefined, f0: 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/UiDescriptionList.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 UiDescriptionListEventMap {
 }
 export interface UiDescriptionListElement extends HTMLDListElement {

package/vanilla/UiDescriptionList.js

@@ -1,33 +1,47 @@
-// Generated by HTML Next 1.0.0-alpha.29 for Vanilla DOM. Do not edit.
-import { manageGeneratedProps } 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-description-list.css";
 
-export function createUiDescriptionList(options = {}) {
+const T0 = ["",[],4];
+const T1 = ["",[]];
+let P0, P1;
+const S = { n: [], t: [], f: import.meta.url, g: "ui-description-list" };
+const D = { props: { "columns": { "required":false,"values":["2","3","4"], 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] }, "layout": { "required":false,"values":["rows","stacked","grid","tiles"],"default":"rows", c: checkFormat("keyword", keywordFormat), t: "keyword", j: 0, m: ["p",formatOf(keywordFormat),false] } } };
+
+export function createUiDescriptionList(options = {}, html) {
   const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
-  const projected = [];
-  const prop0 = componentProps["columns"] === undefined ? undefined : componentProps["columns"];
-  const prop1 = componentProps["density"] === undefined ? "comfortable" : componentProps["density"];
-  const prop2 = componentProps["layout"] === undefined ? "rows" : componentProps["layout"];
   const element = document.createElement("dl");
   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-description-list");
-  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];
+  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 & 7) {
+      const x0 = hostState(["layout","columns","density"], [v[2], v[0], v[1]]);
+      const s0 = x0;
+      if (s0 !== r.v0) writeAttribute(r.n, "data-ui-description-list-state", (r.v0 = s0) === "" ? null : s0);
     }
-  } else {
-  }
-  manageGeneratedProps(element, [
-    { name: "columns", attribute: "data-columns", value: componentProps["columns"], type: ["2","3","4"], required: false },
-    { name: "density", attribute: "data-density", value: componentProps["density"], default: "comfortable", type: ["comfortable","compact"], required: false },
-    { name: "layout", attribute: "data-layout", value: componentProps["layout"], default: "rows", type: ["rows","stacked","grid","tiles"], required: false },
-  ]);
+    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)), undefined, undefined, I);
+  manageProps(I);
   return element;
 }
-

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

package/vanilla/UiDialog.js

@@ -1,57 +1,104 @@
-// 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, clearRegion, toAttribute, toText, truthy, writeAttribute, 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-dialog/ui-dialog.js";
 import "../styles/ui-dialog.css";
 
-const definition = {...{"contract":{"tag":"ui-dialog","props":{"alert":{"type":"boolean","required":false,"target":{"attribute":"alert"},"default":false},"closedby":{"type":{"kind":"terminal","name":"keyword"},"values":["any","closerequest","none"],"required":false,"target":{"attribute":"closedby"}},"for":{"type":"string","required":false,"target":{"attribute":"for"},"default":""},"label":{"type":"string","required":false,"target":{"attribute":"label"}},"modal":{"type":"boolean","required":false,"target":{"attribute":"modal"},"default":false},"modeless":{"type":"boolean","required":false,"target":{"attribute":"modeless"},"default":false},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"default":false},"size":{"type":{"kind":"terminal","name":"keyword"},"values":["sm","md","lg","fullscreen"],"required":false,"target":{"attribute":"size"},"default":"md"}}},"template":{"kind":"element","name":"dialog","attributes":[{"kind":"attribute","name":"aria-label","expression":"accessibleLabel","expressionPlan":{"source":"accessibleLabel","ast":{"kind":"id","name":"accessibleLabel"},"dependencies":["accessibleLabel"]}}],"children":[{"kind":"element","name":"header","attributes":[],"children":[{"kind":"element","name":"h2","attributes":[{"kind":"literal","name":"class","value":"title"}],"children":[{"kind":"text","value":"$label","expressionPlan":{"source":"$label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}],"flow":{"kind":"if","test":"label","testPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}},{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"class","value":"close"},{"kind":"literal","name":"type","value":"button"},{"kind":"literal","name":"aria-label","value":"Close"}],"children":[],"ref":"close"}]},{"kind":"element","name":"ui-scroll-area","attributes":[{"kind":"literal","name":"class","value":"body"}],"children":[{"kind":"slot"}]},{"kind":"element","name":"footer","attributes":[],"children":[{"kind":"slot","fallback":[],"name":"actions"}]}]},"declarations":[{"kind":"state","name":"internalOpen","type":"boolean","value":"false","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"state","name":"accessibleLabel","type":"string","value":"Dialog","expression":{"source":"\"Dialog\"","ast":{"kind":"literal","value":"Dialog"},"dependencies":[]}},{"kind":"event","name":"open","type":"object","shape":{"kind":"object","fields":[{"name":"open","type":{"kind":"terminal","name":"boolean"},"optional":false},{"name":"reason","type":{"kind":"constrained","base":{"kind":"terminal","name":"keyword"},"values":["action","programmatic"]},"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":"close","type":"object","shape":{"kind":"object","fields":[{"name":"open","type":{"kind":"terminal","name":"boolean"},"optional":false},{"name":"reason","type":{"kind":"constrained","base":{"kind":"terminal","name":"keyword"},"values":["action","programmatic","light-dismiss","escape"]},"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":"dialog","choices":["dialog"]}},source:{file:import.meta.url},css:""};
+const T0 = ["",[],["header",[],1,["button",["class","close","type","button","aria-label","Close"]]],["div",["class","body"],["ui-scroll-area",[],4]],["footer",[],4]];
+const T1 = ["h2",["class","title"],0];
+const T2 = ["",[]];
+const T3 = ["",[]];
+let P0, P1, P2, P3;
+const S = { n: ["internalOpen","accessibleLabel"], t: ["b","s"], f: import.meta.url, g: "ui-dialog", d: { "open": [detailCheck(checkObject([["open", checkBoolean, false], ["reason", checkConstrained(checkFormat("keyword", keywordFormat), "keyword", {"values":["action","programmatic"]}), false], ["trigger", checkConstrained(checkFormat("keyword", keywordFormat), "keyword", {"values":["keyboard","pointer","programmatic"]}), false]], false)), true, true, false], "close": [detailCheck(checkObject([["open", checkBoolean, false], ["reason", checkConstrained(checkFormat("keyword", keywordFormat), "keyword", {"values":["action","programmatic","light-dismiss","escape"]}), false], ["trigger", checkConstrained(checkFormat("keyword", keywordFormat), "keyword", {"values":["keyboard","pointer","programmatic"]}), false]], false)), true, true, false] }, x: dispatchDeclared };
+const D = { props: { "alert": { "required":false,"default":false, c: checkBoolean, t: "boolean", j: 0, m: "b" }, "closedby": { "required":false,"values":["any","closerequest","none"], c: checkFormat("keyword", keywordFormat), t: "keyword", j: 0, m: ["p",formatOf(keywordFormat),false] }, "for": { "required":false,"default":"", c: checkString, t: "string", j: 0, m: "s" }, "label": { "required":false, c: checkString, t: "string", j: 0, m: "s" }, "modal": { "required":false,"default":false, c: checkBoolean, t: "boolean", j: 0, m: "b" }, "modeless": { "required":false,"default":false, c: checkBoolean, t: "boolean", j: 0, m: "b" }, "open": { "required":false,"default":false, c: checkBoolean, t: "boolean", j: 0, m: "b" }, "size": { "required":false,"values":["sm","md","lg","fullscreen"],"default":"md", c: checkFormat("keyword", keywordFormat), t: "keyword", j: 0, m: ["p",formatOf(keywordFormat),false] } } };
+const C = (host) => controller.default(host);
 
-export function createUiDialog(options = {}) {
+export function createUiDialog(options = {}, html) {
   const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
-  const projected = [];
   const element = document.createElement("dialog");
   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-dialog");
-  const element0 = document.createElement("header");
-  const element1 = document.createElement("h2");
-  element1.setAttribute("class", "title");
-  const text2 = document.createTextNode("");
-  element1.append(text2);
-  element0.append(element1);
-  const element3 = document.createElement("button");
-  element3.setAttribute("class", "close");
-  element3.setAttribute("type", "button");
-  element3.setAttribute("aria-label", "Close");
-  element0.append(element3);
-  element.append(element0);
-  const element4 = document.createElement("ui-scroll-area");
-  element4.setAttribute("class", "body");
-  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, ""]);
-      element4.append(node);
+  element.append((P0 ??= buildTemplate(T0)).cloneNode(true));
+  const v = [false, "Dialog", null, 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 t0 = n.firstChild;
+    const r = { n, a0: t0, v0: "" };
+    p1(r, -1, d);
+    return r;
+  };
+  const p1 = (r, c, d) => {
+    if (c & 32) {
+      const x0 = v[5];
+      const s0 = toText(x0);
+      if (s0 !== r.v0) r.a0.data = r.v0 = s0;
     }
-  } else {
-  }
-  element.append(element4);
-  const element5 = document.createElement("footer");
-  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);
+  };
+  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 p0 = (r, c, d) => {
+    if (c & 2) {
+      const x0 = v[1];
+      const s0 = toAttribute(x0, "aria-label");
+      if (s0 !== r.v0) writeAttribute(r.n, "aria-label", r.v0 = s0);
     }
-  } else {
-  }
-  element.append(element5);
-  manageComponentLifecycle(element, definition, { props: componentProps, projected,
-    controller,
-  });
+    if (c === -1) {
+      const x1 = true;
+      const s1 = toAttribute(x1, "trim");
+      if (s1 !== r.v1) writeAttribute(r.a3, "trim", r.v1 = s1);
+    }
+    if (c & 516) {
+      const x2 = hostState(["size","alert"], [v[9], v[2]]);
+      const s2 = x2;
+      if (s2 !== r.v2) writeAttribute(r.n, "data-ui-dialog-state", (r.v2 = s2) === "" ? null : s2);
+    }
+    if (c & 32) {
+      const t0 = truthy(v[5]);
+      if (true) {
+        {
+          r.b0 = undefined;
+          clearRegion(r.a1, r.e0);
+          if (t0) { r.b0 = m1(d); r.e0.before(r.b0.n); }
+        }
+      } else if (r.b0 !== undefined) p1(r.b0, c, d);
+    } else if (r.b0 !== undefined) p1(r.b0, c, d);
+    if (r.f1 === undefined) { r.f1 = 1; const at = fillSlot(r.a4, 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.a5, r.e2, "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.b2 = m3(d); at.before(r.b2.n); } }
+    else if (r.b2 !== undefined) p3(r.b2, c, d);
+  };
+  const t0 = element.firstChild;
+  const t1 = t0.firstChild;
+  const t2 = t1.nextSibling.nextSibling;
+  const t3 = t0.nextSibling;
+  const t4 = t3.firstChild;
+  const t5 = t4.firstChild;
+  const t6 = t3.nextSibling.firstChild;
+  const R = { n: element, a3: t4, v0: undefined, v1: null, v2: undefined, a1: t1, e0: t1.nextSibling, b0: undefined, a4: t5, e1: t5.nextSibling, b1: undefined, f1: undefined, a5: t6, e2: t6.nextSibling, b2: undefined, f2: 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["close"] = t2;
   return element;
 }
-

package/vanilla/UiDisclosure.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 UiDisclosureEventMap {
   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" }>;