@backstage/ui 0.7.0-next.2 → 0.7.0

package/dist/index.d.ts

@@ -1,14 +1,11 @@
 import * as react from 'react';
-import { ReactNode, ReactElement, ElementType, ComponentPropsWithRef, ComponentProps, ForwardRefExoticComponent, RefAttributes } from 'react';
+import { ReactNode, ReactElement, ElementType, ComponentPropsWithRef, ComponentProps } from 'react';
 import { RemixiconComponentType } from '@remixicon/react';
 import { Avatar as Avatar$1 } from '@base-ui-components/react/avatar';
-import { ButtonProps as ButtonProps$1, TabsProps as TabsProps$1, TabListProps as TabListProps$1, TabProps as TabProps$1, TabPanelProps as TabPanelProps$1, LinkProps as LinkProps$1, RadioGroupProps as RadioGroupProps$1, RadioProps as RadioProps$1, TextFieldProps as TextFieldProps$1, TooltipProps as TooltipProps$1, TooltipTriggerComponentProps, SearchFieldProps as SearchFieldProps$1, SelectProps as SelectProps$1, SwitchProps as SwitchProps$1 } from 'react-aria-components';
+import { ButtonProps as ButtonProps$1, TabsProps as TabsProps$1, TabListProps as TabListProps$1, TabProps as TabProps$1, TabPanelProps as TabPanelProps$1, LinkProps as LinkProps$1, RadioGroupProps as RadioGroupProps$1, RadioProps as RadioProps$1, TableProps, TableHeaderProps, TableBodyProps, ColumnProps, RowProps, CellProps as CellProps$1, TagGroupProps as TagGroupProps$1, TagListProps, TagProps as TagProps$1, TextFieldProps as TextFieldProps$1, TooltipProps as TooltipProps$1, TooltipTriggerComponentProps, MenuTriggerProps as MenuTriggerProps$1, SubmenuTriggerProps as SubmenuTriggerProps$1, MenuProps as MenuProps$1, PopoverProps, ListBoxProps, MenuItemProps as MenuItemProps$1, ListBoxItemProps, MenuSectionProps as MenuSectionProps$1, SeparatorProps, SearchFieldProps as SearchFieldProps$1, SelectProps as SelectProps$1, SwitchProps as SwitchProps$1 } from 'react-aria-components';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { NavigateOptions } from 'react-router-dom';
 import { Collapsible as Collapsible$1 } from '@base-ui-components/react/collapsible';
-import { useRender } from '@base-ui-components/react/use-render';
-import { Table as Table$1 } from '@tanstack/react-table';
-import { Menu as Menu$1 } from '@base-ui-components/react/menu';
 import { ScrollArea as ScrollArea$1 } from '@base-ui-components/react/scroll-area';
 
 /** @public */
@@ -133,10 +130,6 @@ declare const componentDefinitions: {
             readonly toolbarControls: "bui-HeaderToolbarControls";
             readonly toolbarIcon: "bui-HeaderToolbarIcon";
             readonly toolbarName: "bui-HeaderToolbarName";
-            readonly breadcrumbs: "bui-HeaderBreadcrumbs";
-            readonly breadcrumb: "bui-HeaderBreadcrumb";
-            readonly breadcrumbLink: "bui-HeaderBreadcrumbLink";
-            readonly breadcrumbSeparator: "bui-HeaderBreadcrumbSeparator";
             readonly tabsWrapper: "bui-HeaderTabsWrapper";
         };
     };
