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/src/components/Tabs/Tab.tsx b/packages/core-components/src/components/Tabs/Tab.tsx index 52c49ba1f8..cdf29cca93 100644 --- a/packages/core-components/src/components/Tabs/Tab.tsx +++ b/packages/core-components/src/components/Tabs/Tab.tsx @@ -37,6 +37,8 @@ const tabMarginLeft = (isFirstNav: boolean, isFirstIndex: boolean) => { return '40px'; }; +export type TabClassKey = 'root' | 'selected'; + const useStyles = makeStyles( theme => ({ root: { @@ -65,5 +67,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;