Introduction

CSS-first React components for the Gzodo design system.

@gzodo/ui is a CSS-first component library: stable gz-* classes, CSS variables for theming, and thin React wrappers with the same control props as Gzodo CRM (size, variant, color, fullWidth, disabled).

Design model

1. Plain CSS — public styles are gz-* classes, not CSS Modules
2. Variants via data-* — data-size, data-variant, data-color
3. Tokens — --primary, --bg-base, and the rest of the CRM palette
4. Tailwind-friendly — className is merged; a preset is optional
5. HTML-capable — the same classes work without React

Theme

The docs chrome and every demo share one theme class on the document.

Components

• Button, ButtonGroup, Segment, IconButton
• Input, Textarea, Select, DatePicker (CRM calendar), Checkbox, Radio
• Tabs, Form (Section / Row / FieldArray / Submit)
• DropDown, Tooltip
• Text, Tag, InlineTip, Skeleton
• Flex, Container, Avatar, SideBar
• Badge, Modal, DataView

New pages are files in content/pages plus one entry in the registry.