drawer · 抽屉
依据 APG Dialog。与对话框的差别只是「从哪进来」,
三条硬要求完全一样:焦点陷阱(Tab 不跑出抽屉)·
Esc 关闭 · 关闭后焦点归位(回到触发按钮)。
⚠️ 抽屉是模态:背景设 inert,
否则读屏会同时读到抽屉与背景("双重朗读")。
1 · 四个方向
(关闭后会显示焦点是否归位)
2 · 初始焦点可指定
对比:错写法 vs 本库写法
❌ 常见写法:关闭按钮做小
关闭是独立目标:抽屉滑进来之后,用户第一件事就是找它。24px 的叉在触屏上要瞄准,点偏了就点到了背后的内容。
✅ 本库:drawer__close 44px
命中区 44px(drawer.css 里写明"关闭按钮是独立目标,用 44")—— 字形还是 20px,只是可点范围大了。