MetaMask / MetaMask/metamask-design-system
Follow up: Clean up SegmentButton and SelectButton Storybook enum controls
- Dominant language
- TypeScript
- Stars
- 37
- Forks
- 14
- Avg merge
- 1d 9h
- Merged PRs (30d)
- 60
Description
## Overview
Follow-up from #1172 to clean up Storybook controls for optional enum props on `SegmentButton` and `SelectButton`.
## Problem
Some optional enum controls do not expose the unset/default state consistently:
- `SegmentButton` `variant` uses only `Object.values(SegmentButtonVariant)`.
- `SelectButton` `variant` uses only `Object.values(SelectButtonVariant)`.
- `SelectButton` `endArrowDirection` includes `undefined`, but places it at the end instead of first.
For optional enum props, Storybook controls should include `undefined` as the first option so consumers can clear the control and inspect default behavior.
## Acceptance Criteria
- [ ] `SegmentButton` `variant` control includes `undefined` as the first option.
- [ ] `SelectButton` `variant` control includes `undefined` as the first option.
- [ ] `SelectButton` `endArrowDirection` control places `undefined` first.
- [ ] Story names remain aligned to prop names in PascalCase.
## References
- PR: https://github.com/MetaMask/metamask-design-system/pull/1172
- Cursor rule: Storybook select options for optional enum props should include `undefined` first.
- Files:
- `packages/design-system-react-native/src/components/SegmentButton/SegmentButton.stories.tsx`
- `packages/design-system-react-native/src/components/SelectButton/SelectButton.stories.tsx`
Contributor guide
Research direction
Start with packages/design-system-react-native/src/components/SegmentButton/SegmentButton.stories.tsx and SelectButton/SelectButton.stories.tsx. Inspect the optional enum control definitions and the related story names. Done means undefined is the first option for all three specified controls and story names remain aligned with prop names in PascalCase.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- storybook, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Quiet
- Clarity
- Clearly specified
- Newbie friendliness
- 76/100