feat: drawer #137
feat: drawer #137
Conversation
There was a problem hiding this comment.
Pull Request Overview
This PR introduces a new Drawer sliding panel component with support for four directions and a Storybook demo.
- Adds a barrel export for the
Drawercomponent - Implements
DrawerinDrawer.tsxwith position, transform, and back‐button logic - Provides a Storybook story demonstrating usage and theming options
Reviewed Changes
Copilot reviewed 3 out of 3 changed files in this pull request and generated 2 comments.
| File | Description |
|---|---|
| src/components/Drawer/index.ts | Exports the new Drawer component |
| src/components/Drawer/Drawer.tsx | Implements the sliding panel logic and UI |
| src/components/Drawer/Drawer.stories.tsx | Adds a Storybook example for the drawer |
Comments suppressed due to low confidence (1)
src/components/Drawer/Drawer.tsx:1
- The new
Drawercomponent lacks unit or integration tests covering open/close behavior, directional transforms, and the back button callback. Consider adding tests to validate each direction and interaction.
import React from "react";
| }; | ||
|
|
||
| return ( | ||
| <div |
There was a problem hiding this comment.
The drawer container lacks ARIA roles and attributes. Consider adding role="dialog", aria-modal="true", and an aria-labelledby referencing the title header to improve screen‐reader support.
Copilot uses AI. Check for mistakes.
| switch (direction) { | ||
| case "left": | ||
| return ( | ||
| <svg |
There was a problem hiding this comment.
[nitpick] SVG markup is duplicated for each direction. You could extract a base arrow icon component and apply CSS rotation or transform props instead of repeating nearly identical SVG blocks.
Copilot uses AI. Check for mistakes.
No description provided.