dodil/erp-ui

src/theme.tsx

/**
 * The ERP theme — Radix Themes with a Dodil-inspired default (purple accent, cool gray), and the client's
 * to change. Every erp-ui component draws its colour, spacing and radius from Radix's tokens and nothing
 * else, so rebranding is one prop (or the --accent-* variables), never an edit to a component.
 */
import "@radix-ui/themes/styles.css";
import "./theme.css";
import { Theme, type ThemeProps } from "@radix-ui/themes";
import type { ReactNode } from "react";

export const ERP_THEME_DEFAULTS = {
  accentColor: "purple",
  grayColor: "slate",
  radius: "medium",
  scaling: "100%",
} as const satisfies Partial<ThemeProps>;

export function ErpTheme({ children, ...overrides }: { children: ReactNode } & Partial<ThemeProps>) {
  return (
    <Theme {...ERP_THEME_DEFAULTS} {...overrides}>
      {children}
    </Theme>
  );
}