@threadlabs/looma 0.13.1 → 0.13.3

package/vanilla/UiListItem.js

@@ -1,9 +1,9 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 import { manageGeneratedProps } from "@nextwebwg/html-next/generated-runtime";
 import "../styles/ui-list-item.css";
 
 export function createUiListItem(options = {}) {
-  const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
+  const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
   const projected = [];
   const prop0 = componentProps["current"] === undefined ? false : componentProps["current"];
   const prop1 = componentProps["variant"] === undefined ? "row" : componentProps["variant"];

package/vanilla/UiMenu.d.ts

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 export interface UiMenuEventMap {
   select: CustomEvent<{ readonly value: string; readonly trigger: "keyboard" | "pointer" | "programmatic" }>;
   open: CustomEvent<{ readonly open: boolean; readonly reason: "action" | "programmatic"; readonly trigger: "keyboard" | "pointer" | "programmatic" }>;

package/vanilla/UiMenu.js

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 import { manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
 import * as controller from "../components/ui-menu/ui-menu.js";
 import "../styles/ui-menu.css";
@@ -6,7 +6,7 @@ import "../styles/ui-menu.css";
 const definition = {...{"contract":{"tag":"ui-menu","props":{"density":{"type":{"enum":["comfortable","compact"]},"required":false,"target":{"attribute":"density"},"default":"comfortable"},"for":{"type":"string","required":false,"target":{"attribute":"for"},"default":""},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"default":false},"placement":{"type":"string","required":false,"target":{"attribute":"placement"},"default":"bottom-start"}}},"template":{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"role","value":"menu"},{"kind":"literal","name":"aria-orientation","value":"vertical"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"surface"}],"children":[{"kind":"slot"}]}]},"declarations":[{"kind":"state","name":"internalOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"select","type":"object({ value: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"open","type":"object({ open: boolean, reason: action | programmatic, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"close","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"root":{"kind":"native","element":"div","choices":["div"]}},source:{file:import.meta.url},css:""};
 
 export function createUiMenu(options = {}) {
-  const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
+  const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
   const projected = [];
   const element = document.createElement("div");
   for (const [name, value] of Object.entries(attributes)) {

package/vanilla/UiMenuItem.d.ts

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 export interface UiMenuItemEventMap {
 }
 export interface UiMenuItemElement extends HTMLDivElement {

package/vanilla/UiMenuItem.js

@@ -1,9 +1,9 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 import { manageGeneratedProps } from "@nextwebwg/html-next/generated-runtime";
 import "../styles/ui-menu-item.css";
 
 export function createUiMenuItem(options = {}) {
-  const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
+  const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
   const projected = [];
   const prop0 = componentProps["disabled"] === undefined ? false : componentProps["disabled"];
   const prop1 = componentProps["value"] === undefined ? "" : componentProps["value"];

package/vanilla/UiNavItem.d.ts

@@ -1,11 +1,12 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 export interface UiNavItemEventMap {
 }
-export interface UiNavItemElement extends HTMLButtonElement {
+export interface UiNavItemElement extends HTMLElement {
   addEventListener<K extends keyof UiNavItemEventMap>(type: K, listener: (this: UiNavItemElement, event: UiNavItemEventMap[K]) => unknown, options?: boolean | AddEventListenerOptions): void;
   removeEventListener<K extends keyof UiNavItemEventMap>(type: K, listener: (this: UiNavItemElement, event: UiNavItemEventMap[K]) => unknown, options?: boolean | EventListenerOptions): void;
 }
 export interface UiNavItemProps {
+  as?: "button" | "a" | null;
   current?: boolean | "page" | "step" | "location" | null;
   href?: string | null;
   rel?: string | null;
@@ -13,6 +14,5 @@ export interface UiNavItemProps {
   attributes?: Readonly<Record<string, string | number | boolean | null | undefined>>;
   children?: readonly (string | Node)[];
   slots?: Readonly<Record<string, readonly (string | Node)[]>>;
-  as?: "button" | "a";
 }
 export declare function createUiNavItem(props?: UiNavItemProps): UiNavItemElement;

package/vanilla/UiNavItem.js

@@ -1,67 +1,119 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
-import { manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
+import { componentRootIndex, manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
 import "../styles/ui-nav-item.css";
 
-const definition = {...{"contract":{"tag":"ui-nav-item","props":{"current":{"type":{"kind":"union","members":[{"kind":"terminal","name":"boolean"},{"kind":"keyword","value":"page"},{"kind":"keyword","value":"step"},{"kind":"keyword","value":"location"}]},"required":false,"target":{"attribute":"current"},"default":false},"href":{"type":"string","required":false,"target":{"attribute":"href"}},"rel":{"type":"string","required":false,"target":{"attribute":"rel"}},"target":{"type":"string","required":false,"target":{"attribute":"target"}}}},"template":{"kind":"element","name":"button","attributes":[{"kind":"attribute","name":"type","expression":"{ true: 'button', false: null }[format('%s', not href)]","expressionPlan":{"source":"{ true: 'button', false: null }[format('%s', not href)]","ast":{"kind":"index","object":{"kind":"object","pairs":[{"key":"true","value":{"kind":"literal","value":"button"}},{"key":"false","value":{"kind":"literal","value":null}}]},"index":{"kind":"call","fn":"format","args":[{"kind":"literal","value":"%s"},{"kind":"unary","op":"not","operand":{"kind":"id","name":"href"}}]}},"dependencies":["href"]}},{"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' }[format('%s', current)]","expressionPlan":{"source":"{ true: 'page', false: null, page: 'page', step: 'step', location: 'location' }[format('%s', 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":"format","args":[{"kind":"literal","value":"%s"},{"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"}]}]}]},"declarations":[],"root":{"kind":"native","element":"button","choices":["button","a"]}},source:{file:import.meta.url},css:""};
+const definition = {...{"contract":{"tag":"ui-nav-item","props":{"as":{"type":{"enum":["button","a"]},"required":false,"target":{"attribute":"as"},"default":"button"},"current":{"type":{"kind":"union","members":[{"kind":"terminal","name":"boolean"},{"kind":"keyword","value":"page"},{"kind":"keyword","value":"step"},{"kind":"keyword","value":"location"}]},"required":false,"target":{"attribute":"current"},"default":false},"href":{"type":"string","required":false,"target":{"attribute":"href"}},"rel":{"type":"string","required":false,"target":{"attribute":"rel"}},"target":{"type":"string","required":false,"target":{"attribute":"target"}}}},"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' }[format('%s', current)]","expressionPlan":{"source":"{ true: 'page', false: null, page: 'page', step: 'step', location: 'location' }[format('%s', 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":"format","args":[{"kind":"literal","value":"%s"},{"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"}]}]}],"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' }[format('%s', current)]","expressionPlan":{"source":"{ true: 'page', false: null, page: 'page', step: 'step', location: 'location' }[format('%s', 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":"format","args":[{"kind":"literal","value":"%s"},{"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"}]}]}],"flow":{"kind":"else"}}],"flow":{"kind":"match"}},"declarations":[],"root":{"kind":"native","element":"button","choices":["a","button"]}},source:{file:import.meta.url},css:""};
 
 export function createUiNavItem(options = {}) {
-  const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
+  const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
   const projected = [];
-  const element = document.createElement(as ?? "button");
-  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 ? undefined : componentProps["href"];
-  if (value0 === null || value0 === undefined) element.removeAttribute("href");
-  else element.setAttribute("href", String(value0));
-  const value1 = componentProps["target"] === undefined ? undefined : componentProps["target"];
-  if (value1 === null || value1 === undefined) element.removeAttribute("target");
-  else element.setAttribute("target", String(value1));
-  const value2 = componentProps["rel"] === undefined ? undefined : 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;
-      projected.push([node, "leading"]);
-      element1.append(node);
+  const root = componentRootIndex(definition, componentProps);
+  let element;
+  if (root === 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));
     }
