From e11b519b1bfcd713b6015c381bca20bebdb98062 Mon Sep 17 00:00:00 2001 From: jjangminii Date: Thu, 2 Jul 2026 16:51:11 +0900 Subject: [PATCH 1/4] =?UTF-8?q?feat(ui):=20DeleteButton=20=EC=BB=B4?= =?UTF-8?q?=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EC=B6=94=EA=B0=80=20(#77)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - TrashOnIcon과 "삭제하기" 텍스트로 구성된 삭제 버튼 컴포넌트를 추가했습니다 - 기본은 흰 배경, active(누르는 동안)에는 파란 배경/흰 아이콘·텍스트로 전환됩니다 - Figma 스펙(80x33)에 맞춰 고정 크기로 구현했습니다 --- .../delete-button/DeleteButton.stories.tsx | 26 +++++++++++++++++++ .../button/delete-button/DeleteButton.tsx | 22 ++++++++++++++++ .../src/components/index.ts | 1 + 3 files changed, 49 insertions(+) create mode 100644 packages/timo-design-system/src/components/button/delete-button/DeleteButton.stories.tsx create mode 100644 packages/timo-design-system/src/components/button/delete-button/DeleteButton.tsx diff --git a/packages/timo-design-system/src/components/button/delete-button/DeleteButton.stories.tsx b/packages/timo-design-system/src/components/button/delete-button/DeleteButton.stories.tsx new file mode 100644 index 0000000..9fa5306 --- /dev/null +++ b/packages/timo-design-system/src/components/button/delete-button/DeleteButton.stories.tsx @@ -0,0 +1,26 @@ +import { DeleteButton } from "./DeleteButton"; + +import type { Meta, StoryObj } from "@storybook/react"; + +const meta = { + title: "Components/DeleteButton", + component: DeleteButton, + parameters: { + layout: "centered", + backgrounds: { + default: "light-gray", + values: [ + { name: "light-gray", value: "#F5F5F5" }, + { name: "dark", value: "#333333" }, + { name: "white", value: "#FFFFFF" }, + ], + }, + }, +} satisfies Meta; + +export default meta; +type Story = StoryObj; + +export const Default: Story = { + args: { onClick: () => {} }, +}; diff --git a/packages/timo-design-system/src/components/button/delete-button/DeleteButton.tsx b/packages/timo-design-system/src/components/button/delete-button/DeleteButton.tsx new file mode 100644 index 0000000..d455f09 --- /dev/null +++ b/packages/timo-design-system/src/components/button/delete-button/DeleteButton.tsx @@ -0,0 +1,22 @@ +import { TrashOnIcon } from "@icons"; +import { cn } from "@lib"; + +export interface DeleteButtonProps { + onClick: () => void; +} + +export const DeleteButton = ({ onClick }: DeleteButtonProps) => { + return ( + + ); +}; diff --git a/packages/timo-design-system/src/components/index.ts b/packages/timo-design-system/src/components/index.ts index 7917669..653ccab 100644 --- a/packages/timo-design-system/src/components/index.ts +++ b/packages/timo-design-system/src/components/index.ts @@ -4,4 +4,5 @@ export { Typography } from "@components/typography/Typography"; export { Tag } from "@components/tag/Tag"; export { PriorityIcon } from "@components/priority-icon/PriorityIcon"; export { CreateButton } from "@components/button/create-button/CreateButton"; +export { DeleteButton } from "@components/button/delete-button/DeleteButton"; export { TodayBadge } from "@components/badge/today-badge/TodayBadge"; From 1d8bbbe90876e0d6d4e9daa2723aab37c4aeda18 Mon Sep 17 00:00:00 2001 From: jjangminii Date: Thu, 2 Jul 2026 16:51:35 +0900 Subject: [PATCH 2/4] =?UTF-8?q?style(ui):=20Scrollbar=20=EC=8A=A4=ED=86=A0?= =?UTF-8?q?=EB=A6=AC=20=EC=9E=84=EC=9D=98=EA=B0=92=20=ED=81=B4=EB=9E=98?= =?UTF-8?q?=EC=8A=A4=EB=A5=BC=20Tailwind=20=EC=8A=A4=EC=BC=80=EC=9D=BC=20?= =?UTF-8?q?=EA=B0=92=EC=9C=BC=EB=A1=9C=20=EB=B3=80=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - w-[340px], h-[200px] 등 임의값 클래스를 w-80, h-50 등 Tailwind 스케일 값으로 변경했습니다 --- .../src/components/layout/scrollbar/Scrollbar.stories.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/timo-design-system/src/components/layout/scrollbar/Scrollbar.stories.tsx b/packages/timo-design-system/src/components/layout/scrollbar/Scrollbar.stories.tsx index 9afef7c..d27d7ef 100644 --- a/packages/timo-design-system/src/components/layout/scrollbar/Scrollbar.stories.tsx +++ b/packages/timo-design-system/src/components/layout/scrollbar/Scrollbar.stories.tsx @@ -12,8 +12,8 @@ type Story = StoryObj; export const Default: Story = { render: () => ( -
-
+
+
{Array.from({ length: 20 }, (_, i) => (

아이템 {i + 1} @@ -22,11 +22,11 @@ export const Default: Story = {

-
+
{Array.from({ length: 12 }, (_, i) => (
아이템 {i + 1}
From f663e41d64c8fd2d480a4f6d78e56b0e85269d63 Mon Sep 17 00:00:00 2001 From: KIM JEONGMIN <163228804+jjangminii@users.noreply.github.com> Date: Sun, 5 Jul 2026 00:00:22 +0900 Subject: [PATCH 3/4] Update packages/timo-design-system/src/components/button/delete-button/DeleteButton.stories.tsx MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Co-authored-by: 김민아 --- .../components/button/delete-button/DeleteButton.stories.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/timo-design-system/src/components/button/delete-button/DeleteButton.stories.tsx b/packages/timo-design-system/src/components/button/delete-button/DeleteButton.stories.tsx index 9fa5306..12e3de9 100644 --- a/packages/timo-design-system/src/components/button/delete-button/DeleteButton.stories.tsx +++ b/packages/timo-design-system/src/components/button/delete-button/DeleteButton.stories.tsx @@ -3,7 +3,7 @@ import { DeleteButton } from "./DeleteButton"; import type { Meta, StoryObj } from "@storybook/react"; const meta = { - title: "Components/DeleteButton", + title: "Components/Button/DeleteButton", component: DeleteButton, parameters: { layout: "centered", From 11b460ac8e8a16b86eb0a3196fd26df7db35a752 Mon Sep 17 00:00:00 2001 From: jjangminii Date: Sun, 5 Jul 2026 01:52:06 +0900 Subject: [PATCH 4/4] =?UTF-8?q?refactor(ui):=20DeleteButton=20=EC=8A=A4?= =?UTF-8?q?=ED=86=A0=EB=A6=AC=20import=EB=A5=BC=20=EC=A0=88=EB=8C=80?= =?UTF-8?q?=EA=B2=BD=EB=A1=9C=EB=A1=9C=20=EC=A0=84=ED=99=98=20(#77)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - ./DeleteButton 상대경로를 @components/button/delete-button/DeleteButton alias로 변경했습니다 --- .../components/button/delete-button/DeleteButton.stories.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/timo-design-system/src/components/button/delete-button/DeleteButton.stories.tsx b/packages/timo-design-system/src/components/button/delete-button/DeleteButton.stories.tsx index 12e3de9..12a8799 100644 --- a/packages/timo-design-system/src/components/button/delete-button/DeleteButton.stories.tsx +++ b/packages/timo-design-system/src/components/button/delete-button/DeleteButton.stories.tsx @@ -1,4 +1,4 @@ -import { DeleteButton } from "./DeleteButton"; +import { DeleteButton } from "@components/button/delete-button/DeleteButton"; import type { Meta, StoryObj } from "@storybook/react";