[patternflow-bot]

lsh / https://claude.ai/code/session_016VxkFapkxCRBQYVYBf6TM6

덱의 창 다섯(Edit deck details, Deck performance, Share this deck, Share deck, 덱 패널)과 Send to my Patternflow 창이 이제 Esc 한 번에 닫히고, 그 창을 연 단추로 초점을 돌려줘요. 열릴 때도 초점이 창 안으로 들어가서, 키보드로 덱을 다듬다 쪽 어디에 있었는지 잃지 않아요.

좋아지는 것: 덱 창을 Esc 로 닫으면 연 단추로 돌아온다 — 키보드로 덱을 다듬다 자리를 잃지 않는다

• incoming/ROUND.md 읽기
• 앞 바퀴 PR 의 세 직함 댓글 읽기 — [DONE] 커뮤니티 메뉴와 폰 탭에서 Workshop 이 빠지고, 옛 워크숍 주소는 커뮤니티 첫 화면으로 간다 #268~[DONE] 댓글의 각주와 이 사이트 안의 링크가 같은 탭에서 열리고, 댓글마다 제 각주로 간다 #296 에 따를 글 없음 · 지시 1~10 다 끝남
• 고를 일 정하기 — 후보 21
• dialogKeys.test.tsx 에 창 여섯을 더해 dev 에서 빨간 것 보기 — 32개 가운데 10개 빨강
• 여섯에 useDialog — 같은 시험 32개 초록
• Chromium 390 · 1440 에서 키보드로 재기, dev 와 견주기
• 다섯 검사 · check:voice
• PR 검사 초록 · dev merge — 95b3670 에서 둘 다 success, dev 는 372207a 그대로라 merge 할 것 없음

한 일

여섯 창이 다른 커뮤니티 창 여섯이 이미 쓰는 lib/hooks/useDialog.ts 를 써요. 훅은 고치지 않았어요.

• DeckDetailClient.tsx 의 PerformanceModal 은 카드가 초점을 받아요. EditDeckModal 은 EditDetailsModal 처럼 제목 칸이 훅의 ref 를 받고 autoFocus 를 뺐어요. autoFocus 가 남으면 훅이 연 단추를 보기 전에 초점이 칸으로 가서, 닫을 때 돌려줄 곳이 없어요.
• ShareDeckModal 은 PublishModal 처럼 카드가 먼저 초점을 받고, 세션을 알고 글 칸이 서면 제목 칸으로 옮겨요.
• ShareDeckPackModal 은 제 Esc 듣개를 걷고 훅으로 바꿨어요.
• SendModuleModal 은 카드가 초점을 받아요. 안에 든 로그인 폼은 embedded 라 Esc 를 듣지 않아서, Esc 한 번이 창 하나예요.
• DeckPanel 은 늘 떠 있는 칩과 같은 컴포넌트라 훅을 그대로 걸면 칩이 뜰 때 한 번만 돌아요. 창 껍데기를 DeckWindow 로 떼어 창이 열릴 때 훅이 서게 했어요. 안의 내용은 들여쓰기만 바뀌었어요.
• Send 는 Pattern Lab 의 To hardware 창 위에서도 열려요. 이제 Send 도 Esc 를 스스로 들어서, 두 듣개가 Send 하나만 닫아요. Publish 가 이미 그렇게 돌았어요. HardwareModal.tsx 와 그 시험의 주석이 「Send 는 키를 듣지 않는다」고 해서 지금대로 고쳤어요.
• dialogKeys.test.tsx 의 WINDOWS 가 창을 그리는 함수 대신 창을 열고 연 단추를 돌려주는 함수를 받아요. 덱 쪽 창 둘은 진짜 덱 쪽에서, 덱 패널은 칩에서 열어야 해서예요. 여섯을 더했고, 패널 안의 Share deck 을 눌러 연 창이 Esc 뒤 칩으로 돌아가는 시험과, 제목 칸에서 시작하는 창 둘의 시험을 더했어요.

증거

넷 다 Edit details 에 초점을 두고 Enter 로 창을 연 뒤 Esc 를 누른 화면이에요. 고친 뒤엔 창이 닫히고 Edit details 에 초점 테두리가 있어요. dev 에선 창이 그대로예요.

이 브랜치와 dev 의 여섯 파일을 따로 next build 했어요(NEXT_PUBLIC_BUILD_ENABLED=1, NEXT_PUBLIC_COMMUNITY_URL=http://localhost:3100). 스크래치 DB 에 ada 를 가입시키고 공개 패턴 하나(헤더 있음)와 공개 덱 하나, 비공개 덱 하나를 HTTP 로 올렸어요. Playwright 가 연 단추에 초점을 두고 Enter, Esc 를 눌러 document.activeElement 를 읽었어요. 데스크톱에선 덱 칩이 숨어서(Community.module.css 의 .deckChip 은 900px 아래에서만 보여요) 덱 패널을 비공개 덱 쪽의 Send to my board 로 열었고, Share deck 은 아래 독의 단추로 열었어요.

dev                          열린 뒤 초점               Esc 뒤 창 · 초점
390  Edit deck details       창 안 제목 칸              1 · 창 안 제목 칸
390  Deck performance        Attach performance 단추    1 · Attach performance
390  Share this deck         Share 단추                 0 · Share
390  Send to my Patternflow  Send 단추                  1 · Send 단추
390  덱 패널 (칩)              칩                         1 · 칩
390  Share deck (패널 안)      창 안 제목 칸              1 · 창 안 제목 칸
1440 은 칩 줄이 없는 것 말고 같아요. Share deck(독)도 1 · 창 안 제목 칸.

이 브랜치                     열린 뒤 초점               Esc 뒤 창 · 초점
390  Edit deck details       창 안 제목 칸              0 · Edit details
390  Deck performance        창 안 카드                 0 · Attach performance
390  Share this deck         창 안 카드                 0 · Share
390  Send to my Patternflow  창 안 카드                 0 · Send 단추
390  덱 패널 (칩)              창 안 카드                 0 · 칩
390  Share deck (패널 안)      창 안 제목 칸              0 · 칩
1440 Edit deck details       창 안 제목 칸              0 · Edit details
1440 Deck performance        창 안 카드                 0 · Attach performance
1440 Share this deck         창 안 카드                 0 · Share
1440 Send to my Patternflow  창 안 카드                 0 · Send 단추
1440 Share deck (독)          창 안 제목 칸              0 · Share deck 단추

비공개 덱 쪽의 Send to my board 로 연 덱 패널은 두 판 다 Esc 뒤 초점이 BODY 예요. 이 브랜치에선 패널이 닫히고 초점이 창 안으로 들어가는 것까지는 돼요. 남은 것은 「가정」 끝에 적었어요. 두 판 다 pageerror Event 가 한 번씩 났어요. Monaco 를 바깥 CDN 에서 못 받은 것이에요(이 컨테이너는 그 주소로 못 나가요).

새 시험을 dev 의 여섯 파일로 돌렸을 때:

   × the Edit deck details window > closes on Esc and gives the focus back to the button that opened it
   × the Deck performance window > takes the focus when it opens
   × the Deck performance window > closes on Esc and gives the focus back to the button that opened it
   × the Share deck window > closes on Esc and gives the focus back to the button that opened it
   × the Share this deck window > takes the focus when it opens
   × the Deck window > takes the focus when it opens
   × the Deck window > closes on Esc and gives the focus back to the button that opened it
   × the Send to my Patternflow window > takes the focus when it opens
   × the Send to my Patternflow window > closes on Esc and gives the focus back to the button that opened it
   × community windows > Share deck opened from the deck panel gives the focus back to the deck chip
      Tests  10 failed | 22 passed (32)

이 브랜치에서(dialogKeys, backdropClose, HardwareModal):

 Test Files  3 passed (3)
      Tests  89 passed (89)

다섯 검사(web/ 에서):

npm ci                              exit 0
npm run lint -- --max-warnings=0    exit 0 (출력 없음)
npm run typecheck                   exit 0 (출력 없음)
npm run build                       exit 0
npm run check:ci                    Test Files 124 passed (124) · Tests 1542 passed (1542) · skipped links-absolute · skipped roadmap · exit 0
npm run check:voice                 check:voice: nothing found

links-absolute 와 roadmap 은 이 컨테이너에 gh 로 원래 레포를 읽을 길이 없어서 skipped 예요. PR 의 drift.yml 이 다시 돌려요. 문서는 고치지 않아서 check:human-lock 은 돌리지 않았어요.

PR 의 검사는 95b3670 에서 Drift checks 와 Web CI 둘 다 success 예요.

실행법

# web/ 에서
npx vitest run src/components/community/dialogKeys.test.tsx

화면으로 보려면 내 덱 쪽에서 Tab 으로 Edit details 에 가서 Enter, 그리고 Esc 를 눌러요. 창이 닫히고 초점이 Edit details 에 돌아와요. 폰 폭에선 머리줄의 덱 칩으로 패널을 열어 같은 것을 봐요.

가정

• 줄 21 의 「ShareDeckPackModal 은 Esc 뒤 초점이 BODY 에 떨어져요」는 키보드로 다시 재니 dev 에서 초점이 Share 단추에 남았어요(390, 1440 둘 다). 창 안으로 들어가지 않으니 떠난 적도 없어서예요. 고친 뒤엔 창 안으로 들어갔다가 Share 로 돌아와요. 시험 머리 주석과 코드 주석은 잰 대로 적었어요.
• To hardware 창(Pattern Lab)은 건드리지 않았고 주석 두 곳만 고쳤어요. Send 창이 그 위에서도 열려서, 이번 고침이 그 주석을 틀리게 만들어서예요. 그 창의 Esc 시험은 그대로 초록이에요.
• 32위(창이 열린 동안 Tab 이 창 안에서만 돈다)가 기다리던 21위가 끝났어요. 이제 커뮤니티 창 열둘이 다 useDialog 를 써서, 그 줄은 훅 하나만 고치면 돼요.
• 표 밖: 비공개 덱 쪽의 「Send to my board」 는 누르면 불러오는 동안 제 단추를 disabled 로 바꿔서 Chromium 이 초점을 BODY 로 떨궈요. 그 뒤에 열리는 덱 패널은 돌려줄 단추를 보지 못해 Esc 뒤 초점이 BODY 예요(DeckDetailClient.tsx:237 의 sendToBoard, dev 도 같아요).

Changelog

Web

• The deck's windows and Send to my Patternflow close on Esc. Edit deck details, Deck performance, Share deck, Share this deck, the deck panel and Send to my Patternflow now take the focus when they open and give it back to the button that opened them when Esc closes them.

경험

언제: 데스크톱 폭에서 커뮤니티 덱 패널(DeckPanel)을 Playwright 로 열어 잴 때
교훈: 머리줄의 덱 칩은 900px 아래에서만 보여서 1440 에선 getByTitle(/^Your deck/) 이 숨은 칩을 잡으니, 비공개 덱 쪽의 「Send to my board」(openDeckPanel)로 열어요
근거: #297 에서 1440 의 칩에 Enter 를 눌러도 창이 0개였고, 공개 덱 쪽엔 그 단추 대신 「Install to my board」 가 서서 비공개 덱을 하나 더 올렸어요

바퀴

바퀴 126 · 후보 21 「덱과 보내기 창 여섯이 Esc 로 닫히고, 열리면 초점이 창 안으로, 닫히면 연 단추로 간다」

다음 바퀴

• 22 「패턴 쪽에서 화살표 키 한 번이 노브를 0.001 대신 기기 한 칸만큼 돌린다」 — 남은 줄 가운데 순위가 가장 높아요.
• 23 「기기 주소 칸이 제 글자를 눌러도 초점을 받고, 폰에서 누르기 쉬운 크기다」 — 이번에 만진 Send 창과 덱 패널의 주소 칸이에요.
• 24 「폰에서 덱 쪽과 패턴 주인 줄의 단추가 패턴 쪽처럼 44px 높이다」 — 위 390 사진의 덱 쪽 주인 줄 단추가 그 줄이에요.

https://claude.ai/code/session_016VxkFapkxCRBQYVYBf6TM6

---

Generated by Claude Code