Themeable React component library for Pinset platform
npm install @pinset/uiThemeable React component library for Pinset platform applications.
``bash`
npm install @pinset/ui @pinset/tokens
`tsx
import { ThemeProvider, Button, Card, CardBody, Badge } from '@pinset/ui'
import '@pinset/tokens' // Design tokens
import '@pinset/ui/styles.css' // Component styles
function App() {
return (
)
}
`
, CardHeader, CardBody, CardTitle$3
- - primary, secondary, accent, danger, ghost
- Input - Text input with label and error
- Textarea - Multi-line text input
- Select - Dropdown select$3
- Badge - default, primary, accent, success, warning, error
- Modal - Dialog overlay$3
- ThemeProvider - Theme context provider
- ThemeSwitcher - Theme and color mode picker
- ThemeSwitcherCompact - Compact color mode toggle
- useTheme - Hook for accessing theme contextThemes
Available themes from
@pinset/tokens:| Theme | Description |
|-------|-------------|
|
classic | Bold primaries, high contrast |
| earth | Warm, earthy tones |
| ocean | Blue-focused, clean aesthetic |
| forest | Dark organic, natural accents |$3
`tsx
{/ Uses 'myapp-theme' and 'myapp-color-mode' in localStorage /}
``MIT