@betterstart/cli 0.1.45 → 0.1.47

package/dist/cli.js

@@ -2355,10 +2355,10 @@ function generateFieldJSX(field) {
     case "radio":
       if (field.options && field.options.length > 0) {
         const radioItems = field.options.map(
-          (opt) => `                    <label htmlFor="${name}-${opt.value}" className="flex items-center space-x-2 text-sm font-medium leading-none">
+          (opt) => `                    <FormLabel htmlFor="${name}-${opt.value}" className="flex items-center space-x-2 text-sm font-medium leading-none">
                       <RadioGroupItem value="${opt.value}" id="${name}-${opt.value}" />
                       <span>${escapeJsx(opt.label)}</span>
-                    </label>`
+                    </FormLabel>`
         ).join("\n");
         return `        <FormField
           control={form.control}
@@ -2437,7 +2437,7 @@ ${optionItems}
       return generateTextFieldJSX(name, label, placeholder || "+1 (555) 000-0000", hintJSX, requiredStar, "tel");
     case "file":
     case "upload":
-      return generateTextFieldJSX(name, label, placeholder, hintJSX, requiredStar, "file");
+      return generateFileUploadFieldJSX(field, name, label, hintJSX, requiredStar);
     case "list":
       return generateListFieldJSX(field, name, label, hintPlainJSX, requiredStar);
     default:
@@ -2459,6 +2459,30 @@ function generateTextFieldJSX(name, label, placeholder, hintJSX, requiredStar, i
           )}
         />`;
 }
+function generateFileUploadFieldJSX(field, name, label, hintJSX, requiredStar) {
+  const accept = field.accept || "*/*";
+  const maxSize = field.maxFileSize || 10;
+  return `        <FormField
+          control={form.control}
+          name="${name}"
+          render={({ field }) => (
+            <FormItem>
+              <FormLabel>${label}${requiredStar}</FormLabel>
+              <FormControl>
+                <MediaUploadField
+                  value={field.value}
+                  onChange={field.onChange}
+                  onBlur={field.onBlur}
+                  accept="${accept}"
+                  maxSizeInMB={${maxSize}}
+                  label=""
+                />
+              </FormControl>${hintJSX}
+              <FormMessage />
+            </FormItem>
+          )}
+        />`;
+}
 function generateListFieldJSX(field, name, label, hintJSX, requiredStar) {
   if (!field.fields || field.fields.length === 0) {
     return generateTextFieldJSX(name, label, field.placeholder || "", hintJSX, requiredStar, "text");
@@ -2513,7 +2537,7 @@ ${selectItems}
     return `${nf.name}: ''`;
   }).join(", ");
   return `        <div className="space-y-4">
-          <label className="text-sm font-medium leading-none">${label}${requiredStar}</label>${hintJSX}
+          <FormLabel className="text-sm font-medium leading-none">${label}${requiredStar}</FormLabel>${hintJSX}
           {${name}FieldArray.fields.map((item, index) => (
             <div key={item.id} className="flex items-end gap-2 rounded-lg border p-4">
               <div className="flex-1 space-y-4">
@@ -2569,6 +2593,7 @@ ${fieldsJSX}
   const submitText = schema.submitButtonText || "Submit";
   const successMessage = escapeJsx(schema.successMessage || "Form submitted successfully!");
   const hasRadio = allFields.some((f) => f.type === "radio");
+  const hasFileUpload = allFields.some((f) => f.type === "file" || f.type === "upload");
   const buttonImport = resolveUiImport(cwd, "button");
   const formImport = resolveUiImport(cwd, "form");
   const inputImport = resolveUiImport(cwd, "input");
@@ -2576,11 +2601,13 @@ ${fieldsJSX}
   const selectImport = resolveUiImport(cwd, "select");
   const radioGroupImport = resolveUiImport(cwd, "radio-group");
   const progressImport = resolveUiImport(cwd, "progress");
+  const mediaUploadImport = resolveUiImport(cwd, "media-upload-field");
   const content = buildComponentSource({
     pascal,
     kebab,
     rhfImport,
     hasRadio,
+    hasFileUpload,
     buttonImport,
     formImport,
     inputImport,
@@ -2588,6 +2615,7 @@ ${fieldsJSX}
     selectImport,
     radioGroupImport,
     progressImport,
+    mediaUploadImport,
     zodFields,
     defaults,
     stepsConst,
@@ -2633,7 +2661,8 @@ import {
   FormLabel,
   FormMessage,
 } from '${p7.formImport}'
-import { Input } from '${p7.inputImport}'
+import { Input } from '${p7.inputImport}'${p7.hasFileUpload ? `
+import { MediaUploadField } from '${p7.mediaUploadImport}'` : ""}
 import { Progress } from '${p7.progressImport}'${p7.hasRadio ? `
 import { RadioGroup, RadioGroupItem } from '${p7.radioGroupImport}'` : ""}
 import { Textarea } from '${p7.textareaImport}'
@@ -2831,12 +2860,14 @@ function generateSingleStepForm(schema, cwd, cmsDir, options) {
 ${buildFieldArrayDecls(listFields)}
 ` : "";
   const hasRadio = fields.some((f) => f.type === "radio");
+  const hasFileUpload = fields.some((f) => f.type === "file" || f.type === "upload");
   const buttonImport = resolveUiImport(cwd, "button");
   const formImport = resolveUiImport(cwd, "form");
   const inputImport = resolveUiImport(cwd, "input");
   const textareaImport = resolveUiImport(cwd, "textarea");
   const selectImport = resolveUiImport(cwd, "select");
   const radioGroupImport = resolveUiImport(cwd, "radio-group");
+  const mediaUploadImport = resolveUiImport(cwd, "media-upload-field");
   const content = `'use client'
 
 import { zodResolver } from '@hookform/resolvers/zod'
@@ -2854,7 +2885,8 @@ import {
   FormLabel,
   FormMessage,
 } from '${formImport}'
-import { Input } from '${inputImport}'${hasRadio ? `
+import { Input } from '${inputImport}'${hasFileUpload ? `
+import { MediaUploadField } from '${mediaUploadImport}'` : ""}${hasRadio ? `
 import { RadioGroup, RadioGroupItem } from '${radioGroupImport}'` : ""}
 import { Textarea } from '${textareaImport}'
 import {