diff --git a/.changeset/sour-cherries-allow.md b/.changeset/sour-cherries-allow.md new file mode 100644 index 0000000000..9e1b29ae49 --- /dev/null +++ b/.changeset/sour-cherries-allow.md @@ -0,0 +1,7 @@ +--- +'@backstage/core-components': minor +--- + +Added missing items to `overridableComponents` + +**BREAKING** Overridable component name for styling `OAuthRequestDialog` changed to `BackstageOAuthRequestDialog`. Overridable component name `BackstageMissingAnnotationEmptyState` that was previously deprecated has been removed. diff --git a/.changeset/ten-numbers-vanish.md b/.changeset/ten-numbers-vanish.md new file mode 100644 index 0000000000..3d307b209d --- /dev/null +++ b/.changeset/ten-numbers-vanish.md @@ -0,0 +1,10 @@ +--- +'@backstage/plugin-catalog-graph': patch +'@backstage/plugin-catalog-react': patch +'@backstage/plugin-search-react': patch +'@backstage/plugin-catalog': patch +'@backstage/plugin-home': patch +'@backstage/plugin-org': patch +--- + +Added missing items to `overridableComponents` diff --git a/.github/vale/config/vocabularies/Backstage/accept.txt b/.github/vale/config/vocabularies/Backstage/accept.txt index 320bb2e0ce..3cade01173 100644 --- a/.github/vale/config/vocabularies/Backstage/accept.txt +++ b/.github/vale/config/vocabularies/Backstage/accept.txt @@ -279,6 +279,8 @@ OpenSearch OpenShift openssl orgs +Overridable +overridable padding paddings pagerduty diff --git a/packages/core-components/api-report.md b/packages/core-components/api-report.md index ebcc053648..9b4e9f6798 100644 --- a/packages/core-components/api-report.md +++ b/packages/core-components/api-report.md @@ -695,6 +695,9 @@ export const LinkButton: (props: LinkButtonProps) => JSX.Element; export type LinkButtonProps = ButtonProps_2 & Omit; +// @public (undocumented) +export type LinkClassKey = 'visuallyHidden' | 'externalLink'; + // Warning: (ae-missing-release-tag) "LinkProps" is part of the package's API, but it is missing a release tag (@alpha, @beta, @public, or @internal) // // @public (undocumented) @@ -797,9 +800,6 @@ export function MissingAnnotationEmptyState( props: Props_3, ): React_2.JSX.Element; -// @public @deprecated (undocumented) -export type MissingAnnotationEmptyStateClassKey = 'code'; - // @public export const MobileSidebar: ( props: MobileSidebarProps, @@ -1130,11 +1130,26 @@ export const SidebarSubmenu: ( props: SidebarSubmenuProps, ) => React_2.JSX.Element; +// @public (undocumented) +export type SidebarSubmenuClassKey = 'root' | 'drawer' | 'drawerOpen' | 'title'; + // @public export const SidebarSubmenuItem: ( props: SidebarSubmenuItemProps, ) => React_2.JSX.Element; +// @public (undocumented) +export type SidebarSubmenuItemClassKey = + | 'item' + | 'itemContainer' + | 'selected' + | 'label' + | 'subtitle' + | 'dropdownArrow' + | 'dropdown' + | 'dropdownItem' + | 'textContent'; + // @public export type SidebarSubmenuItemDropdownItem = { title: string; @@ -1205,6 +1220,9 @@ export function SimpleStepperStep( // @public (undocumented) export type SimpleStepperStepClassKey = 'end'; +// @public (undocumented) +export type StackDetailsClassKey = 'title'; + // @public (undocumented) export function StarIcon(props: IconComponentProps): React_2.JSX.Element; diff --git a/packages/core-components/src/components/EmptyState/MissingAnnotationEmptyState.tsx b/packages/core-components/src/components/EmptyState/MissingAnnotationEmptyState.tsx index e185dff8a6..31168b4ac7 100644 --- a/packages/core-components/src/components/EmptyState/MissingAnnotationEmptyState.tsx +++ b/packages/core-components/src/components/EmptyState/MissingAnnotationEmptyState.tsx @@ -49,12 +49,6 @@ type Props = { readMoreUrl?: string; }; -/** - * @public - * @deprecated This component is deprecated, please use {@link @backstage/plugin-catalog-react#MissingAnnotationEmptyStateClassKey} instead - */ -export type MissingAnnotationEmptyStateClassKey = 'code'; - const useStyles = makeStyles( theme => ({ code: { diff --git a/packages/core-components/src/components/EmptyState/index.ts b/packages/core-components/src/components/EmptyState/index.ts index 2696fba850..70e113833a 100644 --- a/packages/core-components/src/components/EmptyState/index.ts +++ b/packages/core-components/src/components/EmptyState/index.ts @@ -18,4 +18,3 @@ export { EmptyState } from './EmptyState'; export type { EmptyStateClassKey } from './EmptyState'; export type { EmptyStateImageClassKey } from './EmptyStateImage'; export { MissingAnnotationEmptyState } from './MissingAnnotationEmptyState'; -export type { MissingAnnotationEmptyStateClassKey } from './MissingAnnotationEmptyState'; diff --git a/packages/core-components/src/components/Link/Link.tsx b/packages/core-components/src/components/Link/Link.tsx index e957390da8..478e589212 100644 --- a/packages/core-components/src/components/Link/Link.tsx +++ b/packages/core-components/src/components/Link/Link.tsx @@ -35,6 +35,9 @@ export function isReactRouterBeta(): boolean { return !obj.index; } +/** @public */ +export type LinkClassKey = 'visuallyHidden' | 'externalLink'; + const useStyles = makeStyles( { visuallyHidden: { diff --git a/packages/core-components/src/components/Link/index.ts b/packages/core-components/src/components/Link/index.ts index 2160508451..cfae332b17 100644 --- a/packages/core-components/src/components/Link/index.ts +++ b/packages/core-components/src/components/Link/index.ts @@ -15,4 +15,4 @@ */ export { Link } from './Link'; -export type { LinkProps } from './Link'; +export type { LinkProps, LinkClassKey } from './Link'; diff --git a/packages/core-components/src/layout/ErrorPage/StackDetails.tsx b/packages/core-components/src/layout/ErrorPage/StackDetails.tsx index 56fabfd5f8..307e44e435 100644 --- a/packages/core-components/src/layout/ErrorPage/StackDetails.tsx +++ b/packages/core-components/src/layout/ErrorPage/StackDetails.tsx @@ -26,6 +26,9 @@ interface IStackDetailsProps { stack: string; } +/** @public */ +export type StackDetailsClassKey = 'title'; + const useStyles = makeStyles( theme => ({ title: { diff --git a/packages/core-components/src/layout/ErrorPage/index.ts b/packages/core-components/src/layout/ErrorPage/index.ts index 429b467444..c89692ceb8 100644 --- a/packages/core-components/src/layout/ErrorPage/index.ts +++ b/packages/core-components/src/layout/ErrorPage/index.ts @@ -17,3 +17,4 @@ export { ErrorPage } from './ErrorPage'; export type { ErrorPageClassKey } from './ErrorPage'; export type { MicDropClassKey } from './MicDrop'; +export type { StackDetailsClassKey } from './StackDetails'; diff --git a/packages/core-components/src/layout/Sidebar/SidebarSubmenu.tsx b/packages/core-components/src/layout/Sidebar/SidebarSubmenu.tsx index e05cc90fa9..f26d59fc1d 100644 --- a/packages/core-components/src/layout/Sidebar/SidebarSubmenu.tsx +++ b/packages/core-components/src/layout/Sidebar/SidebarSubmenu.tsx @@ -27,6 +27,9 @@ import { } from './config'; import { useSidebarOpenState } from './SidebarOpenStateContext'; +/** @public */ +export type SidebarSubmenuClassKey = 'root' | 'drawer' | 'drawerOpen' | 'title'; + const useStyles = makeStyles< Theme, { submenuConfig: SubmenuConfig; left: number } diff --git a/packages/core-components/src/layout/Sidebar/SidebarSubmenuItem.tsx b/packages/core-components/src/layout/Sidebar/SidebarSubmenuItem.tsx index 19834268f9..0ed8aedcaf 100644 --- a/packages/core-components/src/layout/Sidebar/SidebarSubmenuItem.tsx +++ b/packages/core-components/src/layout/Sidebar/SidebarSubmenuItem.tsx @@ -29,6 +29,18 @@ import { isLocationMatch } from './utils'; import Box from '@material-ui/core/Box'; import Button from '@material-ui/core/Button'; +/** @public */ +export type SidebarSubmenuItemClassKey = + | 'item' + | 'itemContainer' + | 'selected' + | 'label' + | 'subtitle' + | 'dropdownArrow' + | 'dropdown' + | 'dropdownItem' + | 'textContent'; + const useStyles = makeStyles( theme => ({ item: { diff --git a/packages/core-components/src/layout/Sidebar/index.ts b/packages/core-components/src/layout/Sidebar/index.ts index b614d50feb..b3d88fd031 100644 --- a/packages/core-components/src/layout/Sidebar/index.ts +++ b/packages/core-components/src/layout/Sidebar/index.ts @@ -21,10 +21,14 @@ export { SidebarGroup } from './SidebarGroup'; export type { SidebarGroupProps } from './SidebarGroup'; export { SidebarSubmenuItem } from './SidebarSubmenuItem'; export { SidebarSubmenu } from './SidebarSubmenu'; -export type { SidebarSubmenuProps } from './SidebarSubmenu'; +export type { + SidebarSubmenuProps, + SidebarSubmenuClassKey, +} from './SidebarSubmenu'; export type { SidebarSubmenuItemProps, SidebarSubmenuItemDropdownItem, + SidebarSubmenuItemClassKey, } from './SidebarSubmenuItem'; export type { SidebarClassKey, SidebarProps } from './Bar'; export { SidebarPage, useContent } from './Page'; diff --git a/packages/core-components/src/overridableComponents.ts b/packages/core-components/src/overridableComponents.ts index 06e147cc78..df6db52094 100644 --- a/packages/core-components/src/overridableComponents.ts +++ b/packages/core-components/src/overridableComponents.ts @@ -25,7 +25,6 @@ import { DismissableBannerClassKey, EmptyStateClassKey, EmptyStateImageClassKey, - MissingAnnotationEmptyStateClassKey, ErrorPanelClassKey, FeatureCalloutCircleClassKey, HeaderIconLinkRowClassKey, @@ -61,6 +60,7 @@ import { FiltersContainerClassKey, TableClassKey, WarningPanelClassKey, + LinkClassKey, FavoriteToggleIconClassKey, } from './components'; @@ -91,6 +91,10 @@ import { TabbedCardClassKey, BoldHeaderClassKey, CardTabClassKey, + SidebarSubmenuClassKey, + SidebarSubmenuItemClassKey, + StackDetailsClassKey, + BreadcrumbsCurrentPageClassKey, } from './layout'; type BackstageComponentsNameToClassKey = { @@ -102,7 +106,6 @@ type BackstageComponentsNameToClassKey = { BackstageDismissableBanner: DismissableBannerClassKey; BackstageEmptyState: EmptyStateClassKey; BackstageEmptyStateImage: EmptyStateImageClassKey; - BackstageMissingAnnotationEmptyState: MissingAnnotationEmptyStateClassKey; BackstageErrorPanel: ErrorPanelClassKey; BackstageFeatureCalloutCircular: FeatureCalloutCircleClassKey; BackstageHeaderIconLinkRow: HeaderIconLinkRowClassKey; @@ -112,7 +115,7 @@ type BackstageComponentsNameToClassKey = { BackstageMarkdownContent: MarkdownContentClassKey; BackstageLoginRequestListItem: LoginRequestListItemClassKey; BackstageLogViewer: LogViewerClassKey; - OAuthRequestDialog: OAuthRequestDialogClassKey; + BackstageOAuthRequestDialog: OAuthRequestDialogClassKey; BackstageOverflowTooltip: OverflowTooltipClassKey; BackstageGauge: GaugeClassKey; BackstageGaugeCard: GaugeCardClassKey; @@ -141,10 +144,12 @@ type BackstageComponentsNameToClassKey = { BackstageBottomLink: BottomLinkClassKey; BackstageBreadcrumbsClickableText: BreadcrumbsClickableTextClassKey; BackstageBreadcrumbsStyledBox: BreadcrumbsStyledBoxClassKey; + BreadcrumbsCurrentPage: BreadcrumbsCurrentPageClassKey; BackstageContent: BackstageContentClassKey; BackstageContentHeader: ContentHeaderClassKey; BackstageErrorPage: ErrorPageClassKey; BackstageErrorPageMicDrop: MicDropClassKey; + BackstageErrorPageStackDetails: StackDetailsClassKey; BackstageHeader: HeaderClassKey; BackstageHeaderLabel: HeaderLabelClassKey; BackstageHeaderTabs: HeaderTabsClassKey; @@ -158,12 +163,15 @@ type BackstageComponentsNameToClassKey = { BackstageSidebarSpacer: SidebarSpacerClassKey; BackstageSidebarDivider: SidebarDividerClassKey; BackstageSidebarItem: SidebarItemClassKey; + BackstageSidebarSubmenu: SidebarSubmenuClassKey; + BackstageSidebarSubmenuItem: SidebarSubmenuItemClassKey; BackstageSidebarPage: SidebarPageClassKey; BackstageCustomProvider: CustomProviderClassKey; BackstageSignInPage: SignInPageClassKey; BackstageTabbedCard: TabbedCardClassKey; BackstageTabbedCardBoldHeader: BoldHeaderClassKey; BackstageCardTab: CardTabClassKey; + BackstageLink: LinkClassKey; BackstageFavoriteToggleIcon: FavoriteToggleIconClassKey; }; diff --git a/plugins/catalog-graph/api-report.md b/plugins/catalog-graph/api-report.md index 205ffed089..fc40e5b6c4 100644 --- a/plugins/catalog-graph/api-report.md +++ b/plugins/catalog-graph/api-report.md @@ -60,6 +60,12 @@ export const catalogGraphPlugin: BackstagePlugin< // @public export const catalogGraphRouteRef: RouteRef; +// @public (undocumented) +export type CustomLabelClassKey = 'text' | 'secondary'; + +// @public (undocumented) +export type CustomNodeClassKey = 'node' | 'text' | 'clickable'; + // @public export enum Direction { BOTTOM_TOP = 'BT', @@ -107,6 +113,9 @@ export const EntityRelationsGraph: ( props: EntityRelationsGraphProps, ) => React_2.JSX.Element; +// @public (undocumented) +export type EntityRelationsGraphClassKey = 'progress' | 'container' | 'graph'; + // @public (undocumented) export type EntityRelationsGraphProps = { rootEntityNames: CompoundEntityRef | CompoundEntityRef[]; diff --git a/plugins/catalog-graph/src/components/CatalogGraphCard/CatalogGraphCard.tsx b/plugins/catalog-graph/src/components/CatalogGraphCard/CatalogGraphCard.tsx index 7c7f4c6063..2276d19757 100644 --- a/plugins/catalog-graph/src/components/CatalogGraphCard/CatalogGraphCard.tsx +++ b/plugins/catalog-graph/src/components/CatalogGraphCard/CatalogGraphCard.tsx @@ -39,6 +39,9 @@ import { } from '../EntityRelationsGraph'; import { EntityRelationsGraphProps } from '../EntityRelationsGraph'; +/** @public */ +export type CatalogGraphCardClassKey = 'card' | 'graph'; + const useStyles = makeStyles( { card: ({ height }) => ({ diff --git a/plugins/catalog-graph/src/components/CatalogGraphCard/index.ts b/plugins/catalog-graph/src/components/CatalogGraphCard/index.ts index 725f90331f..53db3719a7 100644 --- a/plugins/catalog-graph/src/components/CatalogGraphCard/index.ts +++ b/plugins/catalog-graph/src/components/CatalogGraphCard/index.ts @@ -14,3 +14,4 @@ * limitations under the License. */ export { CatalogGraphCard } from './CatalogGraphCard'; +export type { CatalogGraphCardClassKey } from './CatalogGraphCard'; diff --git a/plugins/catalog-graph/src/components/CatalogGraphPage/CatalogGraphPage.tsx b/plugins/catalog-graph/src/components/CatalogGraphPage/CatalogGraphPage.tsx index ad673b192a..23363668a6 100644 --- a/plugins/catalog-graph/src/components/CatalogGraphPage/CatalogGraphPage.tsx +++ b/plugins/catalog-graph/src/components/CatalogGraphPage/CatalogGraphPage.tsx @@ -51,6 +51,16 @@ import { SelectedRelationsFilter } from './SelectedRelationsFilter'; import { SwitchFilter } from './SwitchFilter'; import { useCatalogGraphPage } from './useCatalogGraphPage'; +/** @public */ +export type CatalogGraphPageClassKey = + | 'content' + | 'container' + | 'fullHeight' + | 'graphWrapper' + | 'graph' + | 'legend' + | 'filters'; + const useStyles = makeStyles( theme => ({ content: { diff --git a/plugins/catalog-graph/src/components/CatalogGraphPage/MaxDepthFilter.tsx b/plugins/catalog-graph/src/components/CatalogGraphPage/MaxDepthFilter.tsx index 51ee4643b5..5f7b891d72 100644 --- a/plugins/catalog-graph/src/components/CatalogGraphPage/MaxDepthFilter.tsx +++ b/plugins/catalog-graph/src/components/CatalogGraphPage/MaxDepthFilter.tsx @@ -28,6 +28,9 @@ export type Props = { onChange: (value: number) => void; }; +/** @public */ +export type MaxDepthFilterClassKey = 'formControl'; + const useStyles = makeStyles( { formControl: { diff --git a/plugins/catalog-graph/src/components/CatalogGraphPage/SelectedKindsFilter.tsx b/plugins/catalog-graph/src/components/CatalogGraphPage/SelectedKindsFilter.tsx index 1a38e4e31f..e0b7f7fa55 100644 --- a/plugins/catalog-graph/src/components/CatalogGraphPage/SelectedKindsFilter.tsx +++ b/plugins/catalog-graph/src/components/CatalogGraphPage/SelectedKindsFilter.tsx @@ -28,6 +28,9 @@ import Autocomplete from '@material-ui/lab/Autocomplete'; import React, { useCallback, useEffect, useMemo } from 'react'; import useAsync from 'react-use/esm/useAsync'; +/** @public */ +export type SelectedKindsFilterClassKey = 'formControl'; + const useStyles = makeStyles( { formControl: { diff --git a/plugins/catalog-graph/src/components/CatalogGraphPage/SelectedRelationsFilter.tsx b/plugins/catalog-graph/src/components/CatalogGraphPage/SelectedRelationsFilter.tsx index 74adfd0226..af67c0ef8b 100644 --- a/plugins/catalog-graph/src/components/CatalogGraphPage/SelectedRelationsFilter.tsx +++ b/plugins/catalog-graph/src/components/CatalogGraphPage/SelectedRelationsFilter.tsx @@ -26,6 +26,9 @@ import Autocomplete from '@material-ui/lab/Autocomplete'; import React, { useCallback, useMemo } from 'react'; import { RelationPairs } from '../EntityRelationsGraph'; +/** @public */ +export type SelectedRelationsFilterClassKey = 'formControl'; + const useStyles = makeStyles( { formControl: { diff --git a/plugins/catalog-graph/src/components/CatalogGraphPage/SwitchFilter.tsx b/plugins/catalog-graph/src/components/CatalogGraphPage/SwitchFilter.tsx index 4427d87a59..b2878f1934 100644 --- a/plugins/catalog-graph/src/components/CatalogGraphPage/SwitchFilter.tsx +++ b/plugins/catalog-graph/src/components/CatalogGraphPage/SwitchFilter.tsx @@ -25,6 +25,9 @@ export type Props = { onChange: (value: boolean) => void; }; +/** @public */ +export type SwitchFilterClassKey = 'root'; + const useStyles = makeStyles( { root: { diff --git a/plugins/catalog-graph/src/components/CatalogGraphPage/index.ts b/plugins/catalog-graph/src/components/CatalogGraphPage/index.ts index 9e59ad3a13..496e79aab4 100644 --- a/plugins/catalog-graph/src/components/CatalogGraphPage/index.ts +++ b/plugins/catalog-graph/src/components/CatalogGraphPage/index.ts @@ -14,3 +14,8 @@ * limitations under the License. */ export { CatalogGraphPage } from './CatalogGraphPage'; +export type { CatalogGraphPageClassKey } from './CatalogGraphPage'; +export type { MaxDepthFilterClassKey } from './MaxDepthFilter'; +export type { SelectedKindsFilterClassKey } from './SelectedKindsFilter'; +export type { SelectedRelationsFilterClassKey } from './SelectedRelationsFilter'; +export type { SwitchFilterClassKey } from './SwitchFilter'; diff --git a/plugins/catalog-graph/src/components/EntityRelationsGraph/DefaultRenderLabel.tsx b/plugins/catalog-graph/src/components/EntityRelationsGraph/DefaultRenderLabel.tsx index ae01a113dd..14b88e59b3 100644 --- a/plugins/catalog-graph/src/components/EntityRelationsGraph/DefaultRenderLabel.tsx +++ b/plugins/catalog-graph/src/components/EntityRelationsGraph/DefaultRenderLabel.tsx @@ -19,6 +19,9 @@ import React from 'react'; import { EntityEdgeData } from './types'; import classNames from 'classnames'; +/** @public */ +export type CustomLabelClassKey = 'text' | 'secondary'; + const useStyles = makeStyles( theme => ({ text: { diff --git a/plugins/catalog-graph/src/components/EntityRelationsGraph/DefaultRenderNode.tsx b/plugins/catalog-graph/src/components/EntityRelationsGraph/DefaultRenderNode.tsx index bc3311d33f..dcdba40f9a 100644 --- a/plugins/catalog-graph/src/components/EntityRelationsGraph/DefaultRenderNode.tsx +++ b/plugins/catalog-graph/src/components/EntityRelationsGraph/DefaultRenderNode.tsx @@ -23,6 +23,9 @@ import { EntityIcon } from './EntityIcon'; import { EntityNodeData } from './types'; import { DEFAULT_NAMESPACE } from '@backstage/catalog-model'; +/** @public */ +export type CustomNodeClassKey = 'node' | 'text' | 'clickable'; + const useStyles = makeStyles( theme => ({ node: { diff --git a/plugins/catalog-graph/src/components/EntityRelationsGraph/EntityRelationsGraph.tsx b/plugins/catalog-graph/src/components/EntityRelationsGraph/EntityRelationsGraph.tsx index 51de7cc47f..699c4d9b30 100644 --- a/plugins/catalog-graph/src/components/EntityRelationsGraph/EntityRelationsGraph.tsx +++ b/plugins/catalog-graph/src/components/EntityRelationsGraph/EntityRelationsGraph.tsx @@ -34,6 +34,9 @@ import { ALL_RELATION_PAIRS, RelationPairs } from './relations'; import { Direction, EntityEdge, EntityNode } from './types'; import { useEntityRelationNodesAndEdges } from './useEntityRelationNodesAndEdges'; +/** @public */ +export type EntityRelationsGraphClassKey = 'progress' | 'container' | 'graph'; + const useStyles = makeStyles( theme => ({ progress: { diff --git a/plugins/catalog-graph/src/components/EntityRelationsGraph/index.ts b/plugins/catalog-graph/src/components/EntityRelationsGraph/index.ts index 06227babe3..7477d22f87 100644 --- a/plugins/catalog-graph/src/components/EntityRelationsGraph/index.ts +++ b/plugins/catalog-graph/src/components/EntityRelationsGraph/index.ts @@ -14,7 +14,10 @@ * limitations under the License. */ export { EntityRelationsGraph } from './EntityRelationsGraph'; -export type { EntityRelationsGraphProps } from './EntityRelationsGraph'; +export type { + EntityRelationsGraphProps, + EntityRelationsGraphClassKey, +} from './EntityRelationsGraph'; export { ALL_RELATION_PAIRS } from './relations'; export type { RelationPairs } from './relations'; export { Direction } from './types'; @@ -24,3 +27,5 @@ export type { EntityNodeData, EntityNode, } from './types'; +export type { CustomLabelClassKey } from './DefaultRenderLabel'; +export type { CustomNodeClassKey } from './DefaultRenderNode'; diff --git a/plugins/catalog-graph/src/overridableComponents.ts b/plugins/catalog-graph/src/overridableComponents.ts new file mode 100644 index 0000000000..1b92ae5389 --- /dev/null +++ b/plugins/catalog-graph/src/overridableComponents.ts @@ -0,0 +1,55 @@ +/* + * Copyright 2021 The Backstage Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ +import { Overrides } from '@material-ui/core/styles/overrides'; +import { StyleRules } from '@material-ui/core/styles/withStyles'; +import { CatalogGraphCardClassKey } from './components/CatalogGraphCard'; +import { + CatalogGraphPageClassKey, + MaxDepthFilterClassKey, + SelectedKindsFilterClassKey, + SelectedRelationsFilterClassKey, + SwitchFilterClassKey, +} from './components/CatalogGraphPage'; +import { + CustomLabelClassKey, + CustomNodeClassKey, + EntityRelationsGraphClassKey, +} from './components'; + +/** @public */ +export type PluginCatalogGraphComponentsNameToClassKey = { + PluginCatalogGraphEntityRelationsGraph: EntityRelationsGraphClassKey; + PluginCatalogGraphCustomNode: CustomNodeClassKey; + PluginCatalogGraphCustomLabel: CustomLabelClassKey; + PluginCatalogGraphSwitchFilter: SwitchFilterClassKey; + PluginCatalogGraphSelectedRelationsFilter: SelectedRelationsFilterClassKey; + PluginCatalogGraphSelectedKindsFilter: SelectedKindsFilterClassKey; + PluginCatalogGraphMaxDepthFilter: MaxDepthFilterClassKey; + PluginCatalogGraphCatalogGraphPage: CatalogGraphPageClassKey; + PluginCatalogGraphCatalogGraphCard: CatalogGraphCardClassKey; +}; + +/** @public */ +export type BackstageOverrides = Overrides & { + [Name in keyof PluginCatalogGraphComponentsNameToClassKey]?: Partial< + StyleRules + >; +}; + +declare module '@backstage/theme' { + interface OverrideComponentNameToClassKeys + extends PluginCatalogGraphComponentsNameToClassKey {} +} diff --git a/plugins/catalog-react/api-report.md b/plugins/catalog-react/api-report.md index 274f1c0d68..0293fca239 100644 --- a/plugins/catalog-react/api-report.md +++ b/plugins/catalog-react/api-report.md @@ -92,8 +92,10 @@ export type CatalogReactComponentsNameToClassKey = { CatalogReactEntitySearchBar: CatalogReactEntitySearchBarClassKey; CatalogReactEntityTagPicker: CatalogReactEntityTagPickerClassKey; CatalogReactEntityOwnerPicker: CatalogReactEntityOwnerPickerClassKey; + CatalogReactFixedWidthFormControlLabel: FixedWidthFormControlLabelClassKey; CatalogReactEntityProcessingStatusPicker: CatalogReactEntityProcessingStatusPickerClassKey; CatalogReactEntityAutocompletePickerClassKey: CatalogReactEntityAutocompletePickerClassKey; + CatalogReactMissingAnnotationEmptyState: MissingAnnotationEmptyStateClassKey; }; // @public (undocumented) @@ -649,6 +651,9 @@ export type FavoriteEntityProps = ComponentProps & { entity: Entity; }; +// @public (undocumented) +export type FixedWidthFormControlLabelClassKey = 'label' | 'root'; + // @public export function getEntityRelations( entity: Entity | undefined, diff --git a/plugins/catalog-react/src/components/EntityLifecyclePicker/EntityLifecyclePicker.tsx b/plugins/catalog-react/src/components/EntityLifecyclePicker/EntityLifecyclePicker.tsx index 2d8a0dea32..6af5bc2b08 100644 --- a/plugins/catalog-react/src/components/EntityLifecyclePicker/EntityLifecyclePicker.tsx +++ b/plugins/catalog-react/src/components/EntityLifecyclePicker/EntityLifecyclePicker.tsx @@ -28,9 +28,7 @@ const useStyles = makeStyles( { input: {}, }, - { - name: 'CatalogReactEntityLifecyclePicker', - }, + { name: 'CatalogReactEntityLifecyclePicker' }, ); /** @public */ diff --git a/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.tsx b/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.tsx index 1b78630f9e..565472b152 100644 --- a/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.tsx +++ b/plugins/catalog-react/src/components/EntityOwnerPicker/EntityOwnerPicker.tsx @@ -58,11 +58,12 @@ const useStyles = makeStyles( overflow: 'hidden', }, }, - { - name: 'CatalogReactEntityOwnerPicker', - }, + { name: 'CatalogReactEntityOwnerPicker' }, ); +/** @public */ +export type FixedWidthFormControlLabelClassKey = 'label' | 'root'; + const FixedWidthFormControlLabel = withStyles( _theme => ({ label: { diff --git a/plugins/catalog-react/src/components/EntityOwnerPicker/index.ts b/plugins/catalog-react/src/components/EntityOwnerPicker/index.ts index 8685d838cd..80caf828d9 100644 --- a/plugins/catalog-react/src/components/EntityOwnerPicker/index.ts +++ b/plugins/catalog-react/src/components/EntityOwnerPicker/index.ts @@ -18,4 +18,5 @@ export { EntityOwnerPicker } from './EntityOwnerPicker'; export type { CatalogReactEntityOwnerPickerClassKey, EntityOwnerPickerProps, + FixedWidthFormControlLabelClassKey, } from './EntityOwnerPicker'; diff --git a/plugins/catalog-react/src/components/EntityProcessingStatusPicker/EntityProcessingStatusPicker.tsx b/plugins/catalog-react/src/components/EntityProcessingStatusPicker/EntityProcessingStatusPicker.tsx index 20190a9907..76b7aa1885 100644 --- a/plugins/catalog-react/src/components/EntityProcessingStatusPicker/EntityProcessingStatusPicker.tsx +++ b/plugins/catalog-react/src/components/EntityProcessingStatusPicker/EntityProcessingStatusPicker.tsx @@ -39,9 +39,7 @@ const useStyles = makeStyles( input: {}, label: {}, }, - { - name: 'CatalogReactEntityProcessingStatusPickerPicker', - }, + { name: 'CatalogReactEntityProcessingStatusPickerPicker' }, ); const icon = ; diff --git a/plugins/catalog-react/src/components/EntitySearchBar/EntitySearchBar.tsx b/plugins/catalog-react/src/components/EntitySearchBar/EntitySearchBar.tsx index abde5430bc..5239387d2b 100644 --- a/plugins/catalog-react/src/components/EntitySearchBar/EntitySearchBar.tsx +++ b/plugins/catalog-react/src/components/EntitySearchBar/EntitySearchBar.tsx @@ -40,9 +40,7 @@ const useStyles = makeStyles( }, input: {}, }), - { - name: 'CatalogReactEntitySearchBar', - }, + { name: 'CatalogReactEntitySearchBar' }, ); /** diff --git a/plugins/catalog-react/src/components/UserListPicker/UserListPicker.tsx b/plugins/catalog-react/src/components/UserListPicker/UserListPicker.tsx index f572cec814..ce61229891 100644 --- a/plugins/catalog-react/src/components/UserListPicker/UserListPicker.tsx +++ b/plugins/catalog-react/src/components/UserListPicker/UserListPicker.tsx @@ -74,9 +74,7 @@ const useStyles = makeStyles( margin: theme.spacing(1, 1, 2, 1), }, }), - { - name: 'CatalogReactUserListPicker', - }, + { name: 'CatalogReactUserListPicker' }, ); export type ButtonGroup = { diff --git a/plugins/catalog-react/src/overridableComponents.ts b/plugins/catalog-react/src/overridableComponents.ts index b45fd30103..1b27a350da 100644 --- a/plugins/catalog-react/src/overridableComponents.ts +++ b/plugins/catalog-react/src/overridableComponents.ts @@ -25,6 +25,8 @@ import { CatalogReactEntityTagPickerClassKey, CatalogReactEntityOwnerPickerClassKey, CatalogReactEntityProcessingStatusPickerClassKey, + FixedWidthFormControlLabelClassKey, + MissingAnnotationEmptyStateClassKey, } from './components'; import { CatalogReactEntityAutocompletePickerClassKey } from './components/EntityAutocompletePicker/EntityAutocompletePicker'; @@ -36,8 +38,10 @@ export type CatalogReactComponentsNameToClassKey = { CatalogReactEntitySearchBar: CatalogReactEntitySearchBarClassKey; CatalogReactEntityTagPicker: CatalogReactEntityTagPickerClassKey; CatalogReactEntityOwnerPicker: CatalogReactEntityOwnerPickerClassKey; + CatalogReactFixedWidthFormControlLabel: FixedWidthFormControlLabelClassKey; CatalogReactEntityProcessingStatusPicker: CatalogReactEntityProcessingStatusPickerClassKey; CatalogReactEntityAutocompletePickerClassKey: CatalogReactEntityAutocompletePickerClassKey; + CatalogReactMissingAnnotationEmptyState: MissingAnnotationEmptyStateClassKey; }; /** @public */ diff --git a/plugins/catalog/api-report.md b/plugins/catalog/api-report.md index 2c1d2597fe..4017e8d494 100644 --- a/plugins/catalog/api-report.md +++ b/plugins/catalog/api-report.md @@ -134,6 +134,12 @@ export const CatalogSearchResultListItem: ( props: SearchResultListItemExtensionProps, ) => JSX.Element | null; +// @public (undocumented) +export type CatalogSearchResultListItemClassKey = + | 'item' + | 'flexContainer' + | 'itemText'; + // @public export interface CatalogSearchResultListItemProps { // (undocumented) @@ -223,6 +229,9 @@ export interface CatalogTableRow { }; } +// @public (undocumented) +export type CatalogTableToolbarClassKey = 'root' | 'text'; + // @public (undocumented) export type ColumnBreakpoints = Record; @@ -391,6 +400,9 @@ export interface EntityLabelsCardProps { variant?: InfoCardVariants; } +// @public (undocumented) +export type EntityLabelsEmptyStateClassKey = 'code'; + // @public export const EntityLayout: { (props: EntityLayoutProps): React_2.JSX.Element; @@ -626,6 +638,9 @@ export type PluginCatalogComponentsNameToClassKey = { PluginCatalogEntityLinksEmptyState: EntityLinksEmptyStateClassKey; PluginCatalogSystemDiagramCard: SystemDiagramCardClassKey; PluginCatalogEntityContextMenu: EntityContextMenuClassKey; + PluginCatalogSearchResultListItem: CatalogSearchResultListItemClassKey; + PluginCatalogTableToolbar: CatalogTableToolbarClassKey; + PluginCatalogEntityLabelsEmptyState: EntityLabelsEmptyStateClassKey; }; // @public (undocumented) diff --git a/plugins/catalog/src/components/CatalogSearchResultListItem/CatalogSearchResultListItem.tsx b/plugins/catalog/src/components/CatalogSearchResultListItem/CatalogSearchResultListItem.tsx index f4501bd795..a2722c8b33 100644 --- a/plugins/catalog/src/components/CatalogSearchResultListItem/CatalogSearchResultListItem.tsx +++ b/plugins/catalog/src/components/CatalogSearchResultListItem/CatalogSearchResultListItem.tsx @@ -30,6 +30,12 @@ import { HighlightedSearchResultText } from '@backstage/plugin-search-react'; import { catalogTranslationRef } from '../../alpha/translation'; import { useTranslationRef } from '@backstage/frontend-plugin-api'; +/** @public */ +export type CatalogSearchResultListItemClassKey = + | 'item' + | 'flexContainer' + | 'itemText'; + const useStyles = makeStyles( { item: { diff --git a/plugins/catalog/src/components/CatalogSearchResultListItem/index.ts b/plugins/catalog/src/components/CatalogSearchResultListItem/index.ts index ba0e6d29be..47af0e32b2 100644 --- a/plugins/catalog/src/components/CatalogSearchResultListItem/index.ts +++ b/plugins/catalog/src/components/CatalogSearchResultListItem/index.ts @@ -15,4 +15,7 @@ */ export { CatalogSearchResultListItem } from './CatalogSearchResultListItem'; -export type { CatalogSearchResultListItemProps } from './CatalogSearchResultListItem'; +export type { + CatalogSearchResultListItemProps, + CatalogSearchResultListItemClassKey, +} from './CatalogSearchResultListItem'; diff --git a/plugins/catalog/src/components/CatalogTable/CatalogTableToolbar.tsx b/plugins/catalog/src/components/CatalogTable/CatalogTableToolbar.tsx index 16d9923727..077319a7f0 100644 --- a/plugins/catalog/src/components/CatalogTable/CatalogTableToolbar.tsx +++ b/plugins/catalog/src/components/CatalogTable/CatalogTableToolbar.tsx @@ -19,6 +19,9 @@ import Toolbar from '@material-ui/core/Toolbar'; import Typography from '@material-ui/core/Typography'; import { makeStyles } from '@material-ui/core/styles'; +/** @public */ +export type CatalogTableToolbarClassKey = 'root' | 'text'; + const useToolbarStyles = makeStyles( theme => ({ root: { @@ -34,7 +37,7 @@ const useToolbarStyles = makeStyles( textOverflow: 'ellipsis', }, }), - { name: 'BackstageTableToolbar' }, + { name: 'PluginCatalogTableToolbar' }, ); export function CatalogTableToolbar(props: { diff --git a/plugins/catalog/src/components/CatalogTable/index.ts b/plugins/catalog/src/components/CatalogTable/index.ts index f5d1ca1bb7..ac9871cdbd 100644 --- a/plugins/catalog/src/components/CatalogTable/index.ts +++ b/plugins/catalog/src/components/CatalogTable/index.ts @@ -16,4 +16,5 @@ export { CatalogTable } from './CatalogTable'; export type { CatalogTableProps } from './CatalogTable'; +export type { CatalogTableToolbarClassKey } from './CatalogTableToolbar'; export type { CatalogTableRow, CatalogTableColumnsFunc } from './types'; diff --git a/plugins/catalog/src/components/EntityLabelsCard/EntityLabelsEmptyState.tsx b/plugins/catalog/src/components/EntityLabelsCard/EntityLabelsEmptyState.tsx index d78be2d2ce..3859d54a7a 100644 --- a/plugins/catalog/src/components/EntityLabelsCard/EntityLabelsEmptyState.tsx +++ b/plugins/catalog/src/components/EntityLabelsCard/EntityLabelsEmptyState.tsx @@ -27,6 +27,9 @@ const ENTITY_YAML = `metadata: labels: javaVersion: 1.2.3`; +/** @public */ +export type EntityLabelsEmptyStateClassKey = 'code'; + const useStyles = makeStyles( theme => ({ code: { diff --git a/plugins/catalog/src/components/EntityLabelsCard/index.ts b/plugins/catalog/src/components/EntityLabelsCard/index.ts index 870819f9a7..b86d56c16c 100644 --- a/plugins/catalog/src/components/EntityLabelsCard/index.ts +++ b/plugins/catalog/src/components/EntityLabelsCard/index.ts @@ -17,3 +17,4 @@ export { EntityLabelsCard } from './EntityLabelsCard'; export * from './conditions'; export type { EntityLabelsCardProps } from './EntityLabelsCard'; +export type { EntityLabelsEmptyStateClassKey } from './EntityLabelsEmptyState'; diff --git a/plugins/catalog/src/index.ts b/plugins/catalog/src/index.ts index 806ea40c66..f3cc7d3d0b 100644 --- a/plugins/catalog/src/index.ts +++ b/plugins/catalog/src/index.ts @@ -38,6 +38,7 @@ export * from './components/EntitySwitch'; export * from './components/FilteredEntityLayout'; export * from './overridableComponents'; export * from './components/EntityLabelsCard'; +export * from './components/CatalogSearchResultListItem'; export { CatalogEntityPage, CatalogIndexPage, diff --git a/plugins/catalog/src/overridableComponents.ts b/plugins/catalog/src/overridableComponents.ts index 0d981b1700..c700566b97 100644 --- a/plugins/catalog/src/overridableComponents.ts +++ b/plugins/catalog/src/overridableComponents.ts @@ -19,12 +19,18 @@ import { StyleRules } from '@material-ui/core/styles/withStyles'; import { EntityLinksEmptyStateClassKey } from './components/EntityLinksCard'; import { SystemDiagramCardClassKey } from './components/SystemDiagramCard'; import { EntityContextMenuClassKey } from './components/EntityContextMenu'; +import { CatalogSearchResultListItemClassKey } from './components/CatalogSearchResultListItem'; +import { CatalogTableToolbarClassKey } from './components/CatalogTable'; +import { EntityLabelsEmptyStateClassKey } from './components/EntityLabelsCard'; /** @public */ export type PluginCatalogComponentsNameToClassKey = { PluginCatalogEntityLinksEmptyState: EntityLinksEmptyStateClassKey; PluginCatalogSystemDiagramCard: SystemDiagramCardClassKey; PluginCatalogEntityContextMenu: EntityContextMenuClassKey; + PluginCatalogSearchResultListItem: CatalogSearchResultListItemClassKey; + PluginCatalogTableToolbar: CatalogTableToolbarClassKey; + PluginCatalogEntityLabelsEmptyState: EntityLabelsEmptyStateClassKey; }; /** @public */ diff --git a/plugins/home/src/homePageComponents/FeaturedDocsCard/Content.tsx b/plugins/home/src/homePageComponents/FeaturedDocsCard/Content.tsx index eae8e82966..dfd6c1b8e7 100644 --- a/plugins/home/src/homePageComponents/FeaturedDocsCard/Content.tsx +++ b/plugins/home/src/homePageComponents/FeaturedDocsCard/Content.tsx @@ -53,6 +53,12 @@ export type FeaturedDocsCardProps = { subLinkText?: string; }; +/** @public */ +export type FeaturedDocsCardClassKey = + | 'docDescription' + | 'docSubLink' + | 'docsTitleLink'; + const useStyles = makeStyles( theme => ({ docDescription: { diff --git a/plugins/home/src/homePageComponents/FeaturedDocsCard/index.ts b/plugins/home/src/homePageComponents/FeaturedDocsCard/index.ts index 5151fa370c..526fc291c9 100644 --- a/plugins/home/src/homePageComponents/FeaturedDocsCard/index.ts +++ b/plugins/home/src/homePageComponents/FeaturedDocsCard/index.ts @@ -15,4 +15,7 @@ */ export { Content } from './Content'; -export type { FeaturedDocsCardProps } from './Content'; +export type { + FeaturedDocsCardProps, + FeaturedDocsCardClassKey, +} from './Content'; diff --git a/plugins/home/src/overridableComponents.ts b/plugins/home/src/overridableComponents.ts new file mode 100644 index 0000000000..04225e048c --- /dev/null +++ b/plugins/home/src/overridableComponents.ts @@ -0,0 +1,36 @@ +/* + * Copyright 2021 The Backstage Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { Overrides } from '@material-ui/core/styles/overrides'; +import { StyleRules } from '@material-ui/core/styles/withStyles'; +import { FeaturedDocsCardClassKey } from './homePageComponents/FeaturedDocsCard'; + +/** @public */ +export type CatalogReactComponentsNameToClassKey = { + HomeFeaturedDocsCard: FeaturedDocsCardClassKey; +}; + +/** @public */ +export type BackstageOverrides = Overrides & { + [Name in keyof CatalogReactComponentsNameToClassKey]?: Partial< + StyleRules + >; +}; + +declare module '@backstage/theme' { + interface OverrideComponentNameToClassKeys + extends CatalogReactComponentsNameToClassKey {} +} diff --git a/plugins/org/api-report.md b/plugins/org/api-report.md index e958e8e29a..af03687240 100644 --- a/plugins/org/api-report.md +++ b/plugins/org/api-report.md @@ -53,6 +53,9 @@ export const GroupProfileCard: (props: { showLinks?: boolean; }) => React_2.JSX.Element; +// @public (undocumented) +export type MemberComponentClassKey = 'card' | 'avatar'; + // @public (undocumented) export const MembersListCard: (props: { memberDisplayTitle?: string; @@ -63,6 +66,9 @@ export const MembersListCard: (props: { relationAggregation?: EntityRelationAggregation; }) => React_2.JSX.Element; +// @public (undocumented) +export type MembersListCardClassKey = 'root' | 'cardContent' | 'memberList'; + // @public export const MyGroupsSidebarItem: (props: { singularTitle: string; diff --git a/plugins/org/src/components/Cards/Group/MembersList/MembersListCard.tsx b/plugins/org/src/components/Cards/Group/MembersList/MembersListCard.tsx index f27b071114..a54ee201c5 100644 --- a/plugins/org/src/components/Cards/Group/MembersList/MembersListCard.tsx +++ b/plugins/org/src/components/Cards/Group/MembersList/MembersListCard.tsx @@ -46,6 +46,9 @@ import { import { EntityRefLink } from '@backstage/plugin-catalog-react'; import { EntityRelationAggregation } from '../../types'; +/** @public */ +export type MemberComponentClassKey = 'card' | 'avatar'; + const useStyles = makeStyles( (theme: Theme) => createStyles({ @@ -64,7 +67,7 @@ const useStyles = makeStyles( top: '-2rem', }, }), - { name: 'MembersListCardComponent' }, + { name: 'PluginOrgMemberComponent' }, ); const MemberComponent = (props: { member: UserEntity }) => { @@ -117,21 +120,27 @@ const MemberComponent = (props: { member: UserEntity }) => { ); }; -const useListStyles = makeStyles(theme => ({ - root: { - height: '100%', - }, - cardContent: { - overflow: 'auto', - }, - memberList: { - display: 'grid', - gap: theme.spacing(1.5), - gridTemplateColumns: `repeat(auto-fit, minmax(auto, ${theme.spacing( - 34, - )}px))`, - }, -})); +/** @public */ +export type MembersListCardClassKey = 'root' | 'cardContent' | 'memberList'; + +const useListStyles = makeStyles( + theme => ({ + root: { + height: '100%', + }, + cardContent: { + overflow: 'auto', + }, + memberList: { + display: 'grid', + gap: theme.spacing(1.5), + gridTemplateColumns: `repeat(auto-fit, minmax(auto, ${theme.spacing( + 34, + )}px))`, + }, + }), + { name: 'PluginOrgMembersListCardComponent' }, +); /** @public */ export const MembersListCard = (props: { diff --git a/plugins/org/src/overridableComponents.ts b/plugins/org/src/overridableComponents.ts new file mode 100644 index 0000000000..11381ff7d7 --- /dev/null +++ b/plugins/org/src/overridableComponents.ts @@ -0,0 +1,37 @@ +/* + * Copyright 2021 The Backstage Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { Overrides } from '@material-ui/core/styles/overrides'; +import { StyleRules } from '@material-ui/core/styles/withStyles'; +import { MemberComponentClassKey, MembersListCardClassKey } from './components'; + +/** @public */ +export type CatalogReactComponentsNameToClassKey = { + PluginOrgMemberComponent: MemberComponentClassKey; + PluginOrgMembersListCardComponent: MembersListCardClassKey; +}; + +/** @public */ +export type BackstageOverrides = Overrides & { + [Name in keyof CatalogReactComponentsNameToClassKey]?: Partial< + StyleRules + >; +}; + +declare module '@backstage/theme' { + interface OverrideComponentNameToClassKeys + extends CatalogReactComponentsNameToClassKey {} +} diff --git a/plugins/search-react/api-report.md b/plugins/search-react/api-report.md index 34d79fb16f..3efed073d8 100644 --- a/plugins/search-react/api-report.md +++ b/plugins/search-react/api-report.md @@ -65,6 +65,9 @@ export const HighlightedSearchResultText: ( props: HighlightedSearchResultTextProps, ) => React_2.JSX.Element; +// @public (undocumented) +export type HighlightedSearchResultTextClassKey = 'highlight'; + // @public export type HighlightedSearchResultTextProps = { text: string; diff --git a/plugins/search-react/src/components/HighlightedSearchResultText/HighlightedSearchResultText.tsx b/plugins/search-react/src/components/HighlightedSearchResultText/HighlightedSearchResultText.tsx index d6474f5d56..804fac2d4f 100644 --- a/plugins/search-react/src/components/HighlightedSearchResultText/HighlightedSearchResultText.tsx +++ b/plugins/search-react/src/components/HighlightedSearchResultText/HighlightedSearchResultText.tsx @@ -17,6 +17,9 @@ import React, { useMemo } from 'react'; import { makeStyles } from '@material-ui/core/styles'; +/** @public */ +export type HighlightedSearchResultTextClassKey = 'highlight'; + const useStyles = makeStyles( () => ({ highlight: {}, diff --git a/plugins/search-react/src/overridableComponents.ts b/plugins/search-react/src/overridableComponents.ts new file mode 100644 index 0000000000..be921ebf04 --- /dev/null +++ b/plugins/search-react/src/overridableComponents.ts @@ -0,0 +1,36 @@ +/* + * Copyright 2021 The Backstage Authors + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { Overrides } from '@material-ui/core/styles/overrides'; +import { StyleRules } from '@material-ui/core/styles/withStyles'; +import { HighlightedSearchResultTextClassKey } from './components'; + +/** @public */ +export type CatalogReactComponentsNameToClassKey = { + SearchReactHighlightedSearchResultText: HighlightedSearchResultTextClassKey; +}; + +/** @public */ +export type BackstageOverrides = Overrides & { + [Name in keyof CatalogReactComponentsNameToClassKey]?: Partial< + StyleRules + >; +}; + +declare module '@backstage/theme' { + interface OverrideComponentNameToClassKeys + extends CatalogReactComponentsNameToClassKey {} +}