mirror of
https://github.com/amitwh/markdown-converter.git
synced 2026-08-02 10:00:17 +05:30
feat(renderer): Toolbar skeleton with formatting buttons
This commit is contained in:
@@ -0,0 +1,15 @@
|
||||
import { Bold, Italic, List, ListOrdered, Code, Link as LinkIcon } from 'lucide-react';
|
||||
import { Button } from '@/components/ui/button';
|
||||
|
||||
export function Toolbar() {
|
||||
return (
|
||||
<div className="flex h-10 items-center gap-1 border-b border-border bg-card/10 px-3">
|
||||
<Button variant="ghost" size="icon" aria-label="Bold"><Bold className="h-4 w-4" /></Button>
|
||||
<Button variant="ghost" size="icon" aria-label="Italic"><Italic className="h-4 w-4" /></Button>
|
||||
<Button variant="ghost" size="icon" aria-label="Unordered list"><List className="h-4 w-4" /></Button>
|
||||
<Button variant="ghost" size="icon" aria-label="Ordered list"><ListOrdered className="h-4 w-4" /></Button>
|
||||
<Button variant="ghost" size="icon" aria-label="Code"><Code className="h-4 w-4" /></Button>
|
||||
<Button variant="ghost" size="icon" aria-label="Link"><LinkIcon className="h-4 w-4" /></Button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,11 @@
|
||||
import { describe, it, expect } from 'vitest';
|
||||
import { render, screen } from '@testing-library/react';
|
||||
import { Toolbar } from '@/components/layout/Toolbar';
|
||||
|
||||
describe('Toolbar', () => {
|
||||
it('renders formatting buttons', () => {
|
||||
render(<Toolbar />);
|
||||
expect(screen.getByRole('button', { name: /bold/i })).toBeInTheDocument();
|
||||
expect(screen.getByRole('button', { name: /italic/i })).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user