@questpie/admin 1.1.1 → 2.0.0

package/dist/client/builder/types/collection-types.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"collection-types.d.mts","names":[],"sources":["../../../../src/client/builder/types/collection-types.ts"],"sourcesContent":[],"mappings":";;;;;;;;;;;;;AA8PA;AAiCA;AA0BiB,KAzRL,YAyRK,CAAA,oBAAsB,MAAA,GAAA,MAAA,CAAA,GAxRnC,WAwRmC,GAvRnC,kBAuRmC,CAvRhB,WAuRgB,CAAA;;;;AAMpB,UAxRF,kBAwRE,CAAA,oBAAA,MAAA,GAAA,MAAA,CAAA,CAAA;EAEM;;;EAEU,KAAA,EAxR1B,WAwR0B;EAAf;;;EAIgB,MAAA,CAAA,EAAA,MAAA;;;;;;;;;;;;;;;;;;;;;;SA5P3B;;;;;;;;;;;;;;;;;;UA4CQ;;;;YAIL,aAAa;;;;;;;;;WAWd;;;;;;;;;;;iBAaM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YAmCL;;;;;UAwEK,aAAA;;;;;;;gBAOD;;;;;;;;;;;;;;;;;;;;;;;;;UA0BC,cAAA;;;;;;;;;;;;;;;;;;;;;;;;;UA0BA,yCACG,oBAAoB;;wBAGhB;;mBAEL;;yBAEM;kBACP,gBAAgB;oBACd,eAAe;;;qBAGd;sBACC"}

package/dist/client/builder/types/collection-types.mjs

@@ -0,0 +1,11 @@
+//#region src/client/builder/types/collection-types.ts
+/**
+* Helper to get column config object (normalizes string to object)
+*/
+function normalizeColumnConfig(column) {
+	return typeof column === "string" ? { field: column } : column;
+}
+
+//#endregion
+export { normalizeColumnConfig };
+//# sourceMappingURL=collection-types.mjs.map

