WORK-042
ID:WORK-042Status:done

Config-aware theme resolution for plan site

Update the plan site's resolveThemeCss() to read refrakt.config.json when no --theme flag is provided, so the plan site automatically uses the project's installed theme.

When a theme package is specified in config, resolve its CSS (design tokens + base styles) and layer it under the plan rune CSS. When resolution fails or no config exists, fall back to the built-in default theme.

Priority:mediumComplexity:moderateSource:ADR-004,SPEC-014

Acceptance Criteria

  • When --theme is omitted and refrakt.config.json exists with a theme field, that theme is used
  • Theme package is resolved via its npm package exports (package/html or package/base.css)
  • --theme flag still overrides config when provided
  • --theme default and --theme minimal still use built-in themes regardless of config
  • When config exists but theme resolution fails, falls back to built-in default with a warning
  • When no config exists, uses built-in default (standalone mode unchanged)
  • --theme lumina works as shorthand for @refrakt-md/lumina

Approach

  1. In resolveThemeCss(), check if --theme was explicitly provided
  2. If not, look for refrakt.config.json in the working directory (or --config path)
  3. If config has theme, attempt to resolve it as an npm package
  4. Load the theme's ThemeConfig from package/transform export and merge with plan rune configs
  5. Load CSS from the theme package's base export
  6. Fall back gracefully on any error

References

History

  1. 59ded4a
    Content edited
  2. f262d7b
    source+ADR-004,SPEC-014
  3. 0c04296
    statusreadydone
  4. f5b8bf8
    Created (ready, medium, moderate, plan, themes, config)