UI Siêu Ngon
UI Siêu Ngon
A lightweight React component library with zero runtime dependencies. Pure CSS design tokens, full TypeScript support, and automatic dark mode.
Zero deps
Only React as a peer dependency
Dark mode
DSNProvider — persists, toggles, syncs Tailwind
TypeScript
Full type definitions included
Installation
npm install dosieungon-uiyarn add dosieungon-uibun add dosieungon-uiUsage
Import components directly. CSS is injected automatically — no stylesheet import needed.
// 1. Wrap your app root once
import { DSNProvider } from 'dosieungon-ui';
export default function App({ Component, pageProps }) {
return (
<DSNProvider>
<Component {...pageProps} />
</DSNProvider>
);
}
// 2. Import and use components anywhere — CSS is injected automatically
import { Button, Input, Modal } from 'dosieungon-ui';
export function MyPage() {
return <Button variant="primary">Click me</Button>;
}Components
Button
Trigger actions and events
Card
Container with header/footer support
Chip
Labels, tags and removable items
Input
Text input and textarea fields
Select
Dropdown with search and multi-select
Checkbox
Binary and indeterminate toggles
Radio
Single-choice selection groups
Switch
On/off toggle control
Modal
Dialog overlays with animations
Drawer
Slide-in panels from any edge