package/dist/client/builder/types/collection-types.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"collection-types.mjs","names":[],"sources":["../../../../src/client/builder/types/collection-types.ts"],"sourcesContent":["/**\n * Collection Builder Types\n */\n\nimport type { ComponentReference } from \"#questpie/admin/server\";\nimport type { I18nText } from \"../../i18n/types.js\";\nimport type { AdminBuilder } from \"../admin-builder\";\nimport type { FieldDefinition } from \"../field/field\";\nimport type { IconComponent, MaybeLazyComponent } from \"./common\";\nimport type { FormViewConfig } from \"./field-types\";\nimport type { ActionsConfig } from \"./action-types\";\n\n/**\n * Collection metadata for navigation and display\n */\nexport interface CollectionMeta {\n  /** Display label - supports inline translations */\n  label?: I18nText;\n  icon?: IconComponent | ComponentReference | string;\n  group?: string;\n  order?: number;\n  hidden?: boolean;\n}\n\n// ============================================================================\n// Column Configuration\n// ============================================================================\n\n/**\n * Column configuration for list views\n * Can be a simple field name or detailed config object\n */\nexport type ColumnConfig<TFieldNames extends string = string> =\n  | TFieldNames\n  | ColumnConfigObject<TFieldNames>;\n\n/**\n * Detailed column configuration object\n */\nexport interface ColumnConfigObject<TFieldNames extends string = string> {\n  /**\n   * Field name to display\n   */\n  field: TFieldNames;\n\n  /**\n   * Custom header label (defaults to field label)\n   */\n  header?: string;\n\n  /**\n   * Column width (CSS value like \"200px\", \"20%\", etc.)\n   */\n  width?: string | number;\n\n  /**\n   * Minimum column width\n   */\n  minWidth?: string | number;\n\n  /**\n   * Maximum column width\n   */\n  maxWidth?: string | number;\n\n  /**\n   * Enable sorting for this column\n   * @default true\n   */\n  sortable?: boolean;\n\n  /**\n   * Custom cell renderer component\n   * Overrides the field's default cell component\n   */\n  cell?: MaybeLazyComponent;\n\n  /**\n   * Column visibility\n   * Can be a boolean or function for conditional visibility\n   */\n  visible?: boolean | ((row: any) => boolean);\n\n  /**\n   * Custom CSS class for column cells\n   */\n  className?: string;\n\n  /**\n   * Text alignment\n   */\n  align?: \"left\" | \"center\" | \"right\";\n}\n\n/**\n * Helper to normalize column config to field name\n */\nexport function getColumnFieldName<T extends string>(\n  column: ColumnConfig<T>,\n): T {\n  return typeof column === \"string\" ? column : column.field;\n}\n\n/**\n * Helper to get column config object (normalizes string to object)\n */\nexport function normalizeColumnConfig<T extends string>(\n  column: ColumnConfig<T>,\n): ColumnConfigObject<T> {\n  return typeof column === \"string\" ? { field: column } : column;\n}\n\n// ============================================================================\n// List View Configuration\n// ============================================================================\n\n/**\n * List view configuration\n */\nexport interface ListViewConfig<TFieldNames extends string = string> {\n  /**\n   * Columns to display (field names or column configs)\n   */\n  columns?: ColumnConfig<TFieldNames>[];\n\n  /**\n   * Relations to include in query\n   */\n  with?: string[];\n\n  /**\n   * Default sort\n   */\n  defaultSort?: {\n    field: TFieldNames;\n    direction: \"asc\" | \"desc\";\n  };\n\n  /**\n   * Enable search\n   * @default true\n   */\n  searchable?: boolean;\n\n  /**\n   * Searchable fields (defaults to all text-like fields)\n   */\n  searchFields?: TFieldNames[];\n\n  /**\n   * Enable row selection\n   * @default false\n   */\n  selectable?: boolean;\n\n  /**\n   * Enable pagination\n   * @default true\n   */\n  paginated?: boolean;\n\n  /**\n   * Enable realtime invalidation for list queries.\n   * Falls back to AdminProvider realtime config when undefined.\n   */\n  realtime?: boolean;\n\n  /**\n   * Default page size\n   * @default 25\n   */\n  pageSize?: number;\n\n  /**\n   * Available page size options\n   * @default [10, 25, 50, 100]\n   */\n  pageSizeOptions?: number[];\n\n  /**\n   * Actions configuration for list view\n   */\n  actions?: ActionsConfig;\n}\n\n/**\n * Collection configuration - runtime config object\n */\nexport interface CollectionConfig<TFieldNames extends string = string> {\n  /**\n   * Collection name\n   */\n  name: string;\n\n  /**\n   * Collection metadata (for navigation/display)\n   */\n  meta?: CollectionMeta;\n\n  /**\n   * Display label - supports inline translations\n   */\n  label?: I18nText;\n\n  /**\n   * Icon\n   */\n  icon?: IconComponent | ComponentReference | string;\n\n  /**\n   * Description - supports inline translations\n   */\n  description?: I18nText;\n\n  /**\n   * Field configurations (FieldDefinition objects)\n   *\n   * @deprecated Admin UI is schema-driven. Prefer server-side schema fields.\n   */\n  fields?: Record<string, FieldDefinition>;\n\n  /**\n   * List view configuration\n   *\n   * @deprecated Admin UI is schema-driven. Prefer server-side schema config.\n   */\n  list?: ListViewConfig<TFieldNames>;\n\n  /**\n   * Form view configuration\n   *\n   * @deprecated Admin UI is schema-driven. Prefer server-side schema config.\n   */\n  form?: FormViewConfig;\n\n  /**\n   * Navigation group\n   */\n  group?: string;\n\n  /**\n   * Sort order\n   */\n  order?: number;\n\n  /**\n   * Hide from navigation\n   */\n  hidden?: boolean;\n}\n\n/**\n * Preview configuration for live preview in form view\n */\nexport interface PreviewConfig {\n  /**\n   * URL builder function that returns preview URL for current form values\n   * @param values - Current form values\n   * @param locale - Current content locale\n   * @returns Preview URL string\n   */\n  url: (values: Record<string, unknown>, locale: string) => string;\n  /**\n   * Whether preview is enabled (default: true)\n   */\n  enabled?: boolean;\n  /**\n   * Position of the preview panel (default: \"right\")\n   */\n  position?: \"right\" | \"bottom\";\n  /**\n   * Default width/height percentage of preview panel (default: 50)\n   */\n  defaultWidth?: number;\n  /**\n   * Minimum width/height percentage (default: 30)\n   */\n  minWidth?: number;\n  /**\n   * Maximum width/height percentage (default: 70)\n   */\n  maxWidth?: number;\n}\n\n/**\n * Autosave configuration for form view\n */\nexport interface AutoSaveConfig {\n  /**\n   * Whether autosave is enabled\n   * @default false\n   */\n  enabled?: boolean;\n  /**\n   * Debounce delay in milliseconds before autosave triggers\n   * @default 500 (0.5s as specified)\n   */\n  debounce?: number;\n  /**\n   * Show autosave status indicator in form header\n   * @default true\n   */\n  indicator?: boolean;\n  /**\n   * Warn user before navigating away with unsaved changes\n   * @default true\n   */\n  preventNavigation?: boolean;\n}\n\n/**\n * Collection builder state - internal state during building\n */\nexport interface CollectionBuilderState<\n  TAdminApp extends AdminBuilder<any> = AdminBuilder<any>,\n> {\n  readonly name: string;\n  readonly \"~adminApp\": TAdminApp;\n  /** Display label - supports inline translations */\n  readonly label?: I18nText;\n  /** Description - supports inline translations */\n  readonly description?: I18nText;\n  readonly icon?: IconComponent | ComponentReference;\n  readonly fields?: Record<string, FieldDefinition<any, any>>;\n  readonly list?: any; // View result from .list() callback\n  readonly form?: any; // View result from .form() callback\n  readonly preview?: PreviewConfig; // Preview configuration\n  readonly autoSave?: AutoSaveConfig; // Autosave configuration\n}\n"],"mappings":";;;;AA0GA,SAAgB,sBACd,QACuB;AACvB,QAAO,OAAO,WAAW,WAAW,EAAE,OAAO,QAAQ,GAAG"}

