Skip to content

TP-F3 — Visual theme editor in Preferences #162

Description

@ZhuchkaTriplesix

Epic: #159
Depends on: TP-21 (Preferences integration), TP-08 (QueryaTheme factory), shipped in 0.4.2

Source: docs/planned-0.4.3.md

Goal

Let users tweak a subset of theme colors in Preferences → Appearance and export the result as a valid querya.theme.v1 JSON file (MVP: export-only; saving directly to themes folder can be a follow-up).

Files

  • lib/features/settings/... (new editor section/widget)
  • lib/core/theme/parser/querya_theme_manifest.dart (serialization helper)
  • lib/core/theme/theme_controller.dart (apply preview from edited manifest)
  • docs/theme-custom-json.md
  • widget tests under test/features/settings/

Implementation (MVP scope)

  • Start from the currently selected registry theme or a blank dark/light template.
  • Editable groups (first pass):
    • shadcn_colors: primary, background, foreground, card, border
    • editor_colors: background, foreground, selection
    • workbench_colors: canvas, sidebar, titleBar (subset)
  • Color picker using existing design system; live preview via ThemeController without rewriting entire app state on every keystroke (debounce).
  • Export… action: save dialog → write querya.theme.v1 JSON with generated id if missing.
  • Validate colors through existing parseQueryaThemeColor pipeline before export.

Acceptance Criteria

  • User can change at least the MVP color set and see preview update in Preferences.
  • Exported JSON validates against schema and can be re-imported via Import theme….
  • Export does not corrupt unrelated manifest fields from the source theme.
  • Editor is disabled / shows message when built-in read-only themes cannot be edited in place (export as copy instead).

Tests

  • Widget test: change primary → preview callback invoked.
  • Unit test: export produces parseable manifest round-trip.

Notes

If scope grows, split save to themes folder and tokenColors editor to a later issue / 0.4.4.


Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or requestfrontendTheme parser epic label: frontendsettingsTheme parser epic label: settingsthemeTheming, colors, VS Code themes

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions