import { ReactNode } from "react"; export type FieldType = | "input" | "textarea" | "select" | "switch" | "slider" | "checkbox" | "radio" | "number" | "password" | "email" | "url" | "date" | "time" | "datetime-local" | "color" | "file" | "range" | "tel"; export interface SelectOption { label: string; value: string | number; disabled?: boolean; description?: string; } export interface ValidationRule { required?: boolean; min?: number; max?: number; minLength?: number; maxLength?: number; pattern?: RegExp; custom?: (value: any) => string | null; } export interface FieldConfig { id: string; label: string; description?: string; type: FieldType; value: any; placeholder?: string; disabled?: boolean; readOnly?: boolean; validation?: ValidationRule; // Type-specific props options?: SelectOption[]; min?: number; max?: number; step?: number; accept?: string; // for file input multiple?: boolean; rows?: number; // for textarea // Layout props grid?: { span?: number; offset?: number; }; // Conditional rendering dependsOn?: string; showWhen?: (values: Record) => boolean; // Custom render function render?: (field: FieldConfig, value: any, onChange: (value: any) => void) => ReactNode; } export interface SectionConfig { id: string; title: string; description?: string; icon?: ReactNode; collapsed?: boolean; fields: FieldConfig[]; // Layout columns?: number; // Access control permissions?: string[]; // Custom render render?: (section: SectionConfig, children: ReactNode) => ReactNode; } export interface TabConfig { id: string; title: string; icon?: ReactNode; badge?: string | number; disabled?: boolean; sections: SectionConfig[]; // Access control permissions?: string[]; } export interface ActionConfig { id: string; label: string; icon?: ReactNode; variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link"; size?: "default" | "sm" | "lg" | "icon"; disabled?: boolean; loading?: boolean; permissions?: string[]; onClick: () => void | Promise; } export interface HeaderConfig { title: string; description?: string; actions?: ActionConfig[]; breadcrumbs?: Array<{ label: string; href?: string; }>; } export interface AdminPanelConfig { header: HeaderConfig; tabs: TabConfig[]; // Global settings autoSave?: boolean; autoSaveDelay?: number; // Validation validateOnChange?: boolean; validateOnSubmit?: boolean; // Callbacks onValueChange?: (path: string, value: any, allValues: Record) => void; onSave?: (values: Record) => Promise; onReset?: () => void; onValidate?: (values: Record) => Record; // Theme theme?: { spacing?: "compact" | "normal" | "relaxed"; layout?: "sidebar" | "tabs"; }; } export interface AdminPanelState { values: Record; errors: Record; dirty: Record; loading: boolean; saving: boolean; } // Hook types export interface UseAdminPanelOptions { config: AdminPanelConfig; initialValues?: Record; onSubmit?: (values: Record) => Promise; } export interface UseAdminPanelReturn { state: AdminPanelState; actions: { setValue: (path: string, value: any) => void; setValues: (values: Record) => void; resetValue: (path: string) => void; resetAll: () => void; save: () => Promise; validate: () => boolean; clearErrors: () => void; }; helpers: { getValue: (path: string) => any; getError: (path: string) => string | undefined; isDirty: (path?: string) => boolean; isValid: (path?: string) => boolean; }; } // Data providers export interface AdminDataProvider { load: () => Promise>; save: (values: Record) => Promise; validate?: (values: Record) => Promise>; } // Permission system export interface PermissionChecker { hasPermission: (permission: string) => boolean; hasAnyPermission: (permissions: string[]) => boolean; hasAllPermissions: (permissions: string[]) => boolean; }