package/dist/client/builder/types/common.d.mts

@@ -0,0 +1,60 @@
+import { I18nText } from "../../i18n/types.mjs";
+import * as React$1 from "react";
+
+//#region src/client/builder/types/common.d.ts
+
+/**
+ * Dynamic I18n text resolver (supports functions based on form values)
+ */
+type DynamicI18nText = I18nText | ((values: Record<string, any>) => I18nText);
+/**
+ * Component that can be lazy-loaded or direct
+ * Supports React.lazy, dynamic imports, and direct components
+ */
+type MaybeLazyComponent<TProps = any> = React$1.LazyExoticComponent<React$1.ComponentType<TProps>> | (() => Promise<{
+  default: React$1.ComponentType<TProps>;
+}>) | React$1.ComponentType<TProps>;
+/**
+ * Icon component type
+ * Icons are always synchronous - no lazy loading needed for small SVGs
+ */
+type IconComponent = React$1.ComponentType<React$1.SVGProps<SVGSVGElement> & {
+  className?: string;
+}>;
+/**
+ * Base field props that are provided by the form (runtime)
+ * These should be omitted when inferring field options from component props
+ */
+type BaseFieldProps = {
+  name: string;
+  value: any;
+  onChange?: (value: any) => void;
+  onBlur: () => void;
+  disabled?: boolean;
+  readOnly?: boolean;
+  error?: string;
+  label?: string;
+  description?: string;
+  placeholder?: string;
+  required?: boolean;
+  localized?: boolean;
+  locale?: string;
+  control?: any;
+  className?: string;
+};
+/**
+ * Base field props for builder config (supports I18nText)
+ * These are resolved to plain strings at runtime before passing to components
+ */
+type BaseFieldConfigProps = {
+  /** Field label - supports inline translations and dynamic resolvers */
+  label?: DynamicI18nText;
+  /** Field description - supports inline translations and dynamic resolvers */
+  description?: DynamicI18nText;
+  /** Field placeholder - supports inline translations and dynamic resolvers */
+  placeholder?: DynamicI18nText;
+  required?: boolean;
+};
+//#endregion
+export { BaseFieldConfigProps, BaseFieldProps, DynamicI18nText, IconComponent, MaybeLazyComponent };
+//# sourceMappingURL=common.d.mts.map

