@threadlabs/looma 0.30.1 → 0.30.3

package/vue/UiSwitcher.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, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'
@@ -10,7 +10,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 })
 
@@ -50,13 +61,11 @@ const propValidityContract = {
   },
 } as const
 const props = defineProps({
-  align: {
-    type: null as unknown as PropType<'start' | 'center' | 'end' | 'stretch' | null>,
-    default: null,
-  },
-  gap: { type: null as unknown as PropType<'xs' | 's' | 'm' | 'l' | 'xl' | null>, default: null },
-  limit: { type: null as unknown as PropType<number | null>, default: null },
-  threshold: { type: null as unknown as PropType<'xs' | 'sm' | 'md' | 'lg' | null>, default: null },
+  align: { type: null as unknown as PropType<'start' | 'center' | 'end' | 'stretch' | null> },
+  gap: { type: null as unknown as PropType<'xs' | 's' | 'm' | 'l' | 'xl' | null> },
+  limit: { type: null as unknown as PropType<number | null> },
+  threshold: { type: null as unknown as PropType<'xs' | 'sm' | 'md' | 'lg' | null> },
+  [BINDING_INPUTS_PROP]: { type: null as unknown as PropType<InputBindings> },
 })
 const acceptedProps: Record<string, unknown> = {
   align: null,
@@ -64,36 +73,49 @@ const acceptedProps: Record<string, unknown> = {
   limit: null,
   threshold: null,
 }
-const checkedProps = computed(() => ({
-  align: checkedProp<'start' | 'center' | 'end' | 'stretch'>(
-    props['align'],
-    { kind: 'terminal', name: 'keyword' },
-    false,
-    'align',
-    acceptedProps,
-  ),
-  gap: checkedProp<'xs' | 's' | 'm' | 'l' | 'xl'>(
-    props['gap'],
-    { kind: 'terminal', name: 'keyword' },
-    false,
-    'gap',
-    acceptedProps,
-  ),
-  limit: checkedProp<number>(
-    props['limit'],
-    { kind: 'terminal', name: 'integer' },
-    false,
-    'limit',
-    acceptedProps,
-  ),
-  threshold: checkedProp<'xs' | 'sm' | 'md' | 'lg'>(
-    props['threshold'],
-    { kind: 'terminal', name: 'keyword' },
-    false,
-    'threshold',
-    acceptedProps,
-  ),
-}))
+const inputTracking = vuePropInputs(acceptedProps, {}, (name, value, source, values) => {
+  switch (name) {
+    case 'align':
+      return checkPropInput(value, { kind: 'terminal', name: 'keyword' }, true, true)
+    case 'gap':
+      return checkPropInput(value, { kind: 'terminal', name: 'keyword' }, true, true)
+    case 'limit':
+      return checkPropInput(value, { kind: 'terminal', name: 'integer' }, true, true)
+    case 'threshold':
+      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 ({
+    align: propInputs.value<'start' | 'center' | 'end' | 'stretch' | null>(
+      'align',
+      props['align'],
+      props[BINDING_INPUTS_PROP],
+    ),
+    gap: propInputs.value<'xs' | 's' | 'm' | 'l' | 'xl' | null>(
+      'gap',
+      props['gap'],
+      props[BINDING_INPUTS_PROP],
+    ),
+    limit: propInputs.value<number | null>('limit', props['limit'], props[BINDING_INPUTS_PROP]),
+    threshold: propInputs.value<'xs' | 'sm' | 'md' | 'lg' | null>(
+      'threshold',
+      props['threshold'],
+      props[BINDING_INPUTS_PROP],
+    ),
+  })
+})
+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
@@ -131,11 +153,14 @@ useComponentHost(() => import('../components/ui-switcher/ui-switcher.js'), {
       ({ overLimit: { kind: 'terminal', name: 'boolean' } } as Record<string, any>)[name],
       keys,
     ),
+  initials: { overLimit: false },
   controllerSource: {
     specifier: '../components/ui-switcher/ui-switcher.js',
     definition: './components/ui-switcher/ui-switcher.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/UiTable.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,25 +7,24 @@ type __VLS_Slots = {} & {
 declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     density: {
         type: PropType<"comfortable" | "compact" | null>;
-        default: string;
     };
     stickyHeader: {
         type: PropType<boolean | null>;
-        default: boolean;
+    };
+    "\0htmlNextInputStatus": {
+        type: PropType<InputBindings>;
     };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     density: {
         type: PropType<"comfortable" | "compact" | null>;
-        default: string;
     };
     stickyHeader: {
         type: PropType<boolean | null>;
-        default: boolean;
     };
-}>> & Readonly<{}>, {
-    density: "comfortable" | "compact" | null;
-    stickyHeader: boolean | 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/UiTable.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, ref, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'
@@ -9,7 +9,18 @@ import {
   useComponentHost,
   useReflectedProp,
 } from './host'
-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 })
 
@@ -35,29 +46,49 @@ const propValidityContract = {
   },
 } as const
 const props = defineProps({
-  density: {
-    type: null as unknown as PropType<'comfortable' | 'compact' | null>,
-    default: 'comfortable',
-  },
-  stickyHeader: { type: null as unknown as PropType<boolean | null>, default: false },
+  density: { type: null as unknown as PropType<'comfortable' | 'compact' | null> },
+  stickyHeader: { type: null as unknown as PropType<boolean | null> },
+  [BINDING_INPUTS_PROP]: { type: null as unknown as PropType<InputBindings> },
 })
 const acceptedProps: Record<string, unknown> = { density: 'comfortable', stickyHeader: false }
-const checkedProps = computed(() => ({
-  density: checkedProp<'comfortable' | 'compact'>(
-    props['density'],
-    { kind: 'terminal', name: 'keyword' },
-    false,
-    'density',
-    acceptedProps,
-  ) as 'comfortable' | 'compact',
-  stickyHeader: checkedProp<boolean>(
-    props['stickyHeader'],
-    { kind: 'terminal', name: 'boolean' },
-    false,
-    'stickyHeader',
-    acceptedProps,
-  ) as boolean,
-}))
+const inputTracking = vuePropInputs(
+  acceptedProps,
+  { density: 'comfortable', stickyHeader: false },
+  (name, value, source, values) => {
+    switch (name) {
+      case 'density':
+        return checkPropInput(value, { kind: 'terminal', name: 'keyword' }, true, true)
+      case 'stickyHeader':
+        return checkPropInput(value, { kind: 'terminal', name: 'boolean' }, true, true)
+      default:
+        return { ok: false }
+    }
+  },
+  () => {
+    void checkedProps.value
+  },
+)
+const propInputs = inputTracking.inputs
+const checkedProps = computed(() => {
+  void inputTracking.version.value
+  return ({
+    density: propInputs.value<'comfortable' | 'compact' | null>(
+      'density',
+      props['density'],
+      props[BINDING_INPUTS_PROP],
+    ) as 'comfortable' | 'compact',
+    stickyHeader: propInputs.value<boolean | null>(
+      'stickyHeader',
+      props['stickyHeader'],
+      props[BINDING_INPUTS_PROP],
+    ) as boolean,
+  })
+})
+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
@@ -88,6 +119,8 @@ useComponentHost(() => import('../components/ui-table/ui-table.js'), {
     definition: './components/ui-table/ui-table.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/UiTabs.d.ts

@@ -1,4 +1,5 @@
 import type { PropType } from 'vue';
+import { type InputBindings } from './props.js';
 declare var __VLS_1: {}, __VLS_9: {};
 type __VLS_Slots = {} & {
     tab?: (props: typeof __VLS_1) => any;
@@ -8,31 +9,27 @@ type __VLS_Slots = {} & {
 declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     activation: {
         type: PropType<"auto" | "manual" | null>;
-        default: string;
     };
     density: {
         type: PropType<"comfortable" | "compact" | null>;
-        default: string;
     };
     group: {
         type: PropType<string | null>;
-        default: string;
     };
     label: {
         type: PropType<string | null>;
-        default: string;
     };
     orientation: {
         type: PropType<"horizontal" | "vertical" | null>;
-        default: string;
     };
     stretch: {
         type: PropType<boolean | null>;
-        default: boolean;
     };
     value: {
         type: PropType<string | null>;
-        default: string;
+    };
+    "\0htmlNextInputStatus": {
+        type: PropType<InputBindings>;
     };
 }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     select: (event: CustomEvent<{
@@ -44,31 +41,27 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     activation: {
         type: PropType<"auto" | "manual" | null>;
-        default: string;
     };
     density: {
         type: PropType<"comfortable" | "compact" | null>;
-        default: string;
     };
     group: {
         type: PropType<string | null>;
-        default: string;
     };
     label: {
         type: PropType<string | null>;
-        default: string;
     };
     orientation: {
         type: PropType<"horizontal" | "vertical" | null>;
-        default: string;
     };
     stretch: {
         type: PropType<boolean | null>;
-        default: boolean;
     };
     value: {
         type: PropType<string | null>;
-        default: string;
+    };
+    "\0htmlNextInputStatus": {
+        type: PropType<InputBindings>;
     };
 }>> & Readonly<{
     onSelect?: ((event: CustomEvent<{
@@ -77,15 +70,7 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         readonly trigger: "keyboard" | "pointer" | "programmatic";
     }>) => any) | undefined;
     "onUpdate:value"?: ((value: string) => any) | undefined;
-}>, {
-    value: string | null;
-    label: string | null;
-    group: string | null;
-    stretch: boolean | null;
-    density: "comfortable" | "compact" | null;
-    orientation: "vertical" | "horizontal" | null;
-    activation: "auto" | "manual" | 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/UiTabs.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'
@@ -13,7 +13,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 })
 
@@ -80,19 +91,14 @@ const propValidityContract = {
   },
 } as const
 const props = defineProps({
-  activation: { type: null as unknown as PropType<'auto' | 'manual' | null>, default: 'auto' },
-  density: {
-    type: null as unknown as PropType<'comfortable' | 'compact' | null>,
-    default: 'comfortable',
-  },
-  group: { type: null as unknown as PropType<string | null>, default: '' },
-  label: { type: null as unknown as PropType<string | null>, default: 'Tabs' },
-  orientation: {
-    type: null as unknown as PropType<'horizontal' | 'vertical' | null>,
-    default: 'horizontal',
-  },
-  stretch: { type: null as unknown as PropType<boolean | null>, default: false },
-  value: { type: null as unknown as PropType<string | null>, default: '' },
+  activation: { type: null as unknown as PropType<'auto' | 'manual' | null> },
+  density: { type: null as unknown as PropType<'comfortable' | 'compact' | null> },
+  group: { type: null as unknown as PropType<string | null> },
+  label: { type: null as unknown as PropType<string | null> },
+  orientation: { type: null as unknown as PropType<'horizontal' | 'vertical' | null> },
+  stretch: { type: null as unknown as PropType<boolean | 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> = {
   activation: 'auto',
@@ -103,57 +109,82 @@ const acceptedProps: Record<string, unknown> = {
   stretch: false,
   value: '',
 }
-const checkedProps = computed(() => ({
-  activation: checkedProp<'auto' | 'manual'>(
-    props['activation'],
-    { kind: 'terminal', name: 'keyword' },
-    false,
-    'activation',
-    acceptedProps,
-  ) as 'auto' | 'manual',
-  density: checkedProp<'comfortable' | 'compact'>(
-    props['density'],
-    { kind: 'terminal', name: 'keyword' },
-    false,
-    'density',
-    acceptedProps,
-  ) as 'comfortable' | 'compact',
-  group: checkedProp<string>(
-    props['group'],
-    { kind: 'terminal', name: 'string' },
-    false,
-    'group',
-    acceptedProps,
-  ) as string,
-  label: checkedProp<string>(
-    props['label'],
-    { kind: 'terminal', name: 'string' },
-    false,
-    'label',
-    acceptedProps,
-  ) as string,
-  orientation: checkedProp<'horizontal' | 'vertical'>(
-    props['orientation'],
-    { kind: 'terminal', name: 'keyword' },
-    false,
-    'orientation',
-    acceptedProps,
-  ) as 'horizontal' | 'vertical',
-  stretch: checkedProp<boolean>(
-    props['stretch'],
-    { kind: 'terminal', name: 'boolean' },
-    false,
-    'stretch',
-    acceptedProps,
-  ) as boolean,
-  value: checkedProp<string>(
-    props['value'],
-    { kind: 'terminal', name: 'string' },
-    false,
-    'value',
-    acceptedProps,
-  ) as string,
-}))
+const inputTracking = vuePropInputs(acceptedProps, {
+  activation: 'auto',
+  density: 'comfortable',
+  group: '',
+  label: 'Tabs',
+  orientation: 'horizontal',
+  stretch: false,
+  value: '',
+}, (name, value, source, values) => {
+  switch (name) {
+    case 'activation':
+      return checkPropInput(value, { kind: 'terminal', name: 'keyword' }, true, true)
+    case 'density':
+      return checkPropInput(value, { kind: 'terminal', name: 'keyword' }, true, true)
+    case 'group':
+      return checkPropInput(value, { kind: 'terminal', name: 'string' }, true, true)
+    case 'label':
+      return checkPropInput(value, { kind: 'terminal', name: 'string' }, true, true)
+    case 'orientation':
+      return checkPropInput(value, { kind: 'terminal', name: 'keyword' }, true, true)
+    case 'stretch':
+      return checkPropInput(value, { kind: 'terminal', name: 'boolean' }, 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 ({
+    activation: propInputs.value<'auto' | 'manual' | null>(
+      'activation',
+      props['activation'],
+      props[BINDING_INPUTS_PROP],
+    ) as 'auto' | 'manual',
+    density: propInputs.value<'comfortable' | 'compact' | null>(
+      'density',
+      props['density'],
+      props[BINDING_INPUTS_PROP],
+    ) as 'comfortable' | 'compact',
+    group: propInputs.value<string | null>(
+      'group',
+      props['group'],
+      props[BINDING_INPUTS_PROP],
+    ) as string,
+    label: propInputs.value<string | null>(
+      'label',
+      props['label'],
+      props[BINDING_INPUTS_PROP],
+    ) as string,
+    orientation: propInputs.value<'horizontal' | 'vertical' | null>(
+      'orientation',
+      props['orientation'],
+      props[BINDING_INPUTS_PROP],
+    ) as 'horizontal' | 'vertical',
+    stretch: propInputs.value<boolean | null>(
+      'stretch',
+      props['stretch'],
+      props[BINDING_INPUTS_PROP],
+    ) as boolean,
+    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
@@ -236,11 +267,14 @@ useComponentHost(() => import('../components/ui-tabs/ui-tabs.js'), {
       } as Record<string, any>)[name],
       keys,
     ),
+  initials: { internalValue: '', tabs: [] },
   controllerSource: {
     specifier: '../components/ui-tabs/ui-tabs.js',
     definition: './components/ui-tabs/ui-tabs.html',
   },
   props: checkedProps,
+  inputs: propInputs,
+  inputTracking,
   propInputs: (name: string) => {
     const incoming = hydrationInstance?.vnode.props
     const kebab = name.replace(/[A-Z]/g, (letter) => '-' + letter.toLowerCase())