@threadlabs/looma 0.30.2 → 0.30.4

package/vue/UiEditorMentionMenu.d.ts

@@ -1,4 +1,5 @@
 import type { PropType } from 'vue';
+import { type InputBindings } from './props.js';
 declare var __VLS_1: {}, __VLS_3: {}, __VLS_5: {};
 type __VLS_Slots = {} & {
     header?: (props: typeof __VLS_1) => any;
@@ -10,49 +11,44 @@ type __VLS_Slots = {} & {
 declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     anchorRect: {
         type: PropType<{
-            readonly left?: number;
-            readonly top?: number;
-            readonly right?: number;
-            readonly bottom?: number;
-            readonly x?: number;
-            readonly y?: number;
-            readonly width?: number;
-            readonly height?: number;
+            readonly left?: number | null;
+            readonly top?: number | null;
+            readonly right?: number | null;
+            readonly bottom?: number | null;
+            readonly x?: number | null;
+            readonly y?: number | null;
+            readonly width?: number | null;
+            readonly height?: number | null;
         } | null>;
-        default: null;
     };
     items: {
         type: PropType<readonly ({
             readonly id: string;
             readonly label: string;
-            readonly detail?: string;
-            readonly initials?: string;
+            readonly detail?: string | null;
+            readonly initials?: string | null;
         })[] | null>;
-        default: null;
     };
     label: {
         type: PropType<string | null>;
-        default: string;
     };
     loading: {
         type: PropType<boolean | null>;
-        default: boolean;
     };
     loadingLabel: {
         type: PropType<string | null>;
-        default: string;
     };
     open: {
         type: PropType<boolean | null>;
-        default: boolean;
     };
     query: {
         type: PropType<string | null>;
-        default: string;
     };
     selectedIndex: {
         type: PropType<number | null>;
-        default: number;
+    };
+    "\0htmlNextInputStatus": {
+        type: PropType<InputBindings>;
     };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     select: (event: CustomEvent<{
@@ -66,49 +62,44 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     anchorRect: {
         type: PropType<{
-            readonly left?: number;
-            readonly top?: number;
-            readonly right?: number;
-            readonly bottom?: number;
-            readonly x?: number;
-            readonly y?: number;
-            readonly width?: number;
-            readonly height?: number;
+            readonly left?: number | null;
+            readonly top?: number | null;
+            readonly right?: number | null;
+            readonly bottom?: number | null;
+            readonly x?: number | null;
+            readonly y?: number | null;
+            readonly width?: number | null;
+            readonly height?: number | null;
         } | null>;
-        default: null;
     };
     items: {
         type: PropType<readonly ({
             readonly id: string;
             readonly label: string;
-            readonly detail?: string;
-            readonly initials?: string;
+            readonly detail?: string | null;
+            readonly initials?: string | null;
         })[] | null>;
-        default: null;
     };
     label: {
         type: PropType<string | null>;
-        default: string;
     };
     loading: {
         type: PropType<boolean | null>;
-        default: boolean;
     };
     loadingLabel: {
         type: PropType<string | null>;
-        default: string;
     };
     open: {
         type: PropType<boolean | null>;
-        default: boolean;
     };
     query: {
         type: PropType<string | null>;
-        default: string;
     };
     selectedIndex: {
         type: PropType<number | null>;
-        default: number;
+    };
+    "\0htmlNextInputStatus": {
+        type: PropType<InputBindings>;
     };
 }>> & Readonly<{
     onSelect?: ((event: CustomEvent<{
@@ -119,30 +110,7 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         readonly index: number;
         readonly value: string;
     }>) => any) | undefined;
-}>, {
-    label: string | null;
-    items: readonly {
-        readonly id: string;
-        readonly label: string;
-        readonly detail?: string;
-        readonly initials?: string;
-    }[] | null;
-    open: boolean | null;
-    loading: boolean | null;
-    query: string | null;
-    anchorRect: {
-        readonly left?: number;
-        readonly top?: number;
-        readonly right?: number;
-        readonly bottom?: number;
-        readonly x?: number;
-        readonly y?: number;
-        readonly width?: number;
-        readonly height?: number;
-    } | null;
-    loadingLabel: string | null;
-    selectedIndex: number | null;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+}>, {}, {}, {}, {}, 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;

package/vue/UiEditorMentionMenu.vue

@@ -1,4 +1,4 @@
-<!-- Generated by HTML Next 1.0.0-alpha.58 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.64 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import { computed, getCurrentInstance, provide, ref, useTemplateRef, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'
@@ -12,7 +12,18 @@ import {
   useReflectedProp,
 } from './host'
 import { acceptsControllerWrite } from './props'
-import { checkedProp, propValidityState, vPropValidity } from './props'
+import {
+  BINDING_INPUTS_PROP,
+  checkedProp,
+  checkPropInput,
+  type InputBindings,
+  propValidityState,
+  READY_INPUT,
+  requireInputStatus,
+  UNRESOLVED_INPUT,
+  vPropValidity,
+  vuePropInputs,
+} from './props'
 
 defineOptions({ inheritAttrs: false })
 
@@ -104,35 +115,34 @@ const props = defineProps({
   anchorRect: {
     type: null as unknown as PropType<
       {
-        readonly left?: number
-        readonly top?: number
-        readonly right?: number
-        readonly bottom?: number
-        readonly x?: number
-        readonly y?: number
-        readonly width?: number
-        readonly height?: number
+        readonly left?: number | null
+        readonly top?: number | null
+        readonly right?: number | null
+        readonly bottom?: number | null
+        readonly x?: number | null
+        readonly y?: number | null
+        readonly width?: number | null
+        readonly height?: number | null
       } | null
     >,
-    default: null,
   },
   items: {
     type: null as unknown as PropType<
       readonly ({
         readonly id: string
         readonly label: string
-        readonly detail?: string
-        readonly initials?: string
+        readonly detail?: string | null
+        readonly initials?: string | null
       })[] | null
     >,
-    default: null,
   },
-  label: { type: null as unknown as PropType<string | null>, default: 'Mentions' },
-  loading: { type: null as unknown as PropType<boolean | null>, default: false },
-  loadingLabel: { type: null as unknown as PropType<string | null>, default: 'Searching…' },
-  open: { type: null as unknown as PropType<boolean | null>, default: false },
-  query: { type: null as unknown as PropType<string | null>, default: '' },
-  selectedIndex: { type: null as unknown as PropType<number | null>, default: 0 },
+  label: { type: null as unknown as PropType<string | null> },
+  loading: { type: null as unknown as PropType<boolean | null> },
+  loadingLabel: { type: null as unknown as PropType<string | null> },
+  open: { type: null as unknown as PropType<boolean | null> },
+  query: { type: null as unknown as PropType<string | null> },
+  selectedIndex: { type: null as unknown as PropType<number | null> },
+  [BINDING_INPUTS_PROP]: { type: null as unknown as PropType<InputBindings> },
 })
 const acceptedProps: Record<string, unknown> = {
   anchorRect: null,
@@ -144,107 +154,133 @@ const acceptedProps: Record<string, unknown> = {
   query: '',
   selectedIndex: 0,
 }
-const checkedProps = computed(() => ({
-  anchorRect: checkedProp<
-    {
-      readonly left?: number
-      readonly top?: number
-      readonly right?: number
-      readonly bottom?: number
-      readonly x?: number
-      readonly y?: number
-      readonly width?: number
-      readonly height?: number
-    }
-  >(
-    props['anchorRect'],
-    {
-      kind: 'object',
-      fields: [
-        { name: 'left', type: { kind: 'terminal', name: 'number' }, optional: true },
-        { name: 'top', type: { kind: 'terminal', name: 'number' }, optional: true },
-        { name: 'right', type: { kind: 'terminal', name: 'number' }, optional: true },
-        { name: 'bottom', type: { kind: 'terminal', name: 'number' }, optional: true },
-        { name: 'x', type: { kind: 'terminal', name: 'number' }, optional: true },
-        { name: 'y', type: { kind: 'terminal', name: 'number' }, optional: true },
-        { name: 'width', type: { kind: 'terminal', name: 'number' }, optional: true },
-        { name: 'height', type: { kind: 'terminal', name: 'number' }, optional: true },
-      ],
-      open: false,
-    },
-    false,
-    'anchorRect',
-    acceptedProps,
-  ),
-  items: checkedProp<
-    readonly ({
-      readonly id: string
-      readonly label: string
-      readonly detail?: string
-      readonly initials?: string
-    })[]
-  >(
-    props['items'],
-    {
-      kind: 'list',
-      item: {
-        kind: 'object',
-        fields: [
-          { name: 'id', type: { kind: 'terminal', name: 'string' }, optional: false },
-          { name: 'label', type: { kind: 'terminal', name: 'string' }, optional: false },
-          { name: 'detail', type: { kind: 'terminal', name: 'string' }, optional: true },
-          { name: 'initials', type: { kind: 'terminal', name: 'string' }, optional: true },
-        ],
-        open: false,
-      },
-    },
-    false,
-    'items',
-    acceptedProps,
-  ),
-  label: checkedProp<string>(
-    props['label'],
-    { kind: 'terminal', name: 'string' },
-    false,
-    'label',
-    acceptedProps,
-  ) as string,
-  loading: checkedProp<boolean>(
-    props['loading'],
-    { kind: 'terminal', name: 'boolean' },
-    false,
-    'loading',
-    acceptedProps,
-  ) as boolean,
-  loadingLabel: checkedProp<string>(
-    props['loadingLabel'],
-    { kind: 'terminal', name: 'string' },
-    false,
-    'loadingLabel',
-    acceptedProps,
-  ) as string,
-  open: checkedProp<boolean>(
-    props['open'],
-    { kind: 'terminal', name: 'boolean' },
-    false,
-    'open',
-    acceptedProps,
-  ) as boolean,
-  query: checkedProp<string>(
-    props['query'],
-    { kind: 'terminal', name: 'string' },
-    false,
-    'query',
-    acceptedProps,
-  ) as string,
-  selectedIndex: checkedProp<number>(
-    props['selectedIndex'],
-    { kind: 'terminal', name: 'integer' },
-    false,
-    'selectedIndex',
-    acceptedProps,
-  ) as number,
-}))
+const inputTracking = vuePropInputs(acceptedProps, {
+  label: 'Mentions',
+  loading: false,
+  loadingLabel: 'Searching…',
+  open: false,
+  query: '',
+  selectedIndex: 0,
+}, (name, value, source, values) => {
+  switch (name) {
+    case 'anchorRect':
+      return checkPropInput(
+        value,
+        {
+          kind: 'object',
+          fields: [
+            { name: 'left', type: { kind: 'terminal', name: 'number' }, optional: true },
+            { name: 'top', type: { kind: 'terminal', name: 'number' }, optional: true },
+            { name: 'right', type: { kind: 'terminal', name: 'number' }, optional: true },
+            { name: 'bottom', type: { kind: 'terminal', name: 'number' }, optional: true },
+            { name: 'x', type: { kind: 'terminal', name: 'number' }, optional: true },
+            { name: 'y', type: { kind: 'terminal', name: 'number' }, optional: true },
+            { name: 'width', type: { kind: 'terminal', name: 'number' }, optional: true },
+            { name: 'height', type: { kind: 'terminal', name: 'number' }, optional: true },
+          ],
+          open: false,
+        },
+        true,
+        true,
+      )
+    case 'items':
+      return checkPropInput(
+        value,
+        {
+          kind: 'list',
+          item: {
+            kind: 'object',
+            fields: [
+              { name: 'id', type: { kind: 'terminal', name: 'string' }, optional: false },
+              { name: 'label', type: { kind: 'terminal', name: 'string' }, optional: false },
+              { name: 'detail', type: { kind: 'terminal', name: 'string' }, optional: true },
+              { name: 'initials', type: { kind: 'terminal', name: 'string' }, optional: true },
+            ],
+            open: false,
+          },
+        },
+        true,
+        true,
+      )
+    case 'label':
+      return checkPropInput(value, { kind: 'terminal', name: 'string' }, true, true)
+    case 'loading':
+      return checkPropInput(value, { kind: 'terminal', name: 'boolean' }, true, true)
+    case 'loadingLabel':
+      return checkPropInput(value, { kind: 'terminal', name: 'string' }, true, true)
+    case 'open':
+      return checkPropInput(value, { kind: 'terminal', name: 'boolean' }, true, true)
+    case 'query':
+      return checkPropInput(value, { kind: 'terminal', name: 'string' }, true, true)
+    case 'selectedIndex':
+      return checkPropInput(value, { kind: 'terminal', name: 'integer' }, true, true)
+    default:
+      return { ok: false }
+  }
+}, () => {
+  void checkedProps.value
+})
+const propInputs = inputTracking.inputs
+const checkedProps = computed(() => {
+  void inputTracking.version.value
+  return ({
+    anchorRect: propInputs.value<
+      {
+        readonly left?: number | null
+        readonly top?: number | null
+        readonly right?: number | null
+        readonly bottom?: number | null
+        readonly x?: number | null
+        readonly y?: number | null
+        readonly width?: number | null
+        readonly height?: number | null
+      } | null
+    >('anchorRect', props['anchorRect'], props[BINDING_INPUTS_PROP]),
+    items: propInputs.value<
+      readonly ({
+        readonly id: string
+        readonly label: string
+        readonly detail?: string | null
+        readonly initials?: string | null
+      })[] | null
+    >('items', props['items'], props[BINDING_INPUTS_PROP]),
+    label: propInputs.value<string | null>(
+      'label',
+      props['label'],
+      props[BINDING_INPUTS_PROP],
+    ) as string,
+    loading: propInputs.value<boolean | null>(
+      'loading',
+      props['loading'],
+      props[BINDING_INPUTS_PROP],
+    ) as boolean,
+    loadingLabel: propInputs.value<string | null>(
+      'loadingLabel',
+      props['loadingLabel'],
+      props[BINDING_INPUTS_PROP],
+    ) as string,
+    open: propInputs.value<boolean | null>(
+      'open',
+      props['open'],
+      props[BINDING_INPUTS_PROP],
+    ) as boolean,
+    query: propInputs.value<string | null>(
+      'query',
+      props['query'],
+      props[BINDING_INPUTS_PROP],
+    ) as string,
+    selectedIndex: propInputs.value<number | null>(
+      'selectedIndex',
+      props['selectedIndex'],
+      props[BINDING_INPUTS_PROP],
+    ) as number,
+  })
+})
+const inputStatus = (name: string, handlesError: boolean) => {
+  void checkedProps.value
+  void inputTracking.version.value
+  return requireInputStatus(propInputs.status(name), handlesError)
+}
 void checkedProps.value
 watchSyncEffect(() => {
   void checkedProps.value
@@ -310,11 +346,20 @@ useComponentHost(() => import('../components/ui-editor-mention-menu/ui-editor-me
       } as Record<string, any>)[name],
       keys,
     ),
+  initials: {
+    visible: false,
+    rows: [],
+    searching: false,
+    active: 0,
+    prefix: 'ui-editor-mention-menu',
+  },
   controllerSource: {
     specifier: '../components/ui-editor-mention-menu/ui-editor-mention-menu.js',
     definition: './components/ui-editor-mention-menu/ui-editor-mention-menu.html',
   },
   props: checkedProps,
+  inputs: propInputs,
+  inputTracking,
   propInputs: (name: string) => {
     const incoming = hydrationInstance?.vnode.props
     const kebab = name.replace(/[A-Z]/g, (letter) => '-' + letter.toLowerCase())

package/vue/UiEditorMentionMenuItem.d.ts

@@ -1,4 +1,5 @@
 import type { PropType } from 'vue';
+import { type InputBindings } from './props.js';
 declare var __VLS_1: {}, __VLS_3: {};
 type __VLS_Slots = {} & {
     start?: (props: typeof __VLS_1) => any;
@@ -8,34 +9,30 @@ type __VLS_Slots = {} & {
 declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     detail: {
         type: PropType<string | null>;
-        default: string;
     };
     initials: {
         type: PropType<string | null>;
-        default: string;
     };
     value: {
         type: PropType<string | null>;
-        default: string;
+    };
+    "\0htmlNextInputStatus": {
+        type: PropType<InputBindings>;
     };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     detail: {
         type: PropType<string | null>;
-        default: string;
     };
     initials: {
         type: PropType<string | null>;
-        default: string;
     };
     value: {
         type: PropType<string | null>;
-        default: string;
     };
-}>> & Readonly<{}>, {
-    value: string | null;
-    detail: string | null;
-    initials: string | null;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+    "\0htmlNextInputStatus": {
+        type: PropType<InputBindings>;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, 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;

package/vue/UiEditorMentionMenuItem.vue

@@ -1,9 +1,19 @@
-<!-- Generated by HTML Next 1.0.0-alpha.58 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.64 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import { computed, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'
 import { checkHydratedRoot, nativeAttrs, useReflectedProp } from './host'
-import { checkedProp, vPropValidity } from './props'
+import {
+  BINDING_INPUTS_PROP,
+  checkedProp,
+  checkPropInput,
+  type InputBindings,
+  READY_INPUT,
+  requireInputStatus,
+  UNRESOLVED_INPUT,
+  vPropValidity,
+  vuePropInputs,
+} from './props'
 
 defineOptions({ inheritAttrs: false })
 
@@ -34,34 +44,57 @@ const propValidityContract = {
   },
 } as const
 const props = defineProps({
-  detail: { type: null as unknown as PropType<string | null>, default: '' },
-  initials: { type: null as unknown as PropType<string | null>, default: '' },
-  value: { type: null as unknown as PropType<string | null>, default: '' },
+  detail: { type: null as unknown as PropType<string | null> },
+  initials: { type: null as unknown as PropType<string | null> },
+  value: { type: null as unknown as PropType<string | null> },
+  [BINDING_INPUTS_PROP]: { type: null as unknown as PropType<InputBindings> },
 })
 const acceptedProps: Record<string, unknown> = { detail: '', initials: '', value: '' }
-const checkedProps = computed(() => ({
-  detail: checkedProp<string>(
-    props['detail'],
-    { kind: 'terminal', name: 'string' },
-    false,
-    'detail',
-    acceptedProps,
-  ) as string,
-  initials: checkedProp<string>(
-    props['initials'],
-    { kind: 'terminal', name: 'string' },
-    false,
-    'initials',
-    acceptedProps,
-  ) as string,
-  value: checkedProp<string>(
-    props['value'],
-    { kind: 'terminal', name: 'string' },
-    false,
-    'value',
-    acceptedProps,
-  ) as string,
-}))
+const inputTracking = vuePropInputs(
+  acceptedProps,
+  { detail: '', initials: '', value: '' },
+  (name, value, source, values) => {
+    switch (name) {
+      case 'detail':
+        return checkPropInput(value, { kind: 'terminal', name: 'string' }, true, true)
+      case 'initials':
+        return checkPropInput(value, { kind: 'terminal', name: 'string' }, true, true)
+      case 'value':
+        return checkPropInput(value, { kind: 'terminal', name: 'string' }, true, true)
+      default:
+        return { ok: false }
+    }
+  },
+  () => {
+    void checkedProps.value
+  },
+)
+const propInputs = inputTracking.inputs
+const checkedProps = computed(() => {
+  void inputTracking.version.value
+  return ({
+    detail: propInputs.value<string | null>(
+      'detail',
+      props['detail'],
+      props[BINDING_INPUTS_PROP],
+    ) as string,
+    initials: propInputs.value<string | null>(
+      'initials',
+      props['initials'],
+      props[BINDING_INPUTS_PROP],
+    ) as string,
+    value: propInputs.value<string | null>(
+      'value',
+      props['value'],
+      props[BINDING_INPUTS_PROP],
+    ) as string,
+  })
+})
+const inputStatus = (name: string, handlesError: boolean) => {
+  void checkedProps.value
+  void inputTracking.version.value
+  return requireInputStatus(propInputs.status(name), handlesError)
+}
 void checkedProps.value
 watchSyncEffect(() => {
   void checkedProps.value