diff --git a/.changeset/few-buttons-breathe.md b/.changeset/few-buttons-breathe.md new file mode 100644 index 0000000000..7c7996774a --- /dev/null +++ b/.changeset/few-buttons-breathe.md @@ -0,0 +1,5 @@ +--- +'@backstage/core-components': patch +--- + +Add BackstageTab to overridableComponents so can override styles in a theme diff --git a/packages/core-components/api-report.md b/packages/core-components/api-report.md index 2058fe2122..5367c68ee6 100644 --- a/packages/core-components/api-report.md +++ b/packages/core-components/api-report.md @@ -1286,6 +1286,9 @@ export namespace TabbedLayout { Route: (props: SubRoute) => null; } +// @public (undocumented) +export type TabClassKey = 'root' | 'selected'; + // Warning: (ae-missing-release-tag) "TabIconClassKey" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal) // // @public (undocumented) diff --git a/packages/core-components/src/components/Tabs/Tab.tsx b/packages/core-components/src/components/Tabs/Tab.tsx index 52c49ba1f8..2922bd9651 100644 --- a/packages/core-components/src/components/Tabs/Tab.tsx +++ b/packages/core-components/src/components/Tabs/Tab.tsx @@ -37,6 +37,9 @@ const tabMarginLeft = (isFirstNav: boolean, isFirstIndex: boolean) => { return '40px'; }; +/** @public */ +export type TabClassKey = 'root' | 'selected'; + const useStyles = makeStyles( theme => ({ root: { @@ -65,5 +68,5 @@ const useStyles = makeStyles( export const StyledTab = (props: StyledTabProps) => { const classes = useStyles(props); const { isFirstNav, isFirstIndex, ...rest } = props; - return ; + return ; }; diff --git a/packages/core-components/src/components/Tabs/index.ts b/packages/core-components/src/components/Tabs/index.ts index 015118635c..9702c39a48 100644 --- a/packages/core-components/src/components/Tabs/index.ts +++ b/packages/core-components/src/components/Tabs/index.ts @@ -16,6 +16,7 @@ export { Tabs } from './Tabs'; export type { TabsClassKey } from './Tabs'; +export type { TabClassKey } from './Tab'; export type { TabBarClassKey } from './TabBar'; export type { TabIconClassKey } from './TabIcon'; diff --git a/packages/core-components/src/overridableComponents.ts b/packages/core-components/src/overridableComponents.ts index c53c47da1b..49bc162951 100644 --- a/packages/core-components/src/overridableComponents.ts +++ b/packages/core-components/src/overridableComponents.ts @@ -63,6 +63,7 @@ import { TabBarClassKey, TabIconClassKey, TabsClassKey, + TabClassKey, WarningPanelClassKey, } from './components'; @@ -143,6 +144,7 @@ type BackstageComponentsNameToClassKey = { BackstageTabBar: TabBarClassKey; BackstageTabIcon: TabIconClassKey; BackstageTabs: TabsClassKey; + BackstageTab: TabClassKey; BackstageWarningPanel: WarningPanelClassKey; BackstageBottomLink: BottomLinkClassKey; BackstageBreadcrumbsClickableText: BreadcrumbsClickableTextClassKey;