/**

* Ycode Type Definitions

*

* Core types for pages, layers, and editor functionality

*/

// UI State Types (for state-specific styling: hover, focus, etc.)

export type UIState = 'neutral' | 'hover' | 'focus' | 'active' | 'disabled' | 'current';

export type Breakpoint = 'mobile' | 'tablet' | 'desktop';

export type StringAssetId = string;

// Design Property Interfaces

export interface LayoutDesign {

isActive?: boolean;

display?: string;

flexDirection?: string;

flexWrap?: string;

justifyContent?: string;

alignItems?: string;

gap?: string;

columnGap?: string;

rowGap?: string;

gapMode?: 'all' | 'individual'; // User's toggle preference for gap

gridTemplateColumns?: string;

gridTemplateRows?: string;

}

export interface TypographyDesign {

isActive?: boolean;

fontSize?: string;

fontWeight?: string;

fontFamily?: string;

fontStyle?: string;

lineHeight?: string;

letterSpacing?: string;

textAlign?: string;

textTransform?: string;

textDecoration?: string;

textDecorationColor?: string;

textDecorationThickness?: string;

underlineOffset?: string;

verticalAlign?: string;

color?: string;

placeholderColor?: string;

}

export interface SpacingDesign {

isActive?: boolean;

margin?: string;

marginTop?: string;

marginRight?: string;

marginBottom?: string;

marginLeft?: string;

marginMode?: 'all' | 'individual'; // User's toggle preference for margin

padding?: string;

paddingTop?: string;

paddingRight?: string;

paddingBottom?: string;

paddingLeft?: string;

paddingMode?: 'all' | 'individual'; // User's toggle preference for padding

}

export interface SizingDesign {

isActive?: boolean;

width?: string;

height?: string;

minWidth?: string;

minHeight?: string;

maxWidth?: string;

maxHeight?: string;

overflow?: string;

aspectRatio?: string | null;

objectFit?: string | null;

gridColumnSpan?: string | null;

gridRowSpan?: string | null;

}

export interface BordersDesign {

isActive?: boolean;

borderWidth?: string;

borderTopWidth?: string;

borderRightWidth?: string;

borderBottomWidth?: string;

borderLeftWidth?: string;

borderWidthMode?: 'all' | 'individual'; // User's toggle preference for border width

borderStyle?: string;

borderColor?: string;

borderRadius?: string;

borderTopLeftRadius?: string;

borderTopRightRadius?: string;

borderBottomLeftRadius?: string;

borderBottomRightRadius?: string;

borderRadiusMode?: 'all' | 'individual'; // User's toggle preference for border radius

divideX?: string;

divideY?: string;

divideStyle?: string;

divideColor?: string;

outlineWidth?: string;

outlineColor?: string;

outlineOffset?: string;

}

export interface BackgroundsDesign {

isActive?: boolean;

backgroundColor?: string;

backgroundImage?: string;

backgroundSize?: string;

backgroundPosition?: string;

backgroundRepeat?: string;

backgroundClip?: string;

/** CSS variable values for background image per breakpoint/state, e.g. { '--bg-img': 'url(...)' } */

bgImageVars?: Record<string, string>;

/** CSS variable values for background gradient per breakpoint/state, e.g. { '--bg-img': 'linear-gradient(...)' } */

bgGradientVars?: Record<string, string>;

}

export interface EffectsDesign {

isActive?: boolean;

opacity?: string;

boxShadow?: string;

blur?: string;

backdropBlur?: string;

filter?: string;

backdropFilter?: string;

}

export interface PositioningDesign {

isActive?: boolean;

position?: string;

top?: string;

right?: string;

bottom?: string;

left?: string;

zIndex?: string;

}

export interface DesignProperties {

layout?: LayoutDesign;

typography?: TypographyDesign;

spacing?: SpacingDesign;

sizing?: SizingDesign;

borders?: BordersDesign;

backgrounds?: BackgroundsDesign;

effects?: EffectsDesign;

positioning?: PositioningDesign;

}

