Skip to content

fix: allow arrow up/down keys within focus trapped text area#417

Merged
haoruikun-cb merged 5 commits intocoinbase:masterfrom
bpk9:bkasper/fix-web-textarea-focus-trap
Feb 26, 2026
Merged

fix: allow arrow up/down keys within focus trapped text area#417
haoruikun-cb merged 5 commits intocoinbase:masterfrom
bpk9:bkasper/fix-web-textarea-focus-trap

Conversation

@bpk9
Copy link
Contributor

@bpk9 bpk9 commented Feb 21, 2026 •
edited
Loading

What changed?

  1. Prevent focus trap from calling preventDefault() when up/down arrow keys are pressed within a textarea

Why?

  • Users are unable to navigate textareas via the keyboard when used within focus traps (typically via a modal)

Root cause (required for bugfixes)

UI changes

Web Old Web New
Before.mov
After.mov

Testing

How has it been tested?

  • Unit tests
  • Interaction tests
  • Pseudo State tests
  • Manual - Web
  • Manual - Android (Emulator / Device)
  • Manual - iOS (Emulator / Device)

Testing instructions

  1. Run storybook locally and go to http://localhost:6006/?path=/story/components-focustrap--text-area
  2. Verify up/down arrow keys allow you to move up/down through the textarea

Illustrations/Icons Checklist

