@backstage/ui

Home > @backstage/ui

Components used by Backstage plugins and apps

Functions

Function	Description
CellProfile(props)
Column(props)
DialogTrigger(props)
Header(props)	A component that renders a toolbar.
HeaderPage(props)	A component that renders a header page.
Menu(props)
MenuAutocomplete(props)
MenuAutocompleteListbox(props)
MenuItem(props)
MenuListBox(props)
MenuListBoxItem(props)
MenuSection(props)
MenuSeparator(props)
MenuTrigger(props)
Row(props)
Skeleton(props)
SubmenuTrigger(props)
Tab(props)	A component that renders a tab.
Table(props)
TableBody(props)
TableHeader(props)
TablePagination(props)	Pagination controls for Table components with page navigation and size selection.
TabList(props)	A component that renders a list of tabs.
TabPanel(props)	A component that renders the content of a tab.
Tabs(props)	A component that renders a list of tabs.
Tag(props)	A component that renders a tag.
TagGroup(props)	A component that renders a list of tags.
TooltipTrigger(props)
useBreakpoint()
useTable(config)	Hook for managing table state including pagination and future features like sorting. Supports both controlled and uncontrolled modes using offset/pageSize pattern (Backstage style).
VisuallyHidden(props)	Visually hides content while keeping it accessible to screen readers. Useful for descriptive labels and other screen-reader-only content. Note: This component is for content that should ALWAYS remain visually hidden. For skip links that become visible on focus, use a different approach.

Interfaces

Interface	Description
AccordionGroupProps	Props for the AccordionGroup component.
AccordionPanelProps	Props for the AccordionPanel component.
AccordionProps	Props for the Accordion component.
AccordionTriggerProps	Props for the AccordionTrigger component.
AvatarProps
BoxProps
ButtonIconProps	Properties for ButtonIcon
ButtonLinkProps	Properties for ButtonLink
ButtonProps	Properties for Button
CardBodyProps	Props for the CardBody component.
CardFooterProps	Props for the CardFooter component.
CardHeaderProps	Props for the CardHeader component.
CardProps	Props for the Card component.
CellProfileProps
CellProps
CheckboxProps
ColumnProps
ComponentDefinition	Base type for the component styles structure
ContainerProps
DialogBodyProps	Props for the DialogBody component.
DialogHeaderProps	Props for the DialogHeader component.
DialogProps	Props for the Dialog component.
DialogTriggerProps	Props for the DialogTrigger component.
FieldLabelProps
FlexProps
GridItemProps
GridProps
HeaderPageBreadcrumb	Represents a breadcrumb item in the header.
HeaderPageProps	Props for the main HeaderPage component.
HeaderProps	Props for the main Header component.
HeaderTab	Represents a tab item in the header navigation.
LinkProps
MenuAutocompleteListBoxProps
MenuAutocompleteProps
MenuItemProps
MenuListBoxItemProps
MenuListBoxProps
MenuProps
MenuSectionProps
MenuSeparatorProps
MenuTriggerProps
RadioGroupProps
RadioProps
SearchFieldProps
SelectProps
SkeletonProps
SpaceProps
SubmenuTriggerProps
SwitchProps
TablePaginationProps
TabListProps	Props for the TabList component.
TabPanelProps	Props for the TabPanel component.
TabProps	Props for the Tab component.
TabsProps	Props for the Tabs component.
TagGroupProps	Props for the TagGroup component.
TagProps	Props for the Tag component.
TextFieldProps
TooltipProps
UseTableConfig
UseTablePagination
UseTablePaginationConfig
UseTableResult
UtilityProps
VisuallyHiddenProps	Properties for VisuallyHidden()

Variables

Variable	Description
Accordion
AccordionDefinition	Component definition for Accordion
AccordionGroup
AccordionPanel
AccordionTrigger
Avatar
AvatarDefinition	Component definition for Avatar
Box
BoxDefinition	Component definition for Box
Button
ButtonDefinition	Component definition for Button
ButtonIcon
ButtonIconDefinition	Component definition for ButtonIcon
ButtonLink
ButtonLinkDefinition	Component definition for ButtonLink
Card	Card component.
CardBody	CardBody component.
CardDefinition	Component definition for Card
CardFooter	CardFooter component.
CardHeader	CardHeader component.
Cell
Checkbox
CheckboxDefinition	Component definition for Checkbox
Container
ContainerDefinition	Component definition for Container
Dialog
DialogBody
DialogDefinition	Component definition for Dialog
DialogFooter
DialogHeader
FieldLabel
FieldLabelDefinition	Component definition for FieldLabel
Flex
FlexDefinition	Component definition for Flex
Grid
GridDefinition	Component definition for Grid
GridItemDefinition	Component definition for GridItem
HeaderDefinition	Component definition for Header
HeaderPageDefinition	Component definition for HeaderPage
Link
LinkDefinition	Component definition for Link
MenuDefinition	Component definition for Menu
Radio
RadioGroup
RadioGroupDefinition	Component definition for RadioGroup
SearchField
SearchFieldDefinition	Component definition for SearchField
Select
SelectDefinition	Component definition for Select
SkeletonDefinition	Component definition for Skeleton
Switch
SwitchDefinition	Component definition for Switch
TableDefinition	Component definition for Table
TablePaginationDefinition	Component definition for TablePagination
TabsDefinition	Component definition for Tabs
TagGroupDefinition	Component definition for TagGroup
Text_2
TextDefinition	Component definition for Text
TextField
TextFieldDefinition	Component definition for TextField
Tooltip
TooltipDefinition	Component definition for Tooltip
VisuallyHiddenDefinition	Component definition for VisuallyHidden

Type Aliases

Type Alias	Description
AlignItems
Border
BorderRadius
Breakpoint
ClassNamesMap	Base type for the component styles structure
Columns
DataAttributesMap	Base type for the component styles structure
DataAttributeValues	Base type for the component styles structure
Display
FlexDirection
FlexWrap
JustifyContent
Option_2
Responsive
Space
TabMatchStrategy	Strategies for matching the current route to determine which tab should be active.
TextColors
TextColorStatus
TextOwnProps
TextProps
TextVariants
TextWeights