@threadlabs/looma 0.24.1 → 0.25.1

package/vue/UiToastRegion.vue

@@ -1,4 +1,4 @@
-<!-- Generated by HTML Next 1.0.0-alpha.26 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.29 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import {
   computed,
@@ -11,6 +11,7 @@ import {
 } from 'vue'
 import type { PropType, VNode } from 'vue'
 import { createDispatch, useComponentHost } from './host'
+import { acceptsControllerWrite } from './props'
 import { checkedProp, propValidityState, vPropValidity } from './props'
 import UiIcon from './UiIcon.vue'
 import UiIconButton from './UiIconButton.vue'
@@ -24,7 +25,7 @@ const propValidityContract = {
       required: false,
       target: { attribute: 'duration' },
       description:
-        'Default milliseconds for toasts added with show() or the show command; 0 keeps each until dismissed. Hover or focus pauses a timer.',
+        'Default milliseconds for toasts added with the show-toast event or command; 0 keeps each until dismissed. Hover or focus pauses a timer.',
       default: 0,
     },
     placement: {
@@ -130,6 +131,7 @@ function reflectedProp(
 }
 const hydrationInstance = getCurrentInstance()
 const emit = defineEmits<{
+  'update:duration': [value: number]
   dismiss: [
     event: CustomEvent<
       {
@@ -139,6 +141,16 @@ const emit = defineEmits<{
       }
     >,
   ]
+  'show-toast': [
+    event: CustomEvent<
+      {
+        readonly message: string
+        readonly id?: string
+        readonly tone?: 'neutral' | 'info' | 'success' | 'warning' | 'danger'
+        readonly duration?: number
+      }
+    >,
+  ]
 }>()
 
 const root = ref<HTMLElement | null>(null)
@@ -178,63 +190,96 @@ const hostState = computed(() =>
   ].filter(Boolean).join(' ')
 )
 
-const isDismissDetail = (detail: unknown): boolean =>
-  detail !== null && typeof detail === 'object' && !Array.isArray(detail)
+const isDismissDetail = (
+  detail: unknown,
+): boolean => (detail !== null && typeof detail === 'object' && !Array.isArray(detail)
   && typeof (detail as Record<string, unknown>)['id'] === 'string'
   && ((detail as Record<string, unknown>)['reason'] === 'action'
     || (detail as Record<string, unknown>)['reason'] === 'timeout')
   && ((detail as Record<string, unknown>)['trigger'] === 'keyboard'
     || (detail as Record<string, unknown>)['trigger'] === 'pointer'
     || (detail as Record<string, unknown>)['trigger'] === 'programmatic')
-  && Object.keys(detail as object).every((key) => ['id', 'reason', 'trigger'].includes(key))
+  && Object.keys(detail as object).every((key) => ['id', 'reason', 'trigger'].includes(key)))
+const isShowToastDetail = (
+  detail: unknown,
+): boolean => (detail !== null && typeof detail === 'object' && !Array.isArray(detail)
+  && typeof (detail as Record<string, unknown>)['message'] === 'string'
+  && ((detail as Record<string, unknown>)['id'] === undefined
+    || typeof (detail as Record<string, unknown>)['id'] === 'string')
+  && ((detail as Record<string, unknown>)['tone'] === undefined
+    || ((detail as Record<string, unknown>)['tone'] === 'neutral'
+      || (detail as Record<string, unknown>)['tone'] === 'info'
+      || (detail as Record<string, unknown>)['tone'] === 'success'
+      || (detail as Record<string, unknown>)['tone'] === 'warning'
+      || (detail as Record<string, unknown>)['tone'] === 'danger'))
+  && ((detail as Record<string, unknown>)['duration'] === undefined
+    || (typeof (detail as Record<string, unknown>)['duration'] === 'number'
+      && Number.isFinite((detail as Record<string, unknown>)['duration'])))
+  && Object.keys(detail as object).every((key) =>
+    ['message', 'id', 'tone', 'duration'].includes(key)
+  ))
 const dispatch = createDispatch(root, emit as (name: string, detail: unknown) => void, {
   checks: {
     dismiss: isDismissDetail,
+    'show-toast': isShowToastDetail,
   },
+  modeled: ['duration'],
 })
 
-const { host, ready } = useComponentHost(
-  () => import('../components/ui-toast-region/ui-toast-region.js'),
-  {
-    root,
-    dispatch,
-    controllerSource: {
-      specifier: '../components/ui-toast-region/ui-toast-region.js',
-      definition: './components/ui-toast-region/ui-toast-region.html',
-    },
-    props: checkedProps,
-    propInputs: (name: string) => {
-      const incoming = hydrationInstance?.vnode.props
-      const kebab = name.replace(/[A-Z]/g, (letter) => '-' + letter.toLowerCase())
-      return incoming !== null && incoming !== undefined
-        ? (incoming[name] ?? incoming[kebab] ?? null)
-        : null
-    },
-    propNames: ['duration', 'placement'],
-    propValidity: (name: string) =>
-      propValidityState({ contract: propValidityContract, values: { ...props } }, name),
-    state: { toasts },
+useComponentHost(() => import('../components/ui-toast-region/ui-toast-region.js'), {
+  root,
+  dispatch,
+  acceptsState: (name: string, keys: readonly string[], value: unknown) =>
+    acceptsControllerWrite(
+      value,
+      ({
+        toasts: {
+          kind: 'list',
+          item: {
+            kind: 'object',
+            fields: [{ name: 'id', type: { kind: 'terminal', name: 'string' }, optional: false }, {
+              name: 'message',
+              type: { kind: 'terminal', name: 'string' },
+              optional: false,
+            }, {
+              name: 'tone',
+              type: {
+                kind: 'constrained',
+                base: { kind: 'terminal', name: 'keyword' },
+                values: ['neutral', 'info', 'success', 'warning', 'danger'],
+              },
+              optional: false,
+            }, {
+              name: 'role',
+              type: {
+                kind: 'constrained',
+                base: { kind: 'terminal', name: 'keyword' },
+                values: ['alert', 'status'],
+              },
+              optional: false,
+            }, { name: 'closing', type: { kind: 'terminal', name: 'boolean' }, optional: false }],
+            open: false,
+          },
+        },
+      } as Record<string, any>)[name],
+      keys,
+    ),
+  controllerSource: {
+    specifier: '../components/ui-toast-region/ui-toast-region.js',
+    definition: './components/ui-toast-region/ui-toast-region.html',
   },
-)
-
-defineExpose({
-  show: async (...args: unknown[]) => {
-    const controllerModule = await ready()
-    if (controllerModule === undefined) {
-      throw new TypeError('Controller method `show` is not ready for <ui-toast-region>.')
-    }
-    const method = Reflect.get(controllerModule, 'show')
-    if (typeof method !== 'function') {
-      throw Object.assign(new Error('HJ003: Controller does not export method `show`.'), {
-        name: 'HtmlDiagnosticError',
-        diagnostic: Object.freeze({
-          code: 'HJ003',
-          message: 'Controller does not export method `show`.',
-        }),
-      })
-    }
-    return method(host, ...args)
+  props: checkedProps,
+  propInputs: (name: string) => {
+    const incoming = hydrationInstance?.vnode.props
+    const kebab = name.replace(/[A-Z]/g, (letter) => '-' + letter.toLowerCase())
+    return incoming !== null && incoming !== undefined
+      ? (incoming[name] ?? incoming[kebab] ?? null)
+      : null
   },
+  propNames: ['duration', 'placement'],
+  propValidity: (name: string) =>
+    propValidityState({ contract: propValidityContract, values: { ...props } }, name),
+  state: { toasts },
 })
 
 function text(value: unknown): string {

package/vue/UiTooltip.d.ts

@@ -1,11 +1,7 @@
 import type { PropType } from 'vue';
-declare var __VLS_1: {}, __VLS_3: {};
-type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_1) => any;
-} & {
-    shortcut?: (props: typeof __VLS_3) => any;
-};
-declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     for: {
         type: PropType<string | null>;
         default: string;
@@ -93,14 +89,15 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
     open: boolean | null;
     trigger: "hover" | "click" | "focus" | null;
     for: string | null;
+    hideDelay: number | null;
     inverse: boolean | null;
     placement: "left" | "right" | "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left-start" | "left-end" | "right-start" | "right-end" | null;
-    hideDelay: number | null;
     showDelay: number | null;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
-declare const _default: typeof __VLS_export;
-export default _default;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, {
+    default?: (props: {}) => any;
+} & {
+    shortcut?: (props: {}) => any;
+}>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

package/vue/UiTooltip.vue

@@ -1,8 +1,20 @@
-<!-- Generated by HTML Next 1.0.0-alpha.26 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.29 for Vue 3.5. Do not edit. -->
+<script lang="ts">
+const htmlNextAuthoredCheck2Reported = new Set<string>()
+function htmlNextAuthoredCheck2(accepted: boolean, location: string, message: string): boolean {
+  if (!accepted && !htmlNextAuthoredCheck2Reported.has(location)) {
+    htmlNextAuthoredCheck2Reported.add(location)
+    console.warn(message)
+  }
+  return accepted
+}
+</script>
+
 <script setup lang="ts">
 import { computed, getCurrentInstance, provide, ref, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'
 import { createDispatch, useComponentHost } from './host'
+import { acceptsControllerWrite } from './props'
 import { checkedProp, propValidityState, vPropValidity } from './props'
 
 defineOptions({ inheritAttrs: false })
@@ -250,9 +262,13 @@ const root = ref<HTMLElement | null>(null)
 const internalOpen = ref(false)
 let guardedPrevious: any
 const guarded = computed(() => {
-  if (!(internalOpen.value == null || typeof internalOpen.value === 'boolean')) {
-    return guardedPrevious
-  }
+  if (
+    !(htmlNextAuthoredCheck2(
+      internalOpen.value == null || typeof internalOpen.value === 'boolean',
+      'not internalOpen:internalOpen',
+      './components/ui-tooltip/ui-tooltip.html: HR007: Reference internalOpen does not satisfy its declared type.',
+    ))
+  ) return guardedPrevious
   return guardedPrevious = !internalOpen.value
 })
 provide('html-next:ui-tooltip:internalOpen', internalOpen)
@@ -280,8 +296,9 @@ const hostState = computed(() =>
   ].filter(Boolean).join(' ')
 )
 
-const isOpenDetail = (detail: unknown): boolean =>
-  detail !== null && typeof detail === 'object' && !Array.isArray(detail)
+const isOpenDetail = (
+  detail: unknown,
+): boolean => (detail !== null && typeof detail === 'object' && !Array.isArray(detail)
   && typeof (detail as Record<string, unknown>)['open'] === 'boolean'
   && ((detail as Record<string, unknown>)['reason'] === 'action'
     || (detail as Record<string, unknown>)['reason'] === 'programmatic'
@@ -290,7 +307,7 @@ const isOpenDetail = (detail: unknown): boolean =>
   && ((detail as Record<string, unknown>)['trigger'] === 'keyboard'
     || (detail as Record<string, unknown>)['trigger'] === 'pointer'
     || (detail as Record<string, unknown>)['trigger'] === 'programmatic')
-  && Object.keys(detail as object).every((key) => ['open', 'reason', 'trigger'].includes(key))
+  && Object.keys(detail as object).every((key) => ['open', 'reason', 'trigger'].includes(key)))
 const dispatch = createDispatch(root, emit as (name: string, detail: unknown) => void, {
   checks: {
     open: isOpenDetail,
@@ -302,6 +319,12 @@ const dispatch = createDispatch(root, emit as (name: string, detail: unknown) =>
 useComponentHost(() => import('../components/ui-tooltip/ui-tooltip.js'), {
   root,
   dispatch,
+  acceptsState: (name: string, keys: readonly string[], value: unknown) =>
+    acceptsControllerWrite(
+      value,
+      ({ internalOpen: { kind: 'terminal', name: 'boolean' } } as Record<string, any>)[name],
+      keys,
+    ),
   controllerSource: {
     specifier: '../components/ui-tooltip/ui-tooltip.js',
     definition: './components/ui-tooltip/ui-tooltip.html',

package/vue/UiTopBar.vue

@@ -1,4 +1,4 @@
-<!-- Generated by HTML Next 1.0.0-alpha.26 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.29 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import { getCurrentInstance } from 'vue'
 

package/vue/UiTree.vue

@@ -1,4 +1,4 @@
-<!-- Generated by HTML Next 1.0.0-alpha.26 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.29 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import { computed, getCurrentInstance, ref, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'
@@ -249,8 +249,9 @@ const hostState = computed(() =>
   ].filter(Boolean).join(' ')
 )
 
-const isReorderDetail = (detail: unknown): boolean =>
-  detail !== null && typeof detail === 'object' && !Array.isArray(detail)
+const isReorderDetail = (
+  detail: unknown,
+): boolean => (detail !== null && typeof detail === 'object' && !Array.isArray(detail)
   && typeof (detail as Record<string, unknown>)['sourceId'] === 'string'
   && typeof (detail as Record<string, unknown>)['targetId'] === 'string'
   && ((detail as Record<string, unknown>)['position'] === 'before'
@@ -274,9 +275,10 @@ const isReorderDetail = (detail: unknown): boolean =>
       'targetScope',
       'trigger',
     ].includes(key)
-  )
-const isReorderRejectedDetail = (detail: unknown): boolean =>
-  detail !== null && typeof detail === 'object' && !Array.isArray(detail)
+  ))
+const isReorderRejectedDetail = (
+  detail: unknown,
+): boolean => (detail !== null && typeof detail === 'object' && !Array.isArray(detail)
   && typeof (detail as Record<string, unknown>)['sourceId'] === 'string'
   && typeof (detail as Record<string, unknown>)['targetId'] === 'string'
   && ((detail as Record<string, unknown>)['position'] === 'before'
@@ -291,15 +293,17 @@ const isReorderRejectedDetail = (detail: unknown): boolean =>
   && Object.keys(detail as object).every((key) =>
     ['sourceId', 'targetId', 'position', 'reason', 'maxDepth', 'resultingDepth', 'trigger']
       .includes(key)
-  )
-const isActivateDetail = (detail: unknown): boolean =>
-  detail !== null && typeof detail === 'object' && !Array.isArray(detail)
+  ))
+const isActivateDetail = (
+  detail: unknown,
+): boolean => (detail !== null && typeof detail === 'object' && !Array.isArray(detail)
   && typeof (detail as Record<string, unknown>)['id'] === 'string'
   && ((detail as Record<string, unknown>)['trigger'] === 'keyboard'
     || (detail as Record<string, unknown>)['trigger'] === 'pointer')
-  && Object.keys(detail as object).every((key) => ['id', 'trigger'].includes(key))
-const isSelectDetail = (detail: unknown): boolean =>
-  detail !== null && typeof detail === 'object' && !Array.isArray(detail)
+  && Object.keys(detail as object).every((key) => ['id', 'trigger'].includes(key)))
+const isSelectDetail = (
+  detail: unknown,
+): boolean => (detail !== null && typeof detail === 'object' && !Array.isArray(detail)
   && (Array.isArray((detail as Record<string, unknown>)['ids'])
     && ((detail as Record<string, unknown>)['ids'] as unknown[]).every((item: unknown) =>
       typeof item === 'string'
@@ -307,7 +311,7 @@ const isSelectDetail = (detail: unknown): boolean =>
   && ((detail as Record<string, unknown>)['trigger'] === 'keyboard'
     || (detail as Record<string, unknown>)['trigger'] === 'pointer'
     || (detail as Record<string, unknown>)['trigger'] === 'programmatic')
-  && Object.keys(detail as object).every((key) => ['ids', 'trigger'].includes(key))
+  && Object.keys(detail as object).every((key) => ['ids', 'trigger'].includes(key)))
 const dispatch = createDispatch(root, emit as (name: string, detail: unknown) => void, {
   checks: {
     reorder: isReorderDetail,

package/vue/UiTreeItem.d.ts

@@ -1,15 +1,7 @@
 import type { PropType } from 'vue';
-declare var __VLS_1: {}, __VLS_3: {}, __VLS_11: {}, __VLS_13: {};
-type __VLS_Slots = {} & {
-    leading?: (props: typeof __VLS_1) => any;
-} & {
-    label?: (props: typeof __VLS_3) => any;
-} & {
-    actions?: (props: typeof __VLS_11) => any;
-} & {
-    default?: (props: typeof __VLS_13) => any;
-};
-declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     accepts: {
         type: PropType<string | null>;
         default: string;
@@ -143,19 +135,24 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
     selected: boolean | null;
     disabled: boolean | null;
     expanded: boolean | null;
-    container: boolean | null;
-    lazy: boolean | null;
-    sortable: boolean | null;
     accepts: string | null;
+    container: boolean | null;
     dragType: string | null;
     dropDepth: number | null;
     dropScope: string | null;
     itemId: string | null;
+    lazy: boolean | null;
+    sortable: boolean | null;
     subtreeDepth: number | null;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
-declare const _default: typeof __VLS_export;
-export default _default;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, {
+    leading?: (props: {}) => any;
+} & {
+    label?: (props: {}) => any;
+} & {
+    actions?: (props: {}) => any;
+} & {
+    default?: (props: {}) => any;
+}>;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

package/vue/UiTreeItem.vue

@@ -1,8 +1,20 @@
-<!-- Generated by HTML Next 1.0.0-alpha.26 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.29 for Vue 3.5. Do not edit. -->
+<script lang="ts">
+const htmlNextAuthoredCheck2Reported = new Set<string>()
+function htmlNextAuthoredCheck2(accepted: boolean, location: string, message: string): boolean {
+  if (!accepted && !htmlNextAuthoredCheck2Reported.has(location)) {
+    htmlNextAuthoredCheck2Reported.add(location)
+    console.warn(message)
+  }
+  return accepted
+}
+</script>
+
 <script setup lang="ts">
 import { computed, getCurrentInstance, provide, ref, useTemplateRef, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'
 import { createDispatch, useComponentHost } from './host'
+import { acceptsControllerWrite } from './props'
 import { checkedProp, propValidityState, vPropValidity } from './props'
 import UiButton from './UiButton.vue'
 
@@ -305,14 +317,14 @@ const emit = defineEmits<{
 }>()
 
 const root = ref<HTMLElement | null>(null)
-const rowElement = useTemplateRef<HTMLElement>('row')
-const dragHandleElement = useTemplateRef<HTMLElement>('dragHandle')
-const disclosureElement = useTemplateRef<HTMLElement>('disclosure')
-const leadingElement = useTemplateRef<HTMLElement>('leading')
-const labelElement = useTemplateRef<HTMLElement>('label')
-const labelTextElement = useTemplateRef<HTMLElement>('labelText')
-const actionsElement = useTemplateRef<HTMLElement>('actions')
-const childrenElement = useTemplateRef<HTMLElement>('children')
+const rowElement = useTemplateRef<HTMLElement>('rowElement')
+const dragHandleElement = useTemplateRef<HTMLElement>('dragHandleElement')
+const disclosureElement = useTemplateRef<HTMLElement>('disclosureElement')
+const leadingElement = useTemplateRef<HTMLElement>('leadingElement')
+const labelElement = useTemplateRef<HTMLElement>('labelElement')
+const labelTextElement = useTemplateRef<HTMLElement>('labelTextElement')
+const actionsElement = useTemplateRef<HTMLElement>('actionsElement')
+const childrenElement = useTemplateRef<HTMLElement>('childrenElement')
 const internalExpanded = ref(false)
 const structuralLevel = ref(1)
 const tabStop = ref(false)
@@ -320,14 +332,24 @@ const isContainer = ref(false)
 const moving = ref(false)
 let guardedPrevious: any
 const guarded = computed(() => {
-  if (!(structuralLevel.value == null || Number.isInteger(structuralLevel.value))) {
-    return guardedPrevious
-  }
+  if (
+    !(htmlNextAuthoredCheck2(
+      structuralLevel.value == null || Number.isInteger(structuralLevel.value),
+      'structuralLevel:structuralLevel',
+      './components/ui-tree-item/ui-tree-item.html: HR007: Reference structuralLevel does not satisfy its declared type.',
+    ))
+  ) return guardedPrevious
   return guardedPrevious = structuralLevel.value
 })
 let guardedBindingPrevious: any = null
 const guardedBinding = computed(() => {
-  if (!(moving.value == null || typeof moving.value === 'boolean')) return guardedBindingPrevious
+  if (
+    !(htmlNextAuthoredCheck2(
+      moving.value == null || typeof moving.value === 'boolean',
+      '{ true: concat(\'Cancel moving \', label), false: concat(\'Drag \', label, \' to reorder\') }[concat(moving)]:moving',
+      './components/ui-tree-item/ui-tree-item.html: HR007: Reference moving does not satisfy its declared type.',
+    ))
+  ) return guardedBindingPrevious
   const candidate: any = ((objectValue: any, indexValue: any) =>
     objectValue === Symbol.for('html-next.invalid-result')
       || indexValue === Symbol.for('html-next.invalid-result')
@@ -406,9 +428,13 @@ const guardedBinding = computed(() => {
 })
 let guardedBinding2Previous: any
 const guardedBinding2 = computed(() => {
-  if (!(isContainer.value == null || typeof isContainer.value === 'boolean')) {
-    return guardedBinding2Previous
-  }
+  if (
+    !(htmlNextAuthoredCheck2(
+      isContainer.value == null || typeof isContainer.value === 'boolean',
+      'not isContainer:isContainer',
+      './components/ui-tree-item/ui-tree-item.html: HR007: Reference isContainer does not satisfy its declared type.',
+    ))
+  ) return guardedBinding2Previous
   return guardedBinding2Previous = !isContainer.value
 })
 let guardedBinding3Previous: any = null
@@ -420,8 +446,16 @@ const guardedBinding3 = computed(() => {
 let guardedBinding4Previous: any
 const guardedBinding4 = computed(() => {
   if (
-    !((internalExpanded.value == null || typeof internalExpanded.value === 'boolean')
-      && (isContainer.value == null || typeof isContainer.value === 'boolean'))
+    !(htmlNextAuthoredCheck2(
+      internalExpanded.value == null || typeof internalExpanded.value === 'boolean',
+      'not (isContainer and internalExpanded):internalExpanded',
+      './components/ui-tree-item/ui-tree-item.html: HR007: Reference internalExpanded does not satisfy its declared type.',
+    )
+      && htmlNextAuthoredCheck2(
+        isContainer.value == null || typeof isContainer.value === 'boolean',
+        'not (isContainer and internalExpanded):isContainer',
+        './components/ui-tree-item/ui-tree-item.html: HR007: Reference isContainer does not satisfy its declared type.',
+      ))
   ) return guardedBinding4Previous
   return guardedBinding4Previous = !(isContainer.value && internalExpanded.value)
 })
@@ -456,14 +490,15 @@ const hostState = computed(() =>
   ].filter(Boolean).join(' ')
 )
 
-const isExpandDetail = (detail: unknown): boolean =>
-  detail !== null && typeof detail === 'object' && !Array.isArray(detail)
+const isExpandDetail = (
+  detail: unknown,
+): boolean => (detail !== null && typeof detail === 'object' && !Array.isArray(detail)
   && typeof (detail as Record<string, unknown>)['id'] === 'string'
   && typeof (detail as Record<string, unknown>)['expanded'] === 'boolean'
   && ((detail as Record<string, unknown>)['trigger'] === 'keyboard'
     || (detail as Record<string, unknown>)['trigger'] === 'pointer'
     || (detail as Record<string, unknown>)['trigger'] === 'programmatic')
-  && Object.keys(detail as object).every((key) => ['id', 'expanded', 'trigger'].includes(key))
+  && Object.keys(detail as object).every((key) => ['id', 'expanded', 'trigger'].includes(key)))
 const dispatch = createDispatch(root, emit as (name: string, detail: unknown) => void, {
   declared: { expand: { bubbles: false, composed: true, cancelable: false } },
   checks: {
@@ -475,6 +510,18 @@ const dispatch = createDispatch(root, emit as (name: string, detail: unknown) =>
 useComponentHost(() => import('../components/ui-tree-item/ui-tree-item.js'), {
   root,
   dispatch,
+  acceptsState: (name: string, keys: readonly string[], value: unknown) =>
+    acceptsControllerWrite(
+      value,
+      ({
+        internalExpanded: { kind: 'terminal', name: 'boolean' },
+        structuralLevel: { kind: 'terminal', name: 'integer' },
+        tabStop: { kind: 'terminal', name: 'boolean' },
+        isContainer: { kind: 'terminal', name: 'boolean' },
+        moving: { kind: 'terminal', name: 'boolean' },
+      } as Record<string, any>)[name],
+      keys,
+    ),
   controllerSource: {
     specifier: '../components/ui-tree-item/ui-tree-item.js',
     definition: './components/ui-tree-item/ui-tree-item.html',
@@ -577,14 +624,14 @@ function concat<T extends unknown[]>(...values: T): ConcatResult<T> {
     :data-ui-tree-item-state="hostState || undefined"
     ref="root"
   >
-    <div class="row" ref="row">
+    <div class="row" ref="rowElement">
       <button
         v-if="checkedProps.sortable && !checkedProps.disabled"
         class="drag-handle"
         type="button"
         draggable="true"
         :aria-label="guardedBinding"
-        ref="dragHandle"
+        ref="dragHandleElement"
       >
         <svg
           aria-hidden="true"
@@ -609,7 +656,7 @@ function concat<T extends unknown[]>(...values: T): ConcatResult<T> {
         type="button"
         :disabled="checkedProps.disabled ?? undefined"
         :hidden="guardedBinding2"
-        ref="disclosure"
+        ref="disclosureElement"
       >
         <span class="disclosure-icon" aria-hidden="true"></span>
       </button>
@@ -621,11 +668,11 @@ function concat<T extends unknown[]>(...values: T): ConcatResult<T> {
           :disabled="checkedProps.disabled ?? undefined"
           :aria-label="guardedBinding3"
         ></label>
-      <span class="leading" ref="leading"><slot name="leading" /></span>
-      <span class="label" ref="label"><span class="label-text" ref="labelText"><slot name="label">{{
-            checkedProps.label
-          }}</slot></span></span>
-      <span class="actions" ref="actions"><UiButton
+      <span class="leading" ref="leadingElement"><slot name="leading" /></span>
+      <span class="label" ref="labelElement"><span class="label-text" ref="labelTextElement"><slot
+            name="label"
+          >{{ checkedProps.label }}</slot></span></span>
+      <span class="actions" ref="actionsElement"><UiButton
           v-if="moving"
           data-tree-cancel-move=""
           variant="ghost"
@@ -636,7 +683,9 @@ function concat<T extends unknown[]>(...values: T): ConcatResult<T> {
         <span><slot name="actions" /></span></span>
       <span class="drop-indicator row-drop-indicator" aria-hidden="true"></span>
     </div>
-    <div class="children" role="group" :hidden="guardedBinding4" ref="children"><slot /></div>
+    <div class="children" role="group" :hidden="guardedBinding4" ref="childrenElement">
+      <slot />
+    </div>
     <span class="drop-indicator subtree-drop-indicator" aria-hidden="true"></span>
   </div>
 </template>

package/vue/chunks/UiActionBar.js

@@ -32,6 +32,6 @@ var UiActionBar_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__
 			])], 16);
 		};
 	}
-}), [["__scopeId", "data-v-e0615598"]]);
+}), [["__scopeId", "data-v-47966a1c"]]);
 //#endregion
 export { UiActionBar_default as t };