Автоматическая генерация форм

import { Form } from '@letar/forms'
import { z } from 'zod/v4'

const UserSchema = z.object({
  firstName: z.string().min(2).meta({ ui: { title: 'Имя' } }),
  lastName: z.string().meta({ ui: { title: 'Фамилия' } }),
  email: z.string().email().meta({ ui: { title: 'Email' } }),
  bio: z.string().max(500).meta({ ui: { title: 'О себе', fieldType: 'textarea' } }),
})

<Form.FromSchema
  schema={UserSchema}
  initialValue={{ firstName: '', lastName: '', email: '', bio: '' }}
  onSubmit={save}
  submitLabel="Создать"
/>

<Form.FromSchema
  schema={UserSchema}
  initialValue={userData}
  onSubmit={updateUser}
  exclude={['id', 'createdAt', 'updatedAt']}
  showReset
/>

<Form schema={Schema} initialValue={data} onSubmit={save}>
  <HStack gap={4}>
    <Form.AutoFields include={['firstName', 'lastName']} />
  </HStack>
  <Form.AutoFields exclude={['firstName', 'lastName']} />
  <Form.Button.Submit />
</Form>

<Form.AutoFields
  fieldWrapper={({ name, children }) => (
    <Box key={name} p={2} borderWidth={1} borderRadius="md">
      {children}
    </Box>
  )}
/>

<Form schema={ArticleSchema} initialValue={data} onSubmit={save}>
  <HStack gap={4}>
    <Box flex={2}>
      <Form.Field.Auto name="title" />
    </Box>
    <Box flex={1}>
      <Form.Field.Auto name="slug" />
    </Box>
  </HStack>
  <Form.Field.RichText name="content" label="Содержимое статьи" />
  <Form.Button.Submit>Опубликовать</Form.Button.Submit>
</Form>

const Schema = z.object({
  // Textarea вместо строки
  description: z.string().meta({ ui: { title: 'Описание', fieldType: 'textarea' } }),

  // Слайдер вместо числового поля
  rating: z
    .number()
    .min(0)
    .max(10)
    .meta({ ui: { title: 'Рейтинг', fieldType: 'slider' } }),

  // Rich text редактор
  content: z.string().meta({ ui: { title: 'Контент', fieldType: 'richText' } }),

  // Switch вместо чекбокса
  active: z.boolean().meta({ ui: { title: 'Активен', fieldType: 'switch' } }),

  // Radio cards вместо select
  plan: z.enum(['free', 'pro', 'enterprise']).meta({
    ui: {
      title: 'Тариф',
      fieldType: 'radioCard',
      fieldProps: {
        options: [
          { value: 'free', label: 'Бесплатный', description: 'Для личного использования' },
          { value: 'pro', label: 'Профессиональный', description: 'Для команд' },
          { value: 'enterprise', label: 'Корпоративный', description: 'Индивидуально' },
        ],
      },
    },
  }),
})

const Schema = z.object({
  email: z
    .string()
    .email()
    .meta({
      ui: {
        title: 'Email-адрес', // Лейбл
        placeholder: 'user@example.com', // Плейсхолдер
        description: 'Мы никому не передаём', // Подсказка под полем
        fieldType: 'string', // Переопределение компонента
        fieldProps: { type: 'email' }, // Пропсы для компонента
      },
    }),
})

const ProfileSchema = z.object({
  name: z.string().meta({ ui: { title: 'Имя' } }),
  settings: z.object({
    theme: z.enum(['light', 'dark']).meta({ ui: { title: 'Тема' } }),
    notifications: z.boolean().meta({ ui: { title: 'Уведомления' } }),
  }),
})

// AutoFields автоматически создаёт группу для settings
<Form.FromSchema schema={ProfileSchema} initialValue={data} onSubmit={save} />

const OrderSchema = z.object({
  customer: z.string(),
  items: z.array(
    z.object({
      product: z.string().meta({ ui: { title: 'Товар' } }),
      qty: z.number().min(1).meta({ ui: { title: 'Количество' } }),
    })
  ),
})

// Каждый элемент массива — карточка с полями + кнопка удаления
<Form.FromSchema schema={OrderSchema} initialValue={data} onSubmit={save} />

const Schema = z.object({
  tags: z.array(z.string()).meta({ ui: { title: 'Теги' } }),
})

z.string().min(2).max(100) // → minLength={2} maxLength={100}
z.number().min(1).max(10) // → min={1} max={10}
z.string().email() // → type="email"
z.date().min(new Date()) // → min={now}