-- VDS_LayoutConfig_Live
-- ============================================================================
-- Live + liveWithGallery view widgets: liveEditPanel (footer) + galleryPanel
-- (liveWithGallery col 2).

VDS = VDS or {}
local LC = VDS.LayoutConfig

-- ===== LIVE EDIT (liveEditPanel) =====

LC.sections["liveEdit.stack"] = {
    ["in"]  = "liveEditPanel",
    order   = 10,
    layout  = "vertical",
    padding = { left = 8, top = 4, right = 8, bottom = 6 },
    gap     = 4,
}

-- Header row: decor name (left) + Clear-all button (right). Replaces the
-- centered standalone label so the button has a home and the name reads as
-- a panel title rather than a centered caption.
LC.sections["liveEdit.headerRow"] = {
    ["in"]  = "liveEdit.stack",
    order   = 10,
    layout  = "horizontal",
    gap     = 6,
    height  = 20,
}

LC.widgets["liveEdit.decorName"] = {
    kind     = "label",
    ["in"]   = "liveEdit.headerRow",
    order    = 10,
    binding  = "live.decorName",
    font     = "subheading",
    width    = "fill",
    height   = 20,
    justifyH = "LEFT",
    tooltip  = false,
}

LC.widgets["liveEdit.clearAllBtn"] = {
    kind    = "button",
    ["in"]  = "liveEdit.headerRow",
    order   = 20,
    font    = "caption",
    text    = "Clear all",
    width   = 64,
    height  = 18,
    tooltip = { recipe = "ClearAllSlots" },
}

-- Harmony strategy strip (Stage B, §5.3): 7 compact buttons in one horizontal
-- row. Clicking fills the non-focused slots with picks from VDS.Harmony.forDye.
-- order=15 places it between the header (10) and the first slot row (20).
LC.sections["liveEdit.harmonyStrip"] = {
    ["in"]  = "liveEdit.stack",
    order   = 15,
    layout  = "horizontal",
    gap     = 4,
    height  = 18,
}

-- Chromatic-anchor buttons (7): visible when focused dye is chromatic or no dye focused.
LC.widgets["liveEdit.harmonyBtn.Neutral"] = {
    kind    = "button",
    ["in"]  = "liveEdit.harmonyStrip",
    order   = 10,
    font    = "caption",
    text    = "Neutral",
    width   = 52,
    height  = 18,
    visible = "live.harmonyShowChromatic",
    tooltip = { recipe = "HarmoniseBtn" },
}

LC.widgets["liveEdit.harmonyBtn.Monochromatic"] = {
    kind    = "button",
    ["in"]  = "liveEdit.harmonyStrip",
    order   = 20,
    font    = "caption",
    text    = "Mono",
    width   = 42,
    height  = 18,
    visible = "live.harmonyShowChromatic",
    tooltip = { recipe = "HarmoniseBtn" },
}

LC.widgets["liveEdit.harmonyBtn.Analogous"] = {
    kind    = "button",
    ["in"]  = "liveEdit.harmonyStrip",
    order   = 30,
    font    = "caption",
    text    = "Analog",
    width   = 48,
    height  = 18,
    visible = "live.harmonyShowChromatic",
    tooltip = { recipe = "HarmoniseBtn" },
}

LC.widgets["liveEdit.harmonyBtn.Complement"] = {
    kind    = "button",
    ["in"]  = "liveEdit.harmonyStrip",
    order   = 40,
    font    = "caption",
    text    = "Comp",
    width   = 42,
    height  = 18,
    visible = "live.harmonyShowChromatic",
    tooltip = { recipe = "HarmoniseBtn" },
}

LC.widgets["liveEdit.harmonyBtn.Split"] = {
    kind    = "button",
    ["in"]  = "liveEdit.harmonyStrip",
    order   = 50,
    font    = "caption",
    text    = "Split",
    width   = 40,
    height  = 18,
    visible = "live.harmonyShowChromatic",
    tooltip = { recipe = "HarmoniseBtn" },
}

LC.widgets["liveEdit.harmonyBtn.Triad"] = {
    kind    = "button",
    ["in"]  = "liveEdit.harmonyStrip",
    order   = 60,
    font    = "caption",
    text    = "Triad",
    width   = 40,
    height  = 18,
    visible = "live.harmonyShowChromatic",
    tooltip = { recipe = "HarmoniseBtn" },
}

LC.widgets["liveEdit.harmonyBtn.Clash"] = {
    kind    = "button",
    ["in"]  = "liveEdit.harmonyStrip",
    order   = 70,
    font    = "caption",
    text    = "Clash",
    width   = 40,
    height  = 18,
    visible = "live.harmonyShowChromatic",
    tooltip = { recipe = "HarmoniseBtn" },
}

-- Neutral-anchor buttons (3): visible only when focused dye is neutral.
LC.widgets["liveEdit.harmonyBtn.Tones"] = {
    kind    = "button",
    ["in"]  = "liveEdit.harmonyStrip",
    order   = 80,
    font    = "caption",
    text    = "Tones",
    width   = 50,
    height  = 18,
    visible = "live.harmonyShowNeutral",
    tooltip = { recipe = "HarmoniseBtn" },
}

LC.widgets["liveEdit.harmonyBtn.Contrast"] = {
    kind    = "button",
    ["in"]  = "liveEdit.harmonyStrip",
    order   = 90,
    font    = "caption",
    text    = "Contrast",
    width   = 56,
    height  = 18,
    visible = "live.harmonyShowNeutral",
    tooltip = { recipe = "HarmoniseBtn" },
}