-  } 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;
-      projected.push([node, ""]);
-      element3.append(node);
+    const value0 = componentProps["href"] === undefined ? undefined : componentProps["href"];
+    if (value0 === null || value0 === undefined) element.removeAttribute("href");
+    else element.setAttribute("href", String(value0));
+    const value1 = componentProps["target"] === undefined ? undefined : componentProps["target"];
+    if (value1 === null || value1 === undefined) element.removeAttribute("target");
+    else element.setAttribute("target", String(value1));
+    const value2 = componentProps["rel"] === undefined ? undefined : 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;
+        projected.push([node, "leading"]);
+        element1.append(node);
+      }
+    } else {
     }
-  } 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;
-      projected.push([node, "description"]);
-      element4.append(node);
+    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;
+        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;
+        projected.push([node, "description"]);
+        element4.append(node);
+      }
+    } else {
+    }
+    element2.append(element4);
+    element.append(element2);
   } else {
+    element = document.createElement("button");
+    for (const [name, value] of Object.entries(attributes)) {
+      if (value === null || value === undefined || value === false) continue;
+      element.setAttribute(name, value === true ? "" : String(value));
+    }
+    if (!element.hasAttribute("type")) element.setAttribute("type", "button");
+    element.setAttribute("data-component", "ui-nav-item");
+    const element5 = document.createElement("span");
+    element5.setAttribute("class", "indicator");
+    element5.setAttribute("aria-hidden", "true");
+    element.append(element5);
+    const element6 = document.createElement("span");
+    element6.setAttribute("class", "leading");
+    if (slots["leading"] ?? [].length > 0) {
+      for (const child of slots["leading"] ?? []) {
+        const node = typeof child === "string" ? document.createTextNode(child) : child;
+        projected.push([node, "leading"]);
+        element6.append(node);
+      }
+    } else {
+    }
+    element.append(element6);
+    const element7 = document.createElement("span");
+    element7.setAttribute("class", "content");
+    const element8 = document.createElement("span");
+    element8.setAttribute("class", "label");
+    if (children.length > 0) {
+      for (const child of children) {
+        const node = typeof child === "string" ? document.createTextNode(child) : child;
+        projected.push([node, ""]);
+        element8.append(node);
+      }
+    } else {
+    }
+    element7.append(element8);
+    const element9 = document.createElement("span");
+    element9.setAttribute("class", "description");
+    if (slots["description"] ?? [].length > 0) {
+      for (const child of slots["description"] ?? []) {
+        const node = typeof child === "string" ? document.createTextNode(child) : child;
+        projected.push([node, "description"]);
+        element9.append(node);
+      }
+    } else {
+    }
+    element7.append(element9);
+    element.append(element7);
   }