export interface FormSettings {

success_action?: 'message' | 'redirect'; // What happens on successful submission (default: 'message')

success_message?: string; // Message shown on successful submission (deprecated - now uses alert child)

error_message?: string; // Message shown on failed submission (deprecated - now uses alert child)

redirect_url?: LinkSettingsValue; // Link settings for redirect after successful submission

email_notification?: {

enabled: boolean;

to: string; // Email address to send notifications to

subject?: string; // Email subject line

};

}

export type SwiperAnimationEffect = 'slide' | 'fade' | 'cube' | 'flip' | 'coverflow' | 'cards';

export type SliderLoopMode = 'none' | 'loop' | 'rewind';

export type SliderPaginationType = 'bullets' | 'fraction';

export type LightboxOverlay = 'light' | 'dark';

export type LightboxFilesSource = 'files' | 'cms';

export interface LightboxSettings {

files: string[]; // Asset IDs or external URLs (used when filesSource is 'files')

filesSource: LightboxFilesSource; // Whether files come from manual selection or a CMS field

filesField?: FieldVariable | null; // CMS field binding for dynamic images (used when filesSource is 'cms')

thumbnails: boolean;

navigation: boolean;

pagination: boolean;

zoom: boolean; // Pinch-to-zoom on touch devices

doubleTapZoom: boolean; // Double-tap/click to zoom

mousewheel: boolean; // Navigate slides with scroll wheel

overlay: LightboxOverlay;

groupId: string; // Links multiple lightboxes into one shared gallery

animationEffect: SwiperAnimationEffect;

easing: string;

duration: string; // Transition duration in seconds

}

export interface SliderSettings {

navigation: boolean;

groupSlide: number;

slidesPerGroup: number;

loop: SliderLoopMode;

centered: boolean;

touchEvents: boolean;

slideToClicked: boolean;

mousewheel: boolean;

pagination: boolean;

paginationType: SliderPaginationType;

paginationClickable: boolean;

autoplay: boolean;

pauseOnHover: boolean;

delay: string; // Autoplay delay in seconds

animationEffect: SwiperAnimationEffect;

easing: string;

duration: string; // Transition duration in seconds

}

export interface LayerSettings {

id?: string; // Custom element ID

tag?: string; // HTML tag override (e.g., 'h1', 'h2', etc.)

hidden?: boolean; // Element visibility in canvas

customAttributes?: Record<string, string>; // Custom HTML attributes { attributeName: attributeValue }

locale?: {

format?: 'locale' | 'code'; // Display format for `localeSelector` layers (locale => 'English', code => 'EN')

};

htmlEmbed?: {

code?: string; // Custom HTML code to embed

};

slider?: SliderSettings; // Slider-specific settings (only for slider layers)

lightbox?: LightboxSettings; // Lightbox-specific settings (only for lightbox layers)

form?: FormSettings; // Form-specific settings (only for form layers)

filterOnChange?: boolean; // For filter layers: trigger filtering on every input change (debounced)

optionsSource?: {

collectionId: string;

defaultItemId?: string; // item ID to pre-select as default (select elements)

defaultItemIds?: string[]; // item IDs to pre-check as defaults (checkbox groups)

sortFieldId?: string; // field ID to sort options by (undefined = manual/insertion order)

sortOrder?: 'asc' | 'desc'; // sort direction (defaults to 'asc')

};

selectOptionsMode?: 'list' | 'sort_by' | 'sort_order'; // Builder source mode for select options

sortByCollectionId?: string; // Collection to source sort-by field options from

sortByFieldIds?: string[]; // Which field IDs are enabled as sort-by options

isPlaceholder?: boolean; // Marks an <option> child as a placeholder (disabled, hidden, selected)

map?: MapSettings; // Map-specific settings (only for map layers)

}

