@threadlabs/looma 0.22.9 → 0.22.10

package/vue/UiMenu.vue

@@ -1,9 +1,9 @@
-<!-- Generated by HTML Next 1.0.0-alpha.18 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.19 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import { computed, getCurrentInstance, provide, ref, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'
 import { createDispatch, useComponentHost } from './host'
-import { checkedProp, vPropValidity } from './props'
+import { checkedProp, propValidityState, vPropValidity } from './props'
 
 defineOptions({ inheritAttrs: false })
 
@@ -56,7 +56,7 @@ const propValidityContract = {
       default: 'md',
     },
   },
-}
+} as const
 const props = defineProps({
   density: {
     type: null as unknown as PropType<'comfortable' | 'compact' | null>,
@@ -68,42 +68,56 @@ const props = defineProps({
   placement: { type: null as unknown as PropType<string | null>, default: 'bottom-start' },
   size: { type: null as unknown as PropType<'sm' | 'md' | null>, default: 'md' },
 })
+const acceptedProps: Record<string, unknown> = {
+  density: 'comfortable',
+  for: '',
+  inline: false,
+  open: false,
+  placement: 'bottom-start',
+  size: 'md',
+}
 const checkedProps = computed(() => ({
   density: checkedProp<'comfortable' | 'compact'>(
     props['density'],
     { kind: 'terminal', name: 'keyword' },
     false,
     'density',
+    acceptedProps,
   ) as 'comfortable' | 'compact',
   for: checkedProp<string>(
     props['for'],
     { kind: 'terminal', name: 'string' },
     false,
     'for',
+    acceptedProps,
   ) as string,
   inline: checkedProp<boolean>(
     props['inline'],
     { kind: 'terminal', name: 'boolean' },
     false,
     'inline',
+    acceptedProps,
   ) as boolean,
   open: checkedProp<boolean>(
     props['open'],
     { kind: 'terminal', name: 'boolean' },
     false,
     'open',
+    acceptedProps,
   ) as boolean,
   placement: checkedProp<string>(
     props['placement'],
     { kind: 'terminal', name: 'string' },
     false,
     'placement',
+    acceptedProps,
   ) as string,
   size: checkedProp<'sm' | 'md'>(
     props['size'],
     { kind: 'terminal', name: 'keyword' },
     false,
     'size',
+    acceptedProps,
   ) as 'sm' | 'md',
 }))
 void checkedProps.value
@@ -250,6 +264,16 @@ useComponentHost(() => import('../components/ui-menu/ui-menu.js'), {
     definition: './components/ui-menu/ui-menu.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: ['density', 'for', 'inline', 'open', 'placement', 'size'],
+  propValidity: (name: string) =>
+    propValidityState({ contract: propValidityContract, values: { ...props } }, name),
   state: { internalOpen },
 })
 </script>
@@ -260,7 +284,7 @@ useComponentHost(() => import('../components/ui-menu/ui-menu.js'), {
     role="menu"
     aria-orientation="vertical"
     v-bind="nativeAttrs($attrs)"
-    v-prop-validity="{ contract: propValidityContract, values: { ...checkedProps } }"
+    v-prop-validity="{ contract: propValidityContract, values: { ...props } }"
     :data-density="reflectedProp('density', 'density', checkedProps.density, undefined, false)"
     :data-for="reflectedProp('for', 'for', checkedProps.for, undefined, false)"
     :data-inline="reflectedProp('inline', 'inline', checkedProps.inline, undefined, false)"

package/vue/UiMenuGroup.vue

@@ -1,4 +1,4 @@
-<!-- Generated by HTML Next 1.0.0-alpha.18 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.19 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import { computed, getCurrentInstance, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'
@@ -16,16 +16,18 @@ const propValidityContract = {
       default: '',
     },
   },
-}
+} as const
 const props = defineProps({
   label: { type: null as unknown as PropType<string | null>, default: '' },
 })
+const acceptedProps: Record<string, unknown> = { label: '' }
 const checkedProps = computed(() => ({
   label: checkedProp<string>(
     props['label'],
     { kind: 'terminal', name: 'string' },
     false,
     'label',
+    acceptedProps,
   ) as string,
 }))
 void checkedProps.value
@@ -90,7 +92,7 @@ if (
     role="group"
     v-bind="nativeAttrs($attrs)"
     :aria-label="checkedProps.label ?? undefined"
-    v-prop-validity="{ contract: propValidityContract, values: { ...checkedProps } }"
+    v-prop-validity="{ contract: propValidityContract, values: { ...props } }"
     :data-label="reflectedProp('label', 'label', checkedProps.label, undefined, false)"
   >
     <div v-if="checkedProps.label" class="heading">{{ checkedProps.label }}</div>

package/vue/UiMenuItem.vue

@@ -1,9 +1,9 @@
-<!-- Generated by HTML Next 1.0.0-alpha.18 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.19 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'
 import { createDispatch, preserveRootFocus, useComponentHost } from './host'
-import { checkedProp, vPropValidity } from './props'
+import { checkedProp, propValidityState, vPropValidity } from './props'
 import UiIcon from './UiIcon.vue'
 
 defineOptions({ inheritAttrs: false })
@@ -51,7 +51,7 @@ const propValidityContract = {
       default: '',
     },
   },
-}
+} 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 },
@@ -62,36 +62,48 @@ const props = defineProps({
   },
   value: { type: null as unknown as PropType<string | null>, default: '' },
 })