Required if this PR changes files under packages/illustrations/** or packages/icons/**

  • verified visreg changes with Terran (include link to visreg run/approval)
  • all illustration/icons names have been reviewed by Dom and/or Terran

Change management

type=routine
risk=low
impact=sev5

automerge=false

@cb-heimdall
Copy link
Collaborator

cb-heimdall commented Feb 21, 2026 •
edited
Loading

✅ Heimdall Review Status

Requirement Status More Info
Reviews ✅ 1/1
Denominator calculation
Show calculation
1 if user is bot 0
1 if user is external 0
2 if repo is sensitive 0
From .codeflow.yml 1
Additional review requirements
Show calculation
Max 0
0
From CODEOWNERS 1
Global minimum 0
Max 1
1
1 if commit is unverified 0
Sum 1
CODEOWNERS ✅ See below

✅ CODEOWNERS

Code Owner Status Calculation
ui-systems-eng-team ✅ 1/1
Denominator calculation
Additional CODEOWNERS Requirement
Show calculation
Sum 0
0
From CODEOWNERS 1
Sum 1

@bpk9 bpk9 marked this pull request as ready for review February 21, 2026 04:51
@hcopp
Copy link
Contributor

hcopp commented Feb 23, 2026

Fyi @maximo-macchi-cb

@maximo-macchi-cb maximo-macchi-cb self-requested a review February 23, 2026 19:55
@maximo-macchi-cb
Copy link
Contributor

maximo-macchi-cb commented Feb 23, 2026

Fyi @maximo-macchi-cb

Thanks for the heads up, @hcopp! I'll be reviewing by tomorrow mid-day

maximo-macchi-cb
maximo-macchi-cb previously approved these changes Feb 25, 2026
View reviewed changes
Copy link
Contributor

@maximo-macchi-cb maximo-macchi-cb left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you for the contribution! And thank you for following the contribution guidelines to help make review easier!

@cb-heimdall
Copy link
Collaborator

cb-heimdall commented Feb 25, 2026

Review Error for maximo-macchi-cb @ 2026-02-25 19:03:42 UTC
User failed mfa authentication, either user does not exist or public email is not set on your github profile. \ see go/mfa-help

haoruikun-cb
haoruikun-cb previously approved these changes Feb 25, 2026
View reviewed changes
@maximo-macchi-cb maximo-macchi-cb dismissed stale reviews from haoruikun-cb and themself via f0744ef February 26, 2026 04:37
@maximo-macchi-cb maximo-macchi-cb force-pushed the bkasper/fix-web-textarea-focus-trap branch from cb03c22 to f0744ef Compare February 26, 2026 04:37
@maximo-macchi-cb maximo-macchi-cb self-requested a review February 26, 2026 04:40
@cb-heimdall
Copy link
Collaborator

cb-heimdall commented Feb 26, 2026

Review Error for maximo-macchi-cb @ 2026-02-26 04:40:19 UTC
User cannot review their own commit

@haoruikun-cb haoruikun-cb merged commit 6f276e6 into coinbase:master Feb 26, 2026
24 of 25 checks passed
haoruikun-cb added a commit that referenced this pull request Feb 27, 2026
@hcopp @maximo-macchi-cb
@sverg-cb @stacysun-cb @bpk9 @haoruikun-cb
chore: merge master into cds-v9 (#450)
87c685a 
* fix: Prevent `<TextInput type="number">` from changing value on scroll (#413)

* Web implementation

* Add web example

* Bump changelogs

* fix: set paddingStart on Input for compact label (#423)

* fix: set paddingStart on Input for compact label

* Bump version

* feat: enhance Tag component with icon support and custom nodes (#421)

* feat: enhance Tag component with icon support and custom nodes

- Added support for start and end icons in the Tag component.
- Introduced props for custom start and end nodes.
- Updated stories to demonstrate new icon and custom node functionality.
- Added tests to verify rendering of icons and custom nodes.

* changelog versions

* format

* gap and padding props

* feat: improve link docs (#428)

* feat: chart transitions (#400)

* feat: support customizing transition on web

* Fix enter for scrubber

* Wip mobile

* Simplify animation and fix issues

* Fix bar issues

* Support scrubber beacon label transitions

* Support stagger delay

* Update documentation

* Update docs

* Fix web transition

* Ruse transition types

* Move imports

* Simplify transition

* Fix lint

* Regenerate routes

* Rename functions and routes

* Fix lint

* Fix issue

* Cleanup comments

* Simplify transition names

* Simplify types

* Continue cleaning up types

* Fix lint

* Cleanup bar transition props

* Remove unused story

* Drop ChartTransition

* Simplify scrubber

* Improve accessories

* Fix animation issues with point

* Remove extra line

* Cleanup resolved transitions

* Cleanup isIdleTransition

* Cleanup exit transition

* Simplify logic

* Reuse transition for bar

* Cleanup bar chart

* Fix formatting

* Fix lint

* Fix lint

* Mock path generation

* Re add default border radius for bar

* Bump version

* Simplify code

* Update examples

* Update bar stagger delay logic

* Simplify transition logic

* Add more tests for transitions

* Improve examples

* feat: add range bar chart examples (#435)

* feat: add range bar chart examples

* Fix lint

* Fix lint warning

* Cleanup web as well

* fix: Truncate multi-select chip labels mid-word (#412)

* Add web implementation

* Add story to show longer labels for multi-select chips

* Update changelogs

* chore: rename charts docs (#440)

* chore: rename graphs to charts in docs

* Rename remaining docs

* Ran dedupe and update changelog

* Set docusaurus plugin version

* chore: deprecate useStatusBarHeight hook (#445)

* deprecate useStatusBarHeight hook

* release

* chore: Bump packages for security request (#422)

* Bump package

* Revert "Bump package"

This reverts commit 4a733d6.

* Use resolution instead

* Add resolutions to other packages

* Add resolutionComments

* Revert to ajv v6 to support eslint

* Update dependencies to bump eslint and only resolve ajv V6

* Lower to next patch version

* Remove eslint package bump and only resolve ajv

* Dedupe dependencies

* fix: allow arrow up/down keys within focus trapped text area (#417)

* fix: allow arrow up/down keys within focus trapped text area

* chore: bump version + update changelog

* Bump changelogs

* Fix merge conflict

---------

Co-authored-by: Maximo Macchi <232606069+maximo-macchi-cb@users.noreply.github.com>
Co-authored-by: Harry <ruikun.hao@coinbase.com>

* feat: audit peer deps in ci (#437)

* fix: improve peer dependency component matching

* Find transitive dependencies

* Add framer-motion as a peer dep to web-visualization

* Run script

* Support ci check for correct peer deps

* Update yarn.lock

* Fix lint

* Update changelog

* Fix peer deps

* Fix false positives

* Fix other incorrect deps

* Drop unused dep

* Add reanimated to TabbedChips

* Simplify peer deps generation logic

* Add tests

* Fix lockfile

* Update peer dep versions

---------

Co-authored-by: Maximo Macchi <232606069+maximo-macchi-cb@users.noreply.github.com>
Co-authored-by: Stephen Vergara <stephen.vergara@coinbase.com>
Co-authored-by: Stacy <147009016+stacysun-cb@users.noreply.github.com>
Co-authored-by: Brian Kasper <bkasperr@gmail.com>
Co-authored-by: Harry <ruikun.hao@coinbase.com>
adrienzheng-cb pushed a commit that referenced this pull request Feb 27, 2026
@hcopp @maximo-macchi-cb
@sverg-cb @stacysun-cb @bpk9 @haoruikun-cb
chore: merge master into cds-v9 no squash (#452)
669f56f 
* fix: Prevent `<TextInput type="number">` from changing value on scroll (#413)

* Web implementation

* Add web example

* Bump changelogs

* fix: set paddingStart on Input for compact label (#423)

* fix: set paddingStart on Input for compact label

* Bump version

* feat: enhance Tag component with icon support and custom nodes (#421)

* feat: enhance Tag component with icon support and custom nodes

- Added support for start and end icons in the Tag component.
- Introduced props for custom start and end nodes.
- Updated stories to demonstrate new icon and custom node functionality.
- Added tests to verify rendering of icons and custom nodes.

* changelog versions

* format

* gap and padding props

* feat: improve link docs (#428)

* feat: chart transitions (#400)

* feat: support customizing transition on web

* Fix enter for scrubber

* Wip mobile

* Simplify animation and fix issues

* Fix bar issues

* Support scrubber beacon label transitions

* Support stagger delay

* Update documentation

* Update docs

* Fix web transition

* Ruse transition types

* Move imports

* Simplify transition

* Fix lint

* Regenerate routes

* Rename functions and routes

* Fix lint

* Fix issue

* Cleanup comments

* Simplify transition names

* Simplify types

* Continue cleaning up types

* Fix lint

* Cleanup bar transition props

* Remove unused story

* Drop ChartTransition

* Simplify scrubber

* Improve accessories

* Fix animation issues with point

* Remove extra line

* Cleanup resolved transitions

* Cleanup isIdleTransition

* Cleanup exit transition

* Simplify logic

* Reuse transition for bar

* Cleanup bar chart

* Fix formatting

* Fix lint

* Fix lint

* Mock path generation

* Re add default border radius for bar

* Bump version

* Simplify code

* Update examples

* Update bar stagger delay logic

* Simplify transition logic

* Add more tests for transitions

* Improve examples

* feat: add range bar chart examples (#435)

* feat: add range bar chart examples

* Fix lint

* Fix lint warning

* Cleanup web as well

* fix: Truncate multi-select chip labels mid-word (#412)

* Add web implementation

* Add story to show longer labels for multi-select chips

* Update changelogs

* chore: rename charts docs (#440)

* chore: rename graphs to charts in docs

* Rename remaining docs

* Ran dedupe and update changelog

* Set docusaurus plugin version

* chore: deprecate useStatusBarHeight hook (#445)

* deprecate useStatusBarHeight hook

* release

* chore: Bump packages for security request (#422)

* Bump package

* Revert "Bump package"

This reverts commit 4a733d6.

* Use resolution instead

* Add resolutions to other packages

* Add resolutionComments

* Revert to ajv v6 to support eslint

* Update dependencies to bump eslint and only resolve ajv V6

* Lower to next patch version

* Remove eslint package bump and only resolve ajv

* Dedupe dependencies

* fix: allow arrow up/down keys within focus trapped text area (#417)

* fix: allow arrow up/down keys within focus trapped text area

* chore: bump version + update changelog

* Bump changelogs

* Fix merge conflict

---------

Co-authored-by: Maximo Macchi <232606069+maximo-macchi-cb@users.noreply.github.com>
Co-authored-by: Harry <ruikun.hao@coinbase.com>

* feat: audit peer deps in ci (#437)

* fix: improve peer dependency component matching

* Find transitive dependencies

* Add framer-motion as a peer dep to web-visualization

* Run script

* Support ci check for correct peer deps

* Update yarn.lock

* Fix lint

* Update changelog

* Fix peer deps

* Fix false positives

* Fix other incorrect deps

* Drop unused dep

* Add reanimated to TabbedChips

* Simplify peer deps generation logic

* Add tests

* Fix changelog

---------

Co-authored-by: Maximo Macchi <232606069+maximo-macchi-cb@users.noreply.github.com>
Co-authored-by: Stephen Vergara <stephen.vergara@coinbase.com>
Co-authored-by: Stacy <147009016+stacysun-cb@users.noreply.github.com>
Co-authored-by: Brian Kasper <bkasperr@gmail.com>
Co-authored-by: Harry <ruikun.hao@coinbase.com>
@maximo-macchi-cb maximo-macchi-cb mentioned this pull request Mar 6, 2026
Open
8 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@haoruikun-cb haoruikun-cb haoruikun-cb approved these changes

@maximo-macchi-cb maximo-macchi-cb maximo-macchi-cb approved these changes

Assignees

No one assigned

Labels

packages:common packages:mcp-server packages:mobile packages:web

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

5 participants

@bpk9 @cb-heimdall @hcopp @maximo-macchi-cb @haoruikun-cb