@@ -144,6 +137,7 @@ declare const componentDefinitions: {
         readonly classNames: {
             readonly root: "bui-HeaderPage";
             readonly content: "bui-HeaderPageContent";
+            readonly breadcrumbs: "bui-HeaderPageBreadcrumbs";
             readonly tabsWrapper: "bui-HeaderPageTabsWrapper";
             readonly controls: "bui-HeaderPageControls";
         };
@@ -181,21 +175,21 @@ declare const componentDefinitions: {
     };
     readonly Menu: {
         readonly classNames: {
-            readonly trigger: "bui-MenuTrigger";
-            readonly backdrop: "bui-MenuBackdrop";
-            readonly positioner: "bui-MenuPositioner";
-            readonly popup: "bui-MenuPopup";
-            readonly arrow: "bui-MenuArrow";
+            readonly root: "bui-Menu";
+            readonly popover: "bui-MenuPopover";
+            readonly content: "bui-MenuContent";
+            readonly section: "bui-MenuSection";
+            readonly sectionHeader: "bui-MenuSectionHeader";
             readonly item: "bui-MenuItem";
-            readonly group: "bui-MenuGroup";
-            readonly groupLabel: "bui-MenuGroupLabel";
-            readonly radioGroup: "bui-MenuRadioGroup";
-            readonly radioItem: "bui-MenuRadioItem";
-            readonly radioItemIndicator: "bui-MenuRadioItemIndicator";
-            readonly checkboxItem: "bui-MenuCheckboxItem";
-            readonly checkboxItemIndicator: "bui-MenuCheckboxItemIndicator";
-            readonly submenuTrigger: "bui-MenuSubmenuTrigger";
+            readonly itemListBox: "bui-MenuItemListBox";
+            readonly itemListBoxCheck: "bui-MenuItemListBoxCheck";
+            readonly itemContent: "bui-MenuItemContent";
+            readonly itemArrow: "bui-MenuItemArrow";
             readonly separator: "bui-MenuSeparator";
+            readonly searchField: "bui-MenuSearchField";
+            readonly searchFieldInput: "bui-MenuSearchFieldInput";
+            readonly searchFieldClear: "bui-MenuSearchFieldClear";
+            readonly emptyState: "bui-MenuEmptyState";
         };
     };
     readonly Popover: {
@@ -223,6 +217,9 @@ declare const componentDefinitions: {
             readonly root: "bui-SearchField";
             readonly clear: "bui-InputClear";
         };
+        readonly dataAttributes: {
+            readonly startCollapsed: readonly [true, false];
+        };
     };
     readonly Select: {
         readonly classNames: {
@@ -252,16 +249,17 @@ declare const componentDefinitions: {
     };
     readonly Table: {
         readonly classNames: {
-            readonly root: "bui-TableRoot";
+            readonly table: "bui-Table";
             readonly header: "bui-TableHeader";
             readonly body: "bui-TableBody";
             readonly row: "bui-TableRow";
             readonly head: "bui-TableHead";
+            readonly headSortButton: "bui-TableHeadSortButton";
             readonly caption: "bui-TableCaption";
             readonly cell: "bui-TableCell";
-            readonly cellText: "bui-TableCellText";
-            readonly cellLink: "bui-TableCellLink";
-            readonly cellProfile: "bui-TableCellProfile";
+            readonly cellContentWrapper: "bui-TableCellContentWrapper";
+            readonly cellContent: "bui-TableCellContent";
+            readonly cellIcon: "bui-TableCellIcon";
             readonly cellProfileAvatar: "bui-TableCellProfileAvatar";
             readonly cellProfileAvatarImage: "bui-TableCellProfileAvatarImage";
             readonly cellProfileAvatarFallback: "bui-TableCellProfileAvatarFallback";
@@ -280,6 +278,15 @@ declare const componentDefinitions: {
             readonly panel: "bui-TabPanel";
         };
     };
+    readonly TagGroup: {
+        readonly classNames: {
+            readonly group: "bui-TagGroup";
+            readonly list: "bui-TagList";
+            readonly tag: "bui-Tag";
+            readonly tagIcon: "bui-TagIcon";
+            readonly tagRemoveButton: "bui-TagRemoveButton";
+        };
+    };
     readonly Text: {
         readonly classNames: {
             readonly root: "bui-Text";
@@ -782,95 +789,37 @@ interface CardFooterProps extends React.HTMLAttributes<HTMLDivElement> {
  * @public
  */
 declare const Card: react.ForwardRefExoticComponent<CardProps & react.RefAttributes<HTMLDivElement>>;
-
 /**
- * Collapsible is a component that allows you to collapse and expand content.
- * It is a wrapper around the CollapsiblePrimitive component from base-ui-components.
+ * CardHeader component.
  *
  * @public
  */
-declare const Collapsible: {
-    Root: react.ForwardRefExoticComponent<Omit<Collapsible$1.Root.Props & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
-    Trigger: react.ForwardRefExoticComponent<Omit<Collapsible$1.Trigger.Props & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
-    Panel: react.ForwardRefExoticComponent<Omit<Collapsible$1.Panel.Props & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
-};
-
+declare const CardHeader: react.ForwardRefExoticComponent<CardHeaderProps & react.RefAttributes<HTMLDivElement>>;
 /**
- * Table component for displaying tabular data
+ * CardBody component.
+ *
  * @public
  */
-declare const Table: {
-    Root: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>>;
-    Header: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
-    Body: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
-    Head: react.ForwardRefExoticComponent<react.ThHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>>;
-    Row: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableRowElement> & react.RefAttributes<HTMLTableRowElement>>;
-    Cell: react.ForwardRefExoticComponent<react.TdHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>>;
-    CellText: react.ForwardRefExoticComponent<TableCellTextProps & react.RefAttributes<HTMLDivElement>>;
-    CellLink: react.ForwardRefExoticComponent<TableCellLinkProps & react.RefAttributes<HTMLDivElement>>;
-    CellProfile: react.ForwardRefExoticComponent<TableCellProfileProps & react.RefAttributes<HTMLDivElement>>;
-    Caption: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableCaptionElement> & react.RefAttributes<HTMLTableCaptionElement>>;
-};
-
-/** @public */
-interface TableCellTextProps extends React.HTMLAttributes<HTMLDivElement> {
-    title: string;
-    description?: string;
-}
-
-/** @public */
-interface TableCellLinkProps extends React.HTMLAttributes<HTMLDivElement> {
-    title: string;
-    description?: string;
-    href: string;
-    render?: useRender.ComponentProps<'a'>['render'];
-}
-
-/** @public */
-interface TableCellProfileProps extends React.HTMLAttributes<HTMLDivElement> {
-    src?: string;
-    name?: string;
-    to?: string;
-    withImage?: boolean;
-}
+declare const CardBody: react.ForwardRefExoticComponent<CardBodyProps & react.RefAttributes<HTMLDivElement>>;
+/**
+ * CardFooter component.
+ *
+ * @public
+ */
+declare const CardFooter: react.ForwardRefExoticComponent<CardFooterProps & react.RefAttributes<HTMLDivElement>>;
 
 /**
- * DataTable component for displaying tabular data with pagination
+ * Collapsible is a component that allows you to collapse and expand content.
+ * It is a wrapper around the CollapsiblePrimitive component from base-ui-components.
+ *
  * @public
  */
-declare const DataTable: {
-    Root: <TData>(props: {
-        table: Table$1<TData>;
-    } & React.HTMLAttributes<HTMLDivElement>) => JSX.Element;
-    Pagination: react.ForwardRefExoticComponent<DataTablePaginationProps & react.RefAttributes<HTMLDivElement>>;
-    Table: react.ForwardRefExoticComponent<DataTableTableProps & react.RefAttributes<HTMLTableElement>>;
-    TableRoot: react.ForwardRefExoticComponent<Omit<react.HTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>, "ref"> & react.RefAttributes<HTMLTableElement>>;
-    TableHeader: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
-    TableBody: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
-    TableRow: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableRowElement> & react.RefAttributes<HTMLTableRowElement>>;
-    TableCell: react.ForwardRefExoticComponent<react.TdHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>>;
-    TableCellText: react.ForwardRefExoticComponent<TableCellTextProps & react.RefAttributes<HTMLDivElement>>;
-    TableCellLink: react.ForwardRefExoticComponent<TableCellLinkProps & react.RefAttributes<HTMLDivElement>>;
-    TableCellProfile: react.ForwardRefExoticComponent<TableCellProfileProps & react.RefAttributes<HTMLDivElement>>;
-    TableHead: react.ForwardRefExoticComponent<react.ThHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>>;
+declare const Collapsible: {
+    Root: react.ForwardRefExoticComponent<Omit<Collapsible$1.Root.Props & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
+    Trigger: react.ForwardRefExoticComponent<Omit<Collapsible$1.Trigger.Props & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+    Panel: react.ForwardRefExoticComponent<Omit<Collapsible$1.Panel.Props & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
 };
 
-/** @public */
-interface DataTableRootProps<TData> extends React.HTMLAttributes<HTMLDivElement> {
-    /**
-     * The table instance.
-     */
-    table: Table$1<TData>;
-}
-
-/** @public */
-interface DataTablePaginationProps extends React.HTMLAttributes<HTMLDivElement> {
-}
-
-/** @public */
-interface DataTableTableProps extends React.HTMLAttributes<HTMLTableElement> {
-}
-
 /** @public */
 interface FieldLabelProps {
     /**
@@ -973,9 +922,7 @@ interface HeaderProps {
     icon?: React.ReactNode;
     title?: string;
     titleLink?: string;
-    breadcrumbs?: HeaderBreadcrumb[];
     customActions?: React.ReactNode;
-    menuItems?: HeaderMenuItem[];
     tabs?: HeaderTab[];
     onTabSelectionChange?: TabsProps$1['onSelectionChange'];
 }
@@ -995,25 +942,6 @@ interface HeaderTab {
      */
     matchStrategy?: TabMatchStrategy;
 }
-/**
- * Represents an option item in the header dropdown menu.
- *
- * @public
- */
-interface HeaderMenuItem {
-    label: string;
-    value: string;
-    onClick?: () => void;
-}
-/**
- * Represents a breadcrumb item in the header.
- *
- * @public
- */
-interface HeaderBreadcrumb {
-    label: string;
-    href: string;
-}
 
 declare module 'react-aria-components' {
     interface RouterConfig {
@@ -1035,8 +963,17 @@ declare const Header: (props: HeaderProps) => react_jsx_runtime.JSX.Element;
 interface HeaderPageProps {
     title?: string;
     customActions?: React.ReactNode;
-    menuItems?: HeaderMenuItem[];
     tabs?: HeaderTab[];
+    breadcrumbs?: HeaderPageBreadcrumb[];
+}
+/**
+ * Represents a breadcrumb item in the header.
+ *
+ * @public
+ */
+interface HeaderPageBreadcrumb {
+    label: string;
+    href: string;
 }
 
 /**
@@ -1115,6 +1052,172 @@ declare const RadioGroup: react.ForwardRefExoticComponent<RadioGroupProps & reac
 /** @public */
 declare const Radio: react.ForwardRefExoticComponent<RadioProps & react.RefAttributes<HTMLLabelElement>>;
 
+/** @public */
+declare const Table: (props: TableProps) => react_jsx_runtime.JSX.Element;
+
+/** @public */
+declare const TableHeader: <T extends object>({ columns, children, }: TableHeaderProps<T>) => react_jsx_runtime.JSX.Element;
+
+/** @public */
+declare const TableBody: <T extends object>(props: TableBodyProps<T>) => react_jsx_runtime.JSX.Element;
+
+/** @public */
+declare const Column: (props: Omit<ColumnProps, "children"> & {
+    children?: React.ReactNode;
+}) => react_jsx_runtime.JSX.Element;
+
+/** @public */
+declare function Row<T extends object>({ id, columns, children, href, ...otherProps }: RowProps<T>): react_jsx_runtime.JSX.Element;
+
+/** @public */
+interface CellProps extends CellProps$1 {
+    title: string;
+    description?: string;
+    color?: 'primary' | 'secondary';
+    leadingIcon?: React.ReactNode | null;
+    href?: string;
+}
+/** @public */
+interface CellProfileProps extends CellProps$1 {
+    src?: string;
+    name?: string;
+    href?: string;
+    description?: string;
+    color?: 'primary' | 'secondary';
+}
+
+/** @public */
+declare const Cell: {
+    (props: CellProps): react_jsx_runtime.JSX.Element;
+    displayName: string;
+};
+
+/** @public */
+declare const CellProfile: (props: CellProfileProps) => react_jsx_runtime.JSX.Element;
+
+/** @public */
+interface TablePaginationProps extends React.HTMLAttributes<HTMLDivElement> {
+    offset?: number;
+    pageSize?: number;
+    setPageSize?: (pageSize: number) => void;
+    setOffset?: (offset: number) => void;
+    rowCount?: number;
+    onNextPage?: () => void;
+    onPreviousPage?: () => void;
+    onPageSizeChange?: (pageSize: number) => void;
+    showPageSizeOptions?: boolean;
+}
+
+/** @public */
+interface UseTablePaginationConfig {
+    /** Total number of rows in the dataset - only needed when data is not provided at the top level */
+    rowCount?: number;
+    /** Current offset. When provided, pagination is controlled */
+    offset?: number;
+    /** Current page size. When provided, pagination is controlled */
+    pageSize?: number;
+    /** Callback when offset changes */
+    onOffsetChange?: (offset: number) => void;
+    /** Callback when page size changes */
+    onPageSizeChange?: (pageSize: number) => void;
+    /** Default page size for uncontrolled mode */
+    defaultPageSize?: number;
+    /** Default offset for uncontrolled mode */
+    defaultOffset?: number;
+    /** Callback when next page is clicked */
+    onNextPage?: () => void;
+    /** Callback when previous page is clicked */
+    onPreviousPage?: () => void;
+    /** Whether to show page size options */
+    showPageSizeOptions?: boolean;
+}
+/** @public */
+interface UseTablePagination<T = any> {
+    /** Props to pass to TablePagination component */
+    paginationProps: TablePaginationProps;
+    /** Current offset */
+    offset: number;
+    /** Current page size */
+    pageSize: number;
+    /** Sliced data for current page - only available when data is provided to useTable */
+    data?: T[];
+    /** Go to next page */
+    nextPage: () => void;
+    /** Go to previous page */
+    previousPage: () => void;
+    /** Set specific offset */
+    setOffset: (offset: number) => void;
+    /** Set page size */
+    setPageSize: (pageSize: number) => void;
+}
+/** @public */
+interface UseTableConfig<T = any> {
+    /** Full dataset - when provided, rowCount is calculated automatically and sliced data is returned */
+    data?: T[];
+    /** Pagination configuration */
+    pagination?: UseTablePaginationConfig;
+}
+/** @public */
+interface UseTableResult<T = any> {
+    /** Sliced data for current page */
+    data?: T[];
+    /** Props to pass to TablePagination component */
+    paginationProps: TablePaginationProps;
+    /** Pagination utilities */
+    pagination: UseTablePagination<T>;
+}
+
+/**
+ * Hook for managing table state including pagination and future features like sorting.
+ * Supports both controlled and uncontrolled modes using offset/pageSize pattern (Backstage style).
+ *
+ * @public
+ */
+declare function useTable<T = any>(config?: UseTableConfig<T>): UseTableResult<T>;
+
+/**
+ * Pagination controls for Table components with page navigation and size selection.
+ *
+ * @public
+ */
+declare function TablePagination(props: TablePaginationProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Props for the TagGroup component.
+ *
+ * @public
+ */
+interface TagGroupProps<T> extends Omit<TagGroupProps$1, 'children'>, Pick<TagListProps<T>, 'items' | 'children' | 'renderEmptyState'> {
+}
+/**
+ * Props for the Tag component.
+ *
+ * @public
+ */
+interface TagProps extends TagProps$1 {
+    /**
+     * The icon to display in the chip.
+     */
+    icon?: React.ReactNode;
+    /**
+     * The size of the chip.
+     */
+    size?: 'small' | 'medium';
+}
+
+/**
+ * A component that renders a list of tags.
+ *
+ * @public
+ */
+declare const TagGroup: <T extends object>({ items, children, renderEmptyState, ...props }: TagGroupProps<T>) => react_jsx_runtime.JSX.Element;
+/**
+ * A component that renders a tag.
+ *
+ * @public
+ */
+declare const Tag: (props: TagProps) => react_jsx_runtime.JSX.Element;
+
 /** @public */
 type TextOwnProps = {
     as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'span' | 'label' | 'div' | 'strong' | 'em' | 'small' | 'legend';
@@ -1165,43 +1268,68 @@ declare const TooltipTrigger: (props: TooltipTriggerComponentProps) => react_jsx
 declare const Tooltip: react.ForwardRefExoticComponent<TooltipProps & react.RefAttributes<HTMLDivElement>>;
 
 /** @public */
-type MenuComboboxOption = {
-    label: string;
-    value: string;
-    disabled?: boolean;
-};
+interface MenuTriggerProps extends MenuTriggerProps$1 {
+}
 /** @public */
-interface MenuComboboxProps extends ComponentProps<'div'> {
-    options: MenuComboboxOption[];
-    value?: string[];
-    onValueChange?: (value: string[]) => void;
-    multiselect?: boolean;
-    closeParentOnEsc?: boolean;
+interface SubmenuTriggerProps extends SubmenuTriggerProps$1 {
 }
 /** @public */
-type MenuComponent = {
-    Root: typeof Menu$1.Root;
-    Trigger: typeof Menu$1.Trigger;
-    Portal: typeof Menu$1.Portal;
-    Backdrop: typeof Menu$1.Backdrop;
-    Positioner: typeof Menu$1.Positioner;
-    Popup: typeof Menu$1.Popup;
-    Arrow: typeof Menu$1.Arrow;
-    Item: typeof Menu$1.Item;
-    Group: typeof Menu$1.Group;
-    GroupLabel: typeof Menu$1.GroupLabel;
-    RadioGroup: typeof Menu$1.RadioGroup;
-    RadioItem: typeof Menu$1.RadioItem;
-    RadioItemIndicator: typeof Menu$1.RadioItemIndicator;
-    CheckboxItem: typeof Menu$1.CheckboxItem;
-    CheckboxItemIndicator: typeof Menu$1.CheckboxItemIndicator;
-    SubmenuTrigger: typeof Menu$1.SubmenuTrigger;
-    Separator: typeof Menu$1.Separator;
-    Combobox: ForwardRefExoticComponent<MenuComboboxProps & RefAttributes<HTMLDivElement>>;
-};
+interface MenuProps<T> extends MenuProps$1<T>, Omit<MenuProps$1<T>, 'children'> {
+    placement?: PopoverProps['placement'];
+}
+/** @public */
+interface MenuListBoxProps<T> extends ListBoxProps<T>, Omit<ListBoxProps<T>, 'children'> {
+    placement?: PopoverProps['placement'];
+}
+/** @public */
+interface MenuAutocompleteProps<T> extends MenuProps$1<T>, Omit<MenuProps$1<T>, 'children'> {
+    placeholder?: string;
+    placement?: PopoverProps['placement'];
+}
+/** @public */
+interface MenuAutocompleteListBoxProps<T> extends ListBoxProps<T>, Omit<ListBoxProps<T>, 'children'> {
+    placeholder?: string;
+    placement?: PopoverProps['placement'];
+}
+/** @public */
+interface MenuItemProps extends MenuItemProps$1, Omit<MenuItemProps$1, 'children'> {
+    iconStart?: React.ReactNode;
+    children: React.ReactNode;
+    color?: 'primary' | 'danger';
+}
+/** @public */
+interface MenuListBoxItemProps extends ListBoxItemProps, Omit<ListBoxItemProps, 'children'> {
+    children: React.ReactNode;
+}
+/** @public */
+interface MenuSectionProps<T> extends MenuSectionProps$1<T>, Omit<MenuSectionProps$1<T>, 'children'> {
+    title: string;
+    children: React.ReactNode;
+}
+/** @public */
+interface MenuSeparatorProps extends SeparatorProps {
+}
 
 /** @public */
-declare const Menu: MenuComponent;
+declare const MenuTrigger: (props: MenuTriggerProps) => react_jsx_runtime.JSX.Element;
+/** @public */
+declare const SubmenuTrigger: (props: SubmenuTriggerProps) => react_jsx_runtime.JSX.Element;
+/** @public */
+declare const Menu: (props: MenuProps<object>) => react_jsx_runtime.JSX.Element;
+/** @public */
+declare const MenuListBox: (props: MenuListBoxProps<object>) => react_jsx_runtime.JSX.Element;
+/** @public */
+declare const MenuAutocomplete: (props: MenuAutocompleteProps<object>) => react_jsx_runtime.JSX.Element;
+/** @public */
+declare const MenuAutocompleteListbox: (props: MenuAutocompleteListBoxProps<object>) => react_jsx_runtime.JSX.Element;
+/** @public */
+declare const MenuItem: (props: MenuItemProps) => react_jsx_runtime.JSX.Element;
+/** @public */
+declare const MenuListBoxItem: (props: MenuListBoxItemProps) => react_jsx_runtime.JSX.Element;
+/** @public */
+declare const MenuSection: (props: MenuSectionProps<object>) => react_jsx_runtime.JSX.Element;
+/** @public */
+declare const MenuSeparator: (props: MenuSeparatorProps) => react_jsx_runtime.JSX.Element;
 
 /** @public */
 declare const ScrollArea: {
@@ -1226,6 +1354,10 @@ interface SearchFieldProps extends SearchFieldProps$1, Omit<FieldLabelProps, 'ht
      * The placeholder text for the input
      */
     placeholder?: string;
+    /**
+     * Controls whether the SearchField starts in a collapsed state.
+     */
+    startCollapsed?: boolean;
 }
 
 /** @public */
@@ -1407,4 +1539,4 @@ declare const useBreakpoint: () => {
     down: (key: Breakpoint) => boolean;
 };
 
-export { type AlignItems, type ArbitraryStylingPropDef, Avatar, type AvatarProps, type BooleanPropDef, type Border, type BorderRadius, Box, type BoxOwnProps, type BoxProps, type Breakpoint, Button, ButtonIcon, type ButtonIconProps, ButtonLink, type ButtonLinkProps, type ButtonProps, Card, type CardBodyProps, type CardFooterProps, type CardHeaderProps, type CardProps, Checkbox, type CheckboxProps, type ClassNamesMap, Collapsible, type Columns, type ComponentClassNames, type ComponentDefinition, type ComponentDefinitionName, Container, type ContainerProps, type DataAttributeValues, type DataAttributesMap, DataTable, type DataTablePaginationProps, type DataTableRootProps, type DataTableTableProps, type Display, type DisplayProps, type EnumOrStringPropDef, type EnumPropDef, FieldLabel, type FieldLabelProps, Flex, type FlexDirection, type FlexOwnProps, type FlexProps, type FlexWrap, type GapProps, type GetPropDefType, type GetPropDefTypes, Grid, type GridItemOwnProps, type GridItemProps, type GridOwnProps, type GridProps, Header, type HeaderBreadcrumb, type HeaderMenuItem, HeaderPage, type HeaderPageProps, type HeaderProps, type HeaderTab, type HeightProps, Icon, IconContext, type IconContextProps, type IconMap, type IconNames, type IconProps, IconProvider, type IconProviderProps, type JustifyContent, Link, type LinkProps, type MarginProps, Menu, type MenuComboboxOption, type MenuComboboxProps, type MenuComponent, type NonStylingPropDef, type PaddingProps, type PositionProps, type PropDef, Radio, RadioGroup, type RadioGroupProps, type RadioProps, type ReactNodePropDef, type RegularPropDef, type Responsive, type ResponsivePropDef, ScrollArea, SearchField, type SearchFieldProps, Select, type SelectProps, Skeleton, type SkeletonProps, type Space, type SpaceProps, type StringPropDef, type StylingPropDef, Switch, type SwitchProps, Tab, TabList, type TabListProps, type TabMatchStrategy, TabPanel, type TabPanelProps, type TabProps, Table, type TableCellLinkProps, type TableCellProfileProps, type TableCellTextProps, Tabs, type TabsProps, Text, type TextColorStatus, type TextColors, TextField, type TextFieldProps, type TextOwnProps, type TextProps, type TextVariants, type TextWeights, Tooltip, type TooltipProps, TooltipTrigger, type UtilityProps, type WidthProps, boxPropDefs, breakpoints, componentDefinitions, displayPropDefs, flexPropDefs, gapPropDefs, gridItemPropDefs, gridPropDefs, heightPropDefs, icons, marginPropDefs, paddingPropDefs, positionPropDefs, useBreakpoint, useIcons, widthPropDefs };
+export { type AlignItems, type ArbitraryStylingPropDef, Avatar, type AvatarProps, type BooleanPropDef, type Border, type BorderRadius, Box, type BoxOwnProps, type BoxProps, type Breakpoint, Button, ButtonIcon, type ButtonIconProps, ButtonLink, type ButtonLinkProps, type ButtonProps, Card, CardBody, type CardBodyProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, type CardProps, Cell, CellProfile, type CellProfileProps, type CellProps, Checkbox, type CheckboxProps, type ClassNamesMap, Collapsible, Column, type Columns, type ComponentClassNames, type ComponentDefinition, type ComponentDefinitionName, Container, type ContainerProps, type DataAttributeValues, type DataAttributesMap, type Display, type DisplayProps, type EnumOrStringPropDef, type EnumPropDef, FieldLabel, type FieldLabelProps, Flex, type FlexDirection, type FlexOwnProps, type FlexProps, type FlexWrap, type GapProps, type GetPropDefType, type GetPropDefTypes, Grid, type GridItemOwnProps, type GridItemProps, type GridOwnProps, type GridProps, Header, HeaderPage, type HeaderPageBreadcrumb, type HeaderPageProps, type HeaderProps, type HeaderTab, type HeightProps, Icon, IconContext, type IconContextProps, type IconMap, type IconNames, type IconProps, IconProvider, type IconProviderProps, type JustifyContent, Link, type LinkProps, type MarginProps, Menu, MenuAutocomplete, type MenuAutocompleteListBoxProps, MenuAutocompleteListbox, type MenuAutocompleteProps, MenuItem, type MenuItemProps, MenuListBox, MenuListBoxItem, type MenuListBoxItemProps, type MenuListBoxProps, type MenuProps, MenuSection, type MenuSectionProps, MenuSeparator, type MenuSeparatorProps, MenuTrigger, type MenuTriggerProps, type NonStylingPropDef, type PaddingProps, type PositionProps, type PropDef, Radio, RadioGroup, type RadioGroupProps, type RadioProps, type ReactNodePropDef, type RegularPropDef, type Responsive, type ResponsivePropDef, Row, ScrollArea, SearchField, type SearchFieldProps, Select, type SelectProps, Skeleton, type SkeletonProps, type Space, type SpaceProps, type StringPropDef, type StylingPropDef, SubmenuTrigger, type SubmenuTriggerProps, Switch, type SwitchProps, Tab, TabList, type TabListProps, type TabMatchStrategy, TabPanel, type TabPanelProps, type TabProps, Table, TableBody, TableHeader, TablePagination, type TablePaginationProps, Tabs, type TabsProps, Tag, TagGroup, type TagGroupProps, type TagProps, Text, type TextColorStatus, type TextColors, TextField, type TextFieldProps, type TextOwnProps, type TextProps, type TextVariants, type TextWeights, Tooltip, type TooltipProps, TooltipTrigger, type UseTableConfig, type UseTablePagination, type UseTablePaginationConfig, type UseTableResult, type UtilityProps, type WidthProps, boxPropDefs, breakpoints, componentDefinitions, displayPropDefs, flexPropDefs, gapPropDefs, gridItemPropDefs, gridPropDefs, heightPropDefs, icons, marginPropDefs, paddingPropDefs, positionPropDefs, useBreakpoint, useIcons, useTable, widthPropDefs };

package/dist/index.esm.js

@@ -8,9 +8,8 @@ export { flexPropDefs } from './components/Flex/Flex.props.esm.js';
 export { Container } from './components/Container/Container.esm.js';
 export { Avatar } from './components/Avatar/Avatar.esm.js';
 export { Button } from './components/Button/Button.esm.js';
-export { Card } from './components/Card/Card.esm.js';
+export { Card, CardBody, CardFooter, CardHeader } from './components/Card/Card.esm.js';
 export { Collapsible } from './components/Collapsible/Collapsible.esm.js';
-export { DataTable } from './components/DataTable/DataTable.esm.js';
 export { FieldLabel } from './components/FieldLabel/FieldLabel.esm.js';
 export { Header } from './components/Header/Header.esm.js';
 export { HeaderPage } from './components/HeaderPage/HeaderPage.esm.js';
@@ -21,12 +20,21 @@ export { ButtonIcon } from './components/ButtonIcon/ButtonIcon.esm.js';
 export { ButtonLink } from './components/ButtonLink/ButtonLink.esm.js';
 export { Checkbox } from './components/Checkbox/Checkbox.esm.js';
 export { Radio, RadioGroup } from './components/RadioGroup/RadioGroup.esm.js';
-export { Table } from './components/Table/Table.esm.js';
+export { Table } from './components/Table/components/Table.esm.js';
+export { TableHeader } from './components/Table/components/TableHeader.esm.js';
+export { TableBody } from './components/Table/components/TableBody.esm.js';
+export { Column } from './components/Table/components/Column.esm.js';
+export { Row } from './components/Table/components/Row.esm.js';
+export { Cell } from './components/Table/components/Cell.esm.js';
+export { CellProfile } from './components/Table/components/CellProfile.esm.js';
+export { useTable } from './components/Table/hooks/useTable.esm.js';
+export { TablePagination } from './components/TablePagination/TablePagination.esm.js';
 export { Tab, TabList, TabPanel, Tabs } from './components/Tabs/Tabs.esm.js';
+export { Tag, TagGroup } from './components/TagGroup/TagGroup.esm.js';
 export { Text } from './components/Text/Text.esm.js';
 export { TextField } from './components/TextField/TextField.esm.js';
 export { Tooltip, TooltipTrigger } from './components/Tooltip/Tooltip.esm.js';
-export { Menu } from './components/Menu/Menu.esm.js';
+export { Menu, MenuAutocomplete, MenuAutocompleteListbox, MenuItem, MenuListBox, MenuListBoxItem, MenuSection, MenuSeparator, MenuTrigger, SubmenuTrigger } from './components/Menu/Menu.esm.js';
 export { ScrollArea } from './components/ScrollArea/ScrollArea.esm.js';
 export { SearchField } from './components/SearchField/SearchField.esm.js';
 export { Link } from './components/Link/Link.esm.js';

package/dist/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/props/display.props.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"display.props.esm.js","sources":["../../src/props/display.props.ts"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type { PropDef, GetPropDefTypes } from './prop-def';\n\nconst displayValues = ['none', 'inline', 'inline-block', 'block'] as const;\n\n/** @public */\nconst displayPropDefs = {\n  display: {\n    type: 'enum',\n    className: 'bui-display',\n    values: displayValues,\n    responsive: true,\n  },\n} satisfies {\n  display: PropDef<(typeof displayValues)[number]>;\n};\n\n/** @public */\ntype DisplayProps = GetPropDefTypes<typeof displayPropDefs>;\n\nexport { displayPropDefs };\nexport type { DisplayProps };\n"],"names":[],"mappings":"AAkBA,MAAM,aAAgB,GAAA,CAAC,MAAQ,EAAA,QAAA,EAAU,gBAAgB,OAAO,CAAA;AAGhE,MAAM,eAAkB,GAAA;AAAA,EACtB,OAAS,EAAA;AAAA,IACP,IAAM,EAAA,MAAA;AAAA,IACN,SAAW,EAAA,aAAA;AAAA,IACX,MAAQ,EAAA,aAAA;AAAA,IACR,UAAY,EAAA;AAAA;AAEhB;;;;"}
+{"version":3,"file":"display.props.esm.js","sources":["../../src/props/display.props.ts"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type { PropDef, GetPropDefTypes } from './prop-def';\n\nconst displayValues = ['none', 'inline', 'inline-block', 'block'] as const;\n\n/** @public */\nconst displayPropDefs = {\n  display: {\n    type: 'enum',\n    className: 'bui-display',\n    values: displayValues,\n    responsive: true,\n  },\n} satisfies {\n  display: PropDef<(typeof displayValues)[number]>;\n};\n\n/** @public */\ntype DisplayProps = GetPropDefTypes<typeof displayPropDefs>;\n\nexport { displayPropDefs };\nexport type { DisplayProps };\n"],"names":[],"mappings":"AAkBA,MAAM,aAAA,GAAgB,CAAC,MAAA,EAAQ,QAAA,EAAU,gBAAgB,OAAO,CAAA;AAGhE,MAAM,eAAA,GAAkB;AAAA,EACtB,OAAA,EAAS;AAAA,IACP,IAAA,EAAM,MAAA;AAAA,IACN,SAAA,EAAW,aAAA;AAAA,IACX,MAAA,EAAQ,aAAA;AAAA,IACR,UAAA,EAAY;AAAA;AAEhB;;;;"}

package/dist/props/gap-props.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"gap-props.esm.js","sources":["../../src/props/gap-props.ts"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { PropDef } from './prop-def';\nimport { GetPropDefTypes } from './prop-def';\nimport { spacingValues } from './spacing.props';\n\n/** @public */\nconst gapPropDefs = {\n  gap: {\n    type: 'enum | string',\n    className: 'bui-gap',\n    customProperties: ['--gap'],\n    values: spacingValues,\n    responsive: true,\n    default: '4',\n  },\n} satisfies {\n  gap: PropDef<(typeof spacingValues)[number]>;\n};\n\n/** @public */\ntype GapProps = GetPropDefTypes<typeof gapPropDefs>;\n\nexport { gapPropDefs };\nexport type { GapProps };\n"],"names":[],"mappings":";;AAoBA,MAAM,WAAc,GAAA;AAAA,EAClB,GAAK,EAAA;AAAA,IACH,IAAM,EAAA,eAAA;AAAA,IACN,SAAW,EAAA,SAAA;AAAA,IACX,gBAAA,EAAkB,CAAC,OAAO,CAAA;AAAA,IAC1B,MAAQ,EAAA,aAAA;AAAA,IACR,UAAY,EAAA,IAAA;AAAA,IACZ,OAAS,EAAA;AAAA;AAEb;;;;"}
+{"version":3,"file":"gap-props.esm.js","sources":["../../src/props/gap-props.ts"],"sourcesContent":["/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport { PropDef } from './prop-def';\nimport { GetPropDefTypes } from './prop-def';\nimport { spacingValues } from './spacing.props';\n\n/** @public */\nconst gapPropDefs = {\n  gap: {\n    type: 'enum | string',\n    className: 'bui-gap',\n    customProperties: ['--gap'],\n    values: spacingValues,\n    responsive: true,\n    default: '4',\n  },\n} satisfies {\n  gap: PropDef<(typeof spacingValues)[number]>;\n};\n\n/** @public */\ntype GapProps = GetPropDefTypes<typeof gapPropDefs>;\n\nexport { gapPropDefs };\nexport type { GapProps };\n"],"names":[],"mappings":";;AAoBA,MAAM,WAAA,GAAc;AAAA,EAClB,GAAA,EAAK;AAAA,IACH,IAAA,EAAM,eAAA;AAAA,IACN,SAAA,EAAW,SAAA;AAAA,IACX,gBAAA,EAAkB,CAAC,OAAO,CAAA;AAAA,IAC1B,MAAA,EAAQ,aAAA;AAAA,IACR,UAAA,EAAY,IAAA;AAAA,IACZ,OAAA,EAAS;AAAA;AAEb;;;;"}