docs: add responsive and interaction readiness rubric - #5351
Draft
rubyycheung wants to merge 7 commits into
Draft
Conversation
Summary: - Add a discoverable CLI docs topic for the reusable mobile-readiness rubric. - Wire mobile readiness into the lab hardening review catalog as an evidenced human-review check. - Link the rubric from principles and layout guidance, and test builtin docs discovery plus catalog behavior. Test Plan: - pnpm exec vitest run internal/lab-readiness/audit.test.mjs packages/cli/foundation/discovery/docs-discovery.test.mjs packages/cli/api/docs/integrationDocs.test.mjs - node --input-type=module <mobile-readiness docs schema/discovery check> - pnpm check:changesets - pnpm exec eslint internal/lab-readiness/catalog.mjs internal/lab-readiness/audit.test.mjs packages/cli/foundation/discovery/docs-discovery.test.mjs packages/cli/assets/docs/mobile-readiness.doc.mjs packages/cli/assets/docs/principles.doc.mjs packages/cli/assets/docs/layout.doc.mjs - pnpm -F @astryxdesign/cli typecheck:authoring - pnpm -F @astryxdesign/cli typecheck:json-api - pnpm -F @astryxdesign/cli astryx docs mobile-readiness --dense - pnpm -F @astryxdesign/cli typecheck:template-docs - pnpm check:repo - pnpm lab:readiness:check
meta-cla
Bot
added
the
CLA Signed
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Contributor
PR Analysis Report📚 Storybook PreviewView Storybook for this PR 🧪 Sandbox PreviewView Sandbox for this PR No new or modified components detected. Bundle Size SummaryNo component packages changed. Accessibility AuditStatus: No accessibility violations detected. Generated by PR Enrichment workflow | Storybook | Sandbox | View full report |
rubyycheung
force-pushed
the
docs/mobile-readiness-rubric
branch
from
August 23, 2026 03:31
aa39a2f to
262ecd3
Compare
rubyycheung
changed the title
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
astryx docs responsive-interaction-readinessrubric for reviewing new or changed components across viewport space, pointer precision, hover availability, gestures, transient and queued UI, mobile viewport constraints, and existing interaction contractsCheck | Result | Evidencesubsections that preserve the four viewport/input independence scenariosWhy
Responsive component work was mixing viewport width with touch capability. This rubric keeps those axes separate, preserves the four reference scenarios that prove width independence and input independence, and organizes review outcomes into four scannable categories: responsive layout; touch, pointer, and hover; accessibility and interaction contracts; and mobile viewport constraints.
The adaptive presentation gate captures the Dialog vs BottomSheet lesson generally: responsive pressure usually means reflow/resize, while presentation changes must be explicit, opt-in, documented, and backed by evidence for changed placement, motion, dismissal, focus, scrolling, gesture, or announcement contracts.
The transient UI guidance captures the Toast lessons generally: queued or auto-dismissing surfaces need explicit stack/queue/timing/announcement/gesture evidence, and unrelated components can mark those checks N/A.
The viewport obstruction guidance keeps placement decisions tied to actual obstructions and content priority, not touch/coarse-pointer inference; safe-area support alone is not treated as keyboard or app-chrome avoidance.
WCAG AA boundary
The rubric is scoped to WCAG 2.2 Level AA. For target size, it uses Success Criterion 2.5.8: at least 24x24 CSS px or a permitted exception.
Validation
pnpm exec prettier --write .changeset/responsive-interaction-readiness.md internal/lab-readiness/catalog.mjs internal/lab-readiness/audit.test.mjs packages/cli/assets/docs/layout.doc.mjs packages/cli/assets/docs/principles.doc.mjs packages/cli/assets/docs/responsive-interaction-readiness.doc.mjs packages/cli/foundation/discovery/docs-discovery.test.mjspnpm exec prettier --check .changeset/responsive-interaction-readiness.md internal/lab-readiness/catalog.mjs internal/lab-readiness/audit.test.mjs packages/cli/assets/docs/layout.doc.mjs packages/cli/assets/docs/principles.doc.mjs packages/cli/assets/docs/responsive-interaction-readiness.doc.mjs packages/cli/foundation/discovery/docs-discovery.test.mjspnpm exec vitest run internal/lab-readiness/audit.test.mjs packages/cli/foundation/discovery/docs-discovery.test.mjs packages/cli/api/docs/integrationDocs.test.mjsresponsive-interaction-readiness.doc.mjs, confirmed builtin discovery findsresponsive-interaction-readiness, confirmed the previous topic is absent, and verifiedproblemsInTopic(docs) === []pnpm -F @astryxdesign/cli astryx docs responsive-interaction-readiness --densepnpm check:changesetspnpm check:repopnpm lab:readiness:checkKnown unrelated issue:
pnpm -F @astryxdesign/cli typecheck:strictcurrently fails on main because Stepper template files import@astryxdesign/lab; this PR does not touch those files.Relationship to #5343
This is intentionally separate from the AlertDialog implementation PR #5343. AlertDialog is only used as a concise worked example of the rubric; this branch is based on current
mainand is not stacked on #5343.