@threadlabs/looma 0.23.16 → 0.23.17

package/vue/UiEditorTableContextMenu.vue

@@ -1,4 +1,4 @@
-<!-- Generated by HTML Next 1.0.0-alpha.19 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.25 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import {
   computed,
@@ -450,6 +450,24 @@ function attribute(value: unknown): any {
   return value === true ? '' : text(value)
 }
 
+// A nonempty scalar call cannot produce the invalid-result sentinel.
+type ConcatResult<T extends unknown[]> = T extends
+  [
+    string | number | boolean | null | undefined,
+    ...(string | number | boolean | null | undefined)[],
+  ] ? string | undefined
+  : string | symbol | undefined
+function concat<T extends unknown[]>(...values: T): ConcatResult<T> {
+  if (values.some(value => value === Symbol.for('html-next.invalid-result'))) {
+    return Symbol.for('html-next.invalid-result') as ConcatResult<T>
+  }
+  if (values.some(value => value === undefined)) return undefined as ConcatResult<T>
+  if (values.length === 0 || values.some(value => typeof value === 'object' && value !== null)) {
+    return Symbol.for('html-next.invalid-result') as ConcatResult<T>
+  }
+  return values.map(value => value === null ? '' : String(value)).join('') as ConcatResult<T>
+}
+
 function uniqueKeys<T>(
   items: readonly T[],
   keyOf: (
@@ -527,12 +545,35 @@ function uniqueKeys<T>(
               :key="item.action"
               type="button"
               :role="attribute(
-                (({ true: 'menuitemcheckbox', false: 'menuitem' }) as Record<string, any>)[`${item.checkable}`],
+                ((objectValue: any, indexValue: any) =>
+                  objectValue === Symbol.for('html-next.invalid-result')
+                    || indexValue === Symbol.for('html-next.invalid-result')
+                    ? Symbol.for('html-next.invalid-result')
+                    : objectValue[indexValue])(
+                    { true: 'menuitemcheckbox', false: 'menuitem' },
+                    concat(item.checkable),
+                  ),
               )"
-              :aria-checked="typeof ((({ true: item.checked, false: null }) as Record<string, any>)[`${item.checkable}`])
+              :aria-checked="typeof (((objectValue: any, indexValue: any) =>
+                objectValue === Symbol.for('html-next.invalid-result')
+                  || indexValue === Symbol.for('html-next.invalid-result')
+                  ? Symbol.for('html-next.invalid-result')
+                  : objectValue[indexValue])({ true: item.checked, false: null }, concat(item.checkable)))
                 === 'boolean'
-              ? String((({ true: item.checked, false: null }) as Record<string, any>)[`${item.checkable}`])
-              : attribute((({ true: item.checked, false: null }) as Record<string, any>)[`${item.checkable}`])"
+              ? String(
+                ((objectValue: any, indexValue: any) =>
+                  objectValue === Symbol.for('html-next.invalid-result')
+                    || indexValue === Symbol.for('html-next.invalid-result')
+                    ? Symbol.for('html-next.invalid-result')
+                    : objectValue[indexValue])({ true: item.checked, false: null }, concat(item.checkable)),
+              )
+              : attribute(
+                ((objectValue: any, indexValue: any) =>
+                  objectValue === Symbol.for('html-next.invalid-result')
+                    || indexValue === Symbol.for('html-next.invalid-result')
+                    ? Symbol.for('html-next.invalid-result')
+                    : objectValue[indexValue])({ true: item.checked, false: null }, concat(item.checkable)),
+              )"
               :data-action="item.action"
               :class="{ danger: item.danger }"
             >

package/vue/UiEditorTableOverlay.vue

@@ -1,4 +1,4 @@
-<!-- Generated by HTML Next 1.0.0-alpha.19 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.25 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import {
   computed,
@@ -368,45 +368,74 @@ const active = ref<
 const activeKey = ref('')
 let guardedPrevious: any
 const guarded = computed(() => {
-  if (!(hovered.value?.['rowIndex'] == null || Number.isInteger(hovered.value?.['rowIndex']))) {
+  if (!(hovered.value?.['rowOffset'] == null || typeof hovered.value?.['rowOffset'] === 'string')) {
     return guardedPrevious
   }
-  return guardedPrevious = hovered.value?.rowIndex
+  return guardedPrevious = hovered.value?.rowOffset
 })
 let guardedBindingPrevious: any
 const guardedBinding = computed(() => {
-  if (
-    !(hovered.value?.['columnIndex'] == null || Number.isInteger(hovered.value?.['columnIndex']))
-  ) return guardedBindingPrevious
-  return guardedBindingPrevious = hovered.value?.columnIndex
+  if (!(hovered.value?.['rowIndex'] == null || Number.isInteger(hovered.value?.['rowIndex']))) {
+    return guardedBindingPrevious
+  }
+  return guardedBindingPrevious = hovered.value?.rowIndex
 })
 let guardedBinding2Previous: any
 const guardedBinding2 = computed(() => {
-  if (!(hovered.value?.['rowIndex'] == null || Number.isInteger(hovered.value?.['rowIndex']))) {
-    return guardedBinding2Previous
-  }
-  return guardedBinding2Previous = hovered.value?.rowIndex
+  if (
+    !(hovered.value?.['columnIndex'] == null || Number.isInteger(hovered.value?.['columnIndex']))
+  ) return guardedBinding2Previous
+  return guardedBinding2Previous = hovered.value?.columnIndex
 })
 let guardedBinding3Previous: any
 const guardedBinding3 = computed(() => {
   if (
-    !(hovered.value?.['columnIndex'] == null || Number.isInteger(hovered.value?.['columnIndex']))
+    !(hovered.value?.['columnOffset'] == null
+      || typeof hovered.value?.['columnOffset'] === 'string')
   ) return guardedBinding3Previous
-  return guardedBinding3Previous = hovered.value?.columnIndex
+  return guardedBinding3Previous = hovered.value?.columnOffset
 })
 let guardedBinding4Previous: any
 const guardedBinding4 = computed(() => {
-  if (!(active.value?.['rowIndex'] == null || Number.isInteger(active.value?.['rowIndex']))) {
+  if (!(hovered.value?.['rowIndex'] == null || Number.isInteger(hovered.value?.['rowIndex']))) {
     return guardedBinding4Previous
   }
-  return guardedBinding4Previous = active.value?.rowIndex
+  return guardedBinding4Previous = hovered.value?.rowIndex
 })
 let guardedBinding5Previous: any
 const guardedBinding5 = computed(() => {
+  if (
+    !(hovered.value?.['columnIndex'] == null || Number.isInteger(hovered.value?.['columnIndex']))
+  ) return guardedBinding5Previous
+  return guardedBinding5Previous = hovered.value?.columnIndex
+})
+let guardedBinding6Previous: any
+const guardedBinding6 = computed(() => {
+  if (!(active.value?.['menuLeft'] == null || typeof active.value?.['menuLeft'] === 'string')) {
+    return guardedBinding6Previous
+  }
+  return guardedBinding6Previous = active.value?.menuLeft
+})
+let guardedBinding7Previous: any
+const guardedBinding7 = computed(() => {
+  if (!(active.value?.['menuTop'] == null || typeof active.value?.['menuTop'] === 'string')) {
+    return guardedBinding7Previous
+  }
+  return guardedBinding7Previous = active.value?.menuTop
+})
+let guardedBinding8Previous: any
+const guardedBinding8 = computed(() => {
+  if (!(active.value?.['rowIndex'] == null || Number.isInteger(active.value?.['rowIndex']))) {
+    return guardedBinding8Previous
+  }
+  return guardedBinding8Previous = active.value?.rowIndex
+})
+let guardedBinding9Previous: any
+const guardedBinding9 = computed(() => {
   if (!(active.value?.['columnIndex'] == null || Number.isInteger(active.value?.['columnIndex']))) {
-    return guardedBinding5Previous
+    return guardedBinding9Previous
   }
-  return guardedBinding5Previous = active.value?.columnIndex
+  return guardedBinding9Previous = active.value?.columnIndex
 })
 provide('html-next:ui-editor-table-overlay:rows', rows)
 provide('html-next:ui-editor-table-overlay:cols', cols)
@@ -613,9 +642,9 @@ function uniqueKeys<T>(
         data-action="select-row"
         title="Drag row to reorder; click for actions"
         aria-label="Row actions"
-        :data-row-index="guarded"
-        :data-column-index="guardedBinding"
-        :style="{ top: hovered?.rowOffset ?? undefined }"
+        :data-row-index="guardedBinding"
+        :data-column-index="guardedBinding2"
+        :style="{ top: guarded }"
       >
         <span class="glyph"><UiIcon name="grip-vertical" /></span>
       </button>
@@ -625,9 +654,9 @@ function uniqueKeys<T>(
         data-action="select-column"
         title="Drag column to reorder; click for actions"
         aria-label="Column actions"
-        :data-row-index="guardedBinding2"
-        :data-column-index="guardedBinding3"
-        :style="{ left: hovered?.columnOffset ?? undefined }"
+        :data-row-index="guardedBinding4"
+        :data-column-index="guardedBinding5"
+        :style="{ left: guardedBinding3 }"
       >
         <span class="glyph"><UiIcon name="grip-horizontal" /></span>
       </button></template>
@@ -638,9 +667,9 @@ function uniqueKeys<T>(
       data-action="open-cell-menu"
       title="Cell actions"
       aria-label="Cell actions"
-      :data-row-index="guardedBinding4"
-      :data-column-index="guardedBinding5"
-      :style="{ left: active?.menuLeft ?? undefined, top: active?.menuTop ?? undefined }"
+      :data-row-index="guardedBinding8"
+      :data-column-index="guardedBinding9"
+      :style="{ left: guardedBinding6, top: guardedBinding7 }"
     >
       <UiIcon name="chevron-down" />
     </button>

package/vue/UiEditorTableToolbar.vue

@@ -1,4 +1,4 @@
-<!-- Generated by HTML Next 1.0.0-alpha.19 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.25 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import {
   computed,
@@ -469,6 +469,24 @@ function attribute(value: unknown): any {
   return value === true ? '' : text(value)
 }
 
+// A nonempty scalar call cannot produce the invalid-result sentinel.
+type ConcatResult<T extends unknown[]> = T extends
+  [
+    string | number | boolean | null | undefined,
+    ...(string | number | boolean | null | undefined)[],
+  ] ? string | undefined
+  : string | symbol | undefined
+function concat<T extends unknown[]>(...values: T): ConcatResult<T> {
+  if (values.some(value => value === Symbol.for('html-next.invalid-result'))) {
+    return Symbol.for('html-next.invalid-result') as ConcatResult<T>
+  }
+  if (values.some(value => value === undefined)) return undefined as ConcatResult<T>
+  if (values.length === 0 || values.some(value => typeof value === 'object' && value !== null)) {
+    return Symbol.for('html-next.invalid-result') as ConcatResult<T>
+  }
+  return values.map(value => value === null ? '' : String(value)).join('') as ConcatResult<T>
+}
+
 function uniqueKeys<T>(
   items: readonly T[],
   keyOf: (
@@ -594,12 +612,35 @@ function uniqueKeys<T>(
                 :key="item.action"
                 type="button"
                 :role="attribute(
-                  (({ true: 'menuitemcheckbox', false: 'menuitem' }) as Record<string, any>)[`${item.checkable}`],
+                  ((objectValue: any, indexValue: any) =>
+                    objectValue === Symbol.for('html-next.invalid-result')
+                      || indexValue === Symbol.for('html-next.invalid-result')
+                      ? Symbol.for('html-next.invalid-result')
+                      : objectValue[indexValue])(
+                      { true: 'menuitemcheckbox', false: 'menuitem' },
+                      concat(item.checkable),
+                    ),
                 )"
-                :aria-checked="typeof ((({ true: item.checked, false: null }) as Record<string, any>)[`${item.checkable}`])
+                :aria-checked="typeof (((objectValue: any, indexValue: any) =>
+                  objectValue === Symbol.for('html-next.invalid-result')
+                    || indexValue === Symbol.for('html-next.invalid-result')
+                    ? Symbol.for('html-next.invalid-result')
+                    : objectValue[indexValue])({ true: item.checked, false: null }, concat(item.checkable)))
                   === 'boolean'
-                ? String((({ true: item.checked, false: null }) as Record<string, any>)[`${item.checkable}`])
-                : attribute((({ true: item.checked, false: null }) as Record<string, any>)[`${item.checkable}`])"
+                ? String(
+                  ((objectValue: any, indexValue: any) =>
+                    objectValue === Symbol.for('html-next.invalid-result')
+                      || indexValue === Symbol.for('html-next.invalid-result')
+                      ? Symbol.for('html-next.invalid-result')
+                      : objectValue[indexValue])({ true: item.checked, false: null }, concat(item.checkable)),
+                )
+                : attribute(
+                  ((objectValue: any, indexValue: any) =>
+                    objectValue === Symbol.for('html-next.invalid-result')
+                      || indexValue === Symbol.for('html-next.invalid-result')
+                      ? Symbol.for('html-next.invalid-result')
+                      : objectValue[indexValue])({ true: item.checked, false: null }, concat(item.checkable)),
+                )"
                 :data-action="item.action"
                 :class="{ danger: item.danger }"
               >

package/vue/UiEditorToolbar.vue

@@ -1,4 +1,4 @@
-<!-- Generated by HTML Next 1.0.0-alpha.19 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.25 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import { computed, getCurrentInstance, ref, useTemplateRef, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'

package/vue/UiFloatingActionButton.vue

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

package/vue/UiFormField.vue

@@ -1,4 +1,4 @@
-<!-- Generated by HTML Next 1.0.0-alpha.19 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.25 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import { computed, getCurrentInstance, ref, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'

package/vue/UiGrid.vue

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

package/vue/UiIcon.vue

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

package/vue/UiIconButton.vue

@@ -1,4 +1,4 @@
-<!-- Generated by HTML Next 1.0.0-alpha.19 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.25 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import { computed, getCurrentInstance, ref, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'
@@ -211,6 +211,44 @@ function reflectedProp(
 const hydrationInstance = getCurrentInstance()
 
 const root = ref<HTMLElement | null>(null)
+let guardedPrevious: any = null
+const guarded = computed(() => {
+  const candidate: any = ((objectValue: any, indexValue: any) =>
+    objectValue === Symbol.for('html-next.invalid-result')
+      || indexValue === Symbol.for('html-next.invalid-result')
+      ? Symbol.for('html-next.invalid-result')
+      : objectValue[indexValue])(
+      { true: 'true', false: null },
+      concat(checkedProps.value.loading || checkedProps.value.pending),
+    )
+  if (candidate === Symbol.for('html-next.invalid-result')) {
+    return guardedPrevious
+  }
+  return guardedPrevious = typeof (((objectValue: any, indexValue: any) =>
+      objectValue === Symbol.for('html-next.invalid-result')
+        || indexValue === Symbol.for('html-next.invalid-result')
+        ? Symbol.for('html-next.invalid-result')
+        : objectValue[indexValue])(
+        { true: 'true', false: null },
+        concat(checkedProps.value.loading || checkedProps.value.pending),
+      )) === 'boolean'
+    ? String(((objectValue: any, indexValue: any) =>
+      objectValue === Symbol.for('html-next.invalid-result')
+        || indexValue === Symbol.for('html-next.invalid-result')
+        ? Symbol.for('html-next.invalid-result')
+        : objectValue[indexValue])(
+        { true: 'true', false: null },
+        concat(checkedProps.value.loading || checkedProps.value.pending),
+      ))
+    : attribute(((objectValue: any, indexValue: any) =>
+      objectValue === Symbol.for('html-next.invalid-result')
+        || indexValue === Symbol.for('html-next.invalid-result')
+        ? Symbol.for('html-next.invalid-result')
+        : objectValue[indexValue])(
+        { true: 'true', false: null },
+        concat(checkedProps.value.loading || checkedProps.value.pending),
+      ))
+})
 const hydrationNode = hydrationInstance?.vnode.el
 if (
   typeof window !== 'undefined' && hydrationNode != null
@@ -288,6 +326,24 @@ function attribute(value: unknown): any {
   ) return undefined
   return value === true ? '' : text(value)
 }
+
+// A nonempty scalar call cannot produce the invalid-result sentinel.
+type ConcatResult<T extends unknown[]> = T extends
+  [
+    string | number | boolean | null | undefined,
+    ...(string | number | boolean | null | undefined)[],
+  ] ? string | undefined
+  : string | symbol | undefined
+function concat<T extends unknown[]>(...values: T): ConcatResult<T> {
+  if (values.some(value => value === Symbol.for('html-next.invalid-result'))) {
+    return Symbol.for('html-next.invalid-result') as ConcatResult<T>
+  }
+  if (values.some(value => value === undefined)) return undefined as ConcatResult<T>
+  if (values.length === 0 || values.some(value => typeof value === 'object' && value !== null)) {
+    return Symbol.for('html-next.invalid-result') as ConcatResult<T>
+  }
+  return values.map(value => value === null ? '' : String(value)).join('') as ConcatResult<T>
+}
 </script>
 
 <template>
@@ -297,19 +353,7 @@ function attribute(value: unknown): any {
     v-bind="nativeAttrs($attrs)"
     :disabled="checkedProps.disabled ?? undefined"
     :aria-label="checkedProps.label ?? undefined"
-    :aria-disabled="typeof ((({ true: 'true', false: null }) as Record<string, any>)[
-      `${checkedProps.loading || checkedProps.pending}`
-    ]) === 'boolean'
-    ? String(
-      (({ true: 'true', false: null }) as Record<string, any>)[
-        `${checkedProps.loading || checkedProps.pending}`
-      ],
-    )
-    : attribute(
-      (({ true: 'true', false: null }) as Record<string, any>)[
-        `${checkedProps.loading || checkedProps.pending}`
-      ],
-    )"
+    :aria-disabled="guarded"
     :aria-busy="checkedProps.loading || checkedProps.pending"
     v-prop-validity="{ contract: propValidityContract, values: { ...props } }"
     :data-anticipatory="reflectedProp('anticipatory', 'anticipatory', checkedProps.anticipatory, undefined, false)"

package/vue/UiInput.vue

@@ -1,4 +1,4 @@
-<!-- Generated by HTML Next 1.0.0-alpha.19 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.25 for Vue 3.5. Do not edit. -->
 <script
   setup
   lang="ts"

package/vue/UiInputGroup.vue

@@ -1,4 +1,4 @@
-<!-- Generated by HTML Next 1.0.0-alpha.19 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.25 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import { computed, getCurrentInstance, ref, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'

package/vue/UiList.vue

@@ -1,4 +1,4 @@
-<!-- Generated by HTML Next 1.0.0-alpha.19 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.25 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import { computed, getCurrentInstance, useTemplateRef, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'

package/vue/UiListItem.vue

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

package/vue/UiListbox.vue

@@ -1,4 +1,4 @@
-<!-- Generated by HTML Next 1.0.0-alpha.19 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.25 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import {
   computed,
@@ -245,27 +245,43 @@ const hasSelection = ref(false)
 const active = ref(-1)
 const uid = ref('')
 const validationError = ref(false)
-let guardedPrevious: any
+let guardedPrevious: any = null
 const guarded = computed(() => {
-  if (!(validationError.value == null || typeof validationError.value === 'boolean')) {
+  const candidate: any = ((objectValue: any, indexValue: any) =>
+    objectValue === Symbol.for('html-next.invalid-result')
+      || indexValue === Symbol.for('html-next.invalid-result')
+      ? Symbol.for('html-next.invalid-result')
+      : objectValue[indexValue])({ true: '-1', false: '0' }, concat(checkedProps.value.disabled))
+  if (candidate === Symbol.for('html-next.invalid-result')) {
     return guardedPrevious
   }
-  return guardedPrevious = checkedProps.value.invalid || validationError.value
+  return guardedPrevious = attribute(((objectValue: any, indexValue: any) =>
+    objectValue === Symbol.for('html-next.invalid-result')
+      || indexValue === Symbol.for('html-next.invalid-result')
+      ? Symbol.for('html-next.invalid-result')
+      : objectValue[indexValue])({ true: '-1', false: '0' }, concat(checkedProps.value.disabled)))
 })
 let guardedBindingPrevious: any
 const guardedBinding = computed(() => {
-  if (!(hasSelection.value == null || typeof hasSelection.value === 'boolean')) {
+  if (!(validationError.value == null || typeof validationError.value === 'boolean')) {
     return guardedBindingPrevious
   }
-  return guardedBindingPrevious = checkedProps.value.required && !hasSelection.value
-    && !checkedProps.value.disabled
+  return guardedBindingPrevious = checkedProps.value.invalid || validationError.value
 })
 let guardedBinding2Previous: any
 const guardedBinding2 = computed(() => {
   if (!(hasSelection.value == null || typeof hasSelection.value === 'boolean')) {
     return guardedBinding2Previous
   }
-  return guardedBinding2Previous = hasSelection.value ? true : undefined
+  return guardedBinding2Previous = checkedProps.value.required && !hasSelection.value
+    && !checkedProps.value.disabled
+})
+let guardedBinding3Previous: any
+const guardedBinding3 = computed(() => {
+  if (!(hasSelection.value == null || typeof hasSelection.value === 'boolean')) {
+    return guardedBinding3Previous
+  }
+  return guardedBinding3Previous = hasSelection.value ? true : undefined
 })
 provide('html-next:ui-listbox:choices', choices)
 provide('html-next:ui-listbox:selection', selection)
@@ -343,6 +359,24 @@ function attribute(value: unknown): any {
   return value === true ? '' : text(value)
 }
 
+// A nonempty scalar call cannot produce the invalid-result sentinel.
+type ConcatResult<T extends unknown[]> = T extends
+  [
+    string | number | boolean | null | undefined,
+    ...(string | number | boolean | null | undefined)[],
+  ] ? string | undefined
+  : string | symbol | undefined
+function concat<T extends unknown[]>(...values: T): ConcatResult<T> {
+  if (values.some(value => value === Symbol.for('html-next.invalid-result'))) {
+    return Symbol.for('html-next.invalid-result') as ConcatResult<T>
+  }
+  if (values.some(value => value === undefined)) return undefined as ConcatResult<T>
+  if (values.length === 0 || values.some(value => typeof value === 'object' && value !== null)) {
+    return Symbol.for('html-next.invalid-result') as ConcatResult<T>
+  }
+  return values.map(value => value === null ? '' : String(value)).join('') as ConcatResult<T>
+}
+
 function uniqueKeys<T>(
   items: readonly T[],
   keyOf: (
@@ -377,11 +411,11 @@ function uniqueKeys<T>(
     data-component="ui-listbox"
     role="listbox"
     v-bind="nativeAttrs($attrs)"
-    :tabindex="attribute((({ true: '-1', false: '0' }) as Record<string, any>)[`${checkedProps.disabled ?? ''}`])"
+    :tabindex="guarded"
     :aria-multiselectable="checkedProps.multiple ?? undefined"
     :aria-disabled="checkedProps.disabled ?? undefined"
     :aria-required="checkedProps.required ?? undefined"
-    :aria-invalid="guarded"
+    :aria-invalid="guardedBinding"
     :style="{ '--_rows': checkedProps.rows ?? undefined }"
     v-prop-validity="{ contract: propValidityContract, values: { ...props } }"
     :data-disabled="reflectedProp('disabled', 'disabled', checkedProps.disabled, undefined, false)"
@@ -401,7 +435,7 @@ function uniqueKeys<T>(
           role="option"
           data-ui-choice-option=""
           :data-multiple="checkedProps.multiple ? '' : undefined"
-          :id="`${uid}-option-${choice.index}`"
+          :id="concat(uid, '-option-', choice.index)"
           :data-index="choice.index"
           :aria-selected="choice.selected"
           :aria-disabled="choice.disabled"
@@ -433,8 +467,8 @@ function uniqueKeys<T>(
       type="checkbox"
       aria-hidden="true"
       tabindex="-1"
-      :required="guardedBinding"
-      :checked.attr="guardedBinding2"
+      :required="guardedBinding2"
+      :checked.attr="guardedBinding3"
       :disabled="checkedProps.disabled ?? undefined"
       ref="validity"
     >

package/vue/UiMenu.vue

@@ -1,4 +1,4 @@
-<!-- Generated by HTML Next 1.0.0-alpha.19 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.25 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import { computed, getCurrentInstance, provide, ref, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'

package/vue/UiMenuGroup.vue

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