LC.widgets["liveEdit.harmonyBtn.Accent"] = {
    kind    = "button",
    ["in"]  = "liveEdit.harmonyStrip",
    order   = 100,
    font    = "caption",
    text    = "Accent",
    width   = 50,
    height  = 18,
    visible = "live.harmonyShowNeutral",
    tooltip = { recipe = "HarmoniseBtn" },
}

LC.widgets["liveEdit.slot1"] = {
    kind    = "slotRow",
    ["in"]  = "liveEdit.stack",
    order   = 20,
    visible = "live.hasSlot1",
    binding = "live.slot1",
    height  = 44,
    tooltip = false,
}

LC.widgets["liveEdit.slot2"] = {
    kind    = "slotRow",
    ["in"]  = "liveEdit.stack",
    order   = 30,
    visible = "live.hasSlot2",
    binding = "live.slot2",
    height  = 44,
    tooltip = false,
}

LC.widgets["liveEdit.slot3"] = {
    kind    = "slotRow",
    ["in"]  = "liveEdit.stack",
    order   = 40,
    visible = "live.hasSlot3",
    binding = "live.slot3",
    height  = 44,
    tooltip = false,
}

-- Visual breather between the channel picker (slot rows) and the action bar
-- so the buttons read as a separate band, not glued to slot 3.
LC.widgets["liveEdit.actionBarGap"] = {
    kind    = "spacer",
    ["in"]  = "liveEdit.stack",
    order   = 50,
    height  = 10,
    tooltip = false,
}

-- Action bar: owned-only filter + cost + Cancel + Apply.
LC.sections["liveEdit.actionBar"] = {
    ["in"]  = "liveEdit.stack",
    order   = 60,
    layout  = "horizontal",
    gap     = 6,
    height  = 34,  -- fits the tall primary Apply button (others center-align)
}

-- Owned-dye filter lives here (not config) -- it's toggled mid-edit while
-- browsing the dye list; auto-save moved to the config sidebar (set-and-forget).
LC.widgets["liveEdit.ownedCheck"] = {
    kind    = "checkbox",
    ["in"]  = "liveEdit.actionBar",
    order   = 60,  -- far RIGHT (row flipped: Apply | Revert | Snapshot | ... | Owned only)
    binding = "filter.owned",
    label   = "Owned only",
    width   = 82,
    height  = 22,
    tooltip = { recipe = "OwnedOnly" },
}

LC.widgets["liveEdit.actionSpacer"] = {
    kind    = "spacer",
    ["in"]  = "liveEdit.actionBar",
    order   = 40,  -- pushes the status cluster (cost + Owned only) to the right
    width   = "fill",
    tooltip = false,
}

-- Snapshot: lift the currently-displayed dye scheme into a saved variant.
-- Existing CANVAS_SAVE_LOADOUT reducer handles dedupe + promote-to-top + cap.
LC.widgets["liveEdit.snapshotBtn"] = {
    kind    = "button",
    ["in"]  = "liveEdit.actionBar",
    order   = 30,  -- third of the left action cluster (Apply | Revert | Snapshot)
    font    = "body",
    text    = "Snapshot",
    width   = 80,
    height  = 22,
    tooltip = { recipe = "Snapshot" },
}

-- "Revert" not "Cancel"/"Undo": it restores ALL slots to the last applied
-- baseline and stays in customize mode -- Blizzard's Edit Mode pairs
-- Apply/Revert the same way (EditModeDialogs.xml RevertChangesButton).
LC.widgets["liveEdit.revertBtn"] = {
    kind    = "button",
    ["in"]  = "liveEdit.actionBar",
    order   = 20,  -- second of the left action cluster (Apply | Revert | Snapshot)
    font    = "body",
    text    = "Revert",
    width   = 80,
    height  = 22,
    tooltip = { recipe = "Revert" },
}

LC.widgets["liveEdit.applyBtn"] = {
    kind    = "button",
    ["in"]  = "liveEdit.actionBar",
    order   = 10,  -- FAR LEFT (row flipped: Apply | Revert | Snapshot | ... | Owned only)
    font    = "body",
    text    = "Apply",
    variant = "success",  -- green confirm button: stands out as the primary action
    width   = 120,  -- primary action: wider + taller than the others to stand out
    height  = 34,
    tooltip = { recipe = "Apply" },
}

-- Recent dyes: last LIVE_RECENT_DYES_MAX dyes applied in live mode (account-persisted ring
-- buffer, newest first; donor VDS_LivePreview.lua:486-613). Gated on
-- live.hasRecentDyes so the stack reserves no space until a dye lands;
-- view.live.rows / view.live.height budget +32 (28 + stack gap 4) when
-- visible. Per-swatch tooltips wired by Controller_Live, not the engine.
LC.widgets["liveEdit.recentStrip"] = {
    kind    = "recentDyeStrip",
    ["in"]  = "liveEdit.stack",
    order   = 70,
    visible = "live.hasRecentDyes",
    binding = "live.recentDyes",
    height  = 28,
    tooltip = false,
}

-- ===== GALLERY (galleryPanel; liveWithGallery col 2) =====

LC.sections["gallery.stack"] = {
    ["in"]  = "galleryPanel",
    order   = 10,
    layout  = "vertical",
    padding = { left = 4, top = 4, right = 4, bottom = 4 },
    gap     = 4,
}

LC.widgets["gallery.title"] = {
    kind    = "label",
    ["in"]  = "gallery.stack",
    order   = 10,
    text    = "Saved Variants",
    font    = "subheading",
    height  = 20,
    tooltip = false,
}

LC.widgets["gallery.scroll"] = {
    kind     = "scrollBoxList",
    ["in"]   = "gallery.stack",
    order    = 20,
    binding  = "live.gallery.loadouts",
    height   = "fill",
    extent   = 110,
    rowKinds = { loadout = "galleryTile" },
    tooltip = false,
}
