Interactive elements for user actions
Interactive preview of the Button component with different variants.
Install the package via npm:
npm install apex-design-systemimport { Button } from 'apex-design-system';<Button>Click me</Button>The component supports multiple visual variants:
<Button variant="primary">Primary</Button>
<Button variant="secondary">Secondary</Button>
<Button variant="outline">Outline</Button>
<Button variant="ghost">Ghost</Button>
<Button variant="danger">Danger</Button><Button size="sm">Small</Button>
<Button size="md">Medium</Button>
<Button size="lg">Large</Button><Button isLoading>Loading...</Button>import { ArrowRight, Download } from 'lucide-react';
<Button leftIcon={<Download />}>Download</Button>
<Button rightIcon={<ArrowRight />}>Continue</Button>This component follows WAI-ARIA best practices and is WCAG 2.1 AA compliant. It includes proper keyboard navigation, focus management, and screen reader support.