@boostdev/design-system-react-native 0.3.0 → 0.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +44 -0
- package/README.md +10 -0
- package/dist/index.cjs +589 -536
- package/dist/index.d.cts +36 -5
- package/dist/index.d.ts +36 -5
- package/dist/index.js +442 -493
- package/package.json +1 -1
- package/src/components/interaction/Button/Button.spec.tsx +17 -0
- package/src/components/interaction/Button/Button.tsx +8 -2
- package/src/components/interaction/Dialog/Dialog.tsx +2 -9
- package/src/components/interaction/DropdownMenu/DropdownMenu.tsx +2 -13
- package/src/components/interaction/Rating/Rating.tsx +2 -1
- package/src/components/interaction/SideSheet/SideSheet.tsx +2 -11
- package/src/components/interaction/Toast/Toast.tsx +2 -9
- package/src/components/interaction/form/CheckboxGroup/CheckboxGroup.tsx +2 -1
- package/src/components/interaction/form/Combobox/Combobox.tsx +2 -10
- package/src/components/interaction/form/FileInput/FileInput.tsx +2 -1
- package/src/components/interaction/form/FormInput/FormInput.spec.tsx +11 -9
- package/src/components/interaction/form/FormInput/FormInput.tsx +4 -10
- package/src/components/interaction/form/NumberInput/NumberInput.tsx +2 -9
- package/src/components/interaction/form/RadioGroup/RadioGroup.tsx +2 -1
- package/src/components/interaction/form/SegmentedControl/SegmentedControl.mdx +17 -3
- package/src/components/interaction/form/SegmentedControl/SegmentedControl.spec.tsx +55 -0
- package/src/components/interaction/form/SegmentedControl/SegmentedControl.stories.tsx +9 -0
- package/src/components/interaction/form/SegmentedControl/SegmentedControl.tsx +10 -3
- package/src/components/interaction/form/Select/Select.tsx +2 -11
- package/src/components/interaction/form/Slider/Slider.tsx +2 -9
- package/src/components/interaction/form/Textarea/Textarea.tsx +2 -7
- package/src/components/interaction/form/atoms/Label.tsx +2 -1
- package/src/components/interaction/form/atoms/Message.tsx +2 -1
- package/src/components/layout/SectionHeader/SectionHeader.tsx +2 -1
- package/src/components/ui/Accordion/Accordion.tsx +2 -11
- package/src/components/ui/Alert/Alert.tsx +2 -1
- package/src/components/ui/Avatar/Avatar.tsx +2 -1
- package/src/components/ui/Badge/Badge.spec.tsx +28 -0
- package/src/components/ui/Badge/Badge.tsx +9 -3
- package/src/components/ui/Breadcrumb/Breadcrumb.tsx +2 -1
- package/src/components/ui/Calendar/Calendar.tsx +2 -8
- package/src/components/ui/Carousel/Carousel.tsx +2 -12
- package/src/components/ui/Collapsible/Collapsible.tsx +2 -12
- package/src/components/ui/DescriptionList/DescriptionList.tsx +2 -1
- package/src/components/ui/Link/Link.tsx +2 -1
- package/src/components/ui/NotificationBanner/NotificationBanner.tsx +2 -1
- package/src/components/ui/Pagination/Pagination.tsx +2 -1
- package/src/components/ui/Progress/Progress.tsx +2 -1
- package/src/components/ui/ProgressCircle/ProgressCircle.tsx +2 -1
- package/src/components/ui/Table/Table.tsx +2 -9
- package/src/components/ui/Tabs/Tabs.tsx +2 -10
- package/src/components/ui/Tooltip/Tooltip.tsx +2 -1
- package/src/components/ui/Typography/Typography.mdx +2 -0
- package/src/components/ui/Typography/Typography.spec.tsx +59 -0
- package/src/components/ui/Typography/Typography.tsx +18 -2
- package/src/index.ts +2 -0
- package/src/native/ScaledText.guard.spec.ts +25 -0
- package/src/native/ScaledText.spec.tsx +77 -0
- package/src/native/ScaledText.tsx +30 -0
- package/src/native/fontScale.spec.ts +35 -0
- package/src/native/fontScale.ts +15 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,6 +1,50 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
3
|
All notable changes to `@boostdev/design-system-react-native` are documented here.
|
|
4
|
+
## [0.5.0] - 2026-09-27
|
|
5
|
+
### Added
|
|
6
|
+
- Feat(text): ScaledText with a ceiling from its own font size
|
|
7
|
+
|
|
8
|
+
maxFontScaleFor(fontSize): below 20 pt text may double with the OS text
|
|
9
|
+
size, 20-25 pt grows to 1.5x, 26-59 pt to 1.3x, and 60 pt or more stays
|
|
10
|
+
as it is. ScaledText and ScaledTextInput apply it to React Native's own
|
|
11
|
+
Text and TextInput, which otherwise grow up to 3.57x on iOS
|
|
12
|
+
accessibility sizes.
|
|
13
|
+
|
|
14
|
+
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> ([`6420767`](https://gitlab.com/b00stdev/boostdev-design-system-react-native/-/commit/6420767083a8b2549583d933a9493816a23e537e))
|
|
15
|
+
- Feat(text): every component text goes through ScaledText
|
|
16
|
+
|
|
17
|
+
A guard spec fails when a component takes Text or TextInput from
|
|
18
|
+
react-native directly.
|
|
19
|
+
|
|
20
|
+
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> ([`e1202d5`](https://gitlab.com/b00stdev/boostdev-design-system-react-native/-/commit/e1202d5f1e91debf8b66667a14615b6674c775c5))
|
|
21
|
+
- Feat(text): components hold a larger OS text size
|
|
22
|
+
|
|
23
|
+
Typography takes maxFontSizeMultiplier and numberOfLines. Button and
|
|
24
|
+
FormInput grow from a minimum height instead of a fixed one, and a
|
|
25
|
+
long Button label wraps. SegmentedControl labels stay on one line and
|
|
26
|
+
shrink to fit. Badge takes maxFontSizeMultiplier for a count on a
|
|
27
|
+
fixed shape.
|
|
28
|
+
|
|
29
|
+
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> ([`27af98d`](https://gitlab.com/b00stdev/boostdev-design-system-react-native/-/commit/27af98d047ee97ad0870827a3254d6ea02802546))
|
|
30
|
+
|
|
31
|
+
## [0.4.0] - 2026-09-24
|
|
32
|
+
### Added
|
|
33
|
+
- Feat(segmented-control): xlarge size with a 56 pt tap target
|
|
34
|
+
|
|
35
|
+
CoachHelpr requires 56 pt tap targets app-wide (the DS Button's own
|
|
36
|
+
`large` is already 56 high). SegmentedControl's largest size was 48,
|
|
37
|
+
short of that minimum.
|
|
38
|
+
|
|
39
|
+
Add an additive `xlarge` size (minHeight 56, font.size.body,
|
|
40
|
+
px spacing.m, py spacing.s) alongside the existing small/medium/large —
|
|
41
|
+
no change to their values. Cover it with a spec asserting a rendered
|
|
42
|
+
xlarge segment has a 56px minHeight, add an XLarge story, and document
|
|
43
|
+
the new size in the component's size table and props reference in
|
|
44
|
+
SegmentedControl.mdx.
|
|
45
|
+
|
|
46
|
+
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> ([`4e3121d`](https://gitlab.com/b00stdev/boostdev-design-system-react-native/-/commit/4e3121db4c8f7f1931bcdb8c78a28337ee78d259))
|
|
47
|
+
|
|
4
48
|
## [0.3.0] - 2026-09-23
|
|
5
49
|
### Added
|
|
6
50
|
- Feat(alert): support arbitrary and theme-aware children
|
package/README.md
CHANGED
|
@@ -135,6 +135,16 @@ Both standalone (`useTheme`) and Navigation (`useReactNavigationTheme` / `create
|
|
|
135
135
|
2. Pass it as `tokens` to `createReactNavigationTheme({ tokens, dark })` for the Navigation layer.
|
|
136
136
|
3. For the standalone layer — and to have overrides flow through to the Navigation theme automatically — use the `tokens` prop on `ThemeProvider` (see [Brand theming](#brand-theming-token-overrides) above).
|
|
137
137
|
|
|
138
|
+
## Text size
|
|
139
|
+
|
|
140
|
+
Every DS text grows with the OS text size (iOS Dynamic Type, Android font scale) up to a ceiling
|
|
141
|
+
taken from its own font size (`maxFontScaleFor`): below 20pt grows up to 2×, 20–25pt up to 1.5×,
|
|
142
|
+
26–59pt up to 1.3×, and 60pt or more stays at 1× (a countdown, a score). Override a component's
|
|
143
|
+
`maxFontSizeMultiplier` prop to set a different ceiling, e.g. `1` for text in a fixed shape.
|
|
144
|
+
|
|
145
|
+
In your own app code, use `ScaledText` / `ScaledTextInput` instead of React Native's `Text` /
|
|
146
|
+
`TextInput` to get the same rule.
|
|
147
|
+
|
|
138
148
|
## Development
|
|
139
149
|
|
|
140
150
|
```bash
|