export type MapProvider = 'mapbox' | 'google';

export type MapStyle = 'streets' | 'satellite' | 'light' | 'dark' | 'outdoors';

export type GoogleMapStyle = 'roadmap' | 'satellite';

export interface MapProviderSettings {

style: string;

interactive: boolean;

scrollZoom: boolean;

showNavControl: boolean;

showScaleBar: boolean;

}

export interface MapSettings {

provider: MapProvider;

latitude: number;

longitude: number;

zoom: number;

markerColor: string | null;

search?: string;

mapbox: MapProviderSettings;

google: MapProviderSettings;

}

// Layer Style Types

export interface LayerStyle {

id: string;

name: string;

group?: string; // Element category (e.g. "text", "block", "button") for scoped filtering

// Style data

classes: string;

design?: DesignProperties;

// Versioning fields

content_hash?: string; // SHA-256 hash for change detection

is_published: boolean;

created_at: string;

updated_at: string;

deleted_at?: string | null; // Soft delete for undo/redo support

}

export interface LayerInteraction {

id: string;

trigger: 'click' | 'hover' | 'scroll-into-view' | 'while-scrolling' | 'load';

timeline: InteractionTimeline;

tweens: InteractionTween[];

}

export interface InteractionTimeline {

breakpoints: Breakpoint[];

repeat: number; // -1 = infinite, 0 = none, n = repeat n times

yoyo: boolean; // reverse direction on each repeat

scrollStart?: string; // e.g., 'top 80%', 'top center' - when trigger enters viewport

scrollEnd?: string; // e.g., 'bottom top' - when trigger leaves viewport (while-scrolling only)

scrub?: boolean | number; // while-scrolling: true for direct link, number for smoothing (seconds)

toggleActions?: string; // scroll-into-view: GSAP toggleActions (e.g., 'play none none none')

}

export interface InteractionTween {

id: string;

layer_id: string;

position: number | string; // GSAP position: number (seconds), ">" (after previous), "<" (with previous)

duration: number; // seconds

ease: string; // GSAP ease (e.g., 'power1.out', 'elastic.inOut')

from: TweenProperties;

to: TweenProperties;

apply_styles: InteractionApplyStyles;

splitText?: {

type: 'chars' | 'words' | 'lines';

stagger: { amount: number }; // GSAP stagger: { amount: totalTime }

};

}

export type ApplyStyles = 'on-load' | 'on-trigger';

export type TweenPropertyKey = 'x' | 'y' | 'rotation' | 'scale' | 'skewX' | 'skewY' | 'autoAlpha' | 'display';

export type InteractionApplyStyles = Record<TweenPropertyKey, ApplyStyles>;

export type TweenProperties = {

[K in TweenPropertyKey]?: string | null;

};

export interface TextStyle {

label?: string; // Display label for the style (e.g., "Bold", "Italic")

classes?: string;

design?: DesignProperties;

styleId?: string; // Layer style applied to this text style

styleOverrides?: { classes?: string; design?: DesignProperties };

}

export interface Layer {

id: string;

key?: string; // Optional internal ID for the layer (i.e. "localeSelectorLabel")

name: string; // Element type name: 'div', 'section', 'text', etc.

customName?: string; // User-defined name for display in the UI

// Restrictions (for layer actions)

restrictions?: {

copy?: boolean; // Whether the layer can be copied / duplicated

delete?: boolean; // Whether the layer can be deleted

ancestor?: string; // The ancestor `layer.name` that the layer should be a child of

editText?: boolean; // Whether the layer text contents can be edited

};

classes: string | string[]; // Tailwind CSS classes (support arrays and strings)

// Text styles object, e.g. `{ bold: { classes: 'font-bold', design: { typography: { fontWeight: 'bold' } } }, ... }`

textStyles?: Record<string, TextStyle>;

// Children

children?: Layer[];

// Special properties

open?: boolean; // Collapsed/expanded state in tree

hidden?: boolean;

hiddenGenerated?: boolean; // Hidden by default, shown via form actions (for alerts)

alertType?: 'success' | 'error'; // Type of alert (for form success/error messages)

// Attributes (for HTML elements)

attributes?: Record<string, any> & {

id?: string; // Custom HTML ID attribute

// Media element attributes (video/audio)

muted?: boolean;

controls?: boolean;

loop?: boolean;

autoplay?: boolean;

volume?: string; // Volume as string (0-100)

preload?: string; // 'none' | 'metadata' | 'auto'

youtubePrivacyMode?: boolean; // Privacy-enhanced mode (uses youtube-nocookie.com)

};

// Design system (structured properties)

design?: DesignProperties;

// Settings (element-specific configuration)

settings?: LayerSettings;

// Layer Styles (reusable design system)

styleId?: string; // Reference to applied LayerStyle

styleOverrides?: {

classes?: string;

design?: DesignProperties;

}; // Tracks local changes after style applied

// Components (reusable layer trees)

componentId?: string; // Reference to applied Component

componentOverrides?: {

text?: Record<string, ComponentVariableValue>; // ComponentVariable.id → override value (text)

rich_text?: Record<string, ComponentVariableValue>; // ComponentVariable.id → override value (rich text)

image?: Record<string, ComponentVariableValue>; // ComponentVariable.id → override value (image)

link?: Record<string, ComponentVariableValue>; // ComponentVariable.id → override value (link)

audio?: Record<string, ComponentVariableValue>; // ComponentVariable.id → override value (audio)

video?: Record<string, ComponentVariableValue>; // ComponentVariable.id → override value (video)

icon?: Record<string, ComponentVariableValue>; // ComponentVariable.id → override value (icon)

variableLinks?: Record<string, string>; // childVariableId → parentVariableId (pass-through from nested component to parent)

};

// Layer variables (layer collection data & dynamic data for texts, assets, links)

variables?: LayerVariables;

// Interactions / Animations (new structured approach)

interactions?: LayerInteraction[];

// SSR-only property for resolved collection items

_collectionItems?: CollectionItemWithValues[];

// SSR-only property for collection item values (used for visibility filtering)

_collectionItemValues?: Record<string, string>;

// SSR-only property for collection item ID (used for link URL building)

_collectionItemId?: string;

// SSR-only property for collection item slug (used for link URL building)

_collectionItemSlug?: string;

// SSR-only property for layer-specific collection data (layer_id -> field values map)

_layerDataMap?: Record<string, Record<string, string>>;

// SSR-only property for master component ID (for translation lookups)

_masterComponentId?: string;

// SSR-only property for original layer ID before instance-specific ID transform (for translation lookups)

_originalLayerId?: string;

// SSR-only property for pagination metadata (when pagination is enabled)

_paginationMeta?: CollectionPaginationMeta;

// SSR-only property for dynamic inline styles from CMS color field bindings

_dynamicStyles?: Record<string, string>;

// SSR-only property for filterable collection config (when collection has linked filter inputs)

_filterConfig?: {

collectionId: string;

collectionLayerId: string;

filters: ConditionalVisibility;

sortBy?: string;

sortOrder?: 'asc' | 'desc';

sortByInputLayerId?: string;

sortOrderInputLayerId?: string;

limit?: number;

paginationMode?: 'pages' | 'load_more';

layerTemplate: Layer[];

collectionLayerClasses?: string[];

collectionLayerTag?: string;

isPublished?: boolean;

};

}

export interface LayerVariables {

// Collection data

collection?: CollectionVariable;

conditionalVisibility?: ConditionalVisibility;

// Variables by type

text?: DynamicTextVariable | DynamicRichTextVariable;

icon?: {

src?: AssetVariable | StaticTextVariable; // Static Asset ID | Static Text (SVG code, internal use only)

};

image?: {

src: AssetVariable | FieldVariable | DynamicTextVariable; // Static Asset ID | Field Variable | Dynamic Text (URL that allows inline variables)

alt: DynamicTextVariable; // Image alt text with inline variables

};

audio?: {

src: AssetVariable | FieldVariable | DynamicTextVariable; // Static Asset ID | Field Variable | Dynamic Text (URL that allows inline variables)

};

video?: {

src?: AssetVariable | VideoVariable | FieldVariable | DynamicTextVariable; // Static Asset ID | Video provider + ID (YouTube) | Field Variable | Dynamic Text (URL that allows inline variables)

poster?: AssetVariable | FieldVariable; // Poster image (asset or field variable)

};

iframe?: {

src: DynamicTextVariable; // Embed URL (allow inline variables)

};

backgroundImage?: {

src: AssetVariable | FieldVariable | DynamicTextVariable; // Static Asset ID | Field Variable | Dynamic Text (URL)

};

link?: LinkSettings;

// Design property bindings (CMS color fields)

design?: {

backgroundColor?: DesignColorVariable;

color?: DesignColorVariable; // text color

borderColor?: DesignColorVariable;

divideColor?: DesignColorVariable;

outlineColor?: DesignColorVariable;

textDecorationColor?: DesignColorVariable;

placeholderColor?: DesignColorVariable;

};

}

/** A gradient stop with optional CMS field binding */

export interface BoundColorStop {

id: string;

position: number;

color: string; // static fallback color

field?: FieldVariable; // optional CMS binding for this stop

}

/** Design color variable supporting solid and gradient CMS bindings.

* Each mode's state is stored separately so switching tabs preserves bindings. */

export interface DesignColorVariable {

type: 'color';

mode: 'solid' | 'linear' | 'radial';

/** Solid mode: the CMS field binding */

field?: FieldVariable;

/** Linear gradient state (preserved across tab switches) */

linear?: { angle?: number; stops?: BoundColorStop[] };

/** Radial gradient state (preserved across tab switches) */

radial?: { stops?: BoundColorStop[] };

}

// Link type discriminator

export type LinkType = 'url' | 'email' | 'phone' | 'asset' | 'page' | 'field';

// Collection link field types (simplified for CMS fields)

export type CollectionLinkType = 'url' | 'page';

// Collection Link Field Value (stored as JSON in collection item values)

// Note: Link behavior (target, rel) is set on the layer, not in the CMS value

export interface CollectionLinkValue {

type: CollectionLinkType;

// URL link - simple string URL

url?: string;

// Page link - link to a page (static or dynamic with static item)

page?: {

id: string; // Page ID

collection_item_id?: string | null; // Static collection item ID (no current-page/current-collection)

anchor_layer_id?: string | null; // Optional layer ID for anchor links

};

}

// Reusable link settings structure

export interface LinkSettings {

type: LinkType;

// URL link - custom URL with inline variables support

url?: DynamicTextVariable;

// Email link - mailto:address (supports inline variables)

email?: DynamicTextVariable;

// Phone link - tel:number (supports inline variables)

phone?: DynamicTextVariable;

// Asset link - link to downloadable asset

asset?: {

id: StringAssetId | null;

};

// Page link - link to a page (static or dynamic)

page?: {

id: string; // Page ID (static or dynamic)

collection_item_id?: string | null; // Collection item ID (for dynamic pages)

};

// Field link - href from collection field (CMS field containing URL)

field?: FieldVariable;

// Anchor - reference to a layer ID to use as #anchor

anchor_layer_id?: string | null;

// Link behavior

target?: '_blank' | '_self' | '_parent' | '_top';

download?: boolean; // Force download the linked resource

rel?: string; // 'noopener noreferrer' | 'nofollow' | 'sponsored' | 'ugc'

}

// Essentially a layer without ID (that can have children without IDs)

// Optional id is allowed for templates with animations that reference specific layers

export interface LayerTemplate extends Omit<Layer, 'id' | 'children'> {

id?: string; // Optional: used when animations reference specific layers

children?: Array<LayerTemplate | LayerTemplateRef>;

// Inlined component metadata (for portable layouts)

_inlinedComponentName?: string; // Component name when inlined for portability

_inlinedComponentVariables?: ComponentVariable[]; // Component variables when inlined

}

// Template reference marker (lazy reference resolved during template instantiation)

export type LayerTemplateRef = { __ref: string } & Partial<Omit<LayerTemplate, 'children'>> & {

children?: Array<LayerTemplate | LayerTemplateRef>;

};

// Block template definition (used in template collections)

export interface BlockTemplate {

icon: string;

name: string;

template: LayerTemplate | LayerTemplateRef;

}

// Component Variable Types (ComponentVariableValue defined after text variable types)

export interface ComponentVariable {

id: string; // Unique variable ID

name: string; // Display name (e.g., "Button title")

type?: 'text' | 'rich_text' | 'image' | 'link' | 'audio' | 'video' | 'icon'; // Variable type (defaults to 'text' for backwards compatibility)

placeholder?: string; // Placeholder text shown in text override inputs

default_value?: ComponentVariableValue; // Default value

}

// Component Types (Reusable Layer Trees)

export interface Component {

id: string;

name: string;

// Component data - complete layer tree

layers: Layer[];

// Component variables - exposed properties for overrides

variables?: ComponentVariable[];

// Versioning fields

content_hash?: string; // SHA-256 hash for change detection

is_published: boolean;

// Auto-generated preview thumbnail URL (stored in Supabase Storage)

thumbnail_url?: string | null;

created_at: string;

updated_at: string;

deleted_at?: string | null; // Soft delete timestamp

}

export interface Page {

id: string;

slug: string;

name: string;

page_folder_id: string | null; // Reference to page_folders

order: number; // Sort order

depth: number; // Depth in hierarchy

is_index: boolean; // Index of the root or parent folder

is_dynamic: boolean; // Dynamic page (CMS-driven)

error_page: number | null; // Error page type: 401, 404, 500

settings: PageSettings; // Page settings (CMS, auth, seo, custom code)

content_hash?: string; // SHA-256 hash of page metadata for change detection

is_published: boolean;

created_at: string;

updated_at: string;

deleted_at: string | null; // Soft delete timestamp

}

export interface PageSettings {

cms?: {

collection_id: string;

slug_field_id: string;

};

auth?: {

enabled: boolean;

password: string;

};

seo?: {

image: StringAssetId | FieldVariable | null; // Asset ID or Field Variable (image field)

title: string;

description: string;

noindex: boolean; // Prevent search engines from indexing the page

};

custom_code?: {

head: string;

body: string;

};

}

export interface PageLayers {

id: string;

page_id: string;

layers: Layer[];

content_hash?: string; // SHA-256 hash of layers and CSS for change detection

is_published: boolean;

created_at: string;

updated_at?: string;

deleted_at: string | null; // Soft delete timestamp

generated_css?: string; // Extracted CSS from Play CDN for published pages

}

export interface PageFolderSettings {

auth?: {

enabled: boolean;

password: string;

};

}

export interface PageFolder {

id: string;

page_folder_id: string | null; // Self-referential: parent folder ID

name: string;

slug: string;

depth: number; // Folder depth in hierarchy (0 for root)

order: number; // Sort order within parent folder

settings: PageFolderSettings; // Settings for auth (enabled + password), etc.

is_published: boolean;

created_at: string;

updated_at: string;

deleted_at: string | null; // Soft delete timestamp

}

// Page/Folder Duplicate Operation Types

export interface PageItemDuplicateMetadata {

tempId: string;

originalName: string;

parentFolderId: string | null;

expectedName: string;

}

export interface PageItemDuplicateResult<T> {

success: boolean;

data?: T;

error?: string;

metadata?: PageItemDuplicateMetadata;

}

// Asset Types

/**

* Asset categories for validation

*/

export type AssetCategory = 'images' | 'videos' | 'audio' | 'documents' | 'icons';

/**

* Category filter for file manager - supports single, multiple, or all categories

*/

export type AssetCategoryFilter = AssetCategory | AssetCategory[] | 'all' | null;

/**

* Asset - Represents any uploaded file (images, videos, documents, etc.)

*

* The asset system is designed to handle any file type, not just images.

* - Images will have width/height dimensions

* - Non-images will have null width/height

* - Use mime_type to determine asset type (e.g., image/, video/, application/pdf)

*/

export interface Asset {

id: string;

filename: string;

storage_path: string | null; // Nullable for SVG icons with inline content

public_url: string | null; // Nullable for SVG icons with inline content

file_size: number;

mime_type: string;

width?: number | null;

height?: number | null;

source: string; // Required: identifies where the asset was uploaded from

asset_folder_id?: string | null;

content?: string | null; // Inline SVG content for icon assets

content_hash?: string | null; // SHA-256 hash for change detection during publishing

is_published: boolean;

created_at: string;

updated_at: string;

deleted_at: string | null;

}

export interface AssetFolder {

id: string;

asset_folder_id: string | null;

name: string;

depth: number;

order: number;

is_published: boolean;

created_at: string;

updated_at: string;

deleted_at: string | null;

}

export interface CreateAssetFolderData {

id?: string;

name: string;

depth?: number;

order?: number;

is_published?: boolean;

asset_folder_id?: string | null;

}

export interface UpdateAssetFolderData {

name?: string;

depth?: number;

order?: number;

is_published?: boolean;

asset_folder_id?: string | null;

}

// Settings Types

export interface SiteSettings {

site_name: string;

site_description: string;

theme?: string;

logo_url?: string;

}

export interface Redirect {

id: string;

oldUrl: string; // Internal path only, e.g. "/about-us"

newUrl: string; // Internal path "/about" OR external URL "https://example.com"

type?: '301' | '302'; // Permanent vs temporary (default 301)

}

export type SmtpProvider = 'google' | 'microsoft365' | 'mailersend' | 'postmark' | 'sendgrid' | 'mailgun' | 'amazonses' | 'other';

export type EmailMode = 'ycode' | 'custom';

export interface EmailSettings {

enabled: boolean;

mode?: EmailMode;

provider: SmtpProvider;

smtpHost: string;

smtpPort: string;

smtpUser: string;

smtpPassword: string;

fromEmail: string;

fromName: string;

}

// Editor State Types

export interface EditorState {

selectedLayerId: string | null; // Legacy - kept for backward compatibility

selectedLayerIds: string[]; // New multi-select

lastSelectedLayerId: string | null; // For Shift+Click range

currentPageId: string | null;

isDragging: boolean;

isLoading: boolean;

isSaving: boolean;

activeBreakpoint: Breakpoint;

activeUIState: UIState; // Current UI state for editing (hover, focus, etc.)

}

// API Response Types

export interface ApiResponse<T> {

data?: T;

error?: string;

message?: string;

}

export interface PaginatedResponse<T> {

data: T[];

total: number;

page: number;

per_page: number;

}

// Supabase Config Types (for setup wizard)

export interface SupabaseConfig {

anonKey: string;

serviceRoleKey: string;

connectionUrl: string; // With [YOUR-PASSWORD] placeholder

dbPassword: string; // Actual password to replace [YOUR-PASSWORD]

}

// Internal credentials structure (derived from SupabaseConfig)

export interface SupabaseCredentials {

anonKey: string;

serviceRoleKey: string;

connectionUrl: string; // Original with placeholder

dbPassword: string;

// Derived properties

projectId: string;

projectUrl: string; // API URL: https://[PROJECT_ID].supabase.co

dbHost: string;

dbPort: number;

dbName: string;

dbUser: string;

}

// Vercel Config Types

export interface VercelConfig {

project_id: string;

token: string;

}

// Setup Wizard Types

export type SetupStep = 'welcome' | 'supabase' | 'migrate' | 'admin' | 'template' | 'complete';

export interface SetupState {

currentStep: SetupStep;

supabaseConfig?: SupabaseConfig;

vercelConfig?: VercelConfig;

adminEmail?: string;

isComplete: boolean;

}

// Auth Types

export interface AuthUser {

id: string;

email: string;

created_at: string;

updated_at: string;

}

export interface AuthSession {

access_token: string;

refresh_token: string;

expires_at: number;

user: AuthUser;

}

export interface AuthState {

user: AuthUser | null;

session: AuthSession | null;

loading: boolean;

initialized: boolean;

error: string | null;

}

// Collaboration Types

export interface CollaborationUser {

user_id: string;

email: string;

display_name: string;

avatar_url: string | null;

color: string;

cursor: { x: number; y: number } | null;

selected_layer_id: string | null;

locked_layer_id: string | null;

is_editing: boolean; // Typing/editing indicator

last_active: number;

page_id: string;

}

// Legacy type - use ResourceLock from useCollaborationPresenceStore instead

export interface LayerLock {

layer_id: string;

user_id: string;

acquired_at: number;

expires_at: number;

}

export interface LayerUpdate {

layer_id: string;

user_id: string;

changes: Partial<Layer>;

timestamp: number;

}

// Base collaboration state - extended in useCollaborationPresenceStore

export interface CollaborationState {

users: Record<string, CollaborationUser>;

isConnected: boolean;

currentUserId: string | null;

currentUserColor: string;

currentUserAvatarUrl: string | null;

}

export interface ActivityNotification {

id: string;

type: 'user_joined' | 'user_left' | 'layer_edit_started' | 'layer_edit_ended' | 'page_published' | 'user_idle' | 'page_created' | 'page_deleted';

user_id: string;

user_name: string;

layer_id?: string;

layer_name?: string;

page_id?: string;

timestamp: number;

message: string;

}

// Collection Types (EAV Architecture)

export type CollectionFieldType = 'text' | 'number' | 'boolean' | 'date' | 'date_only' | 'color' | 'reference' | 'multi_reference' | 'rich_text' | 'image' | 'audio' | 'video' | 'document' | 'link' | 'email' | 'phone' | 'status';

export type CollectionSortDirection = 'asc' | 'desc' | 'manual';

export interface CollectionSorting {

field: string; // field ID or 'manual_order'

direction: CollectionSortDirection;

}

export interface Collection {

id: string; // UUID

name: string;

uuid: string;

created_at: string;

updated_at: string;

deleted_at: string | null;

sorting: CollectionSorting | null;

order: number;

is_published: boolean;

draft_items_count?: number;

has_published_version?: boolean;

}

export interface CreateCollectionData {

name: string;

sorting?: CollectionSorting | null;

order?: number;

is_published?: boolean;

}

export interface UpdateCollectionData {

name?: string;

sorting?: CollectionSorting | null;

order?: number;

}

/** Field-specific settings stored in the data column */

export interface CollectionFieldData {

multiple?: boolean; // For asset fields - allow multiple files

}

export interface CreateCollectionFieldData {

name: string;

key?: string | null;

type: CollectionFieldType;

default?: string | null;

fillable?: boolean;

order: number;

collection_id: string; // UUID

reference_collection_id?: string | null; // UUID

hidden?: boolean;

is_computed?: boolean;

data?: CollectionFieldData;

is_published?: boolean;

}

export interface UpdateCollectionFieldData {

name?: string;

key?: string | null;

type?: CollectionFieldType;

default?: string | null;

fillable?: boolean;

order?: number;

reference_collection_id?: string | null; // UUID

hidden?: boolean;

data?: CollectionFieldData;