34 lines
923 B
TypeScript
34 lines
923 B
TypeScript
import { ToggleGroup, ToggleGroupItem } from '@/registry/base/toggle-group';
|
|
import { Bold, Italic, Underline } from 'lucide-react';
|
|
|
|
interface BaseToggleGroupDemoProps {
|
|
multiple: boolean;
|
|
size: 'default' | 'sm' | 'lg';
|
|
variant: 'default' | 'outline';
|
|
}
|
|
|
|
export const BaseToggleGroupDemo = ({
|
|
multiple,
|
|
size,
|
|
variant,
|
|
}: BaseToggleGroupDemoProps) => {
|
|
return (
|
|
<ToggleGroup
|
|
defaultValue={['bold']}
|
|
toggleMultiple={multiple}
|
|
size={size}
|
|
variant={variant}
|
|
>
|
|
<ToggleGroupItem value="bold" aria-label="Toggle bold">
|
|
<Bold className="h-4 w-4" />
|
|
</ToggleGroupItem>
|
|
<ToggleGroupItem value="italic" aria-label="Toggle italic">
|
|
<Italic className="h-4 w-4" />
|
|
</ToggleGroupItem>
|
|
<ToggleGroupItem value="underline" aria-label="Toggle underline">
|
|
<Underline className="h-4 w-4" />
|
|
</ToggleGroupItem>
|
|
</ToggleGroup>
|
|
);
|
|
};
|