@threadlabs/looma 0.30.1 → 0.30.3

package/vue/UiStatusMessage.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.63 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import { computed, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'
 import { attribute, checkHydratedRoot, concat, 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'
 import UiSpinner from './UiSpinner.vue'
 
 defineOptions({ inheritAttrs: false })
@@ -38,40 +48,57 @@ const propValidityContract = {
   },
 } as const
 const props = defineProps({
-  heading: { type: null as unknown as PropType<string | null>, default: '' },
-  kind: {
-    type: null as unknown as PropType<'empty' | 'loading' | 'error' | null>,
-    default: 'empty',
+  heading: { type: null as unknown as PropType<string | null> },
+  kind: { type: null as unknown as PropType<'empty' | 'loading' | 'error' | null> },
+  layout: { type: null as unknown as PropType<'inline' | 'panel' | 'fill' | null> },
+  [BINDING_INPUTS_PROP]: { type: null as unknown as PropType<InputBindings> },
+})
+const acceptedProps: Record<string, unknown> = { heading: '', kind: 'empty', layout: 'inline' }
+const inputTracking = vuePropInputs(
+  acceptedProps,
+  { heading: '', kind: 'empty', layout: 'inline' },
+  (name, value, source, values) => {
+    switch (name) {
+      case 'heading':
+        return checkPropInput(value, { kind: 'terminal', name: 'string' }, true, true)
+      case 'kind':
+        return checkPropInput(value, { kind: 'terminal', name: 'keyword' }, true, true)
+      case 'layout':
+        return checkPropInput(value, { kind: 'terminal', name: 'keyword' }, true, true)
+      default:
+        return { ok: false }
+    }
   },
-  layout: {
-    type: null as unknown as PropType<'inline' | 'panel' | 'fill' | null>,
-    default: 'inline',
+  () => {
+    void checkedProps.value
   },
+)
+const propInputs = inputTracking.inputs
+const checkedProps = computed(() => {
+  void inputTracking.version.value
+  return ({
+    heading: propInputs.value<string | null>(
+      'heading',
+      props['heading'],
+      props[BINDING_INPUTS_PROP],
+    ) as string,
+    kind: propInputs.value<'empty' | 'loading' | 'error' | null>(
+      'kind',
+      props['kind'],
+      props[BINDING_INPUTS_PROP],
+    ) as 'empty' | 'loading' | 'error',
+    layout: propInputs.value<'inline' | 'panel' | 'fill' | null>(
+      'layout',
+      props['layout'],
+      props[BINDING_INPUTS_PROP],
+    ) as 'inline' | 'panel' | 'fill',
+  })
 })
-const acceptedProps: Record<string, unknown> = { heading: '', kind: 'empty', layout: 'inline' }
-const checkedProps = computed(() => ({
-  heading: checkedProp<string>(
-    props['heading'],
-    { kind: 'terminal', name: 'string' },
-    false,
-    'heading',
-    acceptedProps,
-  ) as string,
-  kind: checkedProp<'empty' | 'loading' | 'error'>(
-    props['kind'],
-    { kind: 'terminal', name: 'keyword' },
-    false,
-    'kind',
-    acceptedProps,
-  ) as 'empty' | 'loading' | 'error',
-  layout: checkedProp<'inline' | 'panel' | 'fill'>(
-    props['layout'],
-    { kind: 'terminal', name: 'keyword' },
-    false,
-    'layout',
-    acceptedProps,
-  ) as 'inline' | 'panel' | 'fill',
-}))
+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

package/vue/UiSwatch.d.ts

@@ -1,16 +1,19 @@
 import type { PropType } from 'vue';
+import { type InputBindings } from './props.js';
 declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     tone: {
         type: PropType<"neutral" | "blue" | "green" | "yellow" | "red" | "purple" | null>;
-        default: string;
+    };
+    "\0htmlNextInputStatus": {
+        type: PropType<InputBindings>;
     };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     tone: {
         type: PropType<"neutral" | "blue" | "green" | "yellow" | "red" | "purple" | null>;
-        default: string;
     };
-}>> & Readonly<{}>, {
-    tone: "blue" | "green" | "purple" | "red" | "yellow" | "neutral" | null;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+    "\0htmlNextInputStatus": {
+        type: PropType<InputBindings>;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/vue/UiSwatch.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.63 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import { computed, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'
@@ -9,7 +9,20 @@ import {
   nativeAttrs,
   useReflectedProp,
 } from './host'
-import { checkedProp, vPropValidity } from './props'
+import {
+  BINDING_INPUTS_PROP,
+  checkedProp,
+  checkPropInput,
+  type InputBindings,
+  inputComputed,
+  inputDefault,
+  inputRead,
+  READY_INPUT,
+  requireInputStatus,
+  UNRESOLVED_INPUT,
+  vPropValidity,
+  vuePropInputs,
+} from './props'
 
 defineOptions({ inheritAttrs: false })
 
@@ -31,34 +44,63 @@ const props = defineProps({
     type: null as unknown as PropType<
       'neutral' | 'blue' | 'green' | 'yellow' | 'red' | 'purple' | null
     >,
-    default: 'neutral',
   },
+  [BINDING_INPUTS_PROP]: { type: null as unknown as PropType<InputBindings> },
 })
 const acceptedProps: Record<string, unknown> = { tone: 'neutral' }
-const checkedProps = computed(() => ({
-  tone: checkedProp<'neutral' | 'blue' | 'green' | 'yellow' | 'red' | 'purple'>(
-    props['tone'],
-    { kind: 'terminal', name: 'keyword' },
-    false,
-    'tone',
-    acceptedProps,
-  ) as 'neutral' | 'blue' | 'green' | 'yellow' | 'red' | 'purple',
-}))
+const inputTracking = vuePropInputs(
+  acceptedProps,
+  { tone: 'neutral' },
+  (name, value, source, values) => {
+    switch (name) {
+      case 'tone':
+        return checkPropInput(value, { kind: 'terminal', name: 'keyword' }, true, true)
+      default:
+        return { ok: false }
+    }
+  },
+  () => {
+    void checkedProps.value
+  },
+)
+const propInputs = inputTracking.inputs
+const checkedProps = computed(() => {
+  void inputTracking.version.value
+  return ({
+    tone: propInputs.value<'neutral' | 'blue' | 'green' | 'yellow' | 'red' | 'purple' | null>(
+      'tone',
+      props['tone'],
+      props[BINDING_INPUTS_PROP],
+    ) as 'neutral' | 'blue' | 'green' | 'yellow' | 'red' | 'purple',
+  })
+})
+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
 })
 const reflectedProp = useReflectedProp()
 
-const toneName = cycleCheckedComputed(() =>
-  (({
-    neutral: 'Neutral',
-    blue: 'Blue',
-    green: 'Green',
-    yellow: 'Yellow',
-    red: 'Red',
-    purple: 'Purple',
-  }) as Record<string, any>)[checkedProps.value.tone]
+const toneName: ReturnType<typeof inputComputed<any>> = inputComputed<any>(
+  () =>
+    (({
+      neutral: 'Neutral',
+      blue: 'Blue',
+      green: 'Green',
+      yellow: 'Yellow',
+      red: 'Red',
+      purple: 'Purple',
+    }) as Record<string, any>)[
+      inputRead(checkedProps.value.tone, propInputs.status('tone'))
+    ] as any,
+  (read) => {
+    const value = cycleCheckedComputed(read)
+    return { get: () => value.value }
+  },
 )
 checkHydratedRoot('input', 'ui-swatch')
 
@@ -78,7 +120,7 @@ const hostState = computed(() =>
     v-bind="nativeAttrs($attrs)"
     data-hn
     :value.attr="checkedProps.tone ?? undefined"
-    :aria-label="typeof toneName === 'boolean' ? String(toneName) : attribute(toneName)"
+    :aria-label="typeof (toneName.get()) === 'boolean' ? String(toneName.get()) : attribute(toneName.get())"
     v-prop-validity="{ contract: propValidityContract, values: { ...props } }"
     :data-ui-swatch-prop-tone="reflectedProp('tone', 'tone', checkedProps.tone, undefined, false)"
     :data-ui-swatch-state="hostState || undefined"

package/vue/UiSwitch.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 = {} & {
     default?: (props: typeof __VLS_1) => any;
@@ -8,27 +9,24 @@ type __VLS_Slots = {} & {
 declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     checked: {
         type: PropType<boolean | null>;
-        default: boolean;
     };
     disabled: {
         type: PropType<boolean | null>;
-        default: boolean;
     };
     name: {
         type: PropType<string | null>;
-        default: string;
     };
     required: {
         type: PropType<boolean | null>;
-        default: boolean;
     };
     size: {
         type: PropType<"sm" | "md" | "lg" | null>;
-        default: string;
     };
     value: {
         type: PropType<string | null>;
-        default: string;
+    };
+    "\0htmlNextInputStatus": {
+        type: PropType<InputBindings>;
     };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     change: (event: CustomEvent<{
@@ -41,27 +39,24 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     checked: {
         type: PropType<boolean | null>;
-        default: boolean;
     };
     disabled: {
         type: PropType<boolean | null>;
-        default: boolean;
     };
     name: {
         type: PropType<string | null>;
-        default: string;
     };
     required: {
         type: PropType<boolean | null>;
-        default: boolean;
     };
     size: {
         type: PropType<"sm" | "md" | "lg" | null>;
-        default: string;
     };
     value: {
         type: PropType<string | null>;
-        default: string;
+    };
+    "\0htmlNextInputStatus": {
+        type: PropType<InputBindings>;
     };
 }>> & Readonly<{
     onChange?: ((event: CustomEvent<{
@@ -71,14 +66,7 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
     }>) => any) | undefined;
     "onUpdate:checked"?: ((value: boolean) => any) | undefined;
     "onUpdate:value"?: ((value: string) => any) | undefined;
-}>, {
-    name: string | null;
-    value: string | null;
-    required: boolean | null;
-    size: "sm" | "md" | "lg" | null;
-    disabled: boolean | null;
-    checked: boolean | 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/UiSwitch.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.63 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'
@@ -11,7 +11,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 })
 
@@ -68,12 +79,13 @@ const propValidityContract = {
   },
 } as const
 const props = defineProps({
-  checked: { type: null as unknown as PropType<boolean | null>, default: false },
-  disabled: { type: null as unknown as PropType<boolean | null>, default: false },
-  name: { type: null as unknown as PropType<string | null>, default: '' },
-  required: { type: null as unknown as PropType<boolean | null>, default: false },
-  size: { type: null as unknown as PropType<'sm' | 'md' | 'lg' | null>, default: 'md' },
-  value: { type: null as unknown as PropType<string | null>, default: 'on' },
+  checked: { type: null as unknown as PropType<boolean | null> },
+  disabled: { type: null as unknown as PropType<boolean | null> },
+  name: { type: null as unknown as PropType<string | null> },
+  required: { type: null as unknown as PropType<boolean | null> },
+  size: { type: null as unknown as PropType<'sm' | 'md' | 'lg' | 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> = {
   checked: false,
@@ -83,50 +95,74 @@ const acceptedProps: Record<string, unknown> = {
   size: 'md',
   value: 'on',
 }
-const checkedProps = computed(() => ({
-  checked: checkedProp<boolean>(
-    props['checked'],
-    { kind: 'terminal', name: 'boolean' },
-    false,
-    'checked',
-    acceptedProps,
-  ) as boolean,
-  disabled: checkedProp<boolean>(
-    props['disabled'],
-    { kind: 'terminal', name: 'boolean' },
-    false,
-    'disabled',
-    acceptedProps,
-  ) as boolean,
-  name: checkedProp<string>(
-    props['name'],
-    { kind: 'terminal', name: 'string' },
-    false,
-    'name',
-    acceptedProps,
-  ) as string,
-  required: checkedProp<boolean>(
-    props['required'],
-    { kind: 'terminal', name: 'boolean' },
-    false,
-    'required',
-    acceptedProps,
-  ) as boolean,
-  size: checkedProp<'sm' | 'md' | 'lg'>(
-    props['size'],
-    { kind: 'terminal', name: 'keyword' },
-    false,
-    'size',
-    acceptedProps,
-  ) as 'sm' | 'md' | 'lg',
-  value: checkedProp<string>(
-    props['value'],
-    { kind: 'terminal', name: 'string' },
-    false,
-    'value',
-    acceptedProps,
-  ) as string,
-}))
+const inputTracking = vuePropInputs(acceptedProps, {
+  checked: false,
+  disabled: false,
+  name: '',
+  required: false,
+  size: 'md',
+  value: 'on',
+}, (name, value, source, values) => {
+  switch (name) {
+    case 'checked':
+      return checkPropInput(value, { kind: 'terminal', name: 'boolean' }, true, true)
+    case 'disabled':
+      return checkPropInput(value, { kind: 'terminal', name: 'boolean' }, true, true)
+    case 'name':
+      return checkPropInput(value, { kind: 'terminal', name: 'string' }, true, true)
+    case 'required':
+      return checkPropInput(value, { kind: 'terminal', name: 'boolean' }, true, true)
+    case 'size':
+      return checkPropInput(value, { kind: 'terminal', name: 'keyword' }, 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 ({
+    checked: propInputs.value<boolean | null>(
+      'checked',
+      props['checked'],
+      props[BINDING_INPUTS_PROP],
+    ) as boolean,
+    disabled: propInputs.value<boolean | null>(
+      'disabled',
+      props['disabled'],
+      props[BINDING_INPUTS_PROP],
+    ) as boolean,
+    name: propInputs.value<string | null>(
+      'name',
+      props['name'],
+      props[BINDING_INPUTS_PROP],
+    ) as string,
+    required: propInputs.value<boolean | null>(
+      'required',
+      props['required'],
+      props[BINDING_INPUTS_PROP],
+    ) as boolean,
+    size: propInputs.value<'sm' | 'md' | 'lg' | null>(
+      'size',
+      props['size'],
+      props[BINDING_INPUTS_PROP],
+    ) as 'sm' | 'md' | 'lg',
+    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
@@ -188,11 +224,14 @@ useComponentHost(() => import('../components/ui-switch/ui-switch.js'), {
       ({ internalChecked: { kind: 'terminal', name: 'boolean' } } as Record<string, any>)[name],
       keys,
     ),
+  initials: { internalChecked: false },
   controllerSource: {
     specifier: '../components/ui-switch/ui-switch.js',
     definition: './components/ui-switch/ui-switch.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/UiSwitcher.d.ts

@@ -1,4 +1,5 @@
 import type { PropType } from 'vue';
+import { type InputBindings } from './props.js';
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
@@ -6,43 +7,36 @@ type __VLS_Slots = {} & {
 declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     align: {
         type: PropType<"start" | "center" | "end" | "stretch" | null>;
-        default: null;
     };
     gap: {
         type: PropType<"xs" | "s" | "m" | "l" | "xl" | null>;
-        default: null;
     };
     limit: {
         type: PropType<number | null>;
-        default: null;
     };
     threshold: {
         type: PropType<"xs" | "sm" | "md" | "lg" | null>;
-        default: null;
+    };
+    "\0htmlNextInputStatus": {
+        type: PropType<InputBindings>;
     };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     align: {
         type: PropType<"start" | "center" | "end" | "stretch" | null>;
-        default: null;
     };
     gap: {
         type: PropType<"xs" | "s" | "m" | "l" | "xl" | null>;
-        default: null;
     };
     limit: {
         type: PropType<number | null>;
-        default: null;
     };
     threshold: {
         type: PropType<"xs" | "sm" | "md" | "lg" | null>;
-        default: null;
-    };
-}>> & Readonly<{}>, {
-    align: "center" | "start" | "stretch" | "end" | null;
-    gap: "s" | "xs" | "m" | "l" | "xl" | null;
-    limit: number | null;
-    threshold: "xs" | "sm" | "md" | "lg" | 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;