-
Notifications
You must be signed in to change notification settings - Fork 0
Description
As a developer,
I want the component library to provide dynamic, theme‑driven typography,
so that each app can override or extend text styles, and the shared components automatically adapt to the app’s chosen theme.
Context
Text styles are currently defined as static imports, but they include colours and therefore depend on the active theme. To support dynamic theming properly, text styles need to become theme‑dependent.
We also want to move text styles into the theme, so that apps can override or extend them. This allows each app to define its own typography. This allows ObsIdentify and Observation to use different font sizes for the same semantic text styles, and shared components automatically pick up the correct styles.
The first step is to update the component library to support dynamic, theme‑driven typography. Once that is in place, we can begin migrating the apps from static text styles to dynamic theme usage.
Goals
- Move typography (font + text styles) into the shared theme system.
- Allow apps to override existing text styles.
- Allow apps to add new app‑specific text styles.
- Ensure type‑safety for both shared and app‑specific text styles.
- Migrate shared components to use dynamic theme‑based text styles.
- Provide proof‑of‑concept migrations for app components.
Scope
In Component Library:
- Add font and dynamic text to the theme.
- Introduce
createTextStyles(theme)factory. - Add
createTheme(overrides)merge function. - Update
Themetype to allow extension via declaration merging. - Migrate the components to use
theme.text.*.
In the apps:
- Add theme type augmentation (
theme.d.ts). - Provide theme overrides using
createTheme. - Migrate a few app components from static text styles to dynamic theme usage.