+const acceptedProps: Record<string, unknown> = {
+  checked: false,
+  disabled: false,
+  href: '',
+  type: 'action',
+  value: '',
+}
 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,
   href: checkedProp<string>(
     props['href'],
     { kind: 'terminal', name: 'string' },
     false,
     'href',
+    acceptedProps,
   ) as string,
   type: checkedProp<'action' | 'checkbox' | 'radio'>(
     props['type'],
     { kind: 'terminal', name: 'keyword' },
     false,
     'type',
+    acceptedProps,
   ) as 'action' | 'checkbox' | 'radio',
   value: checkedProp<string>(
     props['value'],
     { kind: 'terminal', name: 'string' },
     false,
     'value',
+    acceptedProps,
   ) as string,
 }))
 void checkedProps.value
@@ -232,6 +244,16 @@ useComponentHost(() => import('../components/ui-menu-item/ui-menu-item.js'), {
     definition: './components/ui-menu-item/ui-menu-item.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: ['checked', 'disabled', 'href', 'type', 'value'],
+  propValidity: (name: string) =>
+    propValidityState({ contract: propValidityContract, values: { ...props } }, name),
   state: { internalChecked },
 })
 
@@ -262,7 +284,7 @@ function attribute(value: unknown): any {
         `${checkedProps.disabled ?? ''}`
       ],
     )"
-    v-prop-validity="{ contract: propValidityContract, values: { ...checkedProps } }"
+    v-prop-validity="{ contract: propValidityContract, values: { ...props } }"
     :data-checked="reflectedProp('checked', 'checked', checkedProps.checked, undefined, false)"
     :data-disabled="reflectedProp('disabled', 'disabled', checkedProps.disabled, undefined, false)"
     :data-href="reflectedProp('href', 'href', checkedProps.href, undefined, false)"
@@ -285,7 +307,7 @@ function attribute(value: unknown): any {
     )"
     :aria-checked="guarded"
     :aria-disabled="checkedProps.disabled ?? undefined"
-    v-prop-validity="{ contract: propValidityContract, values: { ...checkedProps } }"
+    v-prop-validity="{ contract: propValidityContract, values: { ...props } }"
     :data-checked="reflectedProp('checked', 'checked', checkedProps.checked, undefined, false)"
     :data-disabled="reflectedProp('disabled', 'disabled', checkedProps.disabled, undefined, false)"
     :data-href="reflectedProp('href', 'href', checkedProps.href, undefined, false)"

package/vue/UiMeter.vue

@@ -1,4 +1,4 @@
-<!-- Generated by HTML Next 1.0.0-alpha.18 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.19 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import { computed, getCurrentInstance, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'
@@ -67,7 +67,7 @@ const propValidityContract = {
       default: '',
     },
   },
