betterstart-cli 0.0.16 → 0.0.18

package/dist/cli.js

@@ -125,7 +125,7 @@ function createUninstallCommand(runtime) {
   return new Command("uninstall").description("Remove all Admin files and undo modifications made by betterstart init").option("-f, --force", "Skip all confirmation prompts", false).option("--cwd <path>", "Project root path").action((options) => runtime.runUninstall(options));
 }
 function createUpdateCommand(runtime) {
-  return new Command("update").alias("update-component").description("Update Admin components from the latest CLI templates").argument("[components...]", "Component names to update (e.g., media-gallery-field button)").option("--list", "List all available components").option("--all", "Update all components").option("--shadcn-preset <preset>", "Apply a shadcn preset to Admin UI components").option("--only <parts>", "Apply only supported shadcn preset parts: theme").option("--cwd <path>", "Project root path").action(
+  return new Command("update").alias("update-component").description("Update Admin components from the latest CLI templates").argument("[components...]", "Component names to update (e.g., media-field button)").option("--list", "List all available components").option("--all", "Update all components").option("--shadcn-preset <preset>", "Apply a shadcn preset to Admin UI components").option("--only <parts>", "Apply only supported shadcn preset parts: theme").option("--cwd <path>", "Project root path").action(
     (components, options) => runtime.runUpdate(components, options)
   );
 }
@@ -867,9 +867,27 @@ var blogPlugin = {
   configure: "none"
 };
 
+// adapters/next/plugins/portfolio/plugin.ts
+var portfolioPlugin = {
+  id: "portfolio",
+  title: "Portfolio",
+  description: "Portfolio content module",
+  kind: "content",
+  version: "1.0.0",
+  dependencies: [],
+  conflicts: [],
+  schemaFiles: ["portfolio.json"],
+  files: [],
+  packageDependencies: [],
+  devDependencies: [],
+  envSections: [],
+  configure: "none"
+};
+
 // adapters/next/plugin-registry.ts
 var pluginRegistry = {
-  blog: blogPlugin
+  blog: blogPlugin,
+  portfolio: portfolioPlugin
 };
 function listPluginDefinitions() {
   return Object.values(pluginRegistry);
@@ -895,6 +913,7 @@ var REACT_ADMIN_DEPS = [
   "@codemirror/lang-javascript",
   "@codemirror/lang-json",
   "@codemirror/lang-markdown",
+  "@codemirror/state",
   "@codemirror/view",
   "@dnd-kit/core",
   "@dnd-kit/sortable",
@@ -965,6 +984,18 @@ var REACT_ADMIN_DEV_DEPS = ["@tailwindcss/typography"];
 // adapters/next/init/scaffolders/dependencies.ts
 var CLI_PACKAGE_NAME = "betterstart-cli";
 var LOCAL_PACKAGE_PREFIXES = ["workspace:", "link:", "file:", "portal:"];
+var TIPTAP_PACKAGE_PREFIX = "@tiptap/";
+var TIPTAP_PACKAGE_VERSION_SPEC = "^3.26.0";
+var CODEMIRROR_PACKAGE_SPECS = {
+  "@codemirror/commands": "^6.10.3",
+  "@codemirror/lang-javascript": "^6.2.5",
+  "@codemirror/lang-json": "^6.0.2",
+  "@codemirror/lang-markdown": "^6.5.0",
+  "@codemirror/state": "^6.6.0",
+  "@codemirror/view": "^6.43.0",
+  "@uiw/codemirror-theme-github": "^4.25.10",
+  "@uiw/react-codemirror": "^4.25.10"
+};
 var requireFromCli = createRequire(import.meta.url);
 var PNPM_PACKAGE_EXTENSION_DEFINITIONS = [
   {
@@ -1059,6 +1090,70 @@ function hasDeclaredPackage(pkg, name) {
   if (!pkg) return false;
   return Object.hasOwn(pkg.dependencies ?? {}, name) || Object.hasOwn(pkg.devDependencies ?? {}, name) || Object.hasOwn(pkg.optionalDependencies ?? {}, name);
 }
+function getDeclaredRuntimePackageNames(pkg) {
+  if (!pkg) return [];
+  return Object.keys({
+    ...pkg.dependencies ?? {},
+    ...pkg.optionalDependencies ?? {}
+  });
+}
+function getDeclaredDevPackageNames(pkg) {
+  if (!pkg) return [];
+  return Object.keys(pkg.devDependencies ?? {}).filter(
+    (name) => !Object.hasOwn(pkg.dependencies ?? {}, name)
+  );
+}
+function isTiptapPackageName(name) {
+  return name.startsWith(TIPTAP_PACKAGE_PREFIX);
+}
+function getAlignedPackageSpec(name) {
+  if (isTiptapPackageName(name)) {
+    return `${name}@${TIPTAP_PACKAGE_VERSION_SPEC}`;
+  }
+  const versionSpec = CODEMIRROR_PACKAGE_SPECS[name];
+  return versionSpec ? `${name}@${versionSpec}` : null;
+}
+function hasAlignedPackageSpec(spec) {
+  return getAlignedPackageSpec(packageNameFromSpec(spec)) !== null;
+}
+function alignDependencySpecs(dependencies) {
+  return dependencies.map((dependency) => {
+    const name = packageNameFromSpec(dependency);
+    return getAlignedPackageSpec(name) ?? dependency;
+  });
+}
+function getAlignedDeclaredDependencies(packageNames) {
+  return packageNames.flatMap((name) => {
+    const alignedSpec = getAlignedPackageSpec(name);
+    return alignedSpec ? [alignedSpec] : [];
+  });
+}
+function resolveDependencyInstallPlan(options) {
+  const pkg = readProjectPackageJson(options.cwd);
+  const dependencies = alignDependencySpecs(options.dependencies);
+  const devDependencies = alignDependencySpecs(options.devDependencies);
+  const needsPackageAlignment = [...options.dependencies, ...options.devDependencies].some(
+    hasAlignedPackageSpec
+  );
+  if (!needsPackageAlignment) {
+    return {
+      ...options,
+      dependencies: unique(dependencies),
+      devDependencies: unique(devDependencies)
+    };
+  }
+  return {
+    ...options,
+    dependencies: unique([
+      ...dependencies,
+      ...getAlignedDeclaredDependencies(getDeclaredRuntimePackageNames(pkg))
+    ]),
+    devDependencies: unique([
+      ...devDependencies,
+      ...getAlignedDeclaredDependencies(getDeclaredDevPackageNames(pkg))
+    ])
+  };
+}
 function canResolveFromProject(cwd, name) {
   try {
     requireFromCli.resolve(name, { paths: [cwd] });
@@ -1198,21 +1293,27 @@ async function installDependenciesAsync({
   dependencies,
   devDependencies
 }) {
+  const installPlan = resolveDependencyInstallPlan({ cwd, pm, dependencies, devDependencies });
   try {
     if (pm === "pnpm") {
-      ensurePnpmPackageExtensions(cwd, dependencies);
+      ensurePnpmPackageExtensions(cwd, installPlan.dependencies);
     }
-    if (dependencies.length > 0) {
-      await spawnAsync(pm, buildAddArgs(pm, dependencies, false), cwd);
+    if (installPlan.dependencies.length > 0) {
+      await spawnAsync(pm, buildAddArgs(pm, installPlan.dependencies, false), cwd);
     }
-    if (devDependencies.length > 0) {
-      await spawnAsync(pm, buildAddArgs(pm, devDependencies, true), cwd);
+    if (installPlan.devDependencies.length > 0) {
+      await spawnAsync(pm, buildAddArgs(pm, installPlan.devDependencies, true), cwd);
     }
-    return { dependencies, devDeps: devDependencies, success: true, error: null };
+    return {
+      dependencies: installPlan.dependencies,
+      devDeps: installPlan.devDependencies,
+      success: true,
+      error: null
+    };
   } catch (err) {
     return {
-      dependencies,
-      devDeps: devDependencies,
+      dependencies: installPlan.dependencies,
+      devDeps: installPlan.devDependencies,
       success: false,
       error: err instanceof Error ? err.message : "Install failed"
     };
@@ -1641,6 +1742,7 @@ import path11 from "path";
 // core-engine/schema/constants.ts
 var FIELD_TYPES = {
   STRING: "string",
+  EMAIL: "email",
   NUMBER: "number",
   BOOLEAN: "boolean",
   TEXT: "text",
@@ -1713,6 +1815,18 @@ var FORM_FIELD_TYPES = {
   LIST: "list",
   DYNAMIC_FIELDS: "dynamicFields"
 };
+var AUTO_FIELDS = {
+  ID: "id",
+  CREATED_AT: "createdAt",
+  UPDATED_AT: "updatedAt",
+  PUBLISHED: "published",
+  SLUG: "slug"
+};
+var FORM_SUBMISSION_FIELDS = {
+  SUBMITTED_AT: "submittedAt",
+  IP_ADDRESS: "ipAddress",
+  USER_AGENT: "userAgent"
+};
 function isFieldType(value) {
   return Object.values(FIELD_TYPES).includes(value);
 }
@@ -1873,6 +1987,11 @@ function loadSchema(schemasDir, name) {
   const parsed = parseJson(content, filePath);
   const obj = parsed;
   const type = obj.type;
+  if (type === void 0) {
+    throw new Error(
+      `Schema "${name}" is missing required top-level "type". Expected "entity", "single", or "form".`
+    );
+  }
   if (type === "form") {
     return { type: "form", schema: parsed, filePath };
   }
@@ -1913,6 +2032,14 @@ var ENTITY_SLUG_FIELD_NAME = "slug";
 var ENTITY_SLUG_FIELD_TYPES = /* @__PURE__ */ new Set(["string", "varchar", "text"]);
 var GENERATED_SCHEMA_TITLE_FIELD_TYPES = /* @__PURE__ */ new Set(["string", "varchar", "text"]);
 var FORM_SCHEMA_TITLE_FIELD_TYPES = /* @__PURE__ */ new Set(["text"]);
+var FORM_SUBMISSION_COLUMN_NAMES = [
+  AUTO_FIELDS.ID,
+  FORM_SUBMISSION_FIELDS.SUBMITTED_AT,
+  FORM_SUBMISSION_FIELDS.IP_ADDRESS,
+  FORM_SUBMISSION_FIELDS.USER_AGENT,
+  AUTO_FIELDS.CREATED_AT,
+  AUTO_FIELDS.UPDATED_AT
+];
 function isEntitySlugField(field) {
   return field.name === ENTITY_SLUG_FIELD_NAME;
 }
@@ -1956,52 +2083,84 @@ function createGeneratedSlugField(fields) {
     ...sourceField ? { defaultValueFrom: sourceField } : {}
   };
 }
-function normalizeEntitySlugFields(fields, sourceField) {
-  let hasSlugField = false;
-  const normalizedFields = fields.map((field) => {
+function normalizeEntitySlugField(field, sourceField) {
+  return {
+    ...field,
+    required: true,
+    ...sourceField && !field.hidden ? { defaultValueFrom: sourceField } : {}
+  };
+}
+function createGeneratedSlugFieldForTitle(fields, titleField) {
+  const slugField = createGeneratedSlugField(fields);
+  return titleField.slot ? { ...slugField, slot: titleField.slot } : slugField;
+}
+function orderEntityIdentityFields(fields) {
+  const titleIndex = fields.findIndex(isGeneratedSchemaTitleField);
+  const slugIndex = fields.findIndex(isEntitySlugField);
+  if (titleIndex < 0 || slugIndex < 0 || titleIndex === 0 && slugIndex === 1) return fields;
+  const titleField = fields[titleIndex];
+  const slugField = fields[slugIndex];
+  return [
+    titleField,
+    slugField,
+    ...fields.filter((_, index) => index !== titleIndex && index !== slugIndex)
+  ];
+}
+function normalizeEntityIdentityFields(fields, rootFields, state) {
+  const normalizedFields = [];
+  for (const field of fields) {
     if (isEntitySlugField(field)) {
-      hasSlugField = true;
-      return {
-        ...field,
-        required: true,
-        ...sourceField && !field.hidden ? { defaultValueFrom: sourceField } : {}
-      };
+      if (state.keptAuthoredSlugField) continue;
+      state.keptAuthoredSlugField = true;
+      normalizedFields.push(normalizeEntitySlugField(field, state.sourceField));
+      continue;
     }
     if ((field.type === "group" || field.type === "section") && field.fields) {
-      const nested = normalizeEntitySlugFields(field.fields, sourceField);
-      hasSlugField ||= nested.hasSlugField;
-      return { ...field, fields: nested.fields };
+      normalizedFields.push({
+        ...field,
+        fields: normalizeEntityIdentityFields(field.fields, rootFields, state)
+      });
+      continue;
     }
     if (field.type === "tabs" && field.tabs) {
-      const tabs = field.tabs.map((tab) => {
-        const nested = normalizeEntitySlugFields(tab.fields ?? [], sourceField);
-        hasSlugField ||= nested.hasSlugField;
-        return { ...tab, fields: nested.fields };
+      normalizedFields.push({
+        ...field,
+        tabs: field.tabs.map((tab) => ({
+          ...tab,
+          fields: normalizeEntityIdentityFields(tab.fields ?? [], rootFields, state)
+        }))
       });
-      return { ...field, tabs };
+      continue;
     }
-    return field;
-  });
-  return { fields: normalizedFields, hasSlugField };
+    normalizedFields.push(field);
+    if (!state.hasAuthoredSlugField && !state.generatedSlugInserted && isGeneratedSchemaTitleField(field)) {
+      normalizedFields.push(createGeneratedSlugFieldForTitle(rootFields, field));
+      state.generatedSlugInserted = true;
+    }
+  }
+  return orderEntityIdentityFields(normalizedFields);
 }
 function ensureEntitySlugField(schema) {
   const sourceField = hasPersistedTitleField(schema.fields) ? "title" : void 0;
-  const normalized = normalizeEntitySlugFields(schema.fields, sourceField);
-  if (normalized.hasSlugField) {
+  const hasAuthoredSlugField = flattenFields(schema.fields).some(isEntitySlugField);
+  const state = {
+    sourceField,
+    hasAuthoredSlugField,
+    keptAuthoredSlugField: false,
+    generatedSlugInserted: false
+  };
+  const normalizedFields = normalizeEntityIdentityFields(schema.fields, schema.fields, state);
+  if (hasAuthoredSlugField || state.generatedSlugInserted) {
     return {
       ...schema,
-      fields: normalized.fields
+      fields: normalizedFields
     };
   }
-  const slugField = createGeneratedSlugField(schema.fields);
-  const titleIndex = schema.fields.findIndex(
-    (field) => field.name === GENERATED_SCHEMA_TITLE_FIELD_NAME && isStringLikeSlugField(field)
-  );
-  const insertIndex = titleIndex >= 0 ? titleIndex + 1 : Math.min(schema.fields.length, 1);
+  const insertIndex = Math.min(normalizedFields.length, 1);
   const fields = [
-    ...schema.fields.slice(0, insertIndex),
-    slugField,
-    ...schema.fields.slice(insertIndex)
+    ...normalizedFields.slice(0, insertIndex),
+    createGeneratedSlugField(schema.fields),
+    ...normalizedFields.slice(insertIndex)
   ];
   return {
     ...schema,
@@ -2115,6 +2274,23 @@ function collectInvalidFormColumnTypeErrors(schema, errors) {
     }
   }
 }
+function collectInvalidFormColumnReferenceErrors(schema, errors) {
+  const fieldNames = new Set(
+    getAllFormSchemaFields(schema).map((field) => field.name).filter((name) => typeof name === "string" && name.length > 0)
+  );
+  for (const columnName of FORM_SUBMISSION_COLUMN_NAMES) {
+    fieldNames.add(columnName);
+  }
+  for (const column of schema.columns || []) {
+    if (!column.accessorKey || !column.header) {
+      errors.push(`Form column is missing required properties: ${JSON.stringify(column)}`);
+    } else if (!fieldNames.has(column.accessorKey)) {
+      errors.push(
+        `Form column accessorKey "${column.accessorKey}" does not match any field or generated submission property. Available: ${Array.from(fieldNames).join(", ")}`
+      );
+    }
+  }
+}
 function validateEntitySchema(schema) {
   const errors = [];
   collectSchemaSlotLayoutErrors(schema, errors);
@@ -2134,6 +2310,9 @@ function validateEntitySchema(schema) {
   if (!Array.isArray(normalizedSchema.fields) || normalizedSchema.fields.length === 0) {
     errors.push('Schema must have at least one field via "fields" or "slot"');
   }
+  if (normalizedSchema.type !== "entity") {
+    errors.push('Entity schema must have `type: "entity"`');
+  }
   if (!Array.isArray(normalizedSchema.columns) || normalizedSchema.columns.length === 0) {
     errors.push("Schema must have at least one column");
   }
@@ -2196,6 +2375,9 @@ function validateSingleSchema(schema) {
   if (!Array.isArray(normalizedSchema.fields) || normalizedSchema.fields.length === 0) {
     errors.push('Schema must have at least one field via "fields" or "slot"');
   }
+  if (normalizedSchema.type !== "single") {
+    errors.push('Single schema must have `type: "single"`');
+  }
   for (const field of normalizedSchema.fields || []) {
     if (field.type === "separator") continue;
     if (!field.name || !field.type) {
@@ -2255,6 +2437,7 @@ function validateFormSchema(schema) {
   }
   collectMissingFormSchemaTitleErrors(schema, errors);
   collectInvalidFormColumnTypeErrors(schema, errors);
+  collectInvalidFormColumnReferenceErrors(schema, errors);
   return errors;
 }
 function validateLoadedSchema(loaded) {
@@ -3632,6 +3815,7 @@ function toDrizzleType(field, requiredImports) {
       requiredImports.add("uuid");
       return "uuid().defaultRandom()";
     case "string":
+    case "email":
     case "varchar":
       requiredImports.add("varchar");
       return field.length ? `varchar({ length: ${field.length} })` : `varchar({ length: ${DRIZZLE_DEFAULTS.VARCHAR_LENGTH} })`;
@@ -3788,6 +3972,7 @@ function toTypeScriptType(field, mode = "output") {
     case "boolean":
       return "boolean";
     case "string":
+    case "email":
     case "varchar":
     case "text":
     case "markdown":
@@ -3962,7 +4147,7 @@ function generateFieldMapping(field, source = "input") {
   if ((field.type === "date" || field.type === "timestamp" || field.type === "time") && !field.required) {
     return `${source}.${field.name} && ${source}.${field.name} !== '' ? ${source}.${field.name} : null`;
   }
-  if (!field.required && ["string", "varchar", "text", "select"].includes(field.type)) {
+  if (!field.required && ["string", "email", "varchar", "text", "select"].includes(field.type)) {
     return `${source}.${field.name} && ${source}.${field.name} !== '' ? ${source}.${field.name} : null`;
   }
   return `${source}.${field.name}`;
@@ -4228,6 +4413,7 @@ ${blocks.join("\n\n")}
 // adapters/next/generators/entity-filters.ts
 var FILTERABLE_FIELD_TYPES = /* @__PURE__ */ new Set([
   "string",
+  "email",
   "varchar",
   "text",
   "boolean",
@@ -4469,6 +4655,8 @@ function sampleSchemaFieldValue(field) {
   switch (field.type) {
     case "boolean":
       return true;
+    case "email":
+      return "developer@example.com";
     case "number":
     case "decimal":
       return 1;
@@ -5240,21 +5428,19 @@ function buildFormDevModeSnippets(schema, actionImportPath, adminImportAlias) {
   const fields = getAllFormSchemaFields(schema);
   const submissionInput = createFormInputObject(fields);
   const actionModulePath = resolveActionModulePath(actionImportPath, adminImportAlias);
+  const formComponentModulePath = `${adminImportAlias ?? DEFAULT_ADMIN_IMPORT_ALIAS}/components/forms/${toKebabCase(schema.name)}-form`;
   const submissionData = createFormSubmissionObject(fields);
   const submitResponse = { success: true, submission: submissionData };
   const submissionsResponse = { submissions: [submissionData], total: 1 };
   const deleteResponse = { success: true };
   const formLabel2 = schema.label;
-  return [
-    {
-      id: "submit",
-      label: `Submit ${formLabel2}`,
-      kind: "mutation",
-      icon: "send",
-      language: "tsx",
-      payloadExample: createPayloadExample(submissionInput),
-      responseExample: createResponseExample(submitResponse),
-      code: `'use client'
+  const formComponentCode = `import { ${pascal}Form } from '${formComponentModulePath}'
+
+export default function ${pascal}Page() {
+  return <${pascal}Form />
+}
+`;
+  const submitActionCode = `'use client'
 
 import * as React from 'react'
 import {
@@ -5281,7 +5467,25 @@ export function ${pascal}SubmitButton() {
     </button>
   )
 }
-`
+`;
+  return [
+    {
+      id: "jsx",
+      label: `${formLabel2} Component`,
+      kind: "jsx",
+      icon: "file-code",
+      language: "tsx",
+      code: formComponentCode
+    },
+    {
+      id: "submit",
+      label: `Submit ${formLabel2}`,
+      kind: "mutation",
+      icon: "send",
+      language: "tsx",
+      payloadExample: createPayloadExample(submissionInput),
+      responseExample: createResponseExample(submitResponse),
+      code: submitActionCode
     },
     {
       id: "submissions",
@@ -5375,7 +5579,7 @@ function generateColumnDef(col) {
     case "email":
       cellDef = `cell: ({ row }) => {
       const email = row.getValue('${col.accessorKey}') as string
-      return email ? <a href={\`mailto:\${email}\`} className="text-primary hover:underline">{email}</a> : '-'
+      return <div className="text-sm font-medium">{email || '-'}</div>
     }`;
       break;
     case "date":
@@ -7184,7 +7388,7 @@ export { CACHE_TAG, CACHE_TAG_BY_ID } from './types'
 // adapters/next/generators/form-pipeline/form-component-shared.ts
 import fs16 from "fs";
 import path20 from "path";
-var ADMIN_CUSTOM_COMPONENTS = /* @__PURE__ */ new Set(["media-gallery-field"]);
+var ADMIN_CUSTOM_COMPONENTS = /* @__PURE__ */ new Set(["media-field"]);
 function resolveUiImport(cwd, componentName) {
   const componentDirectory = ADMIN_CUSTOM_COMPONENTS.has(componentName) ? "components/custom" : "components/ui";
   const locations = [componentDirectory, `src/${componentDirectory}`];
@@ -7265,6 +7469,26 @@ ${decls}
 function getListFields(fields) {
   return fields.filter((f) => f.name && f.type === "list" && f.fields && f.fields.length > 0);
 }
+function hasFormDescriptionFields(fields) {
+  return fields.some((field) => {
+    if (field.hint) return true;
+    if ((field.type === "group" || field.type === "list") && field.fields) {
+      return hasFormDescriptionFields(field.fields);
+    }
+    return false;
+  });
+}
+function hasSelectFields(fields) {
+  return fields.some((field) => {
+    if (field.type === "select" && field.options && field.options.length > 0) {
+      return true;
+    }
+    if ((field.type === "group" || field.type === "list") && field.fields) {
+      return hasSelectFields(field.fields);
+    }
+    return false;
+  });
+}
 function renderFieldsJSX(fields) {
   return fields.filter((f) => !f.hidden).map((f) => {
     if (f.type === "dynamicFields") return "";
@@ -7516,7 +7740,7 @@ function generateFileUploadFieldJSX(field, name, label, hintJSX, requiredStar) {
             <FormItem${formItemProps(field.height)}>
               ${formLabelWithDescriptionLine(name, label, requiredStar, hintJSX, "              ")}
               <FormControl>
-                <MediaGalleryField
+                <MediaField
                   value={field.value}
                   onChange={field.onChange}
                   onBlur={field.onBlur}
@@ -7684,13 +7908,15 @@ ${fieldsJSX}
   const successHandler = redirectUrl ? `window.location.href = ${JSON.stringify(redirectUrl)}` : "setSubmitted(true)";
   const hasRadio = allFields.some((f) => f.type === "radio");
   const hasFileUpload = allFields.some((f) => f.type === "file" || f.type === "upload");
+  const hasFormDescriptions = hasFormDescriptionFields(allFields);
+  const hasSelectControls = hasSelectFields(allFields);
   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 selectImport = hasSelectControls ? resolveUiImport(cwd, "select") : "";
   const radioGroupImport = resolveUiImport(cwd, "radio-group");
-  const mediaUploadImport = resolveUiImport(cwd, "media-gallery-field");
+  const mediaUploadImport = resolveUiImport(cwd, "media-field");
   const content = buildComponentSource({
     pascal,
     kebab,
@@ -7698,6 +7924,8 @@ ${fieldsJSX}
     hasRadio,
     hasFileUpload,
     hasListFields,
+    hasFormDescriptions,
+    hasSelectControls,
     actionImportPath,
     buttonImport,
     formImport,
@@ -7767,17 +7995,16 @@ import { Button } from '${p15.buttonImport}'
 import {
   Form,
   FormControl,
-  FormDescription,
-  FormField,
+${p15.hasFormDescriptions ? "  FormDescription,\n" : ""}  FormField,
   FormItem,
   FormLabel,
   FormMessage,
 } from '${p15.formImport}'
 import { Input } from '${p15.inputImport}'${p15.hasFileUpload ? `
-import { MediaGalleryField } from '${p15.mediaUploadImport}'` : ""}
+import { MediaField } from '${p15.mediaUploadImport}'` : ""}
 ${p15.hasRadio ? `import { RadioGroup, RadioGroupItem } from '${p15.radioGroupImport}'
 ` : ""}
-import { Textarea } from '${p15.textareaImport}'
+import { Textarea } from '${p15.textareaImport}'${p15.hasSelectControls ? `
 import {
   Select,
   SelectContent,
@@ -7785,6 +8012,7 @@ import {
   SelectTrigger,
   SelectValue,
 } from '${p15.selectImport}'
+` : ""}
 
 const formSchema = z.object({
 ${p15.zodFields}
@@ -7932,13 +8160,15 @@ ${buildFieldArrayDecls(listFields)}
 ` : "";
   const hasRadio = fields.some((f) => f.type === "radio");
   const hasFileUpload = fields.some((f) => f.type === "file" || f.type === "upload");
+  const hasFormDescriptions = hasFormDescriptionFields(rawFields);
+  const hasSelectControls = hasSelectFields(rawFields);
   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 selectImport = hasSelectControls ? resolveUiImport(cwd, "select") : "";
   const radioGroupImport = resolveUiImport(cwd, "radio-group");
-  const mediaUploadImport = resolveUiImport(cwd, "media-gallery-field");
+  const mediaUploadImport = resolveUiImport(cwd, "media-field");
   const queryClientImport = hasFileUpload ? `
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'` : "";
   const queryClientSetup = hasFileUpload ? `
@@ -7967,16 +8197,15 @@ import { Button } from '${buttonImport}'
 import {
   Form,
   FormControl,
-  FormDescription,
-  FormField,
+${hasFormDescriptions ? "  FormDescription,\n" : ""}  FormField,
   FormItem,
   FormLabel,
   FormMessage,
 } from '${formImport}'
 import { Input } from '${inputImport}'${hasFileUpload ? `
-import { MediaGalleryField } from '${mediaUploadImport}'` : ""}${hasRadio ? `
+import { MediaField } from '${mediaUploadImport}'` : ""}${hasRadio ? `
 import { RadioGroup, RadioGroupItem } from '${radioGroupImport}'` : ""}
-import { Textarea } from '${textareaImport}'
+import { Textarea } from '${textareaImport}'${hasSelectControls ? `
 import {
   Select,
   SelectContent,
@@ -7984,6 +8213,7 @@ import {
   SelectTrigger,
   SelectValue,
 } from '${selectImport}'
+` : ""}
 
 const formSchema = z.object({
 ${zodFields}
@@ -9352,7 +9582,7 @@ ${updateBeforePublishBlock}
               (typeof value === 'number' && Number.isNaN(value))
                 ? null
                 : value
-          } else if (!field.required && ['date', 'timestamp', 'time', 'string', 'varchar', 'text', 'select', 'relationship'].includes(field.type)) {
+          } else if (!field.required && ['date', 'timestamp', 'time', 'string', 'email', 'varchar', 'text', 'select', 'relationship'].includes(field.type)) {
             processedData[key] = value && value !== '' ? value : null
           } else {
             processedData[key] = value
@@ -10593,7 +10823,7 @@ function buildEntityContext(schema, nextMajorVersion) {
   );
   const hasCreatableSelectFields = creatableSelectFields.length > 0;
   const selectFields = collectReadSelectFields(allDbFields);
-  const hasSelectFields = selectFields.length > 0;
+  const hasSelectFields2 = selectFields.length > 0;
   const dateRangeFilterFields = new Set(
     resolvedFilters.filter((filter) => filter.type === "date-range").map((filter) => filter.field)
   );
@@ -10746,7 +10976,7 @@ ${searchFields.map((f) => `          ilike(${tableVar}.${f}, searchTerm)`).join(
     Singular,
     hasListRels
   );
-  const selectResultMapping = hasSelectFields ? wrapWithSelectResolution(baseResultMapping, camelPlural, Singular) : baseResultMapping;
+  const selectResultMapping = hasSelectFields2 ? wrapWithSelectResolution(baseResultMapping, camelPlural, Singular) : baseResultMapping;
   const resultMapping = hasMediaFields ? wrapWithMediaResolution(selectResultMapping, camelPlural, Singular) : selectResultMapping;
   const baseListResultMapping = hasHtmlOutput ? buildResultMapping(
     listDbFields,
@@ -10756,7 +10986,7 @@ ${searchFields.map((f) => `          ilike(${tableVar}.${f}, searchTerm)`).join(
     Singular,
     hasListRels
   ) : baseResultMapping;
-  const selectListResultMapping = hasSelectFields ? wrapWithSelectResolution(baseListResultMapping, camelPlural, Singular) : baseListResultMapping;
+  const selectListResultMapping = hasSelectFields2 ? wrapWithSelectResolution(baseListResultMapping, camelPlural, Singular) : baseListResultMapping;
   const listResultMapping = hasMediaFields ? wrapWithMediaResolution(selectListResultMapping, camelPlural, Singular) : selectListResultMapping;
   const fieldMeta = createFields.map((f) => `{ name: '${f.name}', type: '${f.type}', required: ${f.required ?? false} }`).join(",\n    ");
   const createMappings = createFields.map((f) => `      ${f.name}: ${f.name === "slug" ? "resolvedSlug" : generateFieldMapping(f)}`).join(",\n");
@@ -10787,7 +11017,7 @@ ${searchFields.map((f) => `          ilike(${tableVar}.${f}, searchTerm)`).join(
     return ${singleRowMapping}`;
   })();
   const singleRowResolvers = [
-    ...hasSelectFields ? [`resolve${Singular}SelectFields`] : [],
+    ...hasSelectFields2 ? [`resolve${Singular}SelectFields`] : [],
     ...hasMediaFields ? [`resolve${Singular}MediaFields`] : []
   ];
   const singleRowReturn = singleRowResolvers.length > 0 ? wrapSingleRowReturnWithResolvers(baseSingleRowReturn, singleRowResolvers) : baseSingleRowReturn;
@@ -10821,7 +11051,7 @@ ${searchFields.map((f) => `          ilike(${tableVar}.${f}, searchTerm)`).join(
     hasDraft,
     hasSearch,
     hasFilters,
-    hasSelectFields,
+    hasSelectFields: hasSelectFields2,
     hasCreatableSelectFields,
     searchFields,
     htmlOutputFields,
@@ -11037,7 +11267,7 @@ function generateSingleActions(schema, actionsDir, options = {}) {
   );
   const hasCreatableSelectFields = creatableSelectFields.length > 0;
   const selectFields = collectReadSelectFields(dbFields);
-  const hasSelectFields = selectFields.length > 0;
+  const hasSelectFields2 = selectFields.length > 0;
   const relationshipFields = dbFields.filter(
     (f) => f.type === "relationship" && f.relationship && !f.multiple
   );
@@ -11150,7 +11380,7 @@ ${allUpsertInterfaceFields}
   const m2mReadBlock = hasM2M ? `
 ${m2mReadQueries}
 ${m2mAssignments}` : "";
-  const singleRowReturn = hasSelectFields ? `const row = result[0]
+  const singleRowReturn = hasSelectFields2 ? `const row = result[0]
     const singleRow = ${singleRowMapping}${m2mReadBlock}
     const [resolvedSelectRow] = await resolve${Singular}SelectFields([singleRow])
     return resolvedSelectRow` : `const row = result[0]
@@ -11169,7 +11399,7 @@ ${m2mAssignments}` : "";
       ...hasCreatableSelectFields ? [`${tableVar}SelectOptions`] : []
     ])
   ).sort();
-  const selectResolutionFunctions = hasSelectFields ? `
+  const selectResolutionFunctions = hasSelectFields2 ? `
 ${generateSingleResolveSelectFieldsFunction(Singular, selectFields, `${tableVar}SelectOptions`, hasCreatableSelectFields)}
 ` : "";
   const getContent = `'use server'
@@ -11180,7 +11410,7 @@ import { eq } from 'drizzle-orm'
 import { alias } from 'drizzle-orm/pg-core'
 ${cacheReadImport}
 import { ${cacheTagsVar} } from './types'
-import type { ${Singular}${hasSelectFields ? ", SelectOptionValue" : ""} } from './types'
+import type { ${Singular}${hasSelectFields2 ? ", SelectOptionValue" : ""} } from './types'
 
 ${buildAuthorshipAliasBlock()}
 
@@ -11279,7 +11509,7 @@ ${m2mInputDeclarations ? `${m2mInputDeclarations}
           (typeof value === 'number' && Number.isNaN(value))
             ? null
             : value
-      } else if (!field.required && ['date', 'timestamp', 'time', 'string', 'varchar', 'text', 'select', 'relationship'].includes(field.type)) {
+      } else if (!field.required && ['date', 'timestamp', 'time', 'string', 'email', 'varchar', 'text', 'select', 'relationship'].includes(field.type)) {
         processedData[key] = value && value !== '' ? value : null
       } else {
         processedData[key] = value
@@ -12639,6 +12869,8 @@ function getFormFieldType(field) {
   switch (field.type) {
     case "boolean":
       return "checkbox";
+    case "email":
+      return "email";
     case "text":
       return "textarea";
     case "markdown":
@@ -12670,6 +12902,10 @@ function getZodType(field) {
       return field.required ? `z.number({ message: '${label} is required' })` : "z.number().nullable().optional()";
     case "boolean":
       return "z.boolean()";
+    case "email": {
+      const base = field.required ? `z.string().min(1, '${label} is required').email('Please enter a valid email address')` : `z.string().optional().refine((val) => !val || val.trim() === '' || z.string().email().safeParse(val).success, { message: 'Please enter a valid email address' })`;
+      return field.length ? `${base}.max(${field.length})` : base;
+    }
     case "string":
     case "varchar":
     case "text":
@@ -12808,6 +13044,40 @@ function collectRelationshipFields(fields, _tabFieldNames) {
   collect(fields);
   return result;
 }
+function getTabNestedFields(tab) {
+  return [
+    ...tab.fields ?? [],
+    ...tab.slot?.main?.fields ?? [],
+    ...tab.slot?.sidebar?.fields ?? []
+  ];
+}
+function collectTabIconNames(fields) {
+  const icons = /* @__PURE__ */ new Set();
+  function collect(fieldsToCheck) {
+    for (const field of fieldsToCheck) {
+      if (field.fields) collect(field.fields);
+      if (field.tabs) {
+        for (const tab of field.tabs) {
+          const icon = tab.icon?.trim();
+          if (icon) icons.add(toPascalCase(icon));
+          collect(getTabNestedFields(tab));
+        }
+      }
+    }
+  }
+  collect(fields);
+  return Array.from(icons);
+}
+function renderTabsTrigger(tab, indent, options = {}) {
+  const iconName = tab.icon?.trim() ? toPascalCase(tab.icon.trim()) : null;
+  const className = options.className ? ` className="${options.className}"` : "";
+  if (!iconName)
+    return `${indent}<TabsTrigger value="${tab.name}"${className}>${tab.label}</TabsTrigger>`;
+  return `${indent}<TabsTrigger value="${tab.name}"${className}>
+${indent}  <${iconName} className="size-4 shrink-0" />
+${indent}  <span>${tab.label}</span>
+${indent}</TabsTrigger>`;
+}
 function selectDefaultValues(f) {
   if (f.default === void 0 || f.default === null || f.default === "") return [];
   const values = Array.isArray(f.default) ? f.default : [f.default];
@@ -13082,9 +13352,7 @@ function buildUiImports(ctx) {
   if (ctx.hasBoolean) uiImports.push("import { Checkbox } from '@admin/components/ui/checkbox'");
   if (ctx.hasTextarea) uiImports.push("import { Textarea } from '@admin/components/ui/textarea'");
   if (ctx.hasImage || ctx.hasVideo || ctx.hasMedia)
-    uiImports.push(
-      "import { MediaGalleryField } from '@admin/components/custom/media-gallery-field'"
-    );
+    uiImports.push("import { MediaField } from '@admin/components/custom/media-field'");
   if (ctx.hasGallery)
     uiImports.push("import { GalleryField } from '@admin/components/custom/gallery-field'");
   if (ctx.hasIcon || ctx.hasIconPostfix)
@@ -13299,7 +13567,7 @@ ${indent}  render={({ field: formField }) => (
 ${indent}    <FormItem${formItemProps2(field)}>
 ${indent}      ${labelWithDescription(formLabel(field, nestedLabel), nestedHint, `${indent}      `)}
 ${indent}      <FormControl>
-${indent}        <MediaGalleryField value={formField.value} onChange={formField.onChange} onBlur={formField.onBlur} disabled={isPending}${acceptProp} />
+${indent}        <MediaField value={formField.value} onChange={formField.onChange} onBlur={formField.onBlur} disabled={isPending}${acceptProp} />
 ${indent}      </FormControl>
 ${indent}      <FormMessage />
 ${indent}    </FormItem>
@@ -13594,10 +13862,10 @@ function generateFieldJSXCore(field, indent = "          ", context = {}) {
   if (field.type === "separator") return renderSeparatorField(field, indent);
   if (field.type === "boolean") return renderBooleanField(field, indent, label, hintJSX, context);
   if (field.type === "image")
-    return renderMediaGalleryField(field, indent, label, hintJSX, context, "image/*");
+    return renderMediaField(field, indent, label, hintJSX, context, "image/*");
   if (field.type === "video")
-    return renderMediaGalleryField(field, indent, label, hintJSX, context, "video/*");
-  if (field.type === "media") return renderMediaGalleryField(field, indent, label, hintJSX, context);
+    return renderMediaField(field, indent, label, hintJSX, context, "video/*");
+  if (field.type === "media") return renderMediaField(field, indent, label, hintJSX, context);
   if (field.type === "gallery") return renderGalleryField(field, indent, label, hintJSX, context);
   if (field.type === "icon") return renderIconField(field, indent, label, hintJSX);
   if (field.type === "date") return renderDateField(field, indent, label, hintJSX, context);
@@ -13662,7 +13930,7 @@ ${indent}    </FormItem>
 ${indent}  )}
 ${indent}/>`;
 }
-function renderMediaGalleryField(field, indent, label, hintJSX, context, accept) {
+function renderMediaField(field, indent, label, hintJSX, context, accept) {
   const acceptProp = accept ? `
 ${indent}          accept="${accept}"` : "";
   const defaultValueFromHandler = defaultValueFromSourceHandler(field, context);
@@ -13677,7 +13945,7 @@ ${indent}  render={({ field: formField }) => (
 ${indent}    <FormItem${formItemProps2(field)}>
 ${indent}      ${formLabelWithDescription(field, label, hintJSX, `${indent}      `)}
 ${indent}      <FormControl>
-${indent}        <MediaGalleryField
+${indent}        <MediaField
 ${indent}          value={formField.value}
 ${indent}          onChange={${onChange}}
 ${indent}          onBlur={formField.onBlur}
@@ -14398,6 +14666,23 @@ ${indent}/>`;
 }
 
 // adapters/next/generators/form/form-entity.ts
+function escapeRegExp(value) {
+  return value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+function usesIdentifier(source, identifier) {
+  return new RegExp(`\\b${escapeRegExp(identifier)}\\b`).test(source);
+}
+function filterNamedImportsByUsage(importDeclarations, source) {
+  return importDeclarations.flatMap((declaration) => {
+    const match = declaration.match(/^import\s+\{\s*([\s\S]*?)\s*\}\s+from\s+(.+)$/);
+    if (!match) return [declaration];
+    const importedNames = match[1].split(",").map((name) => name.trim()).filter(Boolean);
+    const usedNames = importedNames.filter((name) => usesIdentifier(source, name));
+    if (usedNames.length === 0) return [];
+    if (usedNames.length === importedNames.length) return [declaration];
+    return [`import { ${usedNames.join(", ")} } from ${match[2]}`];
+  });
+}
 function collectSidebarSectionHeadingFields(fields) {
   const headingFields = [];
   for (const field of fields) {
@@ -14558,10 +14843,25 @@ function ${slugValueHelperName}(value: unknown): string {
     slugValueHelperName: hasSlugTitleSource ? slugValueHelperName : void 0
   });
   const cardFieldIndent = "                ";
+  function hasRenderableTabsField(fields, excludedField) {
+    for (const field of fields) {
+      if (field.hidden) continue;
+      if (field.type === "tabs" && field !== excludedField) return true;
+      if ((field.type === "group" || field.type === "section") && field.fields) {
+        if (hasRenderableTabsField(field.fields, excludedField)) return true;
+      }
+      if (field.type === "tabs" && field.tabs) {
+        for (const tab of field.tabs) {
+          if (hasRenderableTabsField(tab.fields ?? [], excludedField)) return true;
+        }
+      }
+    }
+    return false;
+  }
   const renderNestedTabsField = (f, childContext = {}) => {
     const indent = cardFieldIndent;
     if (!f.tabs) return "";
-    const tabsList = f.tabs.map((t) => `${indent}    <TabsTrigger value="${t.name}">${t.label}</TabsTrigger>`).join("\n");
+    const tabsList = f.tabs.map((t) => renderTabsTrigger(t, `${indent}    `)).join("\n");
     const tabsContent = f.tabs.map((t) => {
       const tabFields = (t.fields || []).map(
         (tf) => generateFieldJSX2(tf, `${indent}    `, {
@@ -14649,7 +14949,7 @@ ${indent}  </CardHeader>`;
     if (headingJSX) {
       return `${indent}<Card className="gap-0">
 ${headingJSX}
-${indent}  <CardContent className="space-y-4 p-5">
+${indent}  <CardContent className="space-y-5 p-5">
 ${fieldsJSX}
 ${indent}  </CardContent>
 ${indent}</Card>`;
@@ -14701,42 +15001,63 @@ ${cards.join("\n")}
     ).filter(Boolean).join("\n");
     return [commonMainFieldsJSX, tabFieldsJSX].filter(Boolean).join("\n");
   };
-  const renderTopLevelTabContent = (tab, commonMainFieldsJSX, commonSidebarEntries) => {
+  const renderTopLevelTabFormBody = (tab, commonMainFieldsJSX, commonSidebarEntries) => {
     const tabMainFieldsJSX = renderTabMainFields(tab, commonMainFieldsJSX);
     const tabSidebarEntries = [
       ...commonSidebarEntries,
       ...collectSidebarFields(tab.fields || [], tab.name)
     ].map((entry) => ({ ...entry, jsx: renderStaticSidebarEntry(entry) })).filter((entry) => entry.jsx.length > 0);
-    const sidebarColumn = renderSidebarColumn(tabSidebarEntries, { scrollable: true });
-    return `              <TabsContent value="${tab.name}" className="min-h-0 w-full flex-1 overflow-hidden">
-                <div className="grid grid-cols-1 ${tabSidebarEntries.length > 0 ? "lg:grid-cols-[1fr_360px] " : ""}h-full min-h-0 gap-4 items-stretch">
-                  <div className="h-full min-h-0 min-w-0 pb-4">
-                    <Card className="relative min-h-0 min-w-0 space-y-4 overflow-y-auto p-8 gap-0 h-full">
+    const sidebarColumn = renderSidebarColumn(tabSidebarEntries);
+    return `      <div className="grid grid-cols-1 ${tabSidebarEntries.length > 0 ? "lg:grid-cols-[1fr_360px] " : ""}h-full min-h-0 gap-4 items-stretch">
+        <div className="h-full min-h-0 min-w-0">
+          <Card className="min-h-0 min-w-0 h-full">
+            <CardContent className="space-y-5 gap-0 h-full min-h-0">
 ${tabMainFieldsJSX}
-                    </Card>
-                  </div>
+            </CardContent>
+          </Card>
+        </div>
 ${sidebarColumn}
-                </div>
-              </TabsContent>`;
+      </div>`;
   };
-  const renderTopLevelTabsLayout = (tabsField2, commonFields) => {
-    if (!tabsField2.tabs) return "";
+  const topLevelTabComponentName = (tab) => `${Singular}FormTab${toPascalCase(tab.name)}`;
+  const topLevelTabFileBaseName = (tab) => `${schema.name}-form-tab-${toKebabCase(tab.name)}`;
+  const renderTopLevelTabComponentSpecs = (tabsField2, commonFields) => {
+    if (!tabsField2.tabs) return [];
     const commonMainFieldsJSX = commonFields.map(renderMainField).filter(Boolean).join("\n");
     const commonSidebarEntries = collectSidebarFields(commonFields);
-    const tabsList = tabsField2.tabs.map((tab) => `                <TabsTrigger value="${tab.name}">${tab.label}</TabsTrigger>`).join("\n");
-    const tabsContent = tabsField2.tabs.map((tab) => renderTopLevelTabContent(tab, commonMainFieldsJSX, commonSidebarEntries)).join("\n");
-    return `            <Tabs value={activeTab} onValueChange={(value) => void setActiveTab(value as TabValue)} className="flex h-full min-h-0 w-full flex-col gap-4">
-              <TabsList className="sticky top-0 z-10 shrink-0 bg-background">
-${tabsList}
-              </TabsList>
-${tabsContent}
-            </Tabs>`;
+    return tabsField2.tabs.map((tab) => ({
+      tab,
+      componentName: topLevelTabComponentName(tab),
+      fileBaseName: topLevelTabFileBaseName(tab),
+      body: renderTopLevelTabFormBody(tab, commonMainFieldsJSX, commonSidebarEntries)
+    }));
   };
+  const renderTopLevelTabComponentSwitch = (spec) => `      {tab === ${JSON.stringify(spec.tab.name)} ? <${spec.componentName} state={state} /> : null}`;
   const visibleFields = allFormFields.filter((f) => !(hasDraft && f.name === "published"));
   const topLevelTabsField = visibleFields.find(
     (field) => field.type === "tabs" && (field.slot ?? "main") === "main" && field.tabs?.length
   );
   const topLevelCommonFields = topLevelTabsField ? visibleFields.filter((field) => field !== topLevelTabsField) : visibleFields;
+  const topLevelTabComponents = topLevelTabsField ? renderTopLevelTabComponentSpecs(topLevelTabsField, topLevelCommonFields) : [];
+  const contentUsesTabsField = topLevelTabsField ? hasRenderableTabsField(topLevelCommonFields, topLevelTabsField) || topLevelTabsField.tabs?.some(
+    (tab) => hasRenderableTabsField(tab.fields ?? [], topLevelTabsField)
+  ) === true : hasTabsField;
+  const topLevelTabChildFields = topLevelTabsField?.tabs?.flatMap((tab) => [
+    ...tab.fields ?? [],
+    ...tab.slot?.main?.fields ?? [],
+    ...tab.slot?.sidebar?.fields ?? []
+  ]) ?? [];
+  const contentTabIconNames = collectTabIconNames(
+    topLevelTabsField ? [...topLevelCommonFields, ...topLevelTabChildFields] : allFormFields
+  );
+  const topLevelTabIconNames = Array.from(
+    new Set(
+      topLevelTabsField?.tabs?.flatMap((tab) => {
+        const icon = tab.icon?.trim();
+        return icon ? [toPascalCase(icon)] : [];
+      }) ?? []
+    )
+  );
   const mainFieldsJSX = topLevelCommonFields.map(renderMainField).filter(Boolean).join("\n");
   const sidebarEntries = collectSidebarFields(topLevelCommonFields).map((entry) => ({ ...entry, jsx: renderConditionalSidebarEntry(entry) })).filter((entry) => entry.jsx.length > 0);
   const hasSidebarFields = sidebarEntries.length > 0;
@@ -14759,10 +15080,10 @@ ${tabsContent}
   const sidebarCardJSX = !hasSidebarFields ? "" : shouldGuardSidebarByTab ? `              {hasVisibleSidebarFields ? (
 ${renderSidebarColumn(sidebarEntries, { conditionalTabs: true })}
               ) : null}` : renderSidebarColumn(sidebarEntries, { conditionalTabs: true });
-  const formBodyJSX = topLevelTabsField ? renderTopLevelTabsLayout(topLevelTabsField, topLevelCommonFields) : `${formGridOpen}
+  const formBodyJSX = topLevelTabsField ? topLevelTabComponents.map(renderTopLevelTabComponentSwitch).join("\n") : `${formGridOpen}
               <div className="h-full min-w-0">
                 <Card className="min-w-0 h-full">
-                <CardContent className="space-y-4 gap-0 h-full">
+                <CardContent className="space-y-5 gap-0 h-full">
 ${mainFieldsJSX}
 </CardContent>
                 </Card>
@@ -14850,7 +15171,7 @@ ${sidebarCardJSX}
     hasSelectCombobox,
     hasCreatableSelect,
     hasMultiSelect: multiSelectFields.length > 0,
-    hasTabsField,
+    hasTabsField: contentUsesTabsField,
     hasRelationship,
     hasSimpleList,
     hasNestedList,
@@ -14868,7 +15189,7 @@ ${sidebarCardJSX}
       if (!lucideIcons.includes(icon)) lucideIcons.push(icon);
     }
   };
-  addLucideIcons(...sectionHeadingIconNames);
+  addLucideIcons(...sectionHeadingIconNames, ...contentTabIconNames);
   if (hasRelationship || hasSelectCombobox) addLucideIcons("Check", "ChevronsUpDown");
   if (hasCreatableSelect) addLucideIcons("Plus");
   if (hasNestedList) {
@@ -15011,12 +15332,12 @@ ${sidebarCardJSX}
     "handleErrors"
   ]);
   const hookReturnObject = hookReturnNames.map((name) => `    ${name}`).join(",\n");
-  const contentUsesInitialData = hasDraft || hasSidebarFields && showMetadataWidget || topLevelTabsField && showMetadataWidget;
-  const contentStateNames = uniqueNames([
+  const contentUsesInitialData = hasDraft || !topLevelTabsField && hasSidebarFields && showMetadataWidget;
+  const standardContentStateNames = uniqueNames([
     ...contentUsesInitialData ? ["initialData"] : [],
     "form",
     ...contentUsesPendingState ? ["isPending"] : [],
-    ...hasTabsField ? ["activeTab", "setActiveTab"] : [],
+    ...contentUsesTabsField ? ["activeTab", "setActiveTab"] : [],
     ...relationshipHookReturnNames,
     ...creatableSelectReturnNames,
     ...staticMultiSelectReturnNames,
@@ -15025,8 +15346,15 @@ ${sidebarCardJSX}
     "onSubmit",
     "handleErrors"
   ]);
+  const topLevelTabRouterStateNames = uniqueNames([
+    ...hasDraft ? ["initialData"] : [],
+    "form",
+    "onSubmit",
+    "handleErrors"
+  ]);
+  const contentStateNames = topLevelTabsField ? topLevelTabRouterStateNames : standardContentStateNames;
   const contentStateDestructure = contentStateNames.map((name) => `    ${name}`).join(",\n");
-  const needsCn = hasRelationship || hasSelectCombobox || shouldGuardSidebarByTab || Boolean(topLevelTabsField && showMetadataWidget);
+  const needsCn = hasRelationship || hasSelectCombobox || shouldGuardSidebarByTab;
   const metadataOffsetConst = showMetadataWidget ? "const SCROLL_BORDER_OFFSET = 8;\n\n" : "";
   const tabParserConst = hasTabsField ? `const TAB_VALUES = [${tabNames.map((name) => JSON.stringify(name)).join(", ")}] as const
 const TAB_PARSER = parseAsStringLiteral(TAB_VALUES).withDefault(TAB_VALUES[0])
@@ -15058,6 +15386,32 @@ export type TabValue = (typeof TAB_VALUES)[number]
       )}
 
 ` : "";
+  const topLevelTabsClassName = showMetadataWidget ? `className={cn('min-h-[calc(100svh-56px)] w-full gap-0', {
+          'min-h-[calc(100svh-56px-56px)]': initialData?.id != null
+        })}` : 'className="h-[calc(100svh-56px)] min-h-0 w-full gap-0"';
+  const topLevelTabsShell = topLevelTabsField?.tabs ? `      <Tabs value={entityForm.activeTab} onValueChange={(value) => void entityForm.setActiveTab(value as TabValue)} ${topLevelTabsClassName}>
+        <div className="flex h-14 shrink-0 w-full bg-background border-b border-border/80 px-4 items-center">
+          <TabsList className="bg-transparent border-none">
+${topLevelTabsField.tabs.map((tab) => renderTabsTrigger(tab, "            ", { className: "px-3" })).join("\n")}
+          </TabsList>
+        </div>
+
+        <main className="w-full flex-1 min-h-0 p-4">
+${topLevelTabsField.tabs.map(
+    (tab) => `          <TabsContent value="${tab.name}" className="h-full min-h-0 w-full flex-1">
+            <Form {...entityForm.form}>
+              <${contentComponentName} state={entityForm} tab="${tab.name}" />
+            </Form>
+          </TabsContent>`
+  ).join("\n")}
+        </main>
+      </Tabs>` : "";
+  const defaultShellBody = `      <main className="w-full p-4 h-full">
+        <Form {...entityForm.form}>
+          <${contentComponentName} state={entityForm} />
+        </Form>
+      </main>`;
+  const shellBody = topLevelTabsField ? topLevelTabsShell : defaultShellBody;
   const hookContent = `'use client'
 
 import * as React from 'react'
@@ -15177,27 +15531,63 @@ ${hookReturnObject}
   }
 }
 `;
+  const topLevelTabComponentImports = topLevelTabComponents.map((spec) => `import { ${spec.componentName} } from './${spec.fileBaseName}'`).join("\n");
+  const contentImports = topLevelTabsField ? `import type { TabValue, ${hookName} } from '${hookImportPath}'${topLevelTabComponentImports ? `
+${topLevelTabComponentImports}` : ""}` : `${lucideIcons.length > 0 ? `import { ${lucideIcons.join(", ")} } from 'lucide-react'
+` : ""}${hasTabsField ? `import type { TabValue, ${hookName} } from '${hookImportPath}'` : `import type { ${hookName} } from '${hookImportPath}'`}${needsCn ? "\nimport { cn } from '@admin/utils/shared/cn'" : ""}
+${uiImports.join("\n")}`;
+  const contentSidebarVisibilityState = topLevelTabsField ? "" : sidebarVisibilityState;
+  const renderTopLevelTabComponentFile = (spec) => {
+    const body = spec.body;
+    const tabStateNames = hookReturnNames.filter((name) => usesIdentifier(body, name));
+    const tabStateDestructure = tabStateNames.length > 0 ? `  const {
+${tabStateNames.map((name) => `    ${name}`).join(",\n")}
+  } = state
+
+` : "";
+    const tabLucideIcons = lucideIcons.filter((icon) => usesIdentifier(body, icon));
+    const tabNeedsCn = /\bcn\s*\(/.test(body);
+    const tabImports = [
+      tabLucideIcons.length > 0 ? `import { ${tabLucideIcons.join(", ")} } from 'lucide-react'` : "",
+      `import type { ${hookName} } from '${hookImportPath}'`,
+      tabNeedsCn ? "import { cn } from '@admin/utils/shared/cn'" : "",
+      ...filterNamedImportsByUsage(uiImports, body)
+    ].filter(Boolean).join("\n");
+    return createGeneratedFile(
+      `${pagesDir}/${schema.name}/${spec.fileBaseName}.tsx`,
+      `'use client'
+
+${tabImports}
+
+interface ${spec.componentName}Props {
+  state: ReturnType<typeof ${hookName}>
+}
+
+export function ${spec.componentName}({ state }: ${spec.componentName}Props) {
+${tabStateDestructure}  return (
+${body}
+  )
+}
+`
+    );
+  };
+  const topLevelTabComponentFiles = topLevelTabComponents.map(renderTopLevelTabComponentFile);
   const content = `'use client'
-${lucideIcons.length > 0 ? `
-import { ${lucideIcons.join(", ")} } from 'lucide-react'` : ""}${hasTabsField ? `
-import type { TabValue, ${hookName} } from '${hookImportPath}'` : `
-import type { ${hookName} } from '${hookImportPath}'`}${needsCn ? "\nimport { cn } from '@admin/utils/shared/cn'" : ""}
-${uiImports.join("\n")}
+
+${contentImports}
 
 interface ${contentComponentName}Props {
   state: ReturnType<typeof ${hookName}>
+${topLevelTabsField ? "  tab: TabValue\n" : ""}
 }
 
-export function ${contentComponentName}({ state }: ${contentComponentName}Props) {
+export function ${contentComponentName}({ state${topLevelTabsField ? ", tab" : ""} }: ${contentComponentName}Props) {
   const {
 ${contentStateDestructure}
   } = state
-${sidebarVisibilityState}
+${contentSidebarVisibilityState}
   return (
-    <form id="${schema.name}-form" onSubmit={form.handleSubmit((values) => onSubmit(values${hasDraft ? ", initialData?.published ?? false" : ""}), handleErrors)} ${topLevelTabsField ? showMetadataWidget ? `className={cn('min-h-0', {
-              'h-[calc(100svh-56px-56px-32px)]': initialData?.id != null,
-              'h-[calc(100svh-56px-32px)]': initialData?.id == null
-            })}` : 'className="h-[calc(100svh-56px-32px)] min-h-0"' : 'className="space-y-6 h-full"'}>
+    <form id="${schema.name}-form" onSubmit={form.handleSubmit((values) => onSubmit(values${hasDraft ? ", initialData?.published ?? false" : ""}), handleErrors)} ${topLevelTabsField ? 'className="h-full"' : 'className="space-y-6 h-full"'}>
 ${formBodyJSX}
     </form>
   )
@@ -15205,11 +15595,15 @@ ${formBodyJSX}
 `;
   const shellContent = `'use client'
 ${showMetadataWidget ? "\nimport { usePageScrollThreshold } from '@admin/hooks/use-page-scroll-threshold'" : ""}
+${topLevelTabIconNames.length > 0 ? `import { ${topLevelTabIconNames.join(", ")} } from 'lucide-react'
+` : ""}
 import { Button } from '@admin/components/ui/button'
 import { Form } from '@admin/components/ui/form'
-import { PageHeader } from '@admin/components/shared/page-header'${showMetadataWidget ? "\nimport { EntityMetadata } from '@admin/components/shared/entity-metadata'\nimport { cn } from '@admin/utils/shared/cn'" : ""}
+${topLevelTabsField ? "import { Tabs, TabsContent, TabsList, TabsTrigger } from '@admin/components/ui/tabs'\n" : ""}import { PageHeader } from '@admin/components/shared/page-header'${showMetadataWidget ? "\nimport { EntityMetadata } from '@admin/components/shared/entity-metadata'\nimport { cn } from '@admin/utils/shared/cn'" : ""}
 import type { ${Singular} } from '@admin/actions/${actionImportPath}'
 ${showMetadataWidget ? `import { getVersionsBy${Singular}Id, restore${Singular}Version } from '@admin/actions/${actionImportPath}'` : ""}
+${topLevelTabsField ? `import type { TabValue } from '${hookImportPath}'
+` : ""}
 import { ${hookName} } from '${hookImportPath}'
 import { ${contentComponentName} } from './${schema.name}-form-content'
 
@@ -15257,11 +15651,7 @@ ${hasDraft ? `          <div className="flex items-center gap-1">
           </Button>`}
         }
       />
-${metadataStrip}      <main className="w-full p-4 h-full">
-        <Form {...entityForm.form}>
-          <${contentComponentName} state={entityForm} />
-        </Form>
-      </main>
+${metadataStrip}${shellBody}
     </>
   )
 }
@@ -15270,6 +15660,7 @@ ${metadataStrip}      <main className="w-full p-4 h-full">
     files: [
       createGeneratedFile(hookPath, hookContent),
       createGeneratedFile(`${pagesDir}/${schema.name}/${schema.name}-form-content.tsx`, content),
+      ...topLevelTabComponentFiles,
       createGeneratedFile(`${pagesDir}/${schema.name}/${schema.name}-form.tsx`, shellContent)
     ]
   };
@@ -15398,7 +15789,7 @@ function buildGroupFieldsJSX(group2, analysis, defaultValueFromSourceNames, crea
   const indent = "            ";
   return group2.fields.map((f) => {
     if (f.type === "tabs" && f.tabs) {
-      const tabsList = f.tabs.map((t) => `              <TabsTrigger value="${t.name}">${t.label}</TabsTrigger>`).join("\n");
+      const tabsList = f.tabs.map((t) => renderTabsTrigger(t, "              ")).join("\n");
       const tabsContent = f.tabs.map((t) => {
         const tabFields = (t.fields || []).map(
           (tf) => generateFieldJSX2(tf, "                ", {
@@ -15621,7 +16012,7 @@ ${creatableSelectHandlers ? `${creatableSelectHandlers}
           <CardHeader>
             <CardTitle>${group2.title}</CardTitle>${descriptionLine}
           </CardHeader>
-          <CardContent className="space-y-6">
+          <CardContent className="space-y-5">
 ${fieldsJSX}
           </CardContent>
           <CardFooter>${group2.hint ? `
@@ -15702,6 +16093,7 @@ function generateSingleForm(schema, pagesDir, options = {}) {
     (group2) => analyzeGroup(group2.fields).hasNestedObjectList
   );
   const hasSimpleList = hasList && hasSimpleListField2(allFormFields);
+  const tabIconNames = collectTabIconNames(allFormFields);
   const allRelFields = [];
   for (const g of cardGroups) {
     const a = analyzeGroup(g.fields);
@@ -15747,12 +16139,17 @@ function generateSingleForm(schema, pagesDir, options = {}) {
   CardHeader,
   CardTitle
 } from '@admin/components/ui/card'`);
-  const lucideIcons = ["LoaderCircle"];
-  if (hasRelationship || hasSelectCombobox) lucideIcons.push("Check", "ChevronsUpDown");
-  if (hasCreatableSelect) lucideIcons.push("Plus");
+  const lucideIcons = [];
+  const addLucideIcons = (...icons) => {
+    for (const icon of icons) {
+      if (!lucideIcons.includes(icon)) lucideIcons.push(icon);
+    }
+  };
+  addLucideIcons("LoaderCircle", ...tabIconNames);
+  if (hasRelationship || hasSelectCombobox) addLucideIcons("Check", "ChevronsUpDown");
+  if (hasCreatableSelect) addLucideIcons("Plus");
   if (hasNestedList) {
-    if (!lucideIcons.includes("Plus")) lucideIcons.push("Plus");
-    if (!lucideIcons.includes("X")) lucideIcons.push("X");
+    addLucideIcons("Plus", "X");
   }
   const relHookImports = allRelFields.map((f) => {
     const relPlural = toPascalCase(pluralize(f.relationship || ""));
@@ -18529,6 +18926,7 @@ import fs24 from "fs";
 import path29 from "path";
 var ENTITY_SINGLE_ADD_FIELD_TYPES = [
   "string",
+  "email",
   "varchar",
   "text",
   "markdown",
@@ -18631,6 +19029,11 @@ function loadAuthoredGeneratedSchema(schemasDir, name) {
   const filePath = filePaths[0];
   const parsed = parseJsonObject(fs24.readFileSync(filePath, "utf-8"), filePath);
   const type = parsed.type;
+  if (type === void 0) {
+    throw new Error(
+      `Schema "${name}" is missing required top-level "type". Expected "entity", "single", or "form".`
+    );
+  }
   if (type === "form") {
     return {
       kind: "form",
@@ -20305,7 +20708,7 @@ async function promptEntityIntegrationOptions(schema, field) {
       summary.push(`table column: ${field.name}`);
     }
   }
-  if (["string", "varchar", "text", "markdown", "richtext"].includes(field.type)) {
+  if (["string", "email", "varchar", "text", "markdown", "richtext"].includes(field.type)) {
     const addSearch = await promptConfirm2("Add this field to search?", false);
     if (addSearch) {
       schema.search = schema.search ?? { fields: [] };
@@ -20365,6 +20768,8 @@ function schemaColumnTypeForField(field) {
       return "boolean";
     case "select":
       return "badge";
+    case "email":
+      return "email";
     case "string":
     case "varchar":
     case "text":
@@ -24801,7 +25206,7 @@ var STATIC_CUSTOM_DEPENDENCIES = {
     "content-editor-rich-extensions",
     "content-editor-editor-view-utils",
     "markdown-utils",
-    "media-gallery-field",
+    "media-field",
     "use-content-editor",
     "use-content-editor-table-add-controls",
     "use-content-editor-source-mode",
@@ -24891,7 +25296,7 @@ var STATIC_CUSTOM_DEPENDENCIES = {
     "content-editor/use-tiptap-editor",
     "tiptap-utils"
   ],
-  "content-editor/media-gallery-block": ["media-gallery-field"],
+  "content-editor/media-gallery-block": ["media-field"],
   "content-editor/mobile-toolbar-content": [
     "content-editor/math-popover",
     "content-editor/use-tiptap-editor",
@@ -24916,20 +25321,25 @@ var STATIC_CUSTOM_DEPENDENCIES = {
   ],
   "date-range-picker": ["date-utils"],
   "gallery-field": [
-    "gallery-thumbnail",
+    "card",
+    "carousel",
+    "media-field",
+    "media-field-empty-state",
     "media-gallery-dialog",
+    "skeleton",
     "sortable-gallery-item",
     "use-media"
   ],
   "icon-picker": ["icons-column-skeleton", "icons-data"],
-  "sortable-gallery-item": ["gallery-thumbnail"],
-  "media-gallery-field": [
+  "media-field": [
+    "media-field-empty-state",
     "media-gallery-dialog",
     "media-preview",
     "media-fallback-utils",
     "use-copy-to-clipboard",
     "use-media"
   ],
+  "media-field-empty-state": ["button", "card", "cn", "media-gallery-dialog"],
   "nested-object-list-field": ["form-list-field-utils"],
   "progressive-blur": ["use-page-boundary-blur-visibility"],
   "upload-dropzone": ["upload-utils"]
@@ -24962,7 +25372,7 @@ var TIPTAP_TEMPLATE_DEPENDENCIES = [
   "content-editor/source-mode",
   "tiptap-utils",
   "content-editor/media-gallery-block",
-  "media-gallery-field"
+  "media-field"
 ];
 var TIPTAP_CONTENT_EDITOR_DIRECTORIES = ["tiptap-extension", "tiptap-node", "tiptap-ui"];
 var CODEMIRROR_PACKAGE_DEPS = [
@@ -24970,6 +25380,7 @@ var CODEMIRROR_PACKAGE_DEPS = [
   "@codemirror/lang-javascript",
   "@codemirror/lang-json",
   "@codemirror/lang-markdown",
+  "@codemirror/state",
   "@codemirror/view",
   "@uiw/codemirror-theme-github",
   "@uiw/react-codemirror"
@@ -25371,7 +25782,7 @@ var TEMPLATE_REGISTRY = {
     relPath: "hooks/content-editor/use-content-editor-source-mode.tsx",
     content: () => readTemplate("hooks/content-editor/use-content-editor-source-mode.tsx"),
     dependencies: [
-      "media-gallery-field",
+      "media-field",
       "use-admin-theme",
       "markdown-utils",
       "content-editor-source-media-utils",
@@ -25392,7 +25803,7 @@ var TEMPLATE_REGISTRY = {
       "tiptap",
       "tiptap-utils",
       "content-editor/media-gallery-block",
-      "media-gallery-field"
+      "media-field"
     ]
   },
   "use-content-editor-media-insertion": {