Repository navigation
spec(AST-094): the default look grows nothing for touch; 44 px hit areas never overlap a neighbor (FR42) - #8633
Conversation
…ugh hit areas only (FR42, DEC-20)
…hit areas never overlap a neighbor
|
/approve-spec dd5f239 |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
AI review status for this pull request.
|
github-actions
Bot
added
the
spec-auto-merge
PR Analysis Report
|
meta-cla
Bot
added
the
CLA Signed
![astracat-bot[bot]](https://avatars.githubusercontent.com/in/4796231?s=60&v=4){kind=small}
There was a problem hiding this comment.
Changes requested: FR42 and DEC-20 are owner-approved, but as written FR42 conflicts with current records this pull request does not amend. "No size increase for phones or touch" and the new verification row also forbid the 16 px mobile reading base (design:mobile-typography DR1/DR3) and the iOS 16 px text-entry floor (family:input-fields FR9), and the no-overlap clause rules out component:Thumbnail AR4's 2 px coarse-pointer hit area, which sits over Open. Please scope FR42 to boxes (row heights, control and target sizes) and name those rules as unaffected, or amend the affected records here, list FR42's consequences under Current-state impact, and fix two smaller points: the component:AlertDialog example cites a record that states no phone width, and the non-goals still say the record governs behavior only. A new commit needs a fresh /approve-spec from an engineering owner.
[Automated review]
| FR13 rule for `adaptive`. | ||
|
|
||
| - **FR42 — The default look grows nothing for touch.** The default Astryx | ||
| look makes no size increase for phones or touch; a size may shrink to fit a |
There was a problem hiding this comment.
As written, "no size increase for phones or touch" also forbids the 16 px mobile reading base (design:mobile-typography DR1/DR3: Core's 14 px body text becomes 16 px on a phone under touch) and the iOS 16 px text-entry floor (family:input-fields FR9), both kept by spec:AST-102 FR1/FR3. Suggest scoping this to boxes, for example "makes no row, control or target size increase", and naming those two rules as unaffected, or amending them in this pull request.
|
|
||
| - **FR42 — The default look grows nothing for touch.** The default Astryx | ||
| look makes no size increase for phones or touch; a size may shrink to fit a | ||
| compact screen, such as an alert's phone width (`component:AlertDialog`). |
There was a problem hiding this comment.
component:AlertDialog is a draft and states no phone width (its width is delegated to Dialog). Cite the record that sets the alert's phone width, or drop the citation.
| area. A hit-area expansion never overlaps a neighboring interactive | ||
| element's own target: where neighbors are closer than 44 px, the expansion | ||
| is clamped to half the gap, or skipped, so each element stays reachable. |
There was a problem hiding this comment.
Thumbnail's remove button sits on Open's full-size target, and component:Thumbnail AR4 extends its hit area 2 px on every side on coarse pointers to reach 24 by 24. This clause forbids that expansion and, with no gap to clamp to, leaves the 20 by 20 button AR4 rules out. Could FR42 say how a control placed on another control's target is treated, or amend AR4 here?
| | FR34, FR35 | Browser tests and storyboards under a finger | a sub-menu drilling in and its Back row returning; a tap and a drag during a popover's and a menu's growth; a pinch during growth; a mouse | a drill-in that leaves the parent's rows in place, a change between levels that does not play on its roles, a tap during growth that closes, scrolls or moves focus, a pinch blocked other than by the author's `touch-action`, or a changed mouse path fails | | ||
| | FR36–FR40 | Release tests on synthetic touch streams with explicit timestamps, per use | below and past each commit point; a flick that projects past it; a slow drag past it; a release moving back; Reduce Motion; keyboard and mouse paths | a decision that changes mid-settle, a release moving back that commits, a settle that does not start at the release velocity, or an action with no keyboard or mouse path fails | | ||
| | FR41 | Browser tests with real touch input (`spec:AST-013` FR10) | a tap; a long press on a ContextMenu trigger, a DropdownMenu trigger the caller renders, a row with a context menu, and a slider thumb; a long press on a checkbox row's label and on plain text; a cancelled press; mouse and keyboard selection | a tap that selects, a hold with an action that starts a selection or callout, a label or plain text whose long press does not select natively, a suppression that outlives the press, or a change to native selection elsewhere or to mouse, keyboard, or assistive-technology selection fails | | ||
| | FR42 | Default-theme geometry tests under a coarse and a fine pointer, and hit-testing between adjacent targets | every component at phone width with a finger and with a mouse; a dense toolbar; a chip and its remove button; a Switch beside a label link | a default-theme size that grows under touch or at phone width, a touch target under 44 px where neighbors allow it, or a hit area that overlaps a neighbor's target, fails | |
There was a problem hiding this comment.
This row fails "a default-theme size that grows under touch or at phone width", which includes the 16 px phone reading text and the iOS text-entry floor that current records require; it needs the same scoping as FR42.
…as unaffected; current-state impact
|
/approve-spec 6c32385 |
|
/approve-spec ef63c83 |
There was a problem hiding this comment.
Changes requested: FR42 and DEC-20 are owner-approved, and the earlier conflicts with the mobile typography records, the iOS text-entry floor and Thumbnail AR4 are now carved out in FR42's own text. The FR42 verification row still fails what FR42 exempts: "a hit area that overlaps a neighbor's target" fails Thumbnail's AR4 coarse-pointer ring, and "a default-theme box that grows under touch or at phone width" fails text controls that widen when a finger turns on the 16 px reading base. Please carry both carve-outs into that row and the Current-state impact line and say in FR42 that a box growing only with its text is type sizing; a new commit then needs a fresh /approve-spec from an engineering owner.
[Automated review]
| | FR34, FR35 | Browser tests and storyboards under a finger | a sub-menu drilling in and its Back row returning; a tap and a drag during a popover's and a menu's growth; a pinch during growth; a mouse | a drill-in that leaves the parent's rows in place, a change between levels that does not play on its roles, a tap during growth that closes, scrolls or moves focus, a pinch blocked other than by the author's `touch-action`, or a changed mouse path fails | | ||
| | FR36–FR40 | Release tests on synthetic touch streams with explicit timestamps, per use | below and past each commit point; a flick that projects past it; a slow drag past it; a release moving back; Reduce Motion; keyboard and mouse paths | a decision that changes mid-settle, a release moving back that commits, a settle that does not start at the release velocity, or an action with no keyboard or mouse path fails | | ||
| | FR41 | Browser tests with real touch input (`spec:AST-013` FR10) | a tap; a long press on a ContextMenu trigger, a DropdownMenu trigger the caller renders, a row with a context menu, and a slider thumb; a long press on a checkbox row's label and on plain text; a cancelled press; mouse and keyboard selection | a tap that selects, a hold with an action that starts a selection or callout, a label or plain text whose long press does not select natively, a suppression that outlives the press, or a change to native selection elsewhere or to mouse, keyboard, or assistive-technology selection fails | | ||
| | FR42 | Default-theme geometry tests under a coarse and a fine pointer, and hit-testing between adjacent targets | every component at phone width with a finger and with a mouse; a dense toolbar; a chip and its remove button; a Switch beside a label link | a default-theme box that grows under touch or at phone width, a touch target under 44 px where neighbors allow it, or a hit area that overlaps a neighbor's target, fails | |
There was a problem hiding this comment.
This failure column drops FR42's two carve-outs. "A hit area that overlaps a neighbor's target" fails component:Thumbnail AR4's 2 px coarse-pointer ring, which lies on Open's full-size target and which FR42 leaves unaffected; "a default-theme box that grows under touch or at phone width" fails a text Button that widens when a finger turns on the 16 px reading base (design:mobile-typography DR3), which FR42 calls type sizing. Suggest: "a default-theme box that grows under touch or at phone width other than with its text, a touch target under 44 px where neighbors allow it, or a hit area that overlaps a neighbor's target other than an expansion a component record sets, fails".
| - Every component under a coarse pointer: no box grows for touch, and a | ||
| touch target reaches 44 px only through an invisible hit area clamped by | ||
| its neighbors (FR42). |
There was a problem hiding this comment.
Same omission as the verification row: Thumbnail's AR4 hit area is not clamped by its neighbor. Suggest "…through an invisible hit area clamped by its neighbors, unless a component record sets its own (FR42)".
| screen, such as an alert's phone width. Type sizing is outside this rule: | ||
| the 16 px mobile reading base (`design:mobile-typography` DR1, DR3) and the | ||
| 16 px text-entry floor (`family:input-fields` FR9) are unaffected. Under a |
There was a problem hiding this comment.
Consider saying here that a box that grows only with its text, such as a Button whose label follows the 16 px reading base, is type sizing too; otherwise "control sizes … stay as they are" and this carve-out pull in opposite directions for content-sized controls (spec:AST-102 FR4 has a control grow with its text).
… growing with its text is type sizing
|
/approve-spec 26f6b61 |
There was a problem hiding this comment.
Changes requested: FR42 and DEC-20 are owner-approved, and the earlier gaps in the verification row, the impact line and the text-sized box are fixed. One carve-out is still incomplete: the row's "a touch target under 44 px where neighbors allow it" has no exception for a hit area a record sets, so it fails Token's 24 by 24 Remove target (AR6), and FR42's carve-out names component records only, so it reaches past the heading-links module's 24 px coarse geometry, which must not overlap heading text. Please say "a component or module record" in FR42 and the impact line and apply the exception to the row's whole hit-area clause; a new commit then needs a fresh /approve-spec from an engineering owner.
[Automated review]
| | FR34, FR35 | Browser tests and storyboards under a finger | a sub-menu drilling in and its Back row returning; a tap and a drag during a popover's and a menu's growth; a pinch during growth; a mouse | a drill-in that leaves the parent's rows in place, a change between levels that does not play on its roles, a tap during growth that closes, scrolls or moves focus, a pinch blocked other than by the author's `touch-action`, or a changed mouse path fails | | ||
| | FR36–FR40 | Release tests on synthetic touch streams with explicit timestamps, per use | below and past each commit point; a flick that projects past it; a slow drag past it; a release moving back; Reduce Motion; keyboard and mouse paths | a decision that changes mid-settle, a release moving back that commits, a settle that does not start at the release velocity, or an action with no keyboard or mouse path fails | | ||
| | FR41 | Browser tests with real touch input (`spec:AST-013` FR10) | a tap; a long press on a ContextMenu trigger, a DropdownMenu trigger the caller renders, a row with a context menu, and a slider thumb; a long press on a checkbox row's label and on plain text; a cancelled press; mouse and keyboard selection | a tap that selects, a hold with an action that starts a selection or callout, a label or plain text whose long press does not select natively, a suppression that outlives the press, or a change to native selection elsewhere or to mouse, keyboard, or assistive-technology selection fails | | ||
| | FR42 | Default-theme geometry tests under a coarse and a fine pointer, and hit-testing between adjacent targets | every component at phone width with a finger and with a mouse; a dense toolbar; a chip and its remove button; a Switch beside a label link | a default-theme box that grows under touch or at phone width other than with its text, a touch target under 44 px where neighbors allow it, or a hit area that overlaps a neighbor's target where no component record sets it, fails | |
There was a problem hiding this comment.
The 44 px clause still has no record-set exception. A static removable Token's Remove target is 24 by 24 by its own record (component:Token AR6), with nothing interactive around it, so a test written from this row's "a chip and its remove button" state fails it, although FR42 and the impact line leave it to the record. Suggest: "…, or, where no component or module record sets the hit area, a touch target under 44 px where neighbors allow it or a hit area that overlaps a neighbor's target, fails".
| hit-area expansion never overlaps a neighboring interactive element's own | ||
| target: where neighbors are closer than 44 px, the expansion is clamped to | ||
| half the gap, or skipped, so each element stays reachable; an expansion a | ||
| component record sets on purpose, such as `component:Thumbnail` AR4's, is |
There was a problem hiding this comment.
This carve-out names component records only. module:Markdown/headingLinks FR10 sets the copy button's "non-overlapping 24px coarse hit geometry", and its extension "cannot overlap or steal input from heading text, neighboring controls, or preceding/following lines"; heading text is not an interactive neighbor, so as written FR42 asks that button to reach 44 px over it. Suggest "an expansion a component or module record sets on purpose".
| mouse halves of FR1–FR3) and its non-gesture rules stay in the module. | ||
| - Every component under a coarse pointer: no box grows for touch, and a | ||
| touch target reaches 44 px only through an invisible hit area clamped by | ||
| its neighbors, unless a component record sets its own (FR42). |
There was a problem hiding this comment.
Same wording as FR42's carve-out: "unless a component or module record sets its own".
|
/approve-spec 81ce5a2 |
There was a problem hiding this comment.
Changes requested: FR42 and DEC-20 are owner-approved for this head, and the type-sizing and Thumbnail carve-outs read correctly, but two hit areas that current records set still fall outside FR42's exception. The verification row's "a touch target under 44 px where neighbors allow it" has no exception for a hit area a record sets, so it fails Token's 24 by 24 Remove target (AR6), and FR42's carve-out and the impact line name component records only, so they reach past the Markdown heading-links module's 24 px coarse geometry, which must not overlap heading text. Please write "a component or module record" in FR42 and the impact line and apply the exception to the row's whole hit-area clause; the new commit then needs a fresh /approve-spec from an engineering owner.
[Automated review]
| | FR34, FR35 | Browser tests and storyboards under a finger | a sub-menu drilling in and its Back row returning; a tap and a drag during a popover's and a menu's growth; a pinch during growth; a mouse | a drill-in that leaves the parent's rows in place, a change between levels that does not play on its roles, a tap during growth that closes, scrolls or moves focus, a pinch blocked other than by the author's `touch-action`, or a changed mouse path fails | | ||
| | FR36–FR40 | Release tests on synthetic touch streams with explicit timestamps, per use | below and past each commit point; a flick that projects past it; a slow drag past it; a release moving back; Reduce Motion; keyboard and mouse paths | a decision that changes mid-settle, a release moving back that commits, a settle that does not start at the release velocity, or an action with no keyboard or mouse path fails | | ||
| | FR41 | Browser tests with real touch input (`spec:AST-013` FR10) | a tap; a long press on a ContextMenu trigger, a DropdownMenu trigger the caller renders, a row with a context menu, and a slider thumb; a long press on a checkbox row's label and on plain text; a cancelled press; mouse and keyboard selection | a tap that selects, a hold with an action that starts a selection or callout, a label or plain text whose long press does not select natively, a suppression that outlives the press, or a change to native selection elsewhere or to mouse, keyboard, or assistive-technology selection fails | | ||
| | FR42 | Default-theme geometry tests under a coarse and a fine pointer, and hit-testing between adjacent targets | every component at phone width with a finger and with a mouse; a dense toolbar; a chip and its remove button; a Switch beside a label link | a default-theme box that grows under touch or at phone width other than with its text, a touch target under 44 px where neighbors allow it, or a hit area that overlaps a neighbor's target where no component record sets it, fails | |
There was a problem hiding this comment.
The 44 px clause has no exception for a hit area a record sets. Token's Remove target is 24 by 24 by its own record (component:Token AR6), and a static removable token has nothing interactive around it, so a test written from this row's "a chip and its remove button" state fails it, although FR42 and the impact line leave it to the record. Suggest: "…, or, where no component or module record sets the hit area, a touch target under 44 px where neighbors allow it or a hit area that overlaps a neighbor's target, fails".
| hit-area expansion never overlaps a neighboring interactive element's own | ||
| target: where neighbors are closer than 44 px, the expansion is clamped to | ||
| half the gap, or skipped, so each element stays reachable; an expansion a | ||
| component record sets on purpose, such as `component:Thumbnail` AR4's, is |
There was a problem hiding this comment.
This carve-out names component records only. module:Markdown/headingLinks FR10 sets the copy button's "non-overlapping 24px coarse hit geometry", and its extension "cannot overlap or steal input from heading text, neighboring controls, or preceding/following lines"; heading text is not an interactive neighbor, so as written FR42 asks that button to reach 44 px over it. Suggest "an expansion a component or module record sets on purpose".
| mouse halves of FR1–FR3) and its non-gesture rules stay in the module. | ||
| - Every component under a coarse pointer: no box grows for touch, and a | ||
| touch target reaches 44 px only through an invisible hit area clamped by | ||
| its neighbors, unless a component record sets its own (FR42). |
There was a problem hiding this comment.
Same wording as FR42's carve-out: "unless a component or module record sets its own".
|
/approve-spec 0a9fe24 |
|
/approve-spec 5872deb |
There was a problem hiding this comment.
Recommending approval: FR42, its verification row and DEC-20 carry an engineering owner's /approve-spec for this head, and FR42 now leaves the hit areas that component and module records set, such as Token's Remove target and the Markdown heading-links copy button, to those records, so it no longer conflicts with any current record. No further change is needed before merge; a new commit would need a fresh /approve-spec from an engineering owner. One gap is worth a follow-up but does not block: FR42 protects only interactive neighbors, so it does not say whether a hit area may cover selectable plain text beside a small control.
[Automated review]
Decided (Cindy, 2026-10-26: D25 extended at 18:21, refined at 18:22 and 18:23).
User impact
Products look the same on a phone and a desktop in the default look: rows and controls don't grow for touch. Fingers still get 44 px targets through invisible hit areas, but never at the cost of a close neighbor becoming unreachable. Shrinking to fit a phone (an alert's 320 px width) is fine.
Change:
spec:AST-094Writing rubric results