package/dist/client/builder/types/common.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"common.d.mts","names":[],"sources":["../../../../src/client/builder/types/common.ts"],"sourcesContent":[],"mappings":";;;;;;;;AAY8C,KAFlC,eAAA,GACR,QAC0C,GAAA,CAAA,CAAA,MAAA,EAAhC,MAAgC,CAAA,MAAA,EAAA,GAAA,CAAA,EAAA,GAAR,QAAQ,CAAA;AAM9C;;;;AAEkD,KAFtC,kBAEsC,CAAA,SAAA,GAAA,CAAA,GAD9C,OAAA,CAAM,mBACwC,CADpB,OAAA,CAAM,aACc,CADA,MACA,CAAA,CAAA,GAAA,CAAA,GAAA,GAAvC,OAAuC,CAAA;EAApB,OAAM,EAAN,OAAA,CAAM,aAAA,CAAc,MAAd,CAAA;CAAzB,CAAA,CAAA,GACP,OAAA,CAAM,aADC,CACa,MADb,CAAA;;;;AAOX;AACiB,KADL,aAAA,GAAgB,OAAA,CAAM,aACjB,CAAf,OAAA,CAAM,QAAS,CAAA,aAAA,CAAA,GAAA;EAAf,SAAM,CAAA,EAAA,MAAA;CADoB,CAAA;;AAQ5B;AAsBA;;AAIgB,KA1BJ,cAAA,GA0BI;EAEA,IAAA,EAAA,MAAA;EAAe,KAAA,EAAA,GAAA;;;;;;;;;;;;;;;;;;;KANnB,oBAAA;;UAEF;;gBAEM;;gBAEA"}

package/dist/client/builder/types/field-types.d.mts