-  element2.append(element4);
-  element.append(element2);
   manageComponentLifecycle(element, definition, { props: componentProps, projected,
   });
   return element;

package/vanilla/UiPageHeader.d.ts

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 export interface UiPageHeaderEventMap {
 }
 export interface UiPageHeaderElement extends HTMLElement {

package/vanilla/UiPageHeader.js

@@ -1,9 +1,9 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 import { manageGeneratedProps } from "@nextwebwg/html-next/generated-runtime";
 import "../styles/ui-page-header.css";
 
 export function createUiPageHeader(options = {}) {
-  const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
+  const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
   const projected = [];
   const prop0 = componentProps["align"] === undefined ? "start" : componentProps["align"];
   const element = document.createElement("header");

package/vanilla/UiPopover.d.ts

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 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" }>;

package/vanilla/UiPopover.js

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 import { manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
 import * as controller from "../components/ui-popover/ui-popover.js";
 import "../styles/ui-popover.css";
@@ -6,7 +6,7 @@ import "../styles/ui-popover.css";
 const definition = {...{"contract":{"tag":"ui-popover","props":{"for":{"type":"string","required":false,"target":{"attribute":"for"},"default":""},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"default":false},"placement":{"type":"string","required":false,"target":{"attribute":"placement"},"default":"bottom-start"}}},"template":{"kind":"element","name":"span","attributes":[],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"surface"}],"children":[{"kind":"slot"}]}]},"declarations":[{"kind":"state","name":"internalOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"open","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"close","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"root":{"kind":"native","element":"span","choices":["span"]}},source:{file:import.meta.url},css:""};
 
 export function createUiPopover(options = {}) {
-  const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
+  const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
   const projected = [];
   const element = document.createElement("span");
   for (const [name, value] of Object.entries(attributes)) {

package/vanilla/UiRadio.d.ts

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 export interface UiRadioEventMap {
   change: CustomEvent<{ readonly checked: boolean; readonly value: string; readonly trigger: "keyboard" | "pointer" | "programmatic" }>;
 }

package/vanilla/UiRadio.js

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 import { manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
 import * as controller from "../components/ui-radio/ui-radio.js";
 import "../styles/ui-radio.css";
@@ -6,7 +6,7 @@ import "../styles/ui-radio.css";
 const definition = {...{"contract":{"tag":"ui-radio","props":{"checked":{"type":"boolean","required":false,"target":{"attribute":"checked"},"default":false},"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"default":false},"name":{"type":"string","required":false,"target":{"attribute":"name"},"default":""},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"default":false},"value":{"type":"string","required":false,"target":{"attribute":"value"},"default":"on"}}},"template":{"kind":"element","name":"label","attributes":[],"children":[{"kind":"element","name":"input","attributes":[{"kind":"literal","name":"type","value":"radio"},{"kind":"property","key":"checked","name":"checked","expression":"internalChecked","expressionPlan":{"source":"internalChecked","ast":{"kind":"id","name":"internalChecked"},"dependencies":["internalChecked"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"required","expression":"required","expressionPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}},{"kind":"attribute","name":"value","expression":"value","expressionPlan":{"source":"value","ast":{"kind":"id","name":"value"},"dependencies":["value"]}},{"kind":"attribute","name":"name","expression":"name","expressionPlan":{"source":"name","ast":{"kind":"id","name":"name"},"dependencies":["name"]}}],"children":[],"ref":"input"},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"text"}],"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"},{"kind":"literal","name":"aria-hidden","value":"true"}],"children":[{"kind":"slot","fallback":[],"name":"description"}],"ref":"description"}]}]},"declarations":[{"kind":"state","name":"internalChecked","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"change","type":"object({ checked: boolean, value: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"root":{"kind":"native","element":"label","choices":["label"]}},source:{file:import.meta.url},css:""};
 
 export function createUiRadio(options = {}) {
-  const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
+  const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
   const projected = [];
   const element = document.createElement("label");
   for (const [name, value] of Object.entries(attributes)) {

package/vanilla/UiRadioGroup.d.ts

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 export interface UiRadioGroupEventMap {
   select: CustomEvent<{ readonly value: string; readonly previousValue: string; readonly trigger: "keyboard" | "pointer" | "programmatic" }>;
   change: CustomEvent<{ readonly checked: boolean; readonly value: string; readonly trigger: "keyboard" | "pointer" | "programmatic" }>;

package/vanilla/UiRadioGroup.js

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 import { manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
 import * as controller from "../components/ui-radio-group/ui-radio-group.js";
 import "../styles/ui-radio-group.css";
@@ -6,7 +6,7 @@ import "../styles/ui-radio-group.css";
 const definition = {...{"contract":{"tag":"ui-radio-group","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"default":false},"label":{"type":"string","required":false,"target":{"attribute":"label"},"default":"Options"},"name":{"type":"string","required":false,"target":{"attribute":"name"},"default":""},"orientation":{"type":{"enum":["horizontal","vertical"]},"required":false,"target":{"attribute":"orientation"},"default":"horizontal"},"required":{"type":"boolean","required":false,"target":{"attribute":"aria-required"},"default":false},"value":{"type":"string","required":false,"target":{"attribute":"value"},"default":""}}},"template":{"kind":"element","name":"fieldset","attributes":[{"kind":"literal","name":"role","value":"radiogroup"},{"kind":"attribute","name":"aria-required","expression":"required","expressionPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}}],"children":[{"kind":"element","name":"legend","attributes":[],"children":[{"kind":"element","name":"template","attributes":[{"kind":"directive","name":"value","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}],"children":[]}]},{"kind":"slot"}]},"declarations":[{"kind":"state","name":"internalValue","expression":{"source":"''","ast":{"kind":"literal","value":""},"dependencies":[]}},{"kind":"event","name":"select","type":"object({ value: string, previousValue: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false},{"kind":"event","name":"change","type":"object({ checked: boolean, value: string, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"root":{"kind":"native","element":"fieldset","choices":["fieldset"]}},source:{file:import.meta.url},css:""};
 
 export function createUiRadioGroup(options = {}) {
-  const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
+  const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
   const projected = [];
   const element = document.createElement("fieldset");
   for (const [name, value] of Object.entries(attributes)) {

package/vanilla/UiReel.d.ts

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 export interface UiReelEventMap {
 }
 export interface UiReelElement extends HTMLDivElement {

package/vanilla/UiReel.js

@@ -1,9 +1,9 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 import { manageGeneratedProps } from "@nextwebwg/html-next/generated-runtime";
 import "../styles/ui-reel.css";
 
 export function createUiReel(options = {}) {
-  const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
+  const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
   const projected = [];
   const prop0 = componentProps["gap"] === undefined ? undefined : componentProps["gap"];
   const prop1 = componentProps["itemWidth"] === undefined ? undefined : componentProps["itemWidth"];

package/vanilla/UiScrollArea.d.ts

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 export interface UiScrollAreaEventMap {
 }
 export interface UiScrollAreaElement extends HTMLDivElement {

package/vanilla/UiScrollArea.js

@@ -1,9 +1,9 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 import { manageGeneratedProps } from "@nextwebwg/html-next/generated-runtime";
 import "../styles/ui-scroll-area.css";
 
 export function createUiScrollArea(options = {}) {
-  const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
+  const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
   const projected = [];
   const prop0 = componentProps["orientation"] === undefined ? "vertical" : componentProps["orientation"];
   const element = document.createElement("div");

package/vanilla/UiSearchResultRow.d.ts

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 export interface UiSearchResultRowEventMap {
 }
 export interface UiSearchResultRowElement extends HTMLButtonElement {

package/vanilla/UiSearchResultRow.js

@@ -1,11 +1,11 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 import { manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
 import "../styles/ui-search-result-row.css";
 
 const definition = {...{"contract":{"tag":"ui-search-result-row","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"default":false},"selected":{"type":"boolean","required":false,"target":{"attribute":"aria-current"},"default":false}}},"template":{"kind":"element","name":"button","attributes":[{"kind":"literal","name":"type","value":"button"},{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"aria-current","expression":"selected","expressionPlan":{"source":"selected","ast":{"kind":"id","name":"selected"},"dependencies":["selected"]}}],"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":"title"}],"children":[{"kind":"slot","fallback":[],"name":"title"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"meta"}],"children":[{"kind":"slot","fallback":[],"name":"meta"}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"excerpt"}],"children":[{"kind":"slot","fallback":[],"name":"excerpt"}]}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"trailing"}],"children":[{"kind":"slot","fallback":[],"name":"trailing"}]}]},"declarations":[],"root":{"kind":"native","element":"button","choices":["button"]}},source:{file:import.meta.url},css:""};
 
 export function createUiSearchResultRow(options = {}) {
-  const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
+  const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
   const projected = [];
   const element = document.createElement("button");
   for (const [name, value] of Object.entries(attributes)) {

package/vanilla/UiSearchShell.d.ts

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 export interface UiSearchShellEventMap {
   close: CustomEvent<{ readonly open: boolean; readonly reason: "action" | "programmatic" | "light-dismiss" | "escape"; readonly trigger: "keyboard" | "pointer" | "programmatic" }>;
 }

package/vanilla/UiSearchShell.js

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 import { manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
 import * as controller from "../components/ui-search-shell/ui-search-shell.js";
 import "../styles/ui-search-shell.css";
@@ -6,7 +6,7 @@ import "../styles/ui-search-shell.css";
 const definition = {...{"contract":{"tag":"ui-search-shell","props":{"dismissible":{"type":"boolean","required":false,"target":{"attribute":"dismissible"},"default":false},"label":{"type":"string","required":false,"target":{"attribute":"aria-label"},"default":"Search"},"modal":{"type":"boolean","required":false,"target":{"attribute":"modal"},"default":false},"open":{"type":"boolean","required":false,"target":{"attribute":"open"},"default":false}}},"template":{"kind":"element","name":"div","attributes":[],"children":[{"kind":"element","name":"dialog","attributes":[{"kind":"attribute","name":"aria-label","expression":"label","expressionPlan":{"source":"label","ast":{"kind":"id","name":"label"},"dependencies":["label"]}}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"panel"}],"children":[{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"search"}],"children":[{"kind":"slot","fallback":[],"name":"search"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"status"}],"children":[{"kind":"slot","fallback":[],"name":"status"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"body"}],"children":[{"kind":"slot","fallback":[],"name":"body"}]},{"kind":"element","name":"div","attributes":[{"kind":"literal","name":"class","value":"footer"}],"children":[{"kind":"slot","fallback":[],"name":"footer"}]}]}],"ref":"dialog"}]},"declarations":[{"kind":"state","name":"internalOpen","expression":{"source":"false","ast":{"kind":"literal","value":false},"dependencies":[]}},{"kind":"event","name":"close","type":"object({ open: boolean, reason: action | programmatic | light-dismiss | escape, trigger: keyboard | pointer | programmatic })","bubbles":true,"composed":true,"cancelable":false}],"root":{"kind":"native","element":"div","choices":["div"]}},source:{file:import.meta.url},css:""};
 
 export function createUiSearchShell(options = {}) {
-  const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
+  const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
   const projected = [];
   const element = document.createElement("div");
   for (const [name, value] of Object.entries(attributes)) {

package/vanilla/UiSection.d.ts

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 export interface UiSectionEventMap {
 }
 export interface UiSectionElement extends HTMLElement {

package/vanilla/UiSection.js

@@ -1,11 +1,11 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 import { manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
 import "../styles/ui-section.css";
 
 const definition = {...{"contract":{"tag":"ui-section","props":{"heading":{"type":"string","required":false,"target":{"attribute":"heading"},"default":""},"tone":{"type":{"enum":["neutral","danger"]},"required":false,"target":{"attribute":"tone"},"default":"neutral"},"variant":{"type":{"enum":["plain","card","divided"]},"required":false,"target":{"attribute":"variant"},"default":"plain"}}},"template":{"kind":"element","name":"section","attributes":[],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"head"}],"children":[{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"copy"}],"children":[{"kind":"element","name":"h2","attributes":[{"kind":"literal","name":"class","value":"heading"},{"kind":"attribute","name":"hidden","expression":"not heading","expressionPlan":{"source":"not heading","ast":{"kind":"unary","op":"not","operand":{"kind":"id","name":"heading"}},"dependencies":["heading"]}}],"children":[{"kind":"element","name":"template","attributes":[{"kind":"directive","name":"value","expression":"heading","expressionPlan":{"source":"heading","ast":{"kind":"id","name":"heading"},"dependencies":["heading"]}}],"children":[]}]},{"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":"actions"}],"children":[{"kind":"slot","fallback":[],"name":"actions"}]}]},{"kind":"element","name":"span","attributes":[{"kind":"literal","name":"class","value":"body"}],"children":[{"kind":"slot"}]}]},"declarations":[],"root":{"kind":"native","element":"section","choices":["section"]}},source:{file:import.meta.url},css:""};
 
 export function createUiSection(options = {}) {
-  const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
+  const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
   const projected = [];
   const element = document.createElement("section");
   for (const [name, value] of Object.entries(attributes)) {

package/vanilla/UiSelect.d.ts

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 export interface UiSelectEventMap {
 }
 export interface UiSelectElement extends HTMLSelectElement {

package/vanilla/UiSelect.js

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 import { manageComponentLifecycle } from "@nextwebwg/html-next/runtime";
 import * as controller from "../components/ui-select/ui-select.js";
 import "../styles/ui-select.css";
@@ -6,7 +6,7 @@ import "../styles/ui-select.css";
 const definition = {...{"contract":{"tag":"ui-select","props":{"disabled":{"type":"boolean","required":false,"target":{"attribute":"disabled"},"default":false},"invalid":{"type":"boolean","required":false,"target":{"attribute":"aria-invalid"},"default":false},"required":{"type":"boolean","required":false,"target":{"attribute":"required"},"default":false},"value":{"type":"string","required":false,"target":{"attribute":"value"}}}},"template":{"kind":"element","name":"select","attributes":[{"kind":"attribute","name":"disabled","expression":"disabled","expressionPlan":{"source":"disabled","ast":{"kind":"id","name":"disabled"},"dependencies":["disabled"]}},{"kind":"attribute","name":"required","expression":"required","expressionPlan":{"source":"required","ast":{"kind":"id","name":"required"},"dependencies":["required"]}},{"kind":"attribute","name":"aria-invalid","expression":"invalid","expressionPlan":{"source":"invalid","ast":{"kind":"id","name":"invalid"},"dependencies":["invalid"]}}],"children":[{"kind":"slot"}]},"declarations":[],"root":{"kind":"native","element":"select","choices":["select"]}},source:{file:import.meta.url},css:""};
 
 export function createUiSelect(options = {}) {
-  const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
+  const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
   const projected = [];
   const element = document.createElement("select");
   for (const [name, value] of Object.entries(attributes)) {

package/vanilla/UiSeparator.d.ts

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 export interface UiSeparatorEventMap {
 }
 export interface UiSeparatorElement extends HTMLHRElement {

package/vanilla/UiSeparator.js

@@ -1,9 +1,9 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 import { manageGeneratedProps } from "@nextwebwg/html-next/generated-runtime";
 import "../styles/ui-separator.css";
 
 export function createUiSeparator(options = {}) {
-  const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
+  const { attributes = {}, children = [], slots = {}, ...componentProps } = options;
   const projected = [];
   const prop0 = componentProps["orientation"] === undefined ? "horizontal" : componentProps["orientation"];
   const element = document.createElement("hr");

package/vanilla/UiSidebar.d.ts

@@ -1,4 +1,4 @@
-// Generated by HTML Next 1.0.0-alpha.5 for Vanilla DOM. Do not edit.
+// Generated by HTML Next 1.0.0-alpha.7 for Vanilla DOM. Do not edit.
 export interface UiSidebarEventMap {
   resize: CustomEvent<{ readonly width: number; readonly trigger: "keyboard" | "pointer" | "programmatic" }>;
   toggle: CustomEvent<{ readonly open: boolean; readonly mode: "docked" | "drawer"; readonly trigger: "keyboard" | "pointer" | "programmatic" }>;