-}
+} as const
 const props = defineProps({
   label: { type: null as unknown as PropType<string | null>, default: '' },
   max: { type: null as unknown as PropType<number | null>, default: 1 },
@@ -82,48 +82,64 @@ const props = defineProps({
   value: { type: null as unknown as PropType<number | null>, default: 0 },
   valueText: { type: null as unknown as PropType<string | null>, default: '' },
 })
+const acceptedProps: Record<string, unknown> = {
+  label: '',
+  max: 1,
+  segments: 0,
+  size: 'md',
+  tone: 'neutral',
+  value: 0,
+  valueText: '',
+}
 const checkedProps = computed(() => ({
   label: checkedProp<string>(
     props['label'],
     { kind: 'terminal', name: 'string' },
     false,
     'label',
+    acceptedProps,
   ) as string,
   max: checkedProp<number>(
     props['max'],
     { kind: 'terminal', name: 'number' },
     false,
     'max',
+    acceptedProps,
   ) as number,
   segments: checkedProp<number>(
     props['segments'],
     { kind: 'terminal', name: 'number' },
     false,
     'segments',
+    acceptedProps,
   ) as number,
   size: checkedProp<'sm' | 'md'>(
     props['size'],
     { kind: 'terminal', name: 'keyword' },
     false,
     'size',
+    acceptedProps,
   ) as 'sm' | 'md',
   tone: checkedProp<'neutral' | 'accent' | 'info' | 'success' | 'warning' | 'danger'>(
     props['tone'],
     { kind: 'terminal', name: 'keyword' },
     false,
     'tone',
+    acceptedProps,
   ) as 'neutral' | 'accent' | 'info' | 'success' | 'warning' | 'danger',
   value: checkedProp<number>(
     props['value'],
     { kind: 'terminal', name: 'number' },
     false,
     'value',
+    acceptedProps,
   ) as number,
   valueText: checkedProp<string>(
     props['valueText'],
     { kind: 'terminal', name: 'string' },
     false,
     'valueText',
+    acceptedProps,
   ) as string,
 }))
 void checkedProps.value
@@ -337,7 +353,7 @@ function number(value: unknown): number | undefined {
           : number(checkedProps.segments)! > number(1)!)}`
       ],
     )"
-    v-prop-validity="{ contract: propValidityContract, values: { ...checkedProps } }"
+    v-prop-validity="{ contract: propValidityContract, values: { ...props } }"
     :data-label="reflectedProp('label', 'label', checkedProps.label, undefined, false)"
     :data-max="reflectedProp('max', 'max', checkedProps.max, undefined, false)"
     :data-segments="reflectedProp('segments', 'segments', checkedProps.segments, undefined, false)"

package/vue/UiNavItem.vue

@@ -1,4 +1,4 @@
-<!-- Generated by HTML Next 1.0.0-alpha.18 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.19 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import { computed, getCurrentInstance, useTemplateRef, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'
@@ -48,7 +48,7 @@ const propValidityContract = {
       description: 'Where a link opens, as on a native link. Only meaningful with as="a".',
     },
   },
-}
+} as const
 const props = defineProps({
   as: { type: null as unknown as PropType<'button' | 'a' | null>, default: 'button' },
   current: {
@@ -59,26 +59,48 @@ const props = defineProps({
   rel: { type: null as unknown as PropType<string | null>, default: null },
   target: { type: null as unknown as PropType<string | null>, default: null },
 })
+const acceptedProps: Record<string, unknown> = {
+  as: 'button',
+  current: 'false',
+  href: null,
+  rel: null,
+  target: null,
+}
 const checkedProps = computed(() => ({
   as: checkedProp<'button' | 'a'>(
     props['as'],
     { kind: 'terminal', name: 'keyword' },
     false,
     'as',
+    acceptedProps,
   ) as 'button' | 'a',
   current: checkedProp<'true' | 'false' | 'page' | 'step' | 'location'>(
     props['current'],
     { kind: 'terminal', name: 'keyword' },
     false,
     'current',
+    acceptedProps,
   ) as 'true' | 'false' | 'page' | 'step' | 'location',
-  href: checkedProp<string>(props['href'], { kind: 'terminal', name: 'string' }, false, 'href'),
-  rel: checkedProp<string>(props['rel'], { kind: 'terminal', name: 'string' }, false, 'rel'),
+  href: checkedProp<string>(
+    props['href'],
+    { kind: 'terminal', name: 'string' },
+    false,
+    'href',
+    acceptedProps,
+  ),
+  rel: checkedProp<string>(
+    props['rel'],
+    { kind: 'terminal', name: 'string' },
+    false,
+    'rel',
+    acceptedProps,
+  ),
   target: checkedProp<string>(
     props['target'],
     { kind: 'terminal', name: 'string' },
     false,
     'target',
+    acceptedProps,
   ),
 }))
 void checkedProps.value
@@ -181,7 +203,7 @@ function attribute(value: unknown): any {
         any
       >)[`${checkedProps.current ?? ''}`],
     )"
-    v-prop-validity="{ contract: propValidityContract, values: { ...checkedProps } }"
+    v-prop-validity="{ contract: propValidityContract, values: { ...props } }"
     :data-as="reflectedProp('as', 'as', checkedProps.as, undefined, false)"
     :data-current="reflectedProp('current', 'current', checkedProps.current, undefined, false)"
     :data-href="reflectedProp('href', 'href', checkedProps.href, undefined, false)"
@@ -216,7 +238,7 @@ function attribute(value: unknown): any {
         any
       >)[`${checkedProps.current ?? ''}`],
     )"
-    v-prop-validity="{ contract: propValidityContract, values: { ...checkedProps } }"
+    v-prop-validity="{ contract: propValidityContract, values: { ...props } }"
     :data-as="reflectedProp('as', 'as', checkedProps.as, undefined, false)"
     :data-current="reflectedProp('current', 'current', checkedProps.current, undefined, false)"
     :data-href="reflectedProp('href', 'href', checkedProps.href, undefined, false)"

package/vue/UiPageHeader.vue

@@ -1,4 +1,4 @@
-<!-- Generated by HTML Next 1.0.0-alpha.18 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.19 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import { computed, getCurrentInstance, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'
@@ -18,16 +18,18 @@ const propValidityContract = {
       default: 'start',
     },
   },
-}
+} as const
 const props = defineProps({
   align: { type: null as unknown as PropType<'start' | 'center' | null>, default: 'start' },
 })
+const acceptedProps: Record<string, unknown> = { align: 'start' }
 const checkedProps = computed(() => ({
   align: checkedProp<'start' | 'center'>(
     props['align'],
     { kind: 'terminal', name: 'keyword' },
     false,
     'align',
+    acceptedProps,
   ) as 'start' | 'center',
 }))
 void checkedProps.value
@@ -98,7 +100,7 @@ const hostState = computed(() =>
   <header
     data-component="ui-page-header"
     v-bind="nativeAttrs($attrs)"
-    v-prop-validity="{ contract: propValidityContract, values: { ...checkedProps } }"
+    v-prop-validity="{ contract: propValidityContract, values: { ...props } }"
     :data-align="reflectedProp('align', 'align', checkedProps.align, undefined, false)"
     :data-ui-page-header-state="hostState || undefined"
   >

package/vue/UiPopover.vue

@@ -1,9 +1,9 @@
-<!-- Generated by HTML Next 1.0.0-alpha.18 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.19 for Vue 3.5. Do not edit. -->
 <script setup lang="ts">
 import { computed, getCurrentInstance, provide, ref, watchSyncEffect } from 'vue'
 import type { PropType } from 'vue'
 import { createDispatch, useComponentHost } from './host'
-import { checkedProp, vPropValidity } from './props'
+import { checkedProp, propValidityState, vPropValidity } from './props'
 
 defineOptions({ inheritAttrs: false })
 
@@ -46,7 +46,7 @@ const propValidityContract = {
       default: 'bottom-start',
     },
   },
-}
+} as const
 const props = defineProps({
   for: { type: null as unknown as PropType<string | null>, default: '' },
   open: { type: null as unknown as PropType<boolean | null>, default: false },
@@ -69,18 +69,21 @@ const props = defineProps({
     default: 'bottom-start',
   },
 })
+const acceptedProps: Record<string, unknown> = { for: '', open: false, placement: 'bottom-start' }
 const checkedProps = computed(() => ({
   for: checkedProp<string>(
     props['for'],
     { kind: 'terminal', name: 'string' },
     false,
     'for',
+    acceptedProps,
   ) as string,
   open: checkedProp<boolean>(
     props['open'],
     { kind: 'terminal', name: 'boolean' },
     false,
     'open',
+    acceptedProps,
   ) as boolean,
   placement: checkedProp<
     | 'top'
@@ -95,7 +98,7 @@ const checkedProps = computed(() => ({
     | 'right'
     | 'right-start'
     | 'right-end'
-  >(props['placement'], { kind: 'terminal', name: 'keyword' }, false, 'placement') as
+  >(props['placement'], { kind: 'terminal', name: 'keyword' }, false, 'placement', acceptedProps) as
     | 'top'
     | 'top-start'
     | 'top-end'
@@ -222,6 +225,16 @@ useComponentHost(() => import('../components/ui-popover/ui-popover.js'), {
     definition: './components/ui-popover/ui-popover.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: ['for', 'open', 'placement'],
+  propValidity: (name: string) =>
+    propValidityState({ contract: propValidityContract, values: { ...props } }, name),
   state: { internalOpen },
 })
 </script>
@@ -230,7 +243,7 @@ useComponentHost(() => import('../components/ui-popover/ui-popover.js'), {
   <span
     data-component="ui-popover"
     v-bind="nativeAttrs($attrs)"
-    v-prop-validity="{ contract: propValidityContract, values: { ...checkedProps } }"
+    v-prop-validity="{ contract: propValidityContract, values: { ...props } }"
     :data-for="reflectedProp('for', 'for', checkedProps.for, undefined, false)"
     :data-open="reflectedProp('open', 'open', checkedProps.open, undefined, false)"
     :data-placement="reflectedProp('placement', 'placement', checkedProps.placement, undefined, false)"

package/vue/UiRadio.vue

@@ -1,10 +1,10 @@
-<!-- Generated by HTML Next 1.0.0-alpha.18 for Vue 3.5. Do not edit. -->
+<!-- Generated by HTML Next 1.0.0-alpha.19 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'
 import { vBindControl } from './control'
 import { createDispatch, useComponentHost } from './host'
-import { checkedProp, vPropValidity } from './props'
+import { checkedProp, propValidityState, vPropValidity } from './props'
 
 defineOptions({ inheritAttrs: false })
 
@@ -60,7 +60,7 @@ const propValidityContract = {
       default: 'on',
     },
   },
-}
+} 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 },
@@ -69,42 +69,56 @@ const props = defineProps({
   size: { type: null as unknown as PropType<'sm' | 'md' | 'lg' | null>, default: 'md' },
   value: { type: null as unknown as PropType<string | null>, default: 'on' },
 })
+const acceptedProps: Record<string, unknown> = {
+  checked: false,
+  disabled: false,
+  name: '',
+  required: false,
+  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,
 }))
 void checkedProps.value
@@ -209,6 +223,16 @@ useComponentHost(() => import('../components/ui-radio/ui-radio.js'), {
     definition: './components/ui-radio/ui-radio.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: ['checked', 'disabled', 'name', 'required', 'size', 'value'],
+  propValidity: (name: string) =>
+    propValidityState({ contract: propValidityContract, values: { ...props } }, name),
   refs: { input: inputElement, description: descriptionElement },
   state: { internalChecked },
 })
@@ -218,7 +242,7 @@ useComponentHost(() => import('../components/ui-radio/ui-radio.js'), {
   <label
     data-component="ui-radio"
     v-bind="nativeAttrs($attrs)"
-    v-prop-validity="{ contract: propValidityContract, values: { ...checkedProps } }"
+    v-prop-validity="{ contract: propValidityContract, values: { ...props } }"
     :data-checked="reflectedProp('checked', 'checked', checkedProps.checked, undefined, false)"
     :data-disabled="reflectedProp('disabled', 'disabled', checkedProps.disabled, undefined, false)"
     :data-name="reflectedProp('name', 'name', checkedProps.name, undefined, false)"