@@ -0,0 +1,593 @@
+import { I18nText } from "../../i18n/types.mjs";
+import { BaseFieldProps, DynamicI18nText, IconComponent, MaybeLazyComponent } from "./common.mjs";
+import { ComponentReference } from "../../../server/augmentation.mjs";
+import "../../../server/index.mjs";
+import { ActionDefinition } from "./action-types.mjs";
+import { z } from "zod";
+
+//#region src/client/builder/types/field-types.d.ts
+
+/**
+ * Validation configuration for fields
+ *
+ * These options are used to generate Zod schemas for client-side validation.
+ */
+interface FieldValidationConfig {
+  /**
+   * Minimum length for strings
+   */
+  minLength?: number;
+  /**
+   * Maximum length for strings
+   */
+  maxLength?: number;
+  /**
+   * Minimum value for numbers
+   */
+  min?: number;
+  /**
+   * Maximum value for numbers
+   */
+  max?: number;
+  /**
+   * Regex pattern for strings
+   */
+  pattern?: RegExp | string;
+  /**
+   * Custom error message for pattern validation
+   */
+  patternMessage?: string;
+  /**
+   * Email validation (for text fields)
+   */
+  email?: boolean;
+  /**
+   * URL validation (for text fields)
+   */
+  url?: boolean;
+  /**
+   * Custom validation function
+   * @returns Error message if invalid, undefined if valid
+   */
+  validate?: (value: any, formValues: Record<string, any>) => string | undefined;
+  /**
+   * Custom Zod refinement
+   */
+  refine?: (schema: z.ZodTypeAny) => z.ZodTypeAny;
+}
+/**
+ * Props passed to field components
+ *
+ * @typeParam TValue - Type of the field value
+ */
+interface FieldComponentProps<TValue = any> extends BaseFieldProps {
+  /**
+   * Field value (typed)
+   */
+  value: TValue;
+  /**
+   * Change handler (typed)
+   * Optional to support read-only/preview modes
+   */
+  onChange?: (value: TValue) => void;
+  /**
+   * Field configuration options
+   */
+  config?: FieldUIConfig;
+}
+/**
+ * Context provided to field hooks (onChange, etc.)
+ */
+interface FieldHookContext {
+  /**
+   * Set value of any field in the form
+   */
+  setValue: (name: string, value: any) => void;
+  /**
+   * Get current values of all fields
+   */
+  getValues: () => Record<string, any>;
+  /**
+   * Get value of a specific field
+   */
+  getValue: (name: string) => any;
+  /**
+   * Current field name
+   */
+  fieldName: string;
+  /**
+   * Current locale (for localized fields)
+   */
+  locale?: string;
+}
+/**
+ * Field UI configuration (per-field overrides in collection config)
+ */
+interface FieldUIConfig {
+  /**
+   * Display label
+   */
+  label?: DynamicI18nText;
+  /**
+   * Description text
+   */
+  description?: DynamicI18nText;
+  /**
+   * Placeholder text
+   */
+  placeholder?: DynamicI18nText;
+  /**
+   * Field type override
+   */
+  type?: string;
+  /**
+   * Whether field is required
+   */
+  required?: boolean | ((values: Record<string, any>) => boolean);
+  /**
+   * Whether field is read-only
+   */
+  readOnly?: boolean | ((values: Record<string, any>) => boolean);
+  /**
+   * Whether field is disabled (grayed out, can be dynamic)
+   */
+  disabled?: boolean | ((values: Record<string, any>) => boolean);
+  /**
+   * Whether field is hidden (can be dynamic based on form values).
+   * Hidden fields are not rendered. Default is false (visible).
+   *
+   * Note: undefined/false = visible, true = hidden.
+   * This follows JavaScript falsy semantics for better DX.
+   */
+  hidden?: boolean | ((values: Record<string, any>) => boolean);
+  /**
+   * Whether field is localized
+   */
+  localized?: boolean;
+  /**
+   * Validation configuration for client-side validation
+   */
+  validation?: FieldValidationConfig;
+  /**
+   * Custom field component
+   */
+  component?: MaybeLazyComponent<FieldComponentProps>;
+  /**
+   * Additional options for field type
+   */
+  options?: SelectOption[] | ((values: Record<string, any>) => SelectOption[]);
+  /**
+   * Relation configuration
+   */
+  relation?: RelationFieldConfig;
+  /**
+   * Embedded collection configuration
+   */
+  embedded?: EmbeddedFieldConfig;
+  /**
+   * Rich text configuration
+   */
+  richText?: RichTextConfig;
+  /**
+   * Array field configuration
+   */
+  array?: ArrayFieldConfig;
+  /**
+   * Compute field value from other fields (proxy-tracked dependencies).
+   * Makes the field read-only and virtual (not submitted to backend).
+   *
+   * Dependencies are automatically detected via Proxy tracking.
+   * Works in both forms (reactive) and tables (static).
+   *
+   * @example
+   * ```ts
+   * pricePerMinute: r.number({
+   *   label: "Price/Minute",
+   *   compute: (values) => values.price / values.duration,
+   * })
+   *
+   * fullName: r.text({
+   *   compute: (values) => `${values.firstName} ${values.lastName}`,
+   * })
+   * ```
+   */
+  compute?: (values: Record<string, any>) => any;
+  /**
+   * Called when field value changes.
+   * Use for side effects like updating other fields.
+   * Can be async for API calls.
+   *
+   * @example
+   * ```ts
+   * onChange: async (value, { setValue }) => {
+   *   // Auto-generate slug from title
+   *   setValue('slug', slugify(value));
+   * }
+   * ```
+   */
+  onChange?: (value: any, ctx: FieldHookContext) => void | Promise<void>;
+  /**
+   * Dynamic default value for new records.
+   * Can be a static value, sync function, or async function.
+   * Only evaluated when creating new records (not on edit).
+   *
+   * @example
+   * ```ts
+   * // Static
+   * defaultValue: "draft"
+   *
+   * // Based on other fields
+   * defaultValue: (values) => values.type === "post" ? "draft" : "published"
+   *
+   * // Async (fetch from API)
+   * defaultValue: async (values) => {
+   *   const settings = await fetchSettings();
+   *   return settings.defaultStatus;
+   * }
+   * ```
+   */
+  defaultValue?: any | ((values: Record<string, any>) => any) | ((values: Record<string, any>) => Promise<any>);
+  /**
+   * Async options loader for select-type fields.
+   * Dependencies are automatically detected via Proxy tracking.
+   *
+   * @example
+   * ```ts
+   * subcategory: r.select({
+   *   loadOptions: async (values) => {
+   *     // Automatically re-fetches when values.category changes
+   *     return fetchSubcategories(values.category);
+   *   },
+   * })
+   * ```
+   */
+  loadOptions?: (values: Record<string, any>) => Promise<SelectOption[]>;
+}
+/**
+ * Select field option
+ */
+interface SelectOption {
+  label: I18nText;
+  value: string | number | boolean;
+  disabled?: boolean;
+}
+/**
+ * Relation field configuration
+ */
+interface RelationFieldConfig {
+  /**
+   * Target collection name
+   */
+  targetCollection: string;
+  /**
+   * Display mode
+   */
+  mode?: "inline" | "picker" | "create";
+  /**
+   * Whether multiple items can be selected
+   */
+  multiple?: boolean;
+  /**
+   * Whether items can be reordered
+   */
+  orderable?: boolean;
+  /**
+   * Filter for relation options
+   */
+  filter?: (values: Record<string, any>) => Record<string, any>;
+}
+/**
+ * Embedded collection configuration
+ */
+interface EmbeddedFieldConfig {
+  /**
+   * Target collection name
+   */
+  collection: string;
+  /**
+   * Display mode
+   */
+  mode?: "inline" | "modal" | "drawer";
+  /**
+   * Whether items can be reordered
+   */
+  orderable?: boolean;
+  /**
+   * Function to generate row labels
+   */
+  rowLabel?: (item: any) => string;
+}
+/**
+ * Rich text editor configuration
+ */
+interface RichTextConfig {
+  /**
+   * Enable image uploads
+   */
+  enableImages?: boolean;
+  /**
+   * Show character count
+   */
+  showCharacterCount?: boolean;
+  /**
+   * Maximum characters
+   */
+  maxCharacters?: number;
+  /**
+   * Feature toggles
+   */
+  features?: {
+    slashCommands?: boolean;
+    tableControls?: boolean;
+    bubbleMenu?: boolean;
+  };
+  /**
+   * Image upload handler
+   */
+  onImageUpload?: (file: File) => Promise<string>;
+}
+/**
+ * Array field configuration
+ */
+interface ArrayFieldConfig {
+  /**
+   * Placeholder text for items
+   */
+  placeholder?: string;
+  /**
+   * Type of items in array
+   */
+  itemType?: string;
+  /**
+   * Options for select-type items
+   */
+  options?: SelectOption[];
+  /**
+   * Whether items can be reordered
+   */
+  orderable?: boolean;
+  /**
+   * Minimum items
+   */
+  minItems?: number;
+  /**
+   * Maximum items
+   */
+  maxItems?: number;
+}
+/**
+ * Layout mode - controls spatial arrangement of fields
+ * Mirrors ObjectFieldLayout from field components
+ *
+ * - `"stack"` - Vertical layout, each field on its own line
+ * - `"inline"` - Horizontal flexbox, fields side-by-side with wrapping
+ * - `"grid"` - CSS Grid with configurable columns
+ *
+ * @see ObjectFieldLayout in field-types.ts for detailed visual examples
+ */
+type LayoutMode = "stack" | "inline" | "grid";
+/**
+ * Wrapper mode - controls container visual appearance
+ * Mirrors ObjectFieldWrapper from field components
+ *
+ * - `"flat"` - No visual container, fields render directly
+ * - `"collapsible"` - Accordion-style expandable container
+ *
+ * @see ObjectFieldWrapper in field-types.ts for detailed visual examples
+ */
+type WrapperMode = "flat" | "collapsible";
+/**
+ * Section layout - universal container for grouping fields
+ *
+ * Mirrors object field API exactly:
+ * - wrapper: visual container style (flat | collapsible)
+ * - layout: field arrangement (stack | inline | grid)
+ * - columns: for grid layout
+ * - defaultCollapsed: for collapsible wrapper
+ *
+ * @example Simple section with label
+ * ```ts
+ * {
+ *   type: 'section',
+ *   label: 'Contact Information',
+ *   fields: [f.name, f.email, f.phone]
+ * }
+ * ```
+ *
+ * @example Grid layout (acts as "row")
+ * ```ts
+ * {
+ *   type: 'section',
+ *   layout: 'grid',
+ *   columns: 2,
+ *   fields: [f.firstName, f.lastName]
+ * }
+ * ```
+ *
+ * @example Collapsible section
+ * ```ts
+ * {
+ *   type: 'section',
+ *   label: 'Advanced Settings',
+ *   wrapper: 'collapsible',
+ *   defaultCollapsed: true,
+ *   fields: [f.apiKey, f.webhookUrl]
+ * }
+ * ```
+ *
+ * @example Collapsible + Grid
+ * ```ts
+ * {
+ *   type: 'section',
+ *   label: 'Address',
+ *   wrapper: 'collapsible',
+ *   layout: 'grid',
+ *   columns: 2,
+ *   fields: [f.street, f.city, f.zip, f.country]
+ * }
+ * ```
+ */
+interface SectionLayout<TData = any> {
+  type: "section";
+  label?: DynamicI18nText;
+  description?: DynamicI18nText;
+  wrapper?: WrapperMode;
+  defaultCollapsed?: boolean;
+  layout?: LayoutMode;
+  columns?: number;
+  gap?: number;
+  fields: FieldLayoutItem<TData>[];
+  hidden?: boolean | ((values: Record<string, any>) => boolean);
+  className?: string;
+}
+/**
+ * Tab configuration for tabbed forms
+ */
+interface TabConfig<TData = any> {
+  id: string;
+  label: DynamicI18nText;
+  icon?: IconComponent | ComponentReference;
+  fields: FieldLayoutItem<TData>[];
+  hidden?: boolean | ((values: Record<string, any>) => boolean);
+}
+/**
+ * Tabs layout container for tabbed forms.
+ */
+interface TabsLayout<TData = any> {
+  type: "tabs";
+  tabs: TabConfig<TData>[];
+}
+/**
+ * Context passed to reactive handlers.
+ */
+interface FieldReactiveContext<TData = any> {
+  data: TData;
+  sibling: Record<string, any>;
+  ctx?: Record<string, any>;
+  prev?: {
+    data: TData;
+    sibling: Record<string, any>;
+  };
+}
+/**
+ * Reactive handler config (short function form or object form).
+ */
+type FieldReactiveHandlerConfig<TData = any, TReturn = any> = ((ctx: FieldReactiveContext<TData>) => TReturn | Promise<TReturn>) | {
+  handler: (ctx: FieldReactiveContext<TData>) => TReturn | Promise<TReturn>;
+  deps?: string[] | ((ctx: {
+    data: TData;
+  }) => any[]);
+  debounce?: number;
+};
+/**
+ * Serialized reactive config from server introspection.
+ */
+interface SerializedReactiveDepsConfig {
+  deps: string[];
+  debounce?: number;
+}
+/**
+ * Reactive field config for form layout.
+ * Handlers are executed server-side; deps tracked for client reactivity.
+ */
+interface FieldReactiveConfig<TData = any> {
+  /** Hide field conditionally */
+  hidden?: boolean | FieldReactiveHandlerConfig<TData, boolean> | SerializedReactiveDepsConfig;
+  /** Make field read-only conditionally */
+  readOnly?: boolean | FieldReactiveHandlerConfig<TData, boolean> | SerializedReactiveDepsConfig;
+  /** Disable field conditionally */
+  disabled?: boolean | FieldReactiveHandlerConfig<TData, boolean> | SerializedReactiveDepsConfig;
+  /** Auto-compute field value */
+  compute?: FieldReactiveHandlerConfig<TData, any> | SerializedReactiveDepsConfig;
+}
+/**
+ * Field layout item with optional reactive config
+ */
+interface FieldLayoutItemWithReactive<TData = any> extends FieldReactiveConfig<TData> {
+  field: string;
+  className?: string;
+}
+/**
+ * Field layout item - can be a simple field name, field with config, section, or tabs
+ *
+ * @example
+ * ```ts
+ * fields: [
+ *   f.name,  // simple field reference
+ *   { field: f.email, className: 'col-span-2' },  // with className
+ *   { field: f.slug, compute: { handler: ({ data }) => slugify(data.name), deps: ['name'] } },  // with compute
+ *   { field: f.reason, hidden: ({ data }) => data.status !== 'cancelled' },  // with hidden
+ *   { type: 'section', layout: 'grid', columns: 2, fields: [...] },  // section
+ *   { type: 'tabs', tabs: [...] }  // tabs
+ * ]
+ * ```
+ */
+type FieldLayoutItem<TData = any> = string | FieldLayoutItemWithReactive<TData> | SectionLayout<TData> | TabsLayout<TData>;
+/**
+ * Form sidebar configuration
+ * Uses `fields` array (same structure as main form)
+ */
+interface FormSidebarConfig<TData = any> {
+  position?: "left" | "right";
+  fields: FieldLayoutItem<TData>[];
+}
+/**
+ * Form view configuration
+ * Uses `fields` array for main content
+ *
+ * @example
+ * ```ts
+ * .form(({ v, f }) => v.form({
+ *   sidebar: {
+ *     position: 'right',
+ *     fields: [f.status, f.publishedAt]
+ *   },
+ *   fields: [
+ *     { type: 'section', layout: 'grid', columns: 2, fields: [f.name, f.email] },
+ *     { type: 'section', label: 'Content', fields: [f.body] }
+ *   ]
+ * }))
+ * ```
+ */
+interface FormViewConfig<TData = any> {
+  fields: FieldLayoutItem<TData>[];
+  sidebar?: FormSidebarConfig<TData>;
+  actions?: FormViewActionsConfig;
+}
+/**
+ * Actions configuration for form views
+ *
+ * @example
+ * ```ts
+ * actions: {
+ *   primary: [a.action({ id: "publish", label: "Publish" })],  // Buttons next to Save
+ *   secondary: [a.action({ id: "delete", label: "Delete" })],  // In dropdown menu (...)
+ * }
+ * ```
+ */
+interface FormViewActionsConfig<TItem = any> {
+  /** Actions shown as buttons (next to Save) */
+  primary?: ActionDefinition<TItem>[];
+  /** Actions shown in dropdown menu (...) */
+  secondary?: ActionDefinition<TItem>[];
+}
+/**
+ * Registry for custom field and widget components
+ */
+interface ComponentRegistry {
+  /**
+   * Custom field components by type
+   */
+  fields?: Record<string, MaybeLazyComponent<FieldComponentProps>>;
+  /**
+   * Custom widget components by type
+   */
+  widgets?: Record<string, MaybeLazyComponent<any>>;
+  /**
+   * Custom named components (for component prop on fields)
+   */
+  custom?: Record<string, MaybeLazyComponent<any>>;
+}
+//#endregion
+export { ArrayFieldConfig, ComponentRegistry, EmbeddedFieldConfig, FieldComponentProps, FieldHookContext, FieldLayoutItem, FieldUIConfig, FieldValidationConfig, FormSidebarConfig, FormViewConfig, LayoutMode, RelationFieldConfig, RichTextConfig, SectionLayout, SelectOption, TabConfig, TabsLayout, WrapperMode };
+//# sourceMappingURL=field-types.d.mts.map

package/dist/client/builder/types/field-types.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"field-types.d.mts","names":[],"sources":["../../../../src/client/builder/types/field-types.ts"],"sourcesContent":[],"mappings":"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"}