import {
  ThemeColorPicker,
  accentColorSwatches,
} from "@workspace/appearance/components/theme-color-picker"
import type { ThemeColorConfig } from "@workspace/appearance/theme"

export function AccentPicker({
  config,
  onConfigChange,
}: {
  config: ThemeColorConfig
  onConfigChange: (config: ThemeColorConfig) => void
}) {
  return (
    <ThemeColorPicker
      title="Accent color"
      swatches={accentColorSwatches}
      value={config.accentColor}
      onValueChange={(accentColor) =>
        onConfigChange({ ...config, accentColor })
      }
    />
  )
}