Themes and design-system components

Use theme tokens

Import @kajay/themes/styles.css for the shipped structure and token defaults. Add a preset or override --kajay-* custom properties in your application scope for color, spacing, radius, and typography.

Replace design-system primitives

Use the component map when controls must be your application’s actual components rather than Kajay controls with different CSS.

import type { SurveyComponents } from '@kajay/react';

const components = {
  Button: AppButton,
  Input: AppInput,
  Textarea: AppTextarea,
  Checkbox: AppCheckbox,
  Radio: AppRadio,
} satisfies SurveyComponents;

<Survey model={survey} components={components} />

Preserve behavior