# Theme Models Comparison

This document shows the properties stored in each theme type to help you understand what each theme saves.

## Layout Appearance Theme (Existing)

**File:** `Theme.swift`  
**Storage Key:** `"savedThemes"`

### Properties Stored:
```swift
struct Theme {
    // Metadata
    let id: UUID
    var name: String
    var createdAt: Date
    var updatedAt: Date
    var notes: String?
    
    // Overlay Settings
    var overlayBorderColorHex: String
    var overlayBackgroundColorHex: String
    var overlayBorderWidth: Double
    var overlayBorderRadius: Double
    
    // Text Settings
    var textBorderColorHex: String
    var textBackgroundColorHex: String
    var textBorderWidth: Double
    var textColorHex: String
    var textSize: Double
    var textBorderRadius: Double
    var isTextBold: Bool
    var labelPositionRaw: String
}
```

**AppStorage Keys Used:**
- `overlayBorderColor`
- `overlayBackgroundColor`
- `overlayBorderWidth`
- `overlayBorderRadius`
- `textBorderColor`
- `textBackgroundColor`
- `textBorderWidth`
- `textColor`
- `textSize`
- `textBorderRadius`
- `labelPosition`
- `isTextBold`

---

## Window Switcher Theme (NEW)

**File:** `SwitcherTheme.swift`  
**Storage Key:** `"savedSwitcherThemes"`

### Properties Stored:
```swift
struct SwitcherTheme {
    // Metadata
    let id: UUID
    var name: String
    var createdAt: Date
    var updatedAt: Date
    var notes: String?
    
    // Border Settings (Window Switcher specific)
    var overlayBorderColorHex: String
    var overlayBackgroundColorHex: String
    var overlayBorderWidth: Double
    var overlayBorderRadius: Double
    
    // Label Settings (Window Switcher specific)
    var textBorderColorHex: String
    var textBackgroundColorHex: String
    var textBorderWidth: Double
    var textColorHex: String
    var textSize: Double
    var textBorderRadius: Double
    var isTextBold: Bool
    var labelPositionRaw: String
    
    // Window Switcher Specific
    var showWindowInfo: Bool
    var defaultDisplayModeRaw: String
}
```

**AppStorage Keys Used:**
- `wsBorderColor` ← Window Switcher prefix
- `wsBackgroundColor`
- `wsBorderWidth`
- `wsBorderRadius`
- `wsTextBorderColor`
- `wsTextBackgroundColor`
- `wsTextBorderWidth`
- `wsTextColor`
- `wsTextSize`
- `wsTextBorderRadius`
- `wsTextBold`
- `wsLabelPosition`
- `showWindowInfo`
- `fsDefaultDisplayMode`

---

## Move/Resize Theme (NEW)

**File:** `MoveResizeTheme.swift`  
**Storage Key:** `"savedMoveResizeThemes"`

### Properties Stored:
```swift
struct MoveResizeTheme {
    // Metadata
    let id: UUID
    var name: String
    var createdAt: Date
    var updatedAt: Date
    var notes: String?
    
    // Selection Frame
    var selectionColorHex: String
    var selectionBorderWidth: Double
    var selectionGlow: Bool
    
    // Snap Target Frame
    var snapTargetColorHex: String
    var snapTargetBorderWidth: Double
    var snapTargetGlow: Bool
    
    // Corner Radius (shared)
    var cornerRadius: Int
    
    // Behavior
    var snapEnabled: Bool
    var snapThreshold: Double
    var snapResistance: Double
    var moveStep: Double
}
```

**AppStorage Keys Used:**
- `mrSelectionColorHex` ← Move/Resize prefix
- `mrSelectionBorderWidth`
- `mrSelectionGlow`
- `mrSnapTargetColorHex`
- `mrSnapTargetBorderWidth`
- `mrSnapTargetGlow`
- `mrCornerRadius`
- `mrSnapEnabled`
- `mrSnapThreshold`
- `mrSnapResistance`
- `mrMoveStep`

---

## Key Differences

### Layout Appearance vs Window Switcher
Both have similar properties for overlay and text styling, but:
- **Layout Appearance:** Generic overlay settings for layout visualization
- **Window Switcher:** Additional `showWindowInfo` and `defaultDisplayMode` settings
- **Different AppStorage keys:** Layout uses no prefix, Switcher uses `ws` prefix

### Move/Resize is Completely Different
- No text/label styling
- Focuses on frame appearance (selection and snap target)
- Includes behavior settings (snap, move step)
- Uses `mr` prefix for all AppStorage keys

---

## Storage Architecture

```
UserDefaults
├── "savedThemes" → [Theme] (Layout Appearance)
├── "savedSwitcherThemes" → [SwitcherTheme] (Window Switcher)
└── "savedMoveResizeThemes" → [MoveResizeTheme] (Move/Resize)
```

**Each is completely independent!**

No cross-contamination between theme types.

---

## Color Preview Logic

### Layout Appearance
```swift
var previewColors: (overlayBorder: String, overlayBackground: String, text: String)
```
Shows 3 colors: overlay border, overlay background, text color

### Window Switcher
```swift
var previewColors: (border: String, background: String, text: String)
```
Shows 3 colors: border, background, text color

### Move/Resize
```swift
var previewColors: (selection: String, snapTarget: String)
```
Shows 2 colors: selection frame, snap target frame

---

## JSON Structure Examples

### Layout Theme JSON
```json
{
  "id": "...",
  "name": "My Layout Theme",
  "overlayBorderColorHex": "#FFFF00",
  "overlayBackgroundColorHex": "#88FFFF00",
  "overlayBorderWidth": 2.0,
  "overlayBorderRadius": 2.0,
  "textBorderColorHex": "#FFFF00",
  "textBackgroundColorHex": "#88FFFF00",
  "textBorderWidth": 2.0,
  "textColorHex": "#FFFF00",
  "textSize": 28.0,
  "textBorderRadius": 6.0,
  "isTextBold": true,
  "labelPositionRaw": "center",
  "createdAt": "2026-04-12T...",
  "updatedAt": "2026-04-12T..."
}
```

### Switcher Theme JSON
```json
{
  "id": "...",
  "name": "My Switcher Theme",
  "overlayBorderColorHex": "#00D4FF",
  "overlayBackgroundColorHex": "#8800D4FF",
  "overlayBorderWidth": 3.0,
  "overlayBorderRadius": 8.0,
  "textBorderColorHex": "#FFFFFF",
  "textBackgroundColorHex": "#DD000000",
  "textBorderWidth": 2.0,
  "textColorHex": "#FFFFFF",
  "textSize": 64.0,
  "textBorderRadius": 8.0,
  "isTextBold": true,
  "labelPositionRaw": "topLeft",
  "showWindowInfo": true,
  "defaultDisplayModeRaw": "frames",
  "createdAt": "2026-04-12T...",
  "updatedAt": "2026-04-12T..."
}
```

### Move/Resize Theme JSON
```json
{
  "id": "...",
  "name": "My Move/Resize Theme",
  "selectionColorHex": "#0A84FFCC",
  "selectionBorderWidth": 3.0,
  "selectionGlow": true,
  "snapTargetColorHex": "#30D158CC",
  "snapTargetBorderWidth": 3.0,
  "snapTargetGlow": true,
  "cornerRadius": 10,
  "snapEnabled": true,
  "snapThreshold": 20.0,
  "snapResistance": 3.0,
  "moveStep": 20.0,
  "createdAt": "2026-04-12T...",
  "updatedAt": "2026-04-12T..."
}
```
