@ihabdevteam/core 0.239.0 → 0.241.0

package/CHANGELOG.md

@@ -7,6 +7,93 @@ All notable changes to this project will be documented in this file.
 > 적은 글이라, 지금 이름으로 고쳐 놓으면 그 시절에 그 이름으로 받은 사람이
 > 제 이야기를 못 찾는다.
 
+## 0.241.0
+
+### 채점을 **자판으로 매길 수 있다** (말귀 요청 (53))
+
+채점 흐름은 이 앱이 치료사에게 내미는 일 그 자체다 — 표를 고르고, 칸마다 ○ △ ✕ 를 매기고,
+저장한다. **그 가운데 걸음이 자판으로 막혀 있었다.**
+
+말귀 실측(채점 창 하나): 채점 단추 **36 개**(칸 열둘 × 셋) 가운데 자판으로 닿는 것 **0 개** —
+`.focus()` 를 걸어도 `activeElement` 가 안 바뀐다. 창에서 초점이 서는 자리는 스물일곱뿐
+(닫기 1 · 재생 24 · 날짜 1 · 저장 1)이었다.
+
+**단추 자체는 멀쩡했다.** 늘 DOM 에 있고 이름도 낱말을 달고 제대로 섰다(`낙지 / 낚시 맞음`).
+`display: none` 이라 초점을 못 받았을 뿐이다 — 그래서 `:focus-within` 을 더해도 안 풀린다.
+**초점을 못 받으니 켜질 일이 없다.** 닭과 달걀이다.
+
+이제 **지우지 않고 감춘다** — `position: absolute; width: 1px; clip-path: inset(50%)`. 초점은
+받고 눈에는 안 보이며, 초점이 가면 `:focus-within` 이 되돌려 **보이게** 한다(안 보이는 자리에
+초점이 서면 어디 있는지 모른다). 카드 쪽 `:focus-within` 도 더해 얹기(`:hover`)와 짝을 맞췄다.
+
+`@media (hover: none)` 에서 늘 보이게 해 둔 까닭("얹기에 기대면 안 되는 자리", 2026-09-22)이
+자판에도 그대로 선 셈이다.
+
+> **읽기만 하는 표는 그대로 지운다**(㊹). 자판으로 매길 일이 없으니 감출 까닭도 없고, 잘라서
+> 두면 아무 일도 안 하는 정지점이 칸마다 둘씩 는다.
+>
+> 되돌릴 때는 **다섯 줄을 다 거둬야** 한다(`position`·`width`·`height`·`overflow`·`clip-path`).
+> `display` 만 바꾸면 1px 짜리로 남는다.
+
+### 칸의 재생 단추가 **낱말을 읽는다**
+
+표에 칸이 스물넷이면 낭독기로 단추 목록을 불렀을 때 `재생` 이 **스물네 번** 서서 어느
+낱말인지 가릴 길이 없었다. 바로 옆 채점 단추가 이미 낱말을 달고 있으니 같은 자를 쓴다 —
+`낙지 재생` · `낙지 멈춤`.
+
+**띄우는 글은 짧게 둔다**(`재생`). 손을 얹은 사람에게 낱말은 바로 위에 적혀 있다 — ㊴ 에서
+채점 표식에 쓴 가름과 같다.
+
+## 0.240.0
+
+### `ChartSection` 의 제목이 **머리글**이 되고, 칸이 **이름**을 갖는다 (말귀 요청 (51))
+
+단어훈련 분석 창은 `ChartSection` 셋을 나란히 세운다 — 초성·모음·종성. 셋은 속이 똑같아
+안의 단추 이름도 똑같다. 말귀 실측(창 하나): 이름 가진 것 81 개 중 **같은 이름이 거듭 선 것
+여덟 갈래**(`문장훈련 추천`×3 …), 창 안의 **머리글 0 개**, `<section>` 셋 다 이름 없음.
+
+**눈으로는 제목이 큼직하게 서 있는데 그 글자가 나무에는 없었다.** `h3` 는 글자 꼴이지
+머리글이 아니고, 이름 없는 `<section>` 은 지역으로 안 잡힌다.
+
+- 제목을 **진짜 머리글**로 그린다. `titleLevel` 로 급을 고른다(기본 3 — 글자 꼴 기본과 같은
+  급. 페이지 본문에 바로 서는 칸이면 2. `0` 이면 전과 같이 `div`).
+- 제목이 `<section>` 의 이름이 된다(`aria-labelledby`). 똑같이 생긴 셋이 갈린다.
+- **누르는 칸에는 안 건다** — 거기는 `role="button"` 에 `aria-label` 이 이미 이름이고,
+  `aria-labelledby` 가 그것을 덮어 버린다.
+
+> **머리글이 새로 생긴다.** 급이 안 맞는 자리가 있으면 `titleLevel` 로 맞춘다 — 급을
+> 건너뛰면 머리글로 훑는 사람에게 층이 빈 것처럼 읽힌다.
+
+### `BarChart` 의 막대 수를 **자판·낭독기로도 읽는다** — `focusableBars` (말귀 요청 (52))
+
+값이 **얹어야 뜨는 풍선에만** 있었다. `tabIndex` 도 `onFocus` 도 파일 전체에 0 회라,
+자판·낭독기로는 막대 하나하나의 수를 읽을 길이 **아예 없었다.**
+
+`focusableBars` 를 켜면 칸마다 `tabIndex=0` 과 이름이 붙고, 초점을 받으면 얹었을 때와
+**같은 풍선**이 뜬다. 풍선 글을 짓는 셈을 `onMouseEnter` 손잡이 밖으로 빼서 풍선·초점·
+`aria-label` 셋이 **같은 글**을 쓴다 — 보는 말과 들리는 말이 안 갈린다.
+
+**기본은 거짓이다** — 막대가 서른이면 정지점이 서른 는다. 그 차림표가 화면의 본문인
+자리에서 켠다. 값이 없는 미래 칸은 켜도 안 짚는다.
+
+### 손가락 커서 — 하나는 걷고 하나는 **그대로 둔다**
+
+말귀가 둘을 함께 짚었는데 **답이 갈린다.**
+
+- **`.table-field`**(표 머리) — 걷었다. `.table-field` 전부에 `cursor: pointer` 가 걸려
+  **정렬 못 하는 칸까지** 손가락을 띄웠다(말귀 보고서 목록 머리 여섯). 누르는 것은 그 안의
+  진짜 `<button>` 이라, 그쪽으로 옮겼다.
+- **`BarChart` 의 막대 칸** — **안 걷는다.** `onClick` 이 없는데 손가락이 뜬다는 지적은
+  맞다. 그런데 **iOS 는 '누를 수 없는' 요소에 톡하면 호환 마우스 이벤트를 아예 안 보내고**,
+  `cursor: pointer` 가 그 판정에 든다(`test/touchInteractions0915.test.tsx` 머리글에 그
+  차례가 적혀 있다). 걷으면 데스크톱의 거짓 손가락 하나를 없애는 대신 **손가락으로 쓰는
+  기기에서 수를 읽을 길이 통째로 사라진다.** 얹으면 값이 뜨니 아주 거짓도 아니다.
+  자판 쪽은 `focusableBars` 가 따로 연다.
+
+> 한 번 걷었다가 되돌렸다 — 걷으니 `barChartHoverTooltip`·`touchInteractions0915` 의 시험
+> 여덟이 울었고, 그 시험들이 **손가락으로 호버할 수 있는 칸을 고르는 기준**으로 그 커서를
+> 쓰고 있었다. 되살리지 말 것: 걷으려면 iOS 에서 톡해 풍선이 뜨는지 먼저 재야 한다.
+
 ## 0.239.0
 
 ### 표 굴림통 — **넘치나는 상자 크기가 아니다.** 보개만으로는 못 잡는다