docs: accessibility guide with live keyboard demo + README sweep#52
Conversation
…educed motion The keyboard/a11y feature (#36) shipped with no discoverable documentation: the README had zero accessibility mentions and the docs site only carried the viewportLabel prop row. - New Accessibility guide (/docs/guides/accessibility): the labeled focusable region, the full keyboard map and its follow-bottom semantics, descendant-interaction preservation, reduced-motion behavior, respected programmatic scrolling, and the two app-level patterns the component deliberately leaves to consumers — aria-live announcements for virtualized messages, and pairing onFollowBottomChange with a visible jump-to-newest control. - README: Accessibility section, keyboard/reduced-motion feature bullets, and the missing viewportLabel prop row. - README: descriptive alt text on the TokenMaxing badge. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
…m-env dep README sweep — every claim checked against the current code: - New "Documentation & Live Examples" section: guide links plus a table of the four interactive demos on virtualchat.svelte.page, which the README never mentioned. - Removed the test-count bullet (test counts don't belong in a README and it was stale), the `debug` prop row (the prop was accepted but never read — also removed from types.ts), and the esm-env caveat on the zero-dependencies bullet (the dep was never imported — removed from package.json, so the claim is now simply true; publint passes). - Corrected stale mechanics: measurement is layout-offset-derived with ResizeObserver as the trigger (margins counted), follow-bottom corrections land pre-paint in the same frame as growth, and streaming updates coalesce one reactive cascade per frame. - Added the missing heightCacheVersion row to the debug-info table. - Fixed invalid TypeScript in the LLM Streaming example ($state([...]) does not parse). Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Same pattern as svelte-virtual-list's accessibility page: an EmbeddedExampleV2 card (file / live / source / reset chrome) running the real component, with a try-it panel showing focus state, the last scroll key, and — chat-specific — the live follow-bottom state, so readers can watch PageUp disengage follow and End re-engage it. New InlineExample wrapper mirrors the sibling repo's, pointing source links at this repo. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
The sweep removed esm-env as "unused" based on a source grep, but the Svelte compiler injects it into the packaged output for SSR/browser detection — the docs build (which consumes dist) fails without it. README bullet reworded to the accurate claim. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
|
Warning Review limit reachedYou’ve reached a temporary PR review limit under our Fair Usage Limits Policy. Next review available in: 59 minutes Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available. How can I continue?After more reviews become available, a review can be triggered using the To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews. How do review limits work?CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability. For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window. Please refer docs for additional details. Review details⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: ASSERTIVE Plan: Pro Run ID: 📒 Files selected for processing (6)
Comment |
|
Found 1 test failure on Blacksmith runners: Failure
|
Summary
The keyboard/a11y feature (#36) shipped with no discoverable documentation — the README had zero accessibility mentions and the docs site only carried the
viewportLabelprop row. This PR makes the accessibility story broadcastable: a full docs guide with an embedded live keyboard demo (same pattern as svelte-virtual-list's), a README Accessibility section, and a full-README accuracy sweep that removed several stale or outright false claims.Changes
/docs/guides/accessibility, in the sidebar nav): the labeled focusable region, the full keyboard map with follow-bottom semantics, descendant-interaction preservation, reduced motion, respected programmatic scrolling, and the two app-level patterns the component deliberately leaves to consumers (a politearia-liveannouncer — virtualized messages are invisible to screen readers off-screen — and a jump-to-newest button viaonFollowBottomChange).EmbeddedExampleV2card running the real component with a "try it with your keyboard" panel: focus state, last scroll key, and (chat-specific) the live Following bottom indicator, so readers can watchPageUpdisengage follow andEndre-engage it. New reusableInlineExamplewrapper mirrors the sibling repo's.viewportLabelprop row, plus a new Documentation & Live Examples section linking the guides and all four interactive demos (previously unmentioned).debugprop row and the deaddebug?: booleanfromtypes.ts(accepted but never read — the one small API-surface change here), fixed non-parsing TypeScript in the LLM Streaming example, corrected the mechanics sections to the current architecture (offset-derived heights with margins counted, same-frame pre-paint follow correction), added the missingheightCacheVersiondebug field, and gave the TokenMaxing badge descriptive alt text.esm-envas "unused" (no source imports), but the docs build caught that the Svelte compiler injects it into the packaged output; restored, with the README bullet reworded to the accurate claim ("one micro-dependency"). Netpackage.jsonchange vs main: none.Note: the demo's ArrowUp behavior is best experienced after #51 lands — this PR is docs-only for the component and merges cleanly either way.
Verification
Docs workspace
svelte-checkclean and full docs build green with the new page in the output; librarysvelte-check, unit tests, andpnpm build+ publint green after the types.ts change. Demo driven with real keyboard input in a browser (focus / PageUp / End all reflected live in the panel).🤖 Generated with Claude Code
Commits
9f4465bdocs: document accessibility — keyboard navigation, screen readers, reduced motion97132c8docs(readme): full accuracy sweep; drop dead debug prop and unused esm-env dep3fdb38cdocs: embed a live keyboard demo in the accessibility guide0a179acfix(deps): restore esm-env — the compiled output imports it