@threadlabs/looma 0.3.0 → 0.3.1

package/dist/{chunk-3NVMCHGR.js → chunk-RWLYVQY6.js}

@@ -2821,7 +2821,6 @@ function controller28(host) {
   const disclosure = element.querySelector('[part="disclosure"]');
   const children = element.querySelector('[part="children"]');
   const dragHandle = element.querySelector('[part="drag-handle"]');
-  const label = element.querySelector('[part="label"]');
   const childItems = () => Array.from(children?.children ?? []).filter((child) => child.matches?.('[data-component-root~="ui-tree-item"]'));
   let lastExternalExpanded = Boolean(host.state.expanded);
   host.state.internalExpanded = lastExternalExpanded;
@@ -2860,7 +2859,6 @@ function controller28(host) {
     else element.removeAttribute("aria-expanded");
     element.tabIndex = disabled3 || !host.state.tabStop ? -1 : 0;
     element.style.setProperty("--ui-tree-item-depth", String(level - 1));
-    if (label && label.textContent !== name) label.textContent = name;
     if (children) children.hidden = !expanded;
     if (disclosure) {
       disclosure.hidden = !container;
@@ -5445,7 +5443,7 @@ input[type='radio']:focus-visible {
   { tag: "ui-tree-item", source: `<template component="ui-tree-item" controller="./controllers/ui-tree-item.js" status="early" summary="Migrated Looma ui-tree-item component.">
   <defs>
     <prop name="itemId" type="string" default="">itemId token.</prop>
-    <prop name="label" type="string" default="">label token.</prop>
+    <prop name="label" type="string" default="">The item's accessible name, also shown as the row text unless the label slot supplies content.</prop>
     <prop name="dropDepth" type="number">dropDepth token.</prop>
     <prop name="subtreeDepth" type="number">subtreeDepth token.</prop>
     <prop name="container" type="boolean" default="false">container token.</prop>
@@ -5462,7 +5460,7 @@ input[type='radio']:focus-visible {
     <state name="hasChildren" :value="false"></state>
     <event name="expand" bubbles="false" type="object({ id: string, expanded: boolean, trigger: keyboard | pointer | programmatic })"></event>
   </defs>
-  <div role="treeitem" :data-drop-scope="dropScope" :data-accepts="accepts"><div class="row" part="row"><button $if="sortable and not disabled" class="drag-handle" part="drag-handle" type="button"><svg aria-hidden="true" focusable="false" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="12" r="1"></circle><circle cx="9" cy="5" r="1"></circle><circle cx="9" cy="19" r="1"></circle><circle cx="15" cy="12" r="1"></circle><circle cx="15" cy="5" r="1"></circle><circle cx="15" cy="19" r="1"></circle></svg></button><button class="disclosure" part="disclosure" type="button" :disabled="disabled"><span class="disclosure-icon" aria-hidden="true"></span></button><span class="leading" part="leading"><slot name="leading"></slot></span><span class="label" part="label"></span><span class="actions" part="actions"><slot name="actions"></slot></span><span class="drop-indicator row-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div><div class="children" part="children" role="group"><slot></slot></div><span class="drop-indicator subtree-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div>
+  <div role="treeitem" :data-drop-scope="dropScope" :data-accepts="accepts"><div class="row" part="row"><button $if="sortable and not disabled" class="drag-handle" part="drag-handle" type="button"><svg aria-hidden="true" focusable="false" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="12" r="1"></circle><circle cx="9" cy="5" r="1"></circle><circle cx="9" cy="19" r="1"></circle><circle cx="15" cy="12" r="1"></circle><circle cx="15" cy="5" r="1"></circle><circle cx="15" cy="19" r="1"></circle></svg></button><button class="disclosure" part="disclosure" type="button" :disabled="disabled"><span class="disclosure-icon" aria-hidden="true"></span></button><span class="leading" part="leading"><slot name="leading"></slot></span><span class="label" part="label"><slot name="label"><template $value="label"></template></slot></span><span class="actions" part="actions"><slot name="actions"></slot></span><span class="drop-indicator row-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div><div class="children" part="children" role="group"><slot></slot></div><span class="drop-indicator subtree-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div>
   <style>:scope {
   --_tree-indent: 16px;
   --_tree-row-min-height: 32px;

package/dist/index.cjs

@@ -2864,7 +2864,6 @@ function controller28(host) {
   const disclosure = element.querySelector('[part="disclosure"]');
   const children = element.querySelector('[part="children"]');
   const dragHandle = element.querySelector('[part="drag-handle"]');
-  const label = element.querySelector('[part="label"]');
   const childItems = () => Array.from(children?.children ?? []).filter((child) => child.matches?.('[data-component-root~="ui-tree-item"]'));
   let lastExternalExpanded = Boolean(host.state.expanded);
   host.state.internalExpanded = lastExternalExpanded;
@@ -2903,7 +2902,6 @@ function controller28(host) {
     else element.removeAttribute("aria-expanded");
     element.tabIndex = disabled3 || !host.state.tabStop ? -1 : 0;
     element.style.setProperty("--ui-tree-item-depth", String(level - 1));
-    if (label && label.textContent !== name) label.textContent = name;
     if (children) children.hidden = !expanded;
     if (disclosure) {
       disclosure.hidden = !container;
@@ -5488,7 +5486,7 @@ input[type='radio']:focus-visible {
   { tag: "ui-tree-item", source: `<template component="ui-tree-item" controller="./controllers/ui-tree-item.js" status="early" summary="Migrated Looma ui-tree-item component.">
   <defs>
     <prop name="itemId" type="string" default="">itemId token.</prop>
-    <prop name="label" type="string" default="">label token.</prop>
+    <prop name="label" type="string" default="">The item's accessible name, also shown as the row text unless the label slot supplies content.</prop>
     <prop name="dropDepth" type="number">dropDepth token.</prop>
     <prop name="subtreeDepth" type="number">subtreeDepth token.</prop>
     <prop name="container" type="boolean" default="false">container token.</prop>
@@ -5505,7 +5503,7 @@ input[type='radio']:focus-visible {
     <state name="hasChildren" :value="false"></state>
     <event name="expand" bubbles="false" type="object({ id: string, expanded: boolean, trigger: keyboard | pointer | programmatic })"></event>
   </defs>
-  <div role="treeitem" :data-drop-scope="dropScope" :data-accepts="accepts"><div class="row" part="row"><button $if="sortable and not disabled" class="drag-handle" part="drag-handle" type="button"><svg aria-hidden="true" focusable="false" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="12" r="1"></circle><circle cx="9" cy="5" r="1"></circle><circle cx="9" cy="19" r="1"></circle><circle cx="15" cy="12" r="1"></circle><circle cx="15" cy="5" r="1"></circle><circle cx="15" cy="19" r="1"></circle></svg></button><button class="disclosure" part="disclosure" type="button" :disabled="disabled"><span class="disclosure-icon" aria-hidden="true"></span></button><span class="leading" part="leading"><slot name="leading"></slot></span><span class="label" part="label"></span><span class="actions" part="actions"><slot name="actions"></slot></span><span class="drop-indicator row-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div><div class="children" part="children" role="group"><slot></slot></div><span class="drop-indicator subtree-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div>
+  <div role="treeitem" :data-drop-scope="dropScope" :data-accepts="accepts"><div class="row" part="row"><button $if="sortable and not disabled" class="drag-handle" part="drag-handle" type="button"><svg aria-hidden="true" focusable="false" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="12" r="1"></circle><circle cx="9" cy="5" r="1"></circle><circle cx="9" cy="19" r="1"></circle><circle cx="15" cy="12" r="1"></circle><circle cx="15" cy="5" r="1"></circle><circle cx="15" cy="19" r="1"></circle></svg></button><button class="disclosure" part="disclosure" type="button" :disabled="disabled"><span class="disclosure-icon" aria-hidden="true"></span></button><span class="leading" part="leading"><slot name="leading"></slot></span><span class="label" part="label"><slot name="label"><template $value="label"></template></slot></span><span class="actions" part="actions"><slot name="actions"></slot></span><span class="drop-indicator row-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div><div class="children" part="children" role="group"><slot></slot></div><span class="drop-indicator subtree-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div>
   <style>:scope {
   --_tree-indent: 16px;
   --_tree-row-min-height: 32px;

package/dist/index.js

@@ -1,7 +1,7 @@
 import {
   records,
   styles
-} from "./chunk-3NVMCHGR.js";
+} from "./chunk-RWLYVQY6.js";
 import {
   attachLoomaComponent,
   controllerFor,

package/dist/loader.cjs

@@ -2842,7 +2842,6 @@ function controller28(host) {
   const disclosure = element.querySelector('[part="disclosure"]');
   const children = element.querySelector('[part="children"]');
   const dragHandle = element.querySelector('[part="drag-handle"]');
-  const label = element.querySelector('[part="label"]');
   const childItems = () => Array.from(children?.children ?? []).filter((child) => child.matches?.('[data-component-root~="ui-tree-item"]'));
   let lastExternalExpanded = Boolean(host.state.expanded);
   host.state.internalExpanded = lastExternalExpanded;
@@ -2881,7 +2880,6 @@ function controller28(host) {
     else element.removeAttribute("aria-expanded");
     element.tabIndex = disabled3 || !host.state.tabStop ? -1 : 0;
     element.style.setProperty("--ui-tree-item-depth", String(level - 1));
-    if (label && label.textContent !== name) label.textContent = name;
     if (children) children.hidden = !expanded;
     if (disclosure) {
       disclosure.hidden = !container;
@@ -5466,7 +5464,7 @@ input[type='radio']:focus-visible {
   { tag: "ui-tree-item", source: `<template component="ui-tree-item" controller="./controllers/ui-tree-item.js" status="early" summary="Migrated Looma ui-tree-item component.">
   <defs>
     <prop name="itemId" type="string" default="">itemId token.</prop>
-    <prop name="label" type="string" default="">label token.</prop>
+    <prop name="label" type="string" default="">The item's accessible name, also shown as the row text unless the label slot supplies content.</prop>
     <prop name="dropDepth" type="number">dropDepth token.</prop>
     <prop name="subtreeDepth" type="number">subtreeDepth token.</prop>
     <prop name="container" type="boolean" default="false">container token.</prop>
@@ -5483,7 +5481,7 @@ input[type='radio']:focus-visible {
     <state name="hasChildren" :value="false"></state>
     <event name="expand" bubbles="false" type="object({ id: string, expanded: boolean, trigger: keyboard | pointer | programmatic })"></event>
   </defs>
-  <div role="treeitem" :data-drop-scope="dropScope" :data-accepts="accepts"><div class="row" part="row"><button $if="sortable and not disabled" class="drag-handle" part="drag-handle" type="button"><svg aria-hidden="true" focusable="false" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="12" r="1"></circle><circle cx="9" cy="5" r="1"></circle><circle cx="9" cy="19" r="1"></circle><circle cx="15" cy="12" r="1"></circle><circle cx="15" cy="5" r="1"></circle><circle cx="15" cy="19" r="1"></circle></svg></button><button class="disclosure" part="disclosure" type="button" :disabled="disabled"><span class="disclosure-icon" aria-hidden="true"></span></button><span class="leading" part="leading"><slot name="leading"></slot></span><span class="label" part="label"></span><span class="actions" part="actions"><slot name="actions"></slot></span><span class="drop-indicator row-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div><div class="children" part="children" role="group"><slot></slot></div><span class="drop-indicator subtree-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div>
+  <div role="treeitem" :data-drop-scope="dropScope" :data-accepts="accepts"><div class="row" part="row"><button $if="sortable and not disabled" class="drag-handle" part="drag-handle" type="button"><svg aria-hidden="true" focusable="false" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="12" r="1"></circle><circle cx="9" cy="5" r="1"></circle><circle cx="9" cy="19" r="1"></circle><circle cx="15" cy="12" r="1"></circle><circle cx="15" cy="5" r="1"></circle><circle cx="15" cy="19" r="1"></circle></svg></button><button class="disclosure" part="disclosure" type="button" :disabled="disabled"><span class="disclosure-icon" aria-hidden="true"></span></button><span class="leading" part="leading"><slot name="leading"></slot></span><span class="label" part="label"><slot name="label"><template $value="label"></template></slot></span><span class="actions" part="actions"><slot name="actions"></slot></span><span class="drop-indicator row-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div><div class="children" part="children" role="group"><slot></slot></div><span class="drop-indicator subtree-drop-indicator" part="drop-indicator" aria-hidden="true"></span></div>
   <style>:scope {
   --_tree-indent: 16px;
   --_tree-row-min-height: 32px;

package/dist/loader.js

@@ -1,7 +1,7 @@
 import {
   records,
   styles
-} from "./chunk-3NVMCHGR.js";
+} from "./chunk-RWLYVQY6.js";
 import {
   registerLoomaPackage
 } from "./chunk-XDNZIKNI.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@threadlabs/looma",
-  "version": "0.3.0",
+  "version": "0.3.1",
   "type": "module",
   "description": "Looma declarative components, responsive layout primitives, a complete editor, and supported Vue adapters.",
   "license": "MIT",

package/react/index.js

@@ -288,7 +288,7 @@ function UiCombobox(props) {
     return () => node.removeEventListener("create-item", listener8);
   }, [onCreateItem]);
   return /* @__PURE__ */ jsxs4("div", { ...nativeProps, "data-component": "ui-combobox", "data-component-root": "ui-combobox", "data-size": prop15 ?? void 0, ref: setRoot, children: [
-    /* @__PURE__ */ jsx9("label", { htmlFor: "input", part: "label", "data-component": "ui-combobox", children: /* @__PURE__ */ jsx9("template", { "data-component": "ui-combobox", children: prop7 }) }),
+    /* @__PURE__ */ jsx9("label", { htmlFor: "input", part: "label", "data-component": "ui-combobox", children: prop7 }),
     /* @__PURE__ */ jsxs4("div", { className: "field", part: "field", "data-component": "ui-combobox", children: [
       slots?.["start"] ?? null,
       /* @__PURE__ */ jsx9("div", { className: "items", role: "group", "data-component": "ui-combobox" }),
@@ -297,7 +297,7 @@ function UiCombobox(props) {
       /* @__PURE__ */ jsx9("button", { id: "help", type: "button", part: "affordance", disabled: prop3 ?? void 0, "data-component": "ui-combobox", children: /* @__PURE__ */ jsx9("span", { "aria-hidden": "true", "data-component": "ui-combobox", children: "?" }) }),
       /* @__PURE__ */ jsx9("button", { type: "button", part: "affordance", "aria-controls": "listbox", "data-component": "ui-combobox", children: /* @__PURE__ */ jsx9("svg", { className: "affordance-icon", "aria-hidden": "true", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2.25", "stroke-linecap": "round", "stroke-linejoin": "round", "data-component": "ui-combobox", children: /* @__PURE__ */ jsx9("path", { d: "m6 9 6 6 6-6", "data-component": "ui-combobox" }) }) })
     ] }),
-    /* @__PURE__ */ jsx9(UiTooltip, { id: "help-text", for: "help", "data-component": "ui-combobox", children: /* @__PURE__ */ jsx9("template", { "data-component": "ui-combobox", children: prop5 }) }),
+    /* @__PURE__ */ jsx9(UiTooltip, { id: "help-text", for: "help", "data-component": "ui-combobox", children: prop5 }),
     /* @__PURE__ */ jsxs4("div", { className: "popup", part: "popup", hidden: void 0, "data-component": "ui-combobox", children: [
       /* @__PURE__ */ jsx9("div", { id: "listbox", role: "listbox", "data-component": "ui-combobox" }),
       slots?.["footer"] ?? null
@@ -421,7 +421,7 @@ function UiDialog(props) {
   }, [onClose]);
   return /* @__PURE__ */ jsxs5("dialog", { ...nativeProps, "data-component": "ui-dialog", "data-component-root": "ui-dialog", "aria-label": void 0, ref: setRoot, children: [
     /* @__PURE__ */ jsxs5("header", { className: "dialog__header", "data-component": "ui-dialog", children: [
-      /* @__PURE__ */ jsx12("h2", { className: "dialog__title", "data-component": "ui-dialog", children: /* @__PURE__ */ jsx12("template", { "data-component": "ui-dialog", children: prop2 }) }),
+      /* @__PURE__ */ jsx12("h2", { className: "dialog__title", "data-component": "ui-dialog", children: prop2 }),
       /* @__PURE__ */ jsx12("button", { className: "dialog__close", type: "button", "aria-label": "Close", "data-component": "ui-dialog" })
     ] }),
     /* @__PURE__ */ jsx12("div", { className: "dialog__body", "data-component": "ui-dialog", children: children ?? null }),
@@ -463,7 +463,7 @@ function UiDisclosure(props) {
   }, [onClose]);
   return /* @__PURE__ */ jsxs6("div", { ...nativeProps, "data-component": "ui-disclosure", "data-component-root": "ui-disclosure", ref: setRoot, children: [
     /* @__PURE__ */ jsxs6("button", { className: "disclosure__trigger", type: "button", "aria-controls": void 0, disabled: prop0 ?? void 0, "data-component": "ui-disclosure", children: [
-      /* @__PURE__ */ jsx13("span", { "data-component": "ui-disclosure", children: /* @__PURE__ */ jsx13("template", { "data-component": "ui-disclosure", children: prop2 }) }),
+      /* @__PURE__ */ jsx13("span", { "data-component": "ui-disclosure", children: prop2 }),
       /* @__PURE__ */ jsx13("span", { className: "disclosure__chevron", "aria-hidden": "true", "data-component": "ui-disclosure" })
     ] }),
     /* @__PURE__ */ jsx13("div", { className: "disclosure__panel", "data-component": "ui-disclosure", children: /* @__PURE__ */ jsx13("div", { className: "disclosure__panel-inner", "data-component": "ui-disclosure", children: children ?? null }) })
@@ -512,8 +512,8 @@ function UiEditable(props) {
   return /* @__PURE__ */ jsxs7("div", { ...nativeProps, "data-component": "ui-editable", "data-component-root": "ui-editable", "data-state-edit": void 0, "data-disabled": prop1 ? "" : void 0, ref: setRoot, children: [
     /* @__PURE__ */ jsxs7("div", { className: "editable__field", "data-component": "ui-editable", children: [
       /* @__PURE__ */ jsxs7("button", { className: "editable__preview", type: "button", "data-component": "ui-editable", children: [
-        /* @__PURE__ */ jsx14("span", { className: "editable__text", "data-component": "ui-editable", children: /* @__PURE__ */ jsx14("template", { "data-component": "ui-editable", children: void 0 }) }),
-        /* @__PURE__ */ jsx14("span", { className: "editable__hint", "aria-hidden": "true", "data-component": "ui-editable", children: /* @__PURE__ */ jsx14("template", { "data-component": "ui-editable", children: prop3 }) })
+        /* @__PURE__ */ jsx14("span", { className: "editable__text", "data-component": "ui-editable", children: void 0 }),
+        /* @__PURE__ */ jsx14("span", { className: "editable__hint", "aria-hidden": "true", "data-component": "ui-editable", children: prop3 })
       ] }),
       /* @__PURE__ */ jsx14("input", { className: "editable__input", type: "text", value: void 0, "data-component": "ui-editable" })
     ] }),
@@ -683,7 +683,7 @@ function UiRadioGroup(props) {
     return () => node.removeEventListener("change", listener1);
   }, [onChange]);
   return /* @__PURE__ */ jsxs9("fieldset", { ...nativeProps, "data-component": "ui-radio-group", "data-component-root": "ui-radio-group", role: "radiogroup", "data-orientation": prop3 ?? void 0, "data-disabled": prop0 ? "" : void 0, ref: setRoot, children: [
-    /* @__PURE__ */ jsx19("legend", { "data-component": "ui-radio-group", children: /* @__PURE__ */ jsx19("template", { "data-component": "ui-radio-group", children: prop1 }) }),
+    /* @__PURE__ */ jsx19("legend", { "data-component": "ui-radio-group", children: prop1 }),
     children ?? null
   ] });
 }
@@ -785,7 +785,7 @@ function UiSearchShell(props) {
 import { useLayoutEffect as useLayoutEffect24, useRef as useRef24 } from "react";
 import { attachLoomaComponent as attachLoomaComponent22, updateComponentProps as updateComponentProps22 } from "@threadlabs/looma/core/declarative";
 import { jsx as jsx23 } from "react/jsx-runtime";
-var definition22 = { ...{ "contract": { "tag": "ui-select", "props": { "disabled": { "type": "boolean", "required": false, "target": { "attribute": "disabled" }, "default": false }, "invalid": { "type": "boolean", "required": false, "target": { "attribute": "invalid" }, "default": false }, "multiple": { "type": "boolean", "required": false, "target": { "attribute": "multiple" }, "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": "multiple", "expression": "multiple", "expressionPlan": { "source": "multiple", "ast": { "kind": "id", "name": "multiple" }, "dependencies": ["multiple"] } }], "children": [] }, "declarations": [], "root": { "kind": "native", "element": "select", "choices": ["select"] } }, source: { file: import.meta.url }, css: "" };
+var definition22 = { ...{ "contract": { "tag": "ui-select", "props": { "disabled": { "type": "boolean", "required": false, "target": { "attribute": "disabled" }, "default": false }, "invalid": { "type": "boolean", "required": false, "target": { "attribute": "invalid" }, "default": false }, "multiple": { "type": "boolean", "required": false, "target": { "attribute": "multiple" }, "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": "multiple", "expression": "multiple", "expressionPlan": { "source": "multiple", "ast": { "kind": "id", "name": "multiple" }, "dependencies": ["multiple"] } }], "children": [{ "kind": "slot" }] }, "declarations": [], "root": { "kind": "native", "element": "select", "choices": ["select"] } }, source: { file: import.meta.url }, css: "" };
 function UiSelect(props) {
   const { "disabled": prop0 = false, "invalid": prop1 = false, "multiple": prop2 = false, "required": prop3 = false, "value": prop4, slots, children, ref, ...nativeProps } = props;
   const root = useRef24(null);
@@ -799,7 +799,7 @@ function UiSelect(props) {
   useLayoutEffect24(() => {
     if (root.current != null) updateComponentProps22(root.current, componentProps);
   });
-  return /* @__PURE__ */ jsx23("select", { ...nativeProps, "data-component": "ui-select", "data-component-root": "ui-select", disabled: prop0 ?? void 0, required: prop3 ?? void 0, multiple: prop2 ?? void 0, ref: setRoot });
+  return /* @__PURE__ */ jsx23("select", { ...nativeProps, "data-component": "ui-select", "data-component-root": "ui-select", disabled: prop0 ?? void 0, required: prop3 ?? void 0, multiple: prop2 ?? void 0, ref: setRoot, children: children ?? null });
 }
 
 // src/generated/UiSwitch.tsx
@@ -949,8 +949,8 @@ function UiTopBar(props) {
 // src/generated/UiTreeItem.tsx
 import { useLayoutEffect as useLayoutEffect30, useRef as useRef30 } from "react";
 import { attachLoomaComponent as attachLoomaComponent28, updateComponentProps as updateComponentProps28 } from "@threadlabs/looma/core/declarative";
-import { jsx as jsx29, jsxs as jsxs16 } from "react/jsx-runtime";
-var definition28 = { ...{ "contract": { "tag": "ui-tree-item", "props": { "accepts": { "type": "string", "required": false, "target": { "attribute": "data-accepts" }, "default": "" }, "container": { "type": "boolean", "required": false, "target": { "attribute": "container" }, "default": false }, "disabled": { "type": "boolean", "required": false, "target": { "attribute": "disabled" }, "default": false }, "dragType": { "type": "string", "required": false, "target": { "attribute": "dragtype" }, "default": "item" }, "dropDepth": { "type": "number", "required": false, "target": { "attribute": "dropdepth" } }, "dropScope": { "type": "string", "required": false, "target": { "attribute": "data-drop-scope" }, "default": "" }, "expanded": { "type": "boolean", "required": false, "target": { "attribute": "expanded" }, "default": false }, "itemId": { "type": "string", "required": false, "target": { "attribute": "itemid" }, "default": "" }, "label": { "type": "string", "required": false, "target": { "attribute": "label" }, "default": "" }, "selected": { "type": "boolean", "required": false, "target": { "attribute": "selected" }, "default": false }, "sortable": { "type": "boolean", "required": false, "target": { "attribute": "sortable" }, "default": false }, "subtreeDepth": { "type": "number", "required": false, "target": { "attribute": "subtreedepth" } } } }, "template": { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "role", "value": "treeitem" }, { "kind": "attribute", "name": "data-drop-scope", "expression": "dropScope", "expressionPlan": { "source": "dropScope", "ast": { "kind": "id", "name": "dropScope" }, "dependencies": ["dropScope"] } }, { "kind": "attribute", "name": "data-accepts", "expression": "accepts", "expressionPlan": { "source": "accepts", "ast": { "kind": "id", "name": "accepts" }, "dependencies": ["accepts"] } }], "children": [{ "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "row" }, { "kind": "literal", "name": "part", "value": "row" }], "children": [{ "kind": "element", "name": "button", "attributes": [{ "kind": "literal", "name": "class", "value": "drag-handle" }, { "kind": "literal", "name": "part", "value": "drag-handle" }, { "kind": "literal", "name": "type", "value": "button" }], "children": [{ "kind": "element", "name": "svg", "attributes": [{ "kind": "literal", "name": "aria-hidden", "value": "true" }, { "kind": "literal", "name": "focusable", "value": "false" }, { "kind": "literal", "name": "viewBox", "value": "0 0 24 24" }, { "kind": "literal", "name": "fill", "value": "none" }, { "kind": "literal", "name": "stroke", "value": "currentColor" }, { "kind": "literal", "name": "stroke-width", "value": "2" }, { "kind": "literal", "name": "stroke-linecap", "value": "round" }, { "kind": "literal", "name": "stroke-linejoin", "value": "round" }], "children": [{ "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "9" }, { "kind": "literal", "name": "cy", "value": "12" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "9" }, { "kind": "literal", "name": "cy", "value": "5" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "9" }, { "kind": "literal", "name": "cy", "value": "19" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "15" }, { "kind": "literal", "name": "cy", "value": "12" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "15" }, { "kind": "literal", "name": "cy", "value": "5" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "15" }, { "kind": "literal", "name": "cy", "value": "19" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }] }], "flow": { "kind": "if", "test": "sortable and not disabled", "testPlan": { "source": "sortable and not disabled", "ast": { "kind": "binary", "op": "and", "left": { "kind": "id", "name": "sortable" }, "right": { "kind": "unary", "op": "not", "operand": { "kind": "id", "name": "disabled" } } }, "dependencies": ["disabled", "sortable"] } } }, { "kind": "element", "name": "button", "attributes": [{ "kind": "literal", "name": "class", "value": "disclosure" }, { "kind": "literal", "name": "part", "value": "disclosure" }, { "kind": "literal", "name": "type", "value": "button" }, { "kind": "attribute", "name": "disabled", "expression": "disabled", "expressionPlan": { "source": "disabled", "ast": { "kind": "id", "name": "disabled" }, "dependencies": ["disabled"] } }], "children": [{ "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "disclosure-icon" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [] }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "leading" }, { "kind": "literal", "name": "part", "value": "leading" }], "children": [{ "kind": "slot", "fallback": [], "name": "leading" }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "label" }, { "kind": "literal", "name": "part", "value": "label" }], "children": [] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "actions" }, { "kind": "literal", "name": "part", "value": "actions" }], "children": [{ "kind": "slot", "fallback": [], "name": "actions" }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "drop-indicator row-drop-indicator" }, { "kind": "literal", "name": "part", "value": "drop-indicator" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [] }] }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "children" }, { "kind": "literal", "name": "part", "value": "children" }, { "kind": "literal", "name": "role", "value": "group" }], "children": [{ "kind": "slot" }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "drop-indicator subtree-drop-indicator" }, { "kind": "literal", "name": "part", "value": "drop-indicator" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [] }] }, "declarations": [{ "kind": "state", "name": "internalExpanded", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "structuralLevel", "expression": { "source": "1", "ast": { "kind": "literal", "value": 1 }, "dependencies": [] } }, { "kind": "state", "name": "tabStop", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "hasChildren", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "event", "name": "expand", "type": "object({ id: string, expanded: boolean, trigger: keyboard | pointer | programmatic })", "bubbles": false, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
+import { Fragment, jsx as jsx29, jsxs as jsxs16 } from "react/jsx-runtime";
+var definition28 = { ...{ "contract": { "tag": "ui-tree-item", "props": { "accepts": { "type": "string", "required": false, "target": { "attribute": "data-accepts" }, "default": "" }, "container": { "type": "boolean", "required": false, "target": { "attribute": "container" }, "default": false }, "disabled": { "type": "boolean", "required": false, "target": { "attribute": "disabled" }, "default": false }, "dragType": { "type": "string", "required": false, "target": { "attribute": "dragtype" }, "default": "item" }, "dropDepth": { "type": "number", "required": false, "target": { "attribute": "dropdepth" } }, "dropScope": { "type": "string", "required": false, "target": { "attribute": "data-drop-scope" }, "default": "" }, "expanded": { "type": "boolean", "required": false, "target": { "attribute": "expanded" }, "default": false }, "itemId": { "type": "string", "required": false, "target": { "attribute": "itemid" }, "default": "" }, "label": { "type": "string", "required": false, "target": { "attribute": "label" }, "default": "" }, "selected": { "type": "boolean", "required": false, "target": { "attribute": "selected" }, "default": false }, "sortable": { "type": "boolean", "required": false, "target": { "attribute": "sortable" }, "default": false }, "subtreeDepth": { "type": "number", "required": false, "target": { "attribute": "subtreedepth" } } } }, "template": { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "role", "value": "treeitem" }, { "kind": "attribute", "name": "data-drop-scope", "expression": "dropScope", "expressionPlan": { "source": "dropScope", "ast": { "kind": "id", "name": "dropScope" }, "dependencies": ["dropScope"] } }, { "kind": "attribute", "name": "data-accepts", "expression": "accepts", "expressionPlan": { "source": "accepts", "ast": { "kind": "id", "name": "accepts" }, "dependencies": ["accepts"] } }], "children": [{ "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "row" }, { "kind": "literal", "name": "part", "value": "row" }], "children": [{ "kind": "element", "name": "button", "attributes": [{ "kind": "literal", "name": "class", "value": "drag-handle" }, { "kind": "literal", "name": "part", "value": "drag-handle" }, { "kind": "literal", "name": "type", "value": "button" }], "children": [{ "kind": "element", "name": "svg", "attributes": [{ "kind": "literal", "name": "aria-hidden", "value": "true" }, { "kind": "literal", "name": "focusable", "value": "false" }, { "kind": "literal", "name": "viewBox", "value": "0 0 24 24" }, { "kind": "literal", "name": "fill", "value": "none" }, { "kind": "literal", "name": "stroke", "value": "currentColor" }, { "kind": "literal", "name": "stroke-width", "value": "2" }, { "kind": "literal", "name": "stroke-linecap", "value": "round" }, { "kind": "literal", "name": "stroke-linejoin", "value": "round" }], "children": [{ "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "9" }, { "kind": "literal", "name": "cy", "value": "12" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "9" }, { "kind": "literal", "name": "cy", "value": "5" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "9" }, { "kind": "literal", "name": "cy", "value": "19" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "15" }, { "kind": "literal", "name": "cy", "value": "12" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "15" }, { "kind": "literal", "name": "cy", "value": "5" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "15" }, { "kind": "literal", "name": "cy", "value": "19" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }] }], "flow": { "kind": "if", "test": "sortable and not disabled", "testPlan": { "source": "sortable and not disabled", "ast": { "kind": "binary", "op": "and", "left": { "kind": "id", "name": "sortable" }, "right": { "kind": "unary", "op": "not", "operand": { "kind": "id", "name": "disabled" } } }, "dependencies": ["disabled", "sortable"] } } }, { "kind": "element", "name": "button", "attributes": [{ "kind": "literal", "name": "class", "value": "disclosure" }, { "kind": "literal", "name": "part", "value": "disclosure" }, { "kind": "literal", "name": "type", "value": "button" }, { "kind": "attribute", "name": "disabled", "expression": "disabled", "expressionPlan": { "source": "disabled", "ast": { "kind": "id", "name": "disabled" }, "dependencies": ["disabled"] } }], "children": [{ "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "disclosure-icon" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [] }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "leading" }, { "kind": "literal", "name": "part", "value": "leading" }], "children": [{ "kind": "slot", "fallback": [], "name": "leading" }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "label" }, { "kind": "literal", "name": "part", "value": "label" }], "children": [{ "kind": "slot", "fallback": [{ "kind": "element", "name": "template", "attributes": [{ "kind": "directive", "name": "value", "expression": "label", "expressionPlan": { "source": "label", "ast": { "kind": "id", "name": "label" }, "dependencies": ["label"] } }], "children": [] }], "name": "label" }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "actions" }, { "kind": "literal", "name": "part", "value": "actions" }], "children": [{ "kind": "slot", "fallback": [], "name": "actions" }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "drop-indicator row-drop-indicator" }, { "kind": "literal", "name": "part", "value": "drop-indicator" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [] }] }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "children" }, { "kind": "literal", "name": "part", "value": "children" }, { "kind": "literal", "name": "role", "value": "group" }], "children": [{ "kind": "slot" }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "drop-indicator subtree-drop-indicator" }, { "kind": "literal", "name": "part", "value": "drop-indicator" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [] }] }, "declarations": [{ "kind": "state", "name": "internalExpanded", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "structuralLevel", "expression": { "source": "1", "ast": { "kind": "literal", "value": 1 }, "dependencies": [] } }, { "kind": "state", "name": "tabStop", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "hasChildren", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "event", "name": "expand", "type": "object({ id: string, expanded: boolean, trigger: keyboard | pointer | programmatic })", "bubbles": false, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
 function UiTreeItem(props) {
   const { "accepts": prop0 = "", "container": prop1 = false, "disabled": prop2 = false, "dragType": prop3 = "item", "dropDepth": prop4, "dropScope": prop5 = "", "expanded": prop6 = false, "itemId": prop7 = "", "label": prop8 = "", "selected": prop9 = false, "sortable": prop10 = false, "subtreeDepth": prop11, onExpand, slots, children, ref, ...nativeProps } = props;
   const root = useRef30(null);
@@ -983,7 +983,7 @@ function UiTreeItem(props) {
       ] }) }),
       /* @__PURE__ */ jsx29("button", { className: "disclosure", part: "disclosure", type: "button", disabled: prop2 ?? void 0, "data-component": "ui-tree-item", children: /* @__PURE__ */ jsx29("span", { className: "disclosure-icon", "aria-hidden": "true", "data-component": "ui-tree-item" }) }),
       /* @__PURE__ */ jsx29("span", { className: "leading", part: "leading", "data-component": "ui-tree-item", children: slots?.["leading"] ?? null }),
-      /* @__PURE__ */ jsx29("span", { className: "label", part: "label", "data-component": "ui-tree-item" }),
+      /* @__PURE__ */ jsx29("span", { className: "label", part: "label", "data-component": "ui-tree-item", children: slots?.["label"] ?? /* @__PURE__ */ jsx29(Fragment, { children: prop8 }) }),
       /* @__PURE__ */ jsx29("span", { className: "actions", part: "actions", "data-component": "ui-tree-item", children: slots?.["actions"] ?? null }),
       /* @__PURE__ */ jsx29("span", { className: "drop-indicator row-drop-indicator", part: "drop-indicator", "aria-hidden": "true", "data-component": "ui-tree-item" })
     ] }),

package/svelte/index.js

@@ -973,7 +973,7 @@ function createUiSearchShell(options = {}) {
 
 // src/generated/vanilla/UiSelect.js
 import { attachLoomaComponent as attachLoomaComponent21 } from "@threadlabs/looma/core/declarative";
-var definition21 = { ...{ "contract": { "tag": "ui-select", "props": { "disabled": { "type": "boolean", "required": false, "target": { "attribute": "disabled" }, "default": false }, "invalid": { "type": "boolean", "required": false, "target": { "attribute": "invalid" }, "default": false }, "multiple": { "type": "boolean", "required": false, "target": { "attribute": "multiple" }, "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": "multiple", "expression": "multiple", "expressionPlan": { "source": "multiple", "ast": { "kind": "id", "name": "multiple" }, "dependencies": ["multiple"] } }], "children": [] }, "declarations": [], "root": { "kind": "native", "element": "select", "choices": ["select"] } }, source: { file: import.meta.url }, css: "" };
+var definition21 = { ...{ "contract": { "tag": "ui-select", "props": { "disabled": { "type": "boolean", "required": false, "target": { "attribute": "disabled" }, "default": false }, "invalid": { "type": "boolean", "required": false, "target": { "attribute": "invalid" }, "default": false }, "multiple": { "type": "boolean", "required": false, "target": { "attribute": "multiple" }, "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": "multiple", "expression": "multiple", "expressionPlan": { "source": "multiple", "ast": { "kind": "id", "name": "multiple" }, "dependencies": ["multiple"] } }], "children": [{ "kind": "slot" }] }, "declarations": [], "root": { "kind": "native", "element": "select", "choices": ["select"] } }, source: { file: import.meta.url }, css: "" };
 function createUiSelect(options = {}) {
   const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
   const element = document.createElement("select");
@@ -992,6 +992,10 @@ function createUiSelect(options = {}) {
   else element.removeAttribute("multiple");
   element.setAttribute("data-component", "ui-select");
   element.setAttribute("data-component-root", "ui-select");
+  if (children.length > 0) {
+    for (const child of children) element.append(child);
+  } else {
+  }
   attachLoomaComponent21(element, definition21, "ui-select", componentProps);
   return element;
 }
@@ -1213,7 +1217,7 @@ function createUiTopBar(options = {}) {
 
 // src/generated/vanilla/UiTreeItem.js
 import { attachLoomaComponent as attachLoomaComponent28 } from "@threadlabs/looma/core/declarative";
-var definition28 = { ...{ "contract": { "tag": "ui-tree-item", "props": { "accepts": { "type": "string", "required": false, "target": { "attribute": "data-accepts" }, "default": "" }, "container": { "type": "boolean", "required": false, "target": { "attribute": "container" }, "default": false }, "disabled": { "type": "boolean", "required": false, "target": { "attribute": "disabled" }, "default": false }, "dragType": { "type": "string", "required": false, "target": { "attribute": "dragtype" }, "default": "item" }, "dropDepth": { "type": "number", "required": false, "target": { "attribute": "dropdepth" } }, "dropScope": { "type": "string", "required": false, "target": { "attribute": "data-drop-scope" }, "default": "" }, "expanded": { "type": "boolean", "required": false, "target": { "attribute": "expanded" }, "default": false }, "itemId": { "type": "string", "required": false, "target": { "attribute": "itemid" }, "default": "" }, "label": { "type": "string", "required": false, "target": { "attribute": "label" }, "default": "" }, "selected": { "type": "boolean", "required": false, "target": { "attribute": "selected" }, "default": false }, "sortable": { "type": "boolean", "required": false, "target": { "attribute": "sortable" }, "default": false }, "subtreeDepth": { "type": "number", "required": false, "target": { "attribute": "subtreedepth" } } } }, "template": { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "role", "value": "treeitem" }, { "kind": "attribute", "name": "data-drop-scope", "expression": "dropScope", "expressionPlan": { "source": "dropScope", "ast": { "kind": "id", "name": "dropScope" }, "dependencies": ["dropScope"] } }, { "kind": "attribute", "name": "data-accepts", "expression": "accepts", "expressionPlan": { "source": "accepts", "ast": { "kind": "id", "name": "accepts" }, "dependencies": ["accepts"] } }], "children": [{ "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "row" }, { "kind": "literal", "name": "part", "value": "row" }], "children": [{ "kind": "element", "name": "button", "attributes": [{ "kind": "literal", "name": "class", "value": "drag-handle" }, { "kind": "literal", "name": "part", "value": "drag-handle" }, { "kind": "literal", "name": "type", "value": "button" }], "children": [{ "kind": "element", "name": "svg", "attributes": [{ "kind": "literal", "name": "aria-hidden", "value": "true" }, { "kind": "literal", "name": "focusable", "value": "false" }, { "kind": "literal", "name": "viewBox", "value": "0 0 24 24" }, { "kind": "literal", "name": "fill", "value": "none" }, { "kind": "literal", "name": "stroke", "value": "currentColor" }, { "kind": "literal", "name": "stroke-width", "value": "2" }, { "kind": "literal", "name": "stroke-linecap", "value": "round" }, { "kind": "literal", "name": "stroke-linejoin", "value": "round" }], "children": [{ "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "9" }, { "kind": "literal", "name": "cy", "value": "12" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "9" }, { "kind": "literal", "name": "cy", "value": "5" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "9" }, { "kind": "literal", "name": "cy", "value": "19" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "15" }, { "kind": "literal", "name": "cy", "value": "12" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "15" }, { "kind": "literal", "name": "cy", "value": "5" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "15" }, { "kind": "literal", "name": "cy", "value": "19" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }] }], "flow": { "kind": "if", "test": "sortable and not disabled", "testPlan": { "source": "sortable and not disabled", "ast": { "kind": "binary", "op": "and", "left": { "kind": "id", "name": "sortable" }, "right": { "kind": "unary", "op": "not", "operand": { "kind": "id", "name": "disabled" } } }, "dependencies": ["disabled", "sortable"] } } }, { "kind": "element", "name": "button", "attributes": [{ "kind": "literal", "name": "class", "value": "disclosure" }, { "kind": "literal", "name": "part", "value": "disclosure" }, { "kind": "literal", "name": "type", "value": "button" }, { "kind": "attribute", "name": "disabled", "expression": "disabled", "expressionPlan": { "source": "disabled", "ast": { "kind": "id", "name": "disabled" }, "dependencies": ["disabled"] } }], "children": [{ "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "disclosure-icon" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [] }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "leading" }, { "kind": "literal", "name": "part", "value": "leading" }], "children": [{ "kind": "slot", "fallback": [], "name": "leading" }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "label" }, { "kind": "literal", "name": "part", "value": "label" }], "children": [] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "actions" }, { "kind": "literal", "name": "part", "value": "actions" }], "children": [{ "kind": "slot", "fallback": [], "name": "actions" }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "drop-indicator row-drop-indicator" }, { "kind": "literal", "name": "part", "value": "drop-indicator" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [] }] }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "children" }, { "kind": "literal", "name": "part", "value": "children" }, { "kind": "literal", "name": "role", "value": "group" }], "children": [{ "kind": "slot" }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "drop-indicator subtree-drop-indicator" }, { "kind": "literal", "name": "part", "value": "drop-indicator" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [] }] }, "declarations": [{ "kind": "state", "name": "internalExpanded", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "structuralLevel", "expression": { "source": "1", "ast": { "kind": "literal", "value": 1 }, "dependencies": [] } }, { "kind": "state", "name": "tabStop", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "hasChildren", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "event", "name": "expand", "type": "object({ id: string, expanded: boolean, trigger: keyboard | pointer | programmatic })", "bubbles": false, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
+var definition28 = { ...{ "contract": { "tag": "ui-tree-item", "props": { "accepts": { "type": "string", "required": false, "target": { "attribute": "data-accepts" }, "default": "" }, "container": { "type": "boolean", "required": false, "target": { "attribute": "container" }, "default": false }, "disabled": { "type": "boolean", "required": false, "target": { "attribute": "disabled" }, "default": false }, "dragType": { "type": "string", "required": false, "target": { "attribute": "dragtype" }, "default": "item" }, "dropDepth": { "type": "number", "required": false, "target": { "attribute": "dropdepth" } }, "dropScope": { "type": "string", "required": false, "target": { "attribute": "data-drop-scope" }, "default": "" }, "expanded": { "type": "boolean", "required": false, "target": { "attribute": "expanded" }, "default": false }, "itemId": { "type": "string", "required": false, "target": { "attribute": "itemid" }, "default": "" }, "label": { "type": "string", "required": false, "target": { "attribute": "label" }, "default": "" }, "selected": { "type": "boolean", "required": false, "target": { "attribute": "selected" }, "default": false }, "sortable": { "type": "boolean", "required": false, "target": { "attribute": "sortable" }, "default": false }, "subtreeDepth": { "type": "number", "required": false, "target": { "attribute": "subtreedepth" } } } }, "template": { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "role", "value": "treeitem" }, { "kind": "attribute", "name": "data-drop-scope", "expression": "dropScope", "expressionPlan": { "source": "dropScope", "ast": { "kind": "id", "name": "dropScope" }, "dependencies": ["dropScope"] } }, { "kind": "attribute", "name": "data-accepts", "expression": "accepts", "expressionPlan": { "source": "accepts", "ast": { "kind": "id", "name": "accepts" }, "dependencies": ["accepts"] } }], "children": [{ "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "row" }, { "kind": "literal", "name": "part", "value": "row" }], "children": [{ "kind": "element", "name": "button", "attributes": [{ "kind": "literal", "name": "class", "value": "drag-handle" }, { "kind": "literal", "name": "part", "value": "drag-handle" }, { "kind": "literal", "name": "type", "value": "button" }], "children": [{ "kind": "element", "name": "svg", "attributes": [{ "kind": "literal", "name": "aria-hidden", "value": "true" }, { "kind": "literal", "name": "focusable", "value": "false" }, { "kind": "literal", "name": "viewBox", "value": "0 0 24 24" }, { "kind": "literal", "name": "fill", "value": "none" }, { "kind": "literal", "name": "stroke", "value": "currentColor" }, { "kind": "literal", "name": "stroke-width", "value": "2" }, { "kind": "literal", "name": "stroke-linecap", "value": "round" }, { "kind": "literal", "name": "stroke-linejoin", "value": "round" }], "children": [{ "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "9" }, { "kind": "literal", "name": "cy", "value": "12" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "9" }, { "kind": "literal", "name": "cy", "value": "5" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "9" }, { "kind": "literal", "name": "cy", "value": "19" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "15" }, { "kind": "literal", "name": "cy", "value": "12" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "15" }, { "kind": "literal", "name": "cy", "value": "5" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }, { "kind": "element", "name": "circle", "attributes": [{ "kind": "literal", "name": "cx", "value": "15" }, { "kind": "literal", "name": "cy", "value": "19" }, { "kind": "literal", "name": "r", "value": "1" }], "children": [] }] }], "flow": { "kind": "if", "test": "sortable and not disabled", "testPlan": { "source": "sortable and not disabled", "ast": { "kind": "binary", "op": "and", "left": { "kind": "id", "name": "sortable" }, "right": { "kind": "unary", "op": "not", "operand": { "kind": "id", "name": "disabled" } } }, "dependencies": ["disabled", "sortable"] } } }, { "kind": "element", "name": "button", "attributes": [{ "kind": "literal", "name": "class", "value": "disclosure" }, { "kind": "literal", "name": "part", "value": "disclosure" }, { "kind": "literal", "name": "type", "value": "button" }, { "kind": "attribute", "name": "disabled", "expression": "disabled", "expressionPlan": { "source": "disabled", "ast": { "kind": "id", "name": "disabled" }, "dependencies": ["disabled"] } }], "children": [{ "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "disclosure-icon" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [] }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "leading" }, { "kind": "literal", "name": "part", "value": "leading" }], "children": [{ "kind": "slot", "fallback": [], "name": "leading" }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "label" }, { "kind": "literal", "name": "part", "value": "label" }], "children": [{ "kind": "slot", "fallback": [{ "kind": "element", "name": "template", "attributes": [{ "kind": "directive", "name": "value", "expression": "label", "expressionPlan": { "source": "label", "ast": { "kind": "id", "name": "label" }, "dependencies": ["label"] } }], "children": [] }], "name": "label" }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "actions" }, { "kind": "literal", "name": "part", "value": "actions" }], "children": [{ "kind": "slot", "fallback": [], "name": "actions" }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "drop-indicator row-drop-indicator" }, { "kind": "literal", "name": "part", "value": "drop-indicator" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [] }] }, { "kind": "element", "name": "div", "attributes": [{ "kind": "literal", "name": "class", "value": "children" }, { "kind": "literal", "name": "part", "value": "children" }, { "kind": "literal", "name": "role", "value": "group" }], "children": [{ "kind": "slot" }] }, { "kind": "element", "name": "span", "attributes": [{ "kind": "literal", "name": "class", "value": "drop-indicator subtree-drop-indicator" }, { "kind": "literal", "name": "part", "value": "drop-indicator" }, { "kind": "literal", "name": "aria-hidden", "value": "true" }], "children": [] }] }, "declarations": [{ "kind": "state", "name": "internalExpanded", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "structuralLevel", "expression": { "source": "1", "ast": { "kind": "literal", "value": 1 }, "dependencies": [] } }, { "kind": "state", "name": "tabStop", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "state", "name": "hasChildren", "expression": { "source": "false", "ast": { "kind": "literal", "value": false }, "dependencies": [] } }, { "kind": "event", "name": "expand", "type": "object({ id: string, expanded: boolean, trigger: keyboard | pointer | programmatic })", "bubbles": false, "composed": true, "cancelable": false }], "root": { "kind": "native", "element": "div", "choices": ["div"] } }, source: { file: import.meta.url }, css: "" };
 function createUiTreeItem(options = {}) {
   const { attributes = {}, children = [], slots = {}, as, ...componentProps } = options;
   const element = document.createElement("div");
@@ -1314,39 +1318,46 @@ function createUiTreeItem(options = {}) {
   element12.setAttribute("class", "label");
   element12.setAttribute("part", "label");
   element12.setAttribute("data-component", "ui-tree-item");
-  element0.append(element12);
-  const element13 = document.createElement("span");
-  element13.setAttribute("class", "actions");
-  element13.setAttribute("part", "actions");
-  element13.setAttribute("data-component", "ui-tree-item");
-  if (slots["actions"] ?? [].length > 0) {
-    for (const child of slots["actions"] ?? []) element13.append(child);
+  if (slots["label"] ?? [].length > 0) {
+    for (const child of slots["label"] ?? []) element12.append(child);
   } else {
+    const element13 = document.createElement("template");
+    element13.setAttribute("data-component", "ui-tree-item");
+    element12.append(element13);
   }
-  element0.append(element13);
+  element0.append(element12);
   const element14 = document.createElement("span");
-  element14.setAttribute("class", "drop-indicator row-drop-indicator");
-  element14.setAttribute("part", "drop-indicator");
-  element14.setAttribute("aria-hidden", "true");
+  element14.setAttribute("class", "actions");
+  element14.setAttribute("part", "actions");
   element14.setAttribute("data-component", "ui-tree-item");
+  if (slots["actions"] ?? [].length > 0) {
+    for (const child of slots["actions"] ?? []) element14.append(child);
+  } else {
+  }
   element0.append(element14);
-  element.append(element0);
-  const element15 = document.createElement("div");
-  element15.setAttribute("class", "children");
-  element15.setAttribute("part", "children");
-  element15.setAttribute("role", "group");
+  const element15 = document.createElement("span");
+  element15.setAttribute("class", "drop-indicator row-drop-indicator");
+  element15.setAttribute("part", "drop-indicator");
+  element15.setAttribute("aria-hidden", "true");
   element15.setAttribute("data-component", "ui-tree-item");
+  element0.append(element15);
+  element.append(element0);
+  const element16 = document.createElement("div");
+  element16.setAttribute("class", "children");
+  element16.setAttribute("part", "children");
+  element16.setAttribute("role", "group");
+  element16.setAttribute("data-component", "ui-tree-item");
   if (children.length > 0) {
-    for (const child of children) element15.append(child);
+    for (const child of children) element16.append(child);
   } else {
   }
-  element.append(element15);
-  const element16 = document.createElement("span");
-  element16.setAttribute("class", "drop-indicator subtree-drop-indicator");
-  element16.setAttribute("part", "drop-indicator");
-  element16.setAttribute("aria-hidden", "true");
-  element16.setAttribute("data-component", "ui-tree-item");
   element.append(element16);
+  const element17 = document.createElement("span");
+  element17.setAttribute("class", "drop-indicator subtree-drop-indicator");
+  element17.setAttribute("part", "drop-indicator");
+  element17.setAttribute("aria-hidden", "true");
+  element17.setAttribute("data-component", "ui-tree-item");
+  element.append(element17);
   attachLoomaComponent28(element, definition28, "ui-tree-item", componentProps);
   return element;
 }