GenericEnumChip

A coloured MUI Chip driven by an enum value and a colour mapping. Standardises the visual representation of status, category, and type fields across the app.

📖 Storybook

Preview

Live preview↗ Open in Storybook

Import

import { GenericEnumChip } from "@xocialive/ui-components";

Basic usage

const STATUS_COLORS = {
  active: "success",
  inactive: "error",
  pending: "warning",
} as const;

<GenericEnumChip value={user.status} colorMap={STATUS_COLORS} />;

Props

Prop	Type	Default	Description
value	string	—	The enum value to display
colorMap	Record<string, MuiChipColor>	—	Maps enum values to MUI chip colour names
labelMap	Record<string, string>	—	Optional display labels (falls back to value if omitted)
size	"small" | "medium"	"small"	Chip size
sx	SxProps<Theme>	—	Root element style overrides