Merge 7f1a4d54a8 into 3eaef4a748

apps/www/src/lib/registry/default/ui/auto-form/AutoFormFieldBoolean.vue

@@ -5,7 +5,7 @@ import { FormControl, FormDescription, FormField, FormItem, FormMessage } from '
 import { Switch } from '@/lib/registry/default/ui/switch'
 import { computed } from 'vue'
 import AutoFormLabel from './AutoFormLabel.vue'
-import { beautifyObjectName } from './utils'
+import { beautifyObjectName, maybeBooleanishToBoolean } from './utils'
 
 const props = defineProps<FieldProps>()
 
@@ -21,7 +21,7 @@ const booleanComponent = computed(() => props.config?.component === 'switch' ? S
             <component
               :is="booleanComponent"
               v-bind="{ ...slotProps.componentField }"
-              :disabled="disabled"
+              :disabled="maybeBooleanishToBoolean(config?.inputProps?.disabled) ?? disabled"
               :checked="slotProps.componentField.modelValue"
               @update:checked="slotProps.componentField['onUpdate:modelValue']"
             />

apps/www/src/lib/registry/default/ui/auto-form/AutoFormFieldDate.vue

@@ -9,7 +9,7 @@ import { cn } from '@/lib/utils'
 import { DateFormatter, getLocalTimeZone } from '@internationalized/date'
 import { CalendarIcon } from 'lucide-vue-next'
 import AutoFormLabel from './AutoFormLabel.vue'
-import { beautifyObjectName } from './utils'
+import { beautifyObjectName, maybeBooleanishToBoolean } from './utils'
 
 defineProps<FieldProps>()
 
@@ -28,7 +28,7 @@ const df = new DateFormatter('en-US', {
         <slot v-bind="slotProps">
           <div>
             <Popover>
-              <PopoverTrigger as-child :disabled="disabled">
+              <PopoverTrigger as-child :disabled="maybeBooleanishToBoolean(config?.inputProps?.disabled) ?? disabled">
                 <Button
                   variant="outline"
                   :class="cn(

apps/www/src/lib/registry/default/ui/auto-form/AutoFormFieldEnum.vue

@@ -5,7 +5,7 @@ import { Label } from '@/lib/registry/default/ui/label'
 import { RadioGroup, RadioGroupItem } from '@/lib/registry/default/ui/radio-group'
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/lib/registry/default/ui/select'
 import AutoFormLabel from './AutoFormLabel.vue'
-import { beautifyObjectName } from './utils'
+import { beautifyObjectName, maybeBooleanishToBoolean } from './utils'
 
 defineProps<FieldProps & {
   options?: string[]
@@ -20,14 +20,14 @@ defineProps<FieldProps & {
       </AutoFormLabel>
       <FormControl>
         <slot v-bind="slotProps">
-          <RadioGroup v-if="config?.component === 'radio'" :disabled="disabled" :orientation="'vertical'" v-bind="{ ...slotProps.componentField }">
+          <RadioGroup v-if="config?.component === 'radio'" :disabled="maybeBooleanishToBoolean(config?.inputProps?.disabled) ?? disabled" :orientation="'vertical'" v-bind="{ ...slotProps.componentField }">
             <div v-for="(option, index) in options" :key="option" class="mb-2 flex items-center gap-3 space-y-0">
               <RadioGroupItem :id="`${option}-${index}`" :value="option" />
               <Label :for="`${option}-${index}`">{{ beautifyObjectName(option) }}</Label>
             </div>
           </RadioGroup>
 
-          <Select v-else :disabled="disabled" v-bind="{ ...slotProps.componentField }">
+          <Select v-else :disabled="maybeBooleanishToBoolean(config?.inputProps?.disabled) ?? disabled" v-bind="{ ...slotProps.componentField }">
             <SelectTrigger class="w-full">
               <SelectValue :placeholder="config?.inputProps?.placeholder" />
             </SelectTrigger>

apps/www/src/lib/registry/default/ui/auto-form/AutoFormFieldFile.vue

@@ -39,7 +39,7 @@ async function parseFileAsString(file: File | undefined): Promise<string> {
             v-if="!inputFile"
             type="file"
             v-bind="{ ...config?.inputProps }"
-            :disabled="disabled"
+            :disabled="config?.inputProps?.disabled ?? disabled"
             @change="async (ev: InputEvent) => {
               const file = (ev.target as HTMLInputElement).files?.[0]
               inputFile = file

apps/www/src/lib/registry/default/ui/auto-form/AutoFormFieldInput.vue

@@ -23,7 +23,7 @@ const inputComponent = computed(() => props.config?.component === 'textarea' ? T
             :is="inputComponent"
             type="text"
             v-bind="{ ...slotProps.componentField, ...config?.inputProps }"
-            :disabled="disabled"
+            :disabled="config?.inputProps?.disabled ?? disabled"
           />
         </slot>
       </FormControl>

apps/www/src/lib/registry/default/ui/auto-form/AutoFormFieldNumber.vue

@@ -20,7 +20,7 @@ defineProps<FieldProps>()
       </AutoFormLabel>
       <FormControl>
         <slot v-bind="slotProps">
-          <Input type="number" v-bind="{ ...slotProps.componentField, ...config?.inputProps }" :disabled="disabled" />
+          <Input type="number" v-bind="{ ...slotProps.componentField, ...config?.inputProps }" :disabled="config?.inputProps?.disabled ?? disabled" />
         </slot>
       </FormControl>
       <FormDescription v-if="config?.description">

apps/www/src/lib/registry/default/ui/auto-form/utils.ts

@@ -169,3 +169,20 @@ export function getFromPath<TValue = unknown, TFallback = TValue>(
 
   return resolvedValue as TValue | undefined
 }
+
+type Booleanish = boolean | 'true' | 'false'
+
+export function booleanishToBoolean(value: Booleanish) {
+  switch (value) {
+    case 'true':
+    case true:
+      return true
+    case 'false':
+    case false:
+      return false
+  }
+}
+
+export function maybeBooleanishToBoolean(value?: Booleanish) {
+  return value ? booleanishToBoolean(value) : undefined
+}

apps/www/src/lib/registry/new-york/ui/auto-form/AutoFormFieldBoolean.vue

@@ -5,7 +5,7 @@ import { FormControl, FormDescription, FormField, FormItem, FormMessage } from '
 import { Switch } from '@/lib/registry/new-york/ui/switch'
 import { computed } from 'vue'
 import AutoFormLabel from './AutoFormLabel.vue'
-import { beautifyObjectName } from './utils'
+import { beautifyObjectName, maybeBooleanishToBoolean } from './utils'
 
 const props = defineProps<FieldProps>()
 
@@ -21,7 +21,7 @@ const booleanComponent = computed(() => props.config?.component === 'switch' ? S
             <component
               :is="booleanComponent"
               v-bind="{ ...slotProps.componentField }"
-              :disabled="disabled"
+              :disabled="maybeBooleanishToBoolean(config?.inputProps?.disabled) ?? disabled"
               :checked="slotProps.componentField.modelValue"
               @update:checked="slotProps.componentField['onUpdate:modelValue']"
             />

apps/www/src/lib/registry/new-york/ui/auto-form/AutoFormFieldDate.vue

@@ -9,7 +9,7 @@ import { cn } from '@/lib/utils'
 import { DateFormatter, getLocalTimeZone } from '@internationalized/date'
 import { CalendarIcon } from '@radix-icons/vue'
 import AutoFormLabel from './AutoFormLabel.vue'
-import { beautifyObjectName } from './utils'
+import { beautifyObjectName, maybeBooleanishToBoolean } from './utils'
 
 defineProps<FieldProps>()
 
@@ -28,7 +28,7 @@ const df = new DateFormatter('en-US', {
         <slot v-bind="slotProps">
           <div>
             <Popover>
-              <PopoverTrigger as-child :disabled="disabled">
+              <PopoverTrigger as-child :disabled="maybeBooleanishToBoolean(config?.inputProps?.disabled) ?? disabled">
                 <Button
                   variant="outline"
                   :class="cn(

apps/www/src/lib/registry/new-york/ui/auto-form/AutoFormFieldEnum.vue

@@ -5,7 +5,7 @@ import { Label } from '@/lib/registry/new-york/ui/label'
 import { RadioGroup, RadioGroupItem } from '@/lib/registry/new-york/ui/radio-group'
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/lib/registry/new-york/ui/select'
 import AutoFormLabel from './AutoFormLabel.vue'
-import { beautifyObjectName } from './utils'
+import { beautifyObjectName, maybeBooleanishToBoolean } from './utils'
 
 defineProps<FieldProps & {
   options?: string[]
@@ -20,14 +20,14 @@ defineProps<FieldProps & {
       </AutoFormLabel>
       <FormControl>
         <slot v-bind="slotProps">
-          <RadioGroup v-if="config?.component === 'radio'" :disabled="disabled" :orientation="'vertical'" v-bind="{ ...slotProps.componentField }">
+          <RadioGroup v-if="config?.component === 'radio'" :disabled="maybeBooleanishToBoolean(config?.inputProps?.disabled) ?? disabled" :orientation="'vertical'" v-bind="{ ...slotProps.componentField }">
             <div v-for="(option, index) in options" :key="option" class="mb-2 flex items-center gap-3 space-y-0">
               <RadioGroupItem :id="`${option}-${index}`" :value="option" />
               <Label :for="`${option}-${index}`">{{ beautifyObjectName(option) }}</Label>
             </div>
           </RadioGroup>
 
-          <Select v-else :disabled="disabled" v-bind="{ ...slotProps.componentField }">
+          <Select v-else :disabled="maybeBooleanishToBoolean(config?.inputProps?.disabled) ?? disabled" v-bind="{ ...slotProps.componentField }">
             <SelectTrigger class="w-full">
               <SelectValue :placeholder="config?.inputProps?.placeholder" />
             </SelectTrigger>

apps/www/src/lib/registry/new-york/ui/auto-form/AutoFormFieldFile.vue

@@ -39,7 +39,7 @@ async function parseFileAsString(file: File | undefined): Promise<string> {
             v-if="!inputFile"
             type="file"
             v-bind="{ ...config?.inputProps }"
-            :disabled="disabled"
+            :disabled="config?.inputProps?.disabled ?? disabled"
             @change="async (ev: InputEvent) => {
               const file = (ev.target as HTMLInputElement).files?.[0]
               inputFile = file

apps/www/src/lib/registry/new-york/ui/auto-form/AutoFormFieldInput.vue

@@ -23,7 +23,7 @@ const inputComponent = computed(() => props.config?.component === 'textarea' ? T
             :is="inputComponent"
             type="text"
             v-bind="{ ...slotProps.componentField, ...config?.inputProps }"
-            :disabled="disabled"
+            :disabled="config?.inputProps?.disabled ?? disabled"
           />
         </slot>
       </FormControl>

apps/www/src/lib/registry/new-york/ui/auto-form/AutoFormFieldNumber.vue

@@ -20,7 +20,7 @@ defineProps<FieldProps>()
       </AutoFormLabel>
       <FormControl>
         <slot v-bind="slotProps">
-          <Input type="number" v-bind="{ ...slotProps.componentField, ...config?.inputProps }" :disabled="disabled" />
+          <Input type="number" v-bind="{ ...slotProps.componentField, ...config?.inputProps }" :disabled="config?.inputProps?.disabled ?? disabled" />
         </slot>
       </FormControl>
       <FormDescription v-if="config?.description">

apps/www/src/lib/registry/new-york/ui/auto-form/utils.ts

@@ -169,3 +169,20 @@ export function getFromPath<TValue = unknown, TFallback = TValue>(
 
   return resolvedValue as TValue | undefined
 }
+
+type Booleanish = boolean | 'true' | 'false'
+
+export function booleanishToBoolean(value: Booleanish) {
+  switch (value) {
+    case 'true':
+    case true:
+      return true
+    case 'false':
+    case false:
+      return false
+  }
+}
+
+export function maybeBooleanishToBoolean(value?: Booleanish) {
+  return value ? booleanishToBoolean(value) : undefined
+}