From 0596f8658eba416a5bb9f69fc9acfdfb84809448 Mon Sep 17 00:00:00 2001 From: sangrae Date: Fri, 25 Sep 2026 22:06:43 +0900 Subject: [PATCH 1/7] =?UTF-8?q?chore:=20=EC=82=AC=EB=AC=BC=ED=95=A8=20?= =?UTF-8?q?=EC=9C=A0=EC=9D=98=EC=82=AC=ED=95=AD=20=EC=9D=BC=EB=9F=AC?= =?UTF-8?q?=EC=8A=A4=ED=8A=B8=203=EC=A2=85=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/icons/lockers/apply-period.svg | 24 +++++++++++++++++++++ src/assets/icons/lockers/one-per-person.svg | 11 ++++++++++ src/assets/icons/lockers/usage-period.svg | 14 ++++++++++++ 3 files changed, 49 insertions(+) create mode 100644 src/assets/icons/lockers/apply-period.svg create mode 100644 src/assets/icons/lockers/one-per-person.svg create mode 100644 src/assets/icons/lockers/usage-period.svg diff --git a/src/assets/icons/lockers/apply-period.svg b/src/assets/icons/lockers/apply-period.svg new file mode 100644 index 0000000..c8a787a --- /dev/null +++ b/src/assets/icons/lockers/apply-period.svg @@ -0,0 +1,24 @@ + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/icons/lockers/one-per-person.svg b/src/assets/icons/lockers/one-per-person.svg new file mode 100644 index 0000000..be0297d --- /dev/null +++ b/src/assets/icons/lockers/one-per-person.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/assets/icons/lockers/usage-period.svg b/src/assets/icons/lockers/usage-period.svg new file mode 100644 index 0000000..ceb0355 --- /dev/null +++ b/src/assets/icons/lockers/usage-period.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + From 99b5cf86460a4c8fa03cec6a58ae671758ea7080 Mon Sep 17 00:00:00 2001 From: sangrae Date: Fri, 25 Sep 2026 22:06:43 +0900 Subject: [PATCH 2/7] =?UTF-8?q?refactor:=20BottomSheet=EC=9D=98=20?= =?UTF-8?q?=ED=95=B8=EB=93=A4=E2=86=94=EB=82=B4=EC=9A=A9=20=EA=B0=84?= =?UTF-8?q?=EA=B2=A9=EC=9D=84=20=ED=99=94=EB=A9=B4=EC=9D=B4=20=EA=B3=A0?= =?UTF-8?q?=EB=A5=B4=EB=8F=84=EB=A1=9D=20=EB=B6=84=EB=A6=AC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Figma가 시트마다 다르게 잡아둔 값이다 — 빌릴게는 8px, 사물함은 12px. 기본값을 8로 둬서 기존 화면 동작은 그대로다. --- src/components/ui/BottomSheet.tsx | 21 +++++++++++++++++++-- 1 file changed, 19 insertions(+), 2 deletions(-) diff --git a/src/components/ui/BottomSheet.tsx b/src/components/ui/BottomSheet.tsx index bff3859..f976512 100644 --- a/src/components/ui/BottomSheet.tsx +++ b/src/components/ui/BottomSheet.tsx @@ -3,16 +3,31 @@ import { createPortal } from "react-dom"; import { useScreenSheetPortal } from "@/components/ui/useScreenSheetPortal"; +// 드래그 핸들(24px)과 내용 사이 간격. Figma가 시트마다 다르게 잡아둬서 화면이 고른다 — +// 빌릴게 대여(`1422:57178`, `1422:57209`)는 8px, 사물함 유의사항(`1737:218308`)은 12px이다. +type BottomSheetContentGap = 8 | 12; + +const CONTENT_GAP_CLASS_NAMES: Record = { + 8: "mb-2", + 12: "mb-3", +}; + interface BottomSheetProps { open: boolean; onClose: () => void; + contentGap?: BottomSheetContentGap; children: ReactNode; } // Figma: Views / Bottom Sheets (nodeId 1422:57176) — WDS에는 대응하는 코드 컴포넌트가 없다 // (component-convention.md 참고: Native / Bottom Sheet Indicator는 Stream/iOS 목업 전용 로컬 요소). // 딤+시트를 ScreenLayout의 포털 슬롯(useScreenSheetPortal)에 그려서 화면 컬럼 전체를 덮는다. -function BottomSheet({ open, onClose, children }: BottomSheetProps) { +function BottomSheet({ + open, + onClose, + contentGap = 8, + children, +}: BottomSheetProps) { const portalEl = useScreenSheetPortal(); if (!portalEl) { @@ -38,7 +53,9 @@ function BottomSheet({ open, onClose, children }: BottomSheetProps) { open ? "translate-y-0" : "translate-y-full" }`} > -
+
{children} From 51e3483a624a310a7fdb4cf86d56a43c7cfc1194 Mon Sep 17 00:00:00 2001 From: sangrae Date: Fri, 25 Sep 2026 22:06:43 +0900 Subject: [PATCH 3/7] =?UTF-8?q?feat:=20=EC=82=AC=EB=AC=BC=ED=95=A8=20?= =?UTF-8?q?=EC=8B=A0=EC=B2=AD=20=EC=A0=84=20=EC=9C=A0=EC=9D=98=EC=82=AC?= =?UTF-8?q?=ED=95=AD=20=EB=B0=94=ED=85=80=EC=8B=9C=ED=8A=B8=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../lockers/components/LockersNoticeSheet.tsx | 83 +++++++++++++++++++ .../lockers/constants/lockersNotice.ts | 31 +++++++ 2 files changed, 114 insertions(+) create mode 100644 src/features/lockers/components/LockersNoticeSheet.tsx create mode 100644 src/features/lockers/constants/lockersNotice.ts diff --git a/src/features/lockers/components/LockersNoticeSheet.tsx b/src/features/lockers/components/LockersNoticeSheet.tsx new file mode 100644 index 0000000..c11829a --- /dev/null +++ b/src/features/lockers/components/LockersNoticeSheet.tsx @@ -0,0 +1,83 @@ +import { ActionArea, ActionAreaButton, Typography } from "@wanteddev/wds"; + +import BottomSheet from "@/components/ui/BottomSheet"; +import { LOCKERS_NOTICE_ITEMS } from "@/features/lockers/constants/lockersNotice"; + +interface LockersNoticeSheetProps { + open: boolean; + /** 지금이 사물함 신청 기간인지. 아니면 하단 버튼이 잠기고 문구가 바뀐다. */ + isApplyPeriod: boolean; + onClose: () => void; + onConfirm: () => void; +} + +// Figma: 사물함 신청 전 유의사항 Sheet Body (nodeId 1737:218310) +// +// 신청 기간이 아닐 때의 모습은 Figma에 없다 — 유의사항 3줄은 그대로 두고 하단 버튼만 잠가 +// "신청 기간이 아니에요"를 보여주기로 정했다(docs/plans/#68-lockers-notice-sheet.md 참고). +function LockersNoticeSheet({ + open, + isApplyPeriod, + onClose, + onConfirm, +}: LockersNoticeSheetProps) { + return ( + + {/* pb-7: Figma Sheet Body의 Notice Section ↔ Action Area 간격(28px). + BottomSheet는 자식 사이에 간격을 두지 않아서 여기서 낸다. */} +
+ + {/* Figma가 두 줄로 끊어둔 자리라 줄바꿈을 폭에 맡기지 않고 그대로 옮긴다 */} + 신청 전 아래 내용을 +
+ 확인해 주세요 + + +
+ {LOCKERS_NOTICE_ITEMS.map((item) => ( +
+ +
+ + {item.label} + + + {item.value} + +
+
+ ))} +
+
+ + + {/* Figma Main Action은 56px인데 ActionAreaButton은 48px이다. 높이를 고정하면 비활성 + 문구가 길어져 줄바꿈될 때 잘려서 padding으로 맞춘다(wds-component-usage.md 참고). */} + + {isApplyPeriod ? "신청하기" : "신청 기간이 아니에요"} + + + + ); +} + +export default LockersNoticeSheet; diff --git a/src/features/lockers/constants/lockersNotice.ts b/src/features/lockers/constants/lockersNotice.ts new file mode 100644 index 0000000..3dd7046 --- /dev/null +++ b/src/features/lockers/constants/lockersNotice.ts @@ -0,0 +1,31 @@ +import applyPeriodIcon from "@/assets/icons/lockers/apply-period.svg"; +import onePerPersonIcon from "@/assets/icons/lockers/one-per-person.svg"; +import usagePeriodIcon from "@/assets/icons/lockers/usage-period.svg"; + +export interface LockersNoticeItem { + icon: string; + label: string; + value: string; +} + +// Figma: 사물함 신청 전 유의사항 Notice Items (nodeId 1737:218314)의 내용을 그대로 옮긴 목데이터. +// 이용 기간·신청 기간 API가 붙으면 그 값으로 바뀔 자리다. +// 위 일러스트 3개는 Figma export가 캔버스·섹션 배경까지 같이 구워 넣어서(42px 회색 네모) +// 아이콘 그룹만 남기고 걷어낸 SVG다 — 다시 받으면 같은 정리가 필요하다. +export const LOCKERS_NOTICE_ITEMS: LockersNoticeItem[] = [ + { + icon: usagePeriodIcon, + label: "사물함 이용 기간", + value: "2026.09.01(화) - 2026.12.15(금)", + }, + { + icon: onePerPersonIcon, + label: "중복 신청 불가", + value: "1인당 1개의 사물함만 신청 가능해요.", + }, + { + icon: applyPeriodIcon, + label: "신청기간", + value: "2026.09.01(화) - 2026.12.15(금)", + }, +]; From a711b54201d07f31042dcd7db495cc6f4b54ab63 Mon Sep 17 00:00:00 2001 From: sangrae Date: Fri, 25 Sep 2026 22:06:43 +0900 Subject: [PATCH 4/7] =?UTF-8?q?feat:=20=EC=82=AC=EB=AC=BC=ED=95=A8=20?= =?UTF-8?q?=EC=9C=A0=EC=9D=98=EC=82=AC=ED=95=AD=20=EC=8B=9C=ED=8A=B8=20?= =?UTF-8?q?=ED=99=95=EC=9D=B8=EC=9A=A9=20=EC=9E=84=EC=8B=9C=20=EB=9D=BC?= =?UTF-8?q?=EC=9A=B0=ED=8A=B8=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 시트를 띄울 진입점이 아직 없어서 둔 자리다. 실제 진입점이 붙으면 지운다. --- src/app/router.tsx | 6 +++ src/features/lockers/LockersApplyScreen.tsx | 41 +++++++++++++++++++++ 2 files changed, 47 insertions(+) create mode 100644 src/features/lockers/LockersApplyScreen.tsx diff --git a/src/app/router.tsx b/src/app/router.tsx index 6eb52c5..570fdd2 100644 --- a/src/app/router.tsx +++ b/src/app/router.tsx @@ -13,6 +13,7 @@ import EventsDetailScreen from "@/features/events/EventsDetailScreen"; import EventsListScreen from "@/features/events/EventsListScreen"; import FeedbacksListScreen from "@/features/feedbacks/FeedbacksListScreen"; import HomeScreen from "@/features/home/HomeScreen"; +import LockersApplyScreen from "@/features/lockers/LockersApplyScreen"; import NoticesDetailScreen from "@/features/notices/NoticesDetailScreen"; import NoticesListScreen from "@/features/notices/NoticesListScreen"; @@ -84,6 +85,11 @@ const routes = [ } satisfies ScreenRouteHandle, path: "/notices/:noticeId", }, + { + element: , + // 사물함 유의사항 시트 확인용 임시 라우트 — 실제 진입점이 붙으면 화면과 함께 지운다 + path: "/lockers/apply", + }, // 라우트가 없는 경로 — 레이아웃 안에 둬서 하단 탭이 유지되고, 탭 경로(/event 등)면 그 탭이 활성으로 보인다 { element: , path: "*" }, ], diff --git a/src/features/lockers/LockersApplyScreen.tsx b/src/features/lockers/LockersApplyScreen.tsx new file mode 100644 index 0000000..8bfeba8 --- /dev/null +++ b/src/features/lockers/LockersApplyScreen.tsx @@ -0,0 +1,41 @@ +import { Button, Typography } from "@wanteddev/wds"; +import { useState } from "react"; + +import LockersNoticeSheet from "@/features/lockers/components/LockersNoticeSheet"; + +// 임시 확인용 화면 — 시트를 띄울 진입점이 아직 없어서 둔 자리다. +// 실제 진입점(홈 "사물함 상태" 퀵링크 `1737:218284` 또는 공지 상세 CTA)이 붙으면 +// 이 화면과 /lockers/apply 라우트는 지운다. docs/plans/#68-lockers-notice-sheet.md 참고. +function LockersApplyScreen() { + const [openedPeriod, setOpenedPeriod] = useState<"apply" | "closed" | null>( + null, + ); + + return ( +
+ + 사물함 유의사항 시트 확인용 임시 화면 + + + + + setOpenedPeriod(null)} + // 확인 후 이동할 사물함 구역 선택 화면(1737:218452)은 다음 이슈라 지금은 닫기만 한다 + onConfirm={() => setOpenedPeriod(null)} + open={openedPeriod !== null} + /> +
+ ); +} + +export default LockersApplyScreen; From 2f0d0fa86dbf4c8c378bf03dd7b749e58f0c6697 Mon Sep 17 00:00:00 2001 From: sangrae Date: Fri, 25 Sep 2026 22:06:43 +0900 Subject: [PATCH 5/7] =?UTF-8?q?docs:=20=EC=82=AC=EB=AC=BC=ED=95=A8=20?= =?UTF-8?q?=EC=8B=9C=ED=8A=B8=20=EA=B5=AC=ED=98=84=EC=97=90=EC=84=9C=20?= =?UTF-8?q?=ED=99=95=EC=A0=95=EB=90=9C=20WDS=20=EB=A7=A4=ED=95=91=20?= =?UTF-8?q?=EB=B0=98=EC=98=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/conventions/wds-component-usage.md | 33 +++++++++++++++++++++++++ 1 file changed, 33 insertions(+) diff --git a/docs/conventions/wds-component-usage.md b/docs/conventions/wds-component-usage.md index 280d4e4..653ed07 100644 --- a/docs/conventions/wds-component-usage.md +++ b/docs/conventions/wds-component-usage.md @@ -366,3 +366,36 @@ WDS는 `useToast` 훅 + `Toast` 컴포넌트로 토스트 시스템을 완비하 - **`Divider(new)`의 8px 버전은 1px 구분선과 다른 별개 패턴**: 지금까지 쓰던 `divider(new)`는 1px 헤어라인(WDS `Divider`로 대체)이었는데, 이 화면의 섹션 사이 구분선은 같은 이름의 8px 두꺼운 버전(`bg-background-alternative`, `#f7f7f8`)이다. 헤어라인이 아니라 섹션을 통째로 나누는 용도라 `Divider` 컴포넌트로 대체하지 않고 `
`로 직접 그렸다 — 이미 있는 토큰이라 새로 추가한 색은 없다. - **`PaginationDots`는 부모 flex 컨테이너에 `items-center`가 없으면 왼쪽으로 붙는다**: 이 컴포넌트의 실제 루트(`tabindex` wrapper div)는 `className`/`sx` prop이 그 div까지 전달되지 않아 직접 센터링을 줄 수 없다(내부 tablist는 `width: fit-content`). `flex-col` 부모에 `items-center`를 주고, 형제 요소(캐러셀 스크롤 행)에는 `w-full`을 명시해서 폭을 유지해야 정확히 중앙에 온다 — `/figma-check`로 실측하다 발견된 버그. - **`bg-background-alternative`(`#f7f7f8`)는 흰 배경과 3/255밖에 차이가 안 나서 화면에 따라 거의 안 보일 수 있다**: Q&A 카드 배경·8px 섹션 구분선 둘 다 이 값인데, 개별 레이어 단위로 `get_variable_defs`를 다시 떼어봐도 이 값 하나만 바인딩돼 있고 다른 색·테두리는 없었다 — 코드가 Figma 값을 정확히 따르고 있는 게 확인됐다. 그럼에도 시각적 구분이 약하다고 느껴지면, Figma 스펙을 벗어나 더 진한 톤(예: `Line/Normal/Neutral` `#70737c29`)으로 의도적으로 조정할지는 별도 논의 필요 — 이번 PR에서는 Figma 값 그대로 두었다. + +## 사물함 신청 전 유의사항 바텀시트(`1737:218213`) 구현 중 확정된 매핑 + +이 시트에서 WDS는 `ActionArea`/`ActionAreaButton`/`Typography`뿐이다. 제목·유의사항 3줄은 전부 Stream 로컬이다. + +- **`Notice Item`(`1417:56435` 계열)은 Stream 로컬**: `get_design_context`의 Component descriptions에 아예 잡히지 않았다. 42px 일러스트 + `[라벨 Label 1/Normal - Regular / 값 Body 2/Normal - Medium]` 두 줄 조합이며, 사물함 전용이 아닐 수 있어 보이지만 재사용처가 아직 없어서 `component-convention.md` §1대로 `features/lockers/`에 뒀다. 두 번째 화면에서 실제로 쓰이면 `components/ui/`로 옮긴다. +- **유의사항 일러스트 3개(시계 `1417:56488`, 사람 `1417:56599`, 달력 `1417:56600`)도 WDS 아이콘이 아니다**: `download_assets`의 `export`로 받으면 셋 다 42×42 단일 SVG로 떨어진다. 특히 달력은 `get_design_context` 응답에서 배경 SVG + 도형 6개(`#e7f1ff`/`#2c88fe`/`#b3d0f7` 하드코딩) 조합으로 나와서 손으로 그려야 하나 싶지만, **노드 단위 `export`를 쓰면 한 장으로 받아진다** — 도형을 다시 그리지 말 것. `src/assets/icons/lockers/`에 커밋했다. +- **`download_assets`의 `export`는 캔버스 배경까지 같이 굽는다**: 받은 SVG 맨 앞에 ``(Figma 캔버스 회색)와 뷰박스 밖으로 뻗는 페이지·섹션 배경 path(``, ``)가 들어 있었다. 그대로 쓰면 동그란 아이콘 뒤에 **회색 네모**가 깔린다. 실제 아이콘은 `` 하위(배경 원 `Ellipse 11` + 글리프)뿐이라 그 그룹만 남기고 걷어냈다(2.7KB → 1.0KB). **다시 export하면 같은 정리가 필요하다.** +- **타이포 실측**: 제목은 `heading2`+`bold`(20px/28), 항목 라벨은 `label1`+`regular`(14px/20), 항목 값은 `body2`+`medium`(15px/22)로 Figma와 정확히 일치한다(`typography/style.js` 확인). `heading2`(20px)와 `headline2`(17px)를 혼동하지 않는다. + +### 시트 상단 간격은 Figma가 시트마다 다르다 — `BottomSheet`의 `contentGap` + +드래그 핸들(24px) 다음 내용이 시작하는 위치가 시트마다 다르다. + +| Figma | 내용 시작 y | 간격 | +|---|---|---| +| 빌릴게 대여 `1422:57178` | 32 | 8px | +| 빌릴게 대여(시간 외) `1422:57209` | 32 | 8px | +| 사물함 유의사항 `1737:218308` | 36 | **12px** | + +`BottomSheet`가 빌릴게 기준 8px을 하드코딩하고 있어서 사물함 시트가 4px 짧게 나왔다(시트 상단→제목 실측 37px, Figma 41px). 공용 컴포넌트를 한쪽 값으로 고정할 수 없어 `contentGap?: 8 | 12` prop으로 빼고 기본값을 8(빌릴게 기존 동작)로 뒀다. 사물함 시트만 `contentGap={12}`를 넘긴다 — 수정 후 실측 41px로 일치. + +**새 시트를 만들 때 이 값을 Figma에서 먼저 확인한다.** 8/12 외 값이 나오면 `BottomSheetContentGap` 유니온에 추가한다. + +### Action Area 메인 버튼 높이 보정은 `paddingBlock`으로 통일한다 + +같은 56px 보정이 코드에 두 형태로 섞여 있었다 — 행사 화면 3곳은 `sx={{ paddingBlock: "16px" }}`, `BililgeRentalSheet.tsx:176`은 `sx={{ height: "56px" }}`다. + +**`paddingBlock` 쪽이 맞다.** Figma 스펙이 `padding: 16px 28px`이라 그대로 옮기는 형태이고, 높이를 고정하면 버튼 문구가 길어져 줄바꿈될 때 잘린다. 이 시트는 신청 기간이 아닐 때 문구가 `신청 기간이 아니에요`로 길어져서 실제로 걸릴 수 있는 자리다. `BililgeRentalSheet`도 정리 대상이다(이번 범위 밖). + +### 신청 기간이 아닐 때의 상태는 Figma에 없다 + +`신청하기` 버튼을 `disabled`로 두고 문구를 `신청 기간이 아니에요`로 바꾸기로 코드에서 정했다. 유의사항 3줄은 그대로 둔다. 디자인에 없는 상태를 만든 것이라 디자이너 확인이 필요하다 — `docs/plans/#68-lockers-notice-sheet.md` 참고. From 5dea85a759b98cb4c451983240faa42c2b95a76a Mon Sep 17 00:00:00 2001 From: sangrae Date: Fri, 25 Sep 2026 22:12:26 +0900 Subject: [PATCH 6/7] =?UTF-8?q?fix:=20=EC=8B=9C=ED=8A=B8=EA=B0=80=20?= =?UTF-8?q?=EB=8B=AB=ED=9E=88=EB=8A=94=20=EB=8F=99=EC=95=88=20=EB=B2=84?= =?UTF-8?q?=ED=8A=BC=EC=9D=B4=20=EB=B9=84=ED=99=9C=EC=84=B1=20=EB=AC=B8?= =?UTF-8?q?=EA=B5=AC=EB=A1=9C=20=EB=B0=94=EB=80=8C=EB=8D=98=20=EB=AC=B8?= =?UTF-8?q?=EC=A0=9C=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit open과 기간 여부를 같은 state에서 파생시켜서, 닫는 380ms 애니메이션 내내 버튼이 회색으로 바뀌는 게 보였다. --- src/features/lockers/LockersApplyScreen.tsx | 26 ++++++++++++--------- 1 file changed, 15 insertions(+), 11 deletions(-) diff --git a/src/features/lockers/LockersApplyScreen.tsx b/src/features/lockers/LockersApplyScreen.tsx index 8bfeba8..5147c13 100644 --- a/src/features/lockers/LockersApplyScreen.tsx +++ b/src/features/lockers/LockersApplyScreen.tsx @@ -7,32 +7,36 @@ import LockersNoticeSheet from "@/features/lockers/components/LockersNoticeSheet // 실제 진입점(홈 "사물함 상태" 퀵링크 `1737:218284` 또는 공지 상세 CTA)이 붙으면 // 이 화면과 /lockers/apply 라우트는 지운다. docs/plans/#68-lockers-notice-sheet.md 참고. function LockersApplyScreen() { - const [openedPeriod, setOpenedPeriod] = useState<"apply" | "closed" | null>( - null, - ); + const [isOpen, setIsOpen] = useState(false); + // 시트는 닫아도 380ms 동안 미끄러져 내려간다. 기간 여부를 open과 같은 state에서 파생시키면 + // 그 사이 버튼이 비활성 문구로 바뀌는 게 보이므로, 닫을 때는 open만 끄고 이 값은 유지한다. + const [isApplyPeriod, setIsApplyPeriod] = useState(true); + + const openSheet = (applyPeriod: boolean) => { + setIsApplyPeriod(applyPeriod); + setIsOpen(true); + }; return (
사물함 유의사항 시트 확인용 임시 화면 - + setOpenedPeriod(null)} + isApplyPeriod={isApplyPeriod} + onClose={() => setIsOpen(false)} // 확인 후 이동할 사물함 구역 선택 화면(1737:218452)은 다음 이슈라 지금은 닫기만 한다 - onConfirm={() => setOpenedPeriod(null)} - open={openedPeriod !== null} + onConfirm={() => setIsOpen(false)} + open={isOpen} />
); From ebb93624e5da9c4b01ecccd0655e19b6ebd719b7 Mon Sep 17 00:00:00 2001 From: sangrae Date: Thu, 1 Oct 2026 16:01:22 +0900 Subject: [PATCH 7/7] =?UTF-8?q?fix:=20=EC=9C=A0=EC=9D=98=EC=82=AC=ED=95=AD?= =?UTF-8?q?=20=EC=8B=9C=ED=8A=B8=20=EB=B2=84=ED=8A=BC=20=EB=AC=B8=EA=B5=AC?= =?UTF-8?q?=EB=A5=BC=20Figma=EB=8C=80=EB=A1=9C=20=ED=99=95=EC=9D=B8?= =?UTF-8?q?=ED=96=88=EC=96=B4=EC=9A=94=EB=A1=9C=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/conventions/wds-component-usage.md | 2 +- src/features/lockers/components/LockersNoticeSheet.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/conventions/wds-component-usage.md b/docs/conventions/wds-component-usage.md index 653ed07..ab6a4f7 100644 --- a/docs/conventions/wds-component-usage.md +++ b/docs/conventions/wds-component-usage.md @@ -398,4 +398,4 @@ WDS는 `useToast` 훅 + `Toast` 컴포넌트로 토스트 시스템을 완비하 ### 신청 기간이 아닐 때의 상태는 Figma에 없다 -`신청하기` 버튼을 `disabled`로 두고 문구를 `신청 기간이 아니에요`로 바꾸기로 코드에서 정했다. 유의사항 3줄은 그대로 둔다. 디자인에 없는 상태를 만든 것이라 디자이너 확인이 필요하다 — `docs/plans/#68-lockers-notice-sheet.md` 참고. +하단 `확인했어요` 버튼을 `disabled`로 두고 문구를 `신청 기간이 아니에요`로 바꾸기로 코드에서 정했다. 유의사항 3줄은 그대로 둔다. 디자인에 없는 상태를 만든 것이라 디자이너 확인이 필요하다 — `docs/plans/#68-lockers-notice-sheet.md` 참고. diff --git a/src/features/lockers/components/LockersNoticeSheet.tsx b/src/features/lockers/components/LockersNoticeSheet.tsx index c11829a..ba1e3ba 100644 --- a/src/features/lockers/components/LockersNoticeSheet.tsx +++ b/src/features/lockers/components/LockersNoticeSheet.tsx @@ -73,7 +73,7 @@ function LockersNoticeSheet({ onClick={onConfirm} sx={{ paddingBlock: "16px" }} > - {isApplyPeriod ? "신청하기" : "신청 기간이 아니에요"} + {isApplyPeriod ? "확인했어요" : "신청 기간이 아니에요"}