feat: [DSRN] Added PickerBase

[brianacnguyen]

Description

This PR adds PickerBase to @metamask/design-system-react-native: a presentational picker row whose root is a Pressable (accessibilityRole="button", accessibilityState / disabled tied to isDisabled). The label uses TextOrChildren (string + textProps or arbitrary children). Optional startAccessory renders before the label. The trailing slot is either a mapped arrow Icon when endArrow is set (PickerBaseEndArrow → ArrowUp / ArrowDown / ArrowLeft / ArrowRight), or endAccessory when endArrow is omitted; if both are passed, endArrow wins.

---

Related issues

Fixes: https://consensyssoftware.atlassian.net/browse/DSYS-686

---

Manual testing steps

1. From the repo root, run React Native Storybook (e.g. yarn storybook:ios or yarn storybook:android).
2. Open Components → PickerBase and confirm Default renders with the down arrow and label.
3. In Controls, set endArrow to up, left, right, and undefined (no arrow); with endArrow cleared, confirm endAccessory-style stories still behave as expected.
4. Toggle isDisabled and confirm the control looks disabled and does not fire onPress when tapped.
5. (Optional) Run yarn workspace @metamask/design-system-react-native jest packages/design-system-react-native/src/components/PickerBase/PickerBase.test.tsx.

---

Screenshots/Recordings

Before

N/A — new component.

After

Simulator.Screen.Recording.-.iPhone.15.Pro.Max.-.2026-04-14.at.22.49.31.mov

---

Pre-merge author checklist

• I've followed MetaMask Contributor Docs
• I've completed the PR template to the best of my ability
• I’ve included tests if applicable
• I’ve documented my code using JSDoc format if applicable
• I’ve applied the right labels on the PR (see labeling guidelines). Not required for external contributors.

---

Pre-merge reviewer checklist

• I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
• I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.

---

Note

Low Risk
Low risk: adds a new presentational component with Storybook/docs/tests and only minor export surface changes; no auth, persistence, or business logic changes.

Overview
Adds new PickerBase to @metamask/design-system-react-native: a Pressable row with optional startAccessory, label via TextOrChildren/textProps, and a trailing slot that shows a mapped arrow icon via endArrow (or endAccessory when omitted) plus disabled handling (isDisabled).

Exports the component and shared types (PickerBaseEndArrow, PickerBasePropsShared) through design-system-react-native and design-system-shared, and wires in Storybook stories, Jest coverage, and a new PickerBase README.

^{Reviewed by Cursor Bugbot for commit 624ad78. Bugbot is set up for automated code reviews on this repo. Configure here.}

[github-actions]

📖 Storybook Preview

• View PR Storybook

[cursor]

Cursor Bugbot has reviewed your changes and found 1 potential issue.

^{❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, have a team admin enable autofix in the Cursor dashboard.}

^{Reviewed by Cursor Bugbot for commit 34ea187. Configure here.}

[github-actions]

📖 Storybook Preview

• View PR Storybook

[brianacnguyen]

PickerEndArrowDirection