feat: add DefaultTab and DefaultTabsActiveIndicator.

[adrienzheng-cb]

What changed? Why?

Summary

Adds DefaultTab and DefaultTabsActiveIndicator so Tabs can be used out of the box for the common label + animated underline pattern, documents it on the docs site, and steers consumers away from TabNavigation via type-level deprecation.

---

Changes

@coinbase/cds-common

• useTabs: Optional second generic TTab extends TabValue<TabId> so tabs, activeTab, and onChange can reflect custom tab row types (defaults match previous behavior).

@coinbase/cds-web (packages/web/src/tabs)

• DefaultTab: Default tab control (label styling, optional count / max, focus ring).
• DefaultTabsActiveIndicator: Default underline indicator aligned with the tab row.
• Tabs: TabComponent defaults to DefaultTab; generic TabComponentProps / TabsProps; internal wiring for useTabs with TTab.
• TabNavigation: @deprecated on exported types (TabProps, CustomTabProps, TabNavigationBaseProps, TabNavigationProps) — use Tabs instead.
• TabLabel / TabIndicator: Deprecation-related doc tweaks.
• __stories__/Tabs.stories.tsx: Storybook coverage for default and advanced cases.
• index.ts: Exports DefaultTab and DefaultTabsActiveIndicator.

@coinbase/cds-mobile (packages/mobile/src/tabs)

• Same default pieces: DefaultTab, DefaultTabsActiveIndicator, and Tabs updates (default TabComponent, handleTabsChange for onChange typing).
• TabNavigation: Same type deprecations as web.
• __stories__/Tabs.stories.tsx: Full ExampleScreen stories (replaces TabNavigation-only placeholder).

Docs (apps/docs)

• Tabs: Examples prioritize DefaultTabsActiveIndicator and default TabComponent; separate section for custom tab + indicator.
• Metadata: Imports, descriptions, related components, Storybook link; avoids positioning TabNavigation as the primary reference in copy.
• _webStyles.mdx: Styles explorer uses the default tab + indicator path.
• TabLabel / TabIndicator metadata: Minor alignment with deprecation.

---

Migration

• Prefer Tabs + DefaultTab + DefaultTabsActiveIndicator for the underline tab list.
• TabNavigation types are deprecated; plan to move call sites to Tabs before removal (see @deprecationExpectedRemoval on types).

UI changes

Screen.Recording.2026-03-30.at.2.04.56.PM.mov

Simulator.Screen.Recording.-.iPhone.16.Pro.-.2026-03-30.at.14.06.24.mov

Testing

How has it been tested?

• Unit tests
• Interaction tests
• Pseudo State tests
• Manual - Web
• Manual - Android (Emulator / Device)
• Manual - iOS (Emulator / Device)

Testing instructions

Illustrations/Icons Checklist

Required if this PR changes files under packages/illustrations/** or packages/icons/**

• verified visreg changes with Terran (include link to visreg run/approval)
• all illustration/icons names have been reviewed by Dom and/or Terran

Change management

type=routine
risk=low
impact=sev5

automerge=false

[cb-heimdall]

✅ Heimdall Review Status

Requirement	Status	More Info
Reviews	✅ 1/1	Denominator calculation Show calculation 1 if user is bot 0 1 if user is external 0 2 if repo is sensitive 0 From .codeflow.yml 1 Additional review requirements Show calculation Max 0 0 From CODEOWNERS 1 Global minimum 0 Max 1 1 1 if commit is unverified 0 Sum 1
CODEOWNERS	✅ See below

✅ CODEOWNERS

Code Owner	Status	Calculation
ui-systems-eng-team	✅ 1/1	Denominator calculation Additional CODEOWNERS Requirement Show calculation Sum 0 0 From CODEOWNERS 1 Sum 1

[github-actions]

https://percy.io/d424b72f/web/cds-mobile-visreg-03c97426/builds/48385956

[hcopp]

@adrienzheng-cb can you provide some screenshots and explain the purpose behind this?

If I'm reading correctly, since we deprecated TabNavigation we are providing a default TabComponent for Tabs right? And then also we are deprecating TabLabel and TabIndicator which are used for TabNavigation and don't seem to be usable with Tabs out of the box so we needed to make DefaultTab to replace TabLabel and DefaultTabsActiveIndicator to replace TabIndicator.

One last thing, if you can explain the shift from TabValue<TabId> to TTab that would be helpful!