Back to changelog index

7.5.0

May 27, 2026 · 1 packages · 4 unique changes · 1 release entry

libsBreaking changes

This release affects the sharedLibs family.

Run contractspec connect adoption resolve --family sharedLibs to see how it impacts your project.

Release summaries

  • mobile-appshell-native-uplift

    Native AppShell renders a single Expo Router NativeTabs navigator, removes the native header/notifications/menu chrome, and sources tab-bar colors from the active design-system theme.

    integrator

    BREAKING (native only) — AppShell.native now renders ONLY the `expo-router/unstable-native-tabs` navigator. The native header (`AppHeader`), the notification bell, the overflow menu, and the `children`/`aiPanel` slots are no longer rendered on native; this also removes the prior double-navigator mount (NativeTabs + a sibling Stack). `AppShellProps` is unchanged and all props remain accepted and crash-free, but `brand`/`logo`/`title`/`notifications`/`commands`/`userMenu`/`children`/ `aiPanel` now render nothing on native. Mount AppShell.native from an Expo Router layout whose direct child route files match the primary tab triggers, and wrap the app in `DesignSystemThemeProvider` + `SafeAreaProvider`.

    maintainer

    AppShell.native is reduced to a header-less single-navigator component; tab triggers come from the governed `buildNativeTabDescriptors` mapping with `{sf, md}` native icons. Tab colors derive from `useDesignSystemTheme()` (falling back to `defaultTokens`): `iconColor`/`labelStyle` use `{default: mutedForeground, selected: primary}`, Android `tintColor`/ `indicatorColor` = primary, badge colors from primary/primaryForeground. `rippleColor` was removed because the editorial `muted` token is a `color-mix()` CSS string that React Native cannot parse. Web AppShell and `AppShellProps` are untouched.

    customer

    The mobile app no longer shows an empty bar at the top; primary navigation is a themed bottom tab bar with visible icons and a clear active/inactive state that respects safe-area insets.

Migration guide

  • AppShell.native is header-less and is the sole navigator in its layout

    Required

    Render AppShell.native from an Expo Router layout whose direct child routes match the primary tab triggers, and stop relying on the native header / notifications / menu / children slots.

    1. Mount AppShell.native from an Expo Router layout (e.g. a `(tabs)/_layout.tsx`) whose direct child route files exactly match the primary tab trigger names (use `/` for the index tab and single-segment hrefs such as `/cockpit`). Untriggered sibling routes become phantom tabs, so keep non-tab screens in a parent stack.
    2. Do not pass routed page content via `children` on native — NativeTabs owns routed tab content; `children` and `aiPanel` are ignored on native.
    3. The native header, notification bell, and overflow menu are no longer rendered. If a host needs notifications/menu on native, surface them inside a tab screen or a future dedicated surface; the `notifications`/`userMenu`/`commands` props are still accepted but render nothing on native.
    4. Build tab presence from a static, route-accurate list (do not gate tab presence on per-user/role-filtered data) so every tab route file always has a matching trigger; apply role/persona gating to in-screen content instead.
  • Provide DesignSystemThemeProvider and SafeAreaProvider at the native app root

    Required

    The tab bar colors come from the resolved design-system theme; without a provider it falls back to light defaultTokens that will not match a themed app.

    1. Wrap the native app root in `SafeAreaProvider` (from react-native-safe-area-context) so the tab bar and tab content respect safe-area insets.
    2. Wrap the app in `DesignSystemThemeProvider platform="native" theme={<yourThemeSpec>} mode="light"` so `useDesignSystemTheme()` resolves the same tokens the rest of the UI uses; otherwise AppShell.native falls back to light `defaultTokens`.
    3. Ensure no `color-mix()`/CSS-string theme tokens are fed to React Native color props.

Upgrade steps

  • Re-verify the native AppShell tab bar on device

    manual

    Tab rendering, icon glyphs, active/inactive contrast, safe-area, exact tab count, and boot landing are native-runtime behaviors that must be confirmed on an Android dev build (and an iOS simulator for parity).

    Packages: @lssm-tech/lib.design-system

    1. Confirm no header strip renders at the top and the bottom tab bar is the only chrome.
    2. Confirm exactly the intended tabs render (no phantom/iconless tabs) for every persona/role, including roles whose surfaces are gated.
    3. Confirm each tab shows its icon (Material `md` on Android, SF Symbol `sf` on iOS) and that active vs inactive is clearly distinguishable.
    4. Confirm tab-bar colors match the app theme (editorial tokens), not light defaults.
    5. Confirm the tab bar and tab content respect safe-area insets on a notched device.
    6. Confirm the app boots onto the intended landing tab with no redirect loop, and that non-tab routes still push over the tab shell.

Unique release changes

  • - Native AppShell renders a single Expo Router NativeTabs navigator, removes the native header/notifications/menu chrome, and sources tab-bar colors from the active design-system theme.

    1 packages · 1 occurrences

  • - Render AppShell.native from an Expo Router layout whose direct child routes match the primary tab triggers, and stop relying on the native header / notifications / menu / children slots.

    1 packages · 1 occurrences

  • - Tab rendering, icon glyphs, active/inactive contrast, safe-area, exact tab count, and boot landing are native-runtime behaviors that must be confirmed on an Android dev build (and an iOS simulator for parity).

    1 packages · 1 occurrences

  • - The tab bar colors come from the resolved design-system theme; without a provider it falls back to light defaultTokens that will not match a themed app.

    1 packages · 1 occurrences

Impacted packages

  • @lssm-tech/lib.design-system

    Layer: libs · 4 changes