@backstage/ui 0.15.0-next.0 → 0.15.0-next.1

package/dist/index.d.ts

@@ -1568,6 +1568,44 @@ interface HeaderNavTabGroup {
  * @public
  */
 type HeaderNavTabItem = HeaderNavTab | HeaderNavTabGroup;
+/**
+ * Represents a tag item in the header.
+ *
+ * @public
+ */
+interface HeaderTag {
+    label: string;
+    href?: string;
+}
+/**
+ * Represents a metadata key-value pair in the header.
+ *
+ * @public
+ */
+interface HeaderMetadataItem {
+    label: string;
+    value: React.ReactNode;
+}
+/**
+ * Represents a user in the HeaderMetadataUsers component.
+ *
+ * @public
+ */
+interface HeaderMetadataUser {
+    name: string;
+    src?: string;
+    href?: string;
+}
+/**
+ * Represents a status item in the HeaderMetadataStatus component.
+ *
+ * @public
+ */
+interface HeaderMetadataStatusProps {
+    label: string;
+    color: 'danger' | 'warning' | 'success' | 'info';
+    href?: string;
+}
 /**
  * Own props for the Header component.
  *
@@ -1578,8 +1616,23 @@ interface HeaderOwnProps {
     customActions?: React.ReactNode;
     tabs?: HeaderNavTabItem[];
     activeTabId?: string | null;
+    /**
+     * @deprecated The breadcrumbs prop will be removed in a future release.
+     */
     breadcrumbs?: HeaderBreadcrumb[];
+    /**
+     * Markdown string rendered below the title. Only inline links are supported.
+     * Bold, italic, and block-level markdown are not rendered.
+     */
+    description?: string;
+    tags?: HeaderTag[];
+    metadata?: HeaderMetadataItem[];
     className?: string;
+    /**
+     * Makes the title-and-actions row stick to the top of its nearest scroll
+     * container while the rest of the header content scrolls away.
+     */
+    sticky?: boolean;
 }
 /**
  * Props for the Header component.
@@ -1633,12 +1686,27 @@ declare const HeaderDefinition: {
     readonly styles: {
         readonly [key: string]: string;
     };
+    readonly bg: "consumer";
     readonly classNames: {
-        readonly root: "bui-Header";
+        readonly headerTop: "bui-HeaderTop";
+        readonly stickySentinel: "bui-HeaderStickySentinel";
         readonly content: "bui-HeaderContent";
+        readonly headerBottom: "bui-HeaderBottom";
         readonly breadcrumbs: "bui-HeaderBreadcrumbs";
+        readonly breadcrumbsSmall: "bui-HeaderBreadcrumbsSmall";
+        readonly breadcrumbLink: "bui-HeaderBreadcrumbLink";
+        readonly breadcrumbLinkSmall: "bui-HeaderBreadcrumbLinkSmall";
+        readonly breadcrumbSeparator: "bui-HeaderBreadcrumbSeparator";
+        readonly titleStack: "bui-HeaderTitleStack";
+        readonly title: "bui-HeaderTitle";
+        readonly titleSmall: "bui-HeaderTitleSmall";
         readonly tabsWrapper: "bui-HeaderTabsWrapper";
         readonly controls: "bui-HeaderControls";
+        readonly tags: "bui-HeaderTags";
+        readonly tag: "bui-HeaderTag";
+        readonly description: "bui-HeaderDescription";
+        readonly metaRow: "bui-HeaderMetaRow";
+        readonly metaItem: "bui-HeaderMetaItem";
     };
     readonly propDefs: {
         readonly title: {};
@@ -1646,7 +1714,11 @@ declare const HeaderDefinition: {
         readonly tabs: {};
         readonly activeTabId: {};
         readonly breadcrumbs: {};
+        readonly description: {};
+        readonly tags: {};
+        readonly metadata: {};
         readonly className: {};
+        readonly sticky: {};
     };
 };
 /**
@@ -1657,12 +1729,27 @@ declare const HeaderPageDefinition: {
     readonly styles: {
         readonly [key: string]: string;
     };
+    readonly bg: "consumer";
     readonly classNames: {
-        readonly root: "bui-Header";
+        readonly headerTop: "bui-HeaderTop";
+        readonly stickySentinel: "bui-HeaderStickySentinel";
         readonly content: "bui-HeaderContent";
+        readonly headerBottom: "bui-HeaderBottom";
         readonly breadcrumbs: "bui-HeaderBreadcrumbs";
+        readonly breadcrumbsSmall: "bui-HeaderBreadcrumbsSmall";
+        readonly breadcrumbLink: "bui-HeaderBreadcrumbLink";
+        readonly breadcrumbLinkSmall: "bui-HeaderBreadcrumbLinkSmall";
+        readonly breadcrumbSeparator: "bui-HeaderBreadcrumbSeparator";
+        readonly titleStack: "bui-HeaderTitleStack";
+        readonly title: "bui-HeaderTitle";
+        readonly titleSmall: "bui-HeaderTitleSmall";
         readonly tabsWrapper: "bui-HeaderTabsWrapper";
         readonly controls: "bui-HeaderControls";
+        readonly tags: "bui-HeaderTags";
+        readonly tag: "bui-HeaderTag";
+        readonly description: "bui-HeaderDescription";
+        readonly metaRow: "bui-HeaderMetaRow";
+        readonly metaItem: "bui-HeaderMetaItem";
     };
     readonly propDefs: {
         readonly title: {};
@@ -1670,7 +1757,11 @@ declare const HeaderPageDefinition: {
         readonly tabs: {};
         readonly activeTabId: {};
         readonly breadcrumbs: {};
+        readonly description: {};
+        readonly tags: {};
+        readonly metadata: {};
         readonly className: {};
+        readonly sticky: {};
     };
 };
 
@@ -1725,6 +1816,26 @@ declare const HeaderNavGroupDefinition: {
     };
 };
 
+/**
+ * Displays a list of users as avatars inside a Header metadata value.
+ * A single user shows the avatar with their name beside it.
+ * Multiple users show avatars in a row with the name revealed on hover via tooltip.
+ * When a user has an `href`, the avatar and name become links.
+ *
+ * @public
+ */
+declare const HeaderMetadataUsers: ({ users, }: {
+    users: HeaderMetadataUser[];
+}) => react_jsx_runtime.JSX.Element | null;
+
+/**
+ * Displays a single status indicator as a coloured dot with a label inside a
+ * Header metadata value. Optionally renders the label as a link when href is provided.
+ *
+ * @public
+ */
+declare const HeaderMetadataStatus: ({ label, color, href, }: HeaderMetadataStatusProps) => react_jsx_runtime.JSX.Element;
+
 /** @public */
 type ButtonIconOwnProps = {
     size?: Responsive<'small' | 'medium'>;
@@ -3446,6 +3557,11 @@ type Option = {
     disabled?: boolean;
 };
 /** @public */
+type OptionSection = {
+    title: string;
+    options: Option[];
+};
+/** @public */
 type SelectOwnProps = {
     /**
      * An icon to render before the input
@@ -3457,9 +3573,10 @@ type SelectOwnProps = {
      */
     size?: 'small' | 'medium' | Partial<Record<Breakpoint, 'small' | 'medium'>>;
     /**
-     * The options of the select field
+     * The options of the select field. Pass flat options, option sections for
+     * grouped display, or a mix of both in the same array.
      */
-    options?: Array<Option>;
+    options?: Array<Option | OptionSection>;
     /**
      * Enable search/filter functionality in the dropdown
      * @defaultValue false
@@ -3858,5 +3975,5 @@ declare function useAnalytics(): AnalyticsTracker;
  */
 declare function getNodeText(node: ReactNode | ((...args: any[]) => ReactNode)): string | undefined;
 
-export { Accordion, AccordionDefinition, AccordionGroup, AccordionGroupDefinition, AccordionPanel, AccordionPanelDefinition, AccordionTrigger, AccordionTriggerDefinition, Alert, AlertDefinition, Avatar, AvatarDefinition, BUIProvider, Badge, BadgeDefinition, BgProvider, Box, BoxDefinition, Button, ButtonDefinition, ButtonIcon, ButtonIconDefinition, ButtonLink, ButtonLinkDefinition, Card, CardBody, CardBodyDefinition, CardDefinition, CardFooter, CardFooterDefinition, CardHeader, CardHeaderDefinition, Cell, CellProfile, CellText, Checkbox, CheckboxDefinition, CheckboxGroup, CheckboxGroupDefinition, Column, Container, ContainerDefinition, DateRangePicker, DateRangePickerDefinition, Dialog, DialogBody, DialogBodyDefinition, DialogDefinition, DialogFooter, DialogFooterDefinition, DialogHeader, DialogHeaderDefinition, DialogTrigger, FieldLabel, FieldLabelDefinition, Flex, FlexDefinition, FullPage, FullPageDefinition, Grid, GridDefinition, GridItemDefinition, Header, HeaderDefinition, HeaderNavDefinition, HeaderNavGroupDefinition, HeaderNavItemDefinition, HeaderPage, HeaderPageDefinition, Link, LinkDefinition, List, ListDefinition, ListRow, ListRowDefinition, Menu, MenuAutocomplete, MenuAutocompleteListbox, MenuDefinition, MenuItem, MenuListBox, MenuListBoxItem, MenuSection, MenuSeparator, MenuTrigger, PasswordField, PasswordFieldDefinition, PluginHeader, PluginHeaderDefinition, Popover, PopoverDefinition, Radio, RadioDefinition, RadioGroup, RadioGroupDefinition, Row, SearchAutocomplete, SearchAutocompleteDefinition, SearchAutocompleteItem, SearchField, SearchFieldDefinition, Select, SelectDefinition, Skeleton, SkeletonDefinition, Slider, SliderDefinition, SubmenuTrigger, Switch, SwitchDefinition, Tab, TabList, TabPanel, Table, TableBody, TableBodySkeleton, TableDefinition, TableHeader, TablePagination, TablePaginationDefinition, TableRoot, Tabs, TabsDefinition, Tag, TagGroup, TagGroupDefinition, Text, TextDefinition, TextField, TextFieldDefinition, ToggleButton, ToggleButtonDefinition, ToggleButtonGroup, ToggleButtonGroupDefinition, Tooltip, TooltipDefinition, TooltipTrigger, VisuallyHidden, VisuallyHiddenDefinition, getNodeText, useAnalytics, useBgConsumer, useBgProvider, useBreakpoint, useTable };
-export type { AccordionGroupOwnProps, AccordionGroupProps, AccordionOwnProps, AccordionPanelOwnProps, AccordionPanelProps, AccordionProps, AccordionTriggerOwnProps, AccordionTriggerProps, AlertOwnProps, AlertProps, AlignItems, AnalyticsEventAttributes, AnalyticsTracker, AvatarOwnProps, AvatarProps, BUIProviderProps, BadgeOwnProps, BadgeProps, BgContextValue, BgProviderProps, Border, BorderRadius, BoxOwnProps, BoxProps, BoxUtilityProps, Breakpoint, ButtonIconOwnProps, ButtonIconProps, ButtonLinkOwnProps, ButtonLinkProps, ButtonOwnProps, ButtonProps, CardBaseProps, CardBodyOwnProps, CardBodyProps, CardButtonVariant, CardFooterOwnProps, CardFooterProps, CardHeaderOwnProps, CardHeaderProps, CardLinkVariant, CardOwnProps, CardProps, CardStaticVariant, CellOwnProps, CellProfileOwnProps, CellProfileProps, CellProps, CellTextOwnProps, CellTextProps, CheckboxGroupOwnProps, CheckboxGroupProps, CheckboxOwnProps, CheckboxProps, ColumnConfig, ColumnOwnProps, ColumnProps, Columns, CompletePaginationOptions, ContainerBg, ContainerOwnProps, ContainerProps, CursorParams, CursorResponse, DateRangePickerOwnProps, DateRangePickerProps, DialogBodyOwnProps, DialogBodyProps, DialogFooterOwnProps, DialogFooterProps, DialogHeaderOwnProps, DialogHeaderProps, DialogOwnProps, DialogProps, DialogTriggerProps, Display, FieldLabelOwnProps, FieldLabelProps, FilterState, FlexDirection, FlexItemProps, FlexOwnProps, FlexProps, FlexWrap, FullPageOwnProps, FullPageProps, GridItemOwnProps, GridItemProps, GridOwnProps, GridProps, HeaderBreadcrumb, HeaderNavTab, HeaderNavTabGroup, HeaderNavTabItem, HeaderOwnProps, HeaderPageBreadcrumb, HeaderPageOwnProps, HeaderPageProps, HeaderProps, HeaderTab, JustifyContent, LinkOwnProps, LinkProps, ListOwnProps, ListProps, ListRowOwnProps, ListRowProps, MarginProps, MenuAutocompleteListBoxOwnProps, MenuAutocompleteListBoxProps, MenuAutocompleteOwnProps, MenuAutocompleteProps, MenuItemOwnProps, MenuItemProps, MenuListBoxItemOwnProps, MenuListBoxItemProps, MenuListBoxOwnProps, MenuListBoxProps, MenuOwnProps, MenuPopoverOwnProps, MenuProps, MenuSectionOwnProps, MenuSectionProps, MenuSeparatorOwnProps, MenuSeparatorProps, MenuTriggerProps, NoPagination, OffsetParams, OffsetResponse, Option, PaddingProps, PagePagination, PageSizeOption, PaginationOptions, PasswordFieldOwnProps, PasswordFieldProps, PluginHeaderOwnProps, PluginHeaderProps, PopoverOwnProps, PopoverProps, ProviderBg, QueryOptions, RadioGroupOwnProps, RadioGroupProps, RadioOwnProps, RadioProps, Responsive, RowConfig, RowOwnProps, RowProps, RowRenderFn, SearchAutocompleteItemOwnProps, SearchAutocompleteItemProps, SearchAutocompleteOwnProps, SearchAutocompleteProps, SearchFieldOwnProps, SearchFieldProps, SearchState, SelectOwnProps, SelectProps, SkeletonOwnProps, SkeletonProps, SliderOwnProps, SliderProps, SortDescriptor, SortState, Space, SpaceProps, SubmenuTriggerProps, SwitchOwnProps, SwitchProps, TabListOwnProps, TabListProps, TabMatchStrategy, TabOwnProps, TabPanelOwnProps, TabPanelProps, TabProps, TableBodyOwnProps, TableBodyProps, TableHeaderOwnProps, TableHeaderProps, TableItem, TablePaginationOwnProps, TablePaginationProps, TablePaginationType, TableProps, TableRootOwnProps, TableRootProps, TableSelection, TabsOwnProps, TabsProps, TagGroupOwnProps, TagGroupProps, TagOwnProps, TagProps, TextColorStatus, TextColors, TextFieldOwnProps, TextFieldProps, TextOwnProps, TextProps, TextVariants, TextWeights, ToggleButtonGroupOwnProps, ToggleButtonGroupProps, ToggleButtonOwnProps, ToggleButtonProps, TooltipOwnProps, TooltipProps, UseAnalyticsFn, UseTableCompleteOptions, UseTableCursorOptions, UseTableOffsetOptions, UseTableOptions, UseTableResult, UtilityProps, VirtualizedProp, VisuallyHiddenOwnProps, VisuallyHiddenProps };
+export { Accordion, AccordionDefinition, AccordionGroup, AccordionGroupDefinition, AccordionPanel, AccordionPanelDefinition, AccordionTrigger, AccordionTriggerDefinition, Alert, AlertDefinition, Avatar, AvatarDefinition, BUIProvider, Badge, BadgeDefinition, BgProvider, Box, BoxDefinition, Button, ButtonDefinition, ButtonIcon, ButtonIconDefinition, ButtonLink, ButtonLinkDefinition, Card, CardBody, CardBodyDefinition, CardDefinition, CardFooter, CardFooterDefinition, CardHeader, CardHeaderDefinition, Cell, CellProfile, CellText, Checkbox, CheckboxDefinition, CheckboxGroup, CheckboxGroupDefinition, Column, Container, ContainerDefinition, DateRangePicker, DateRangePickerDefinition, Dialog, DialogBody, DialogBodyDefinition, DialogDefinition, DialogFooter, DialogFooterDefinition, DialogHeader, DialogHeaderDefinition, DialogTrigger, FieldLabel, FieldLabelDefinition, Flex, FlexDefinition, FullPage, FullPageDefinition, Grid, GridDefinition, GridItemDefinition, Header, HeaderDefinition, HeaderMetadataStatus, HeaderMetadataUsers, HeaderNavDefinition, HeaderNavGroupDefinition, HeaderNavItemDefinition, HeaderPage, HeaderPageDefinition, Link, LinkDefinition, List, ListDefinition, ListRow, ListRowDefinition, Menu, MenuAutocomplete, MenuAutocompleteListbox, MenuDefinition, MenuItem, MenuListBox, MenuListBoxItem, MenuSection, MenuSeparator, MenuTrigger, PasswordField, PasswordFieldDefinition, PluginHeader, PluginHeaderDefinition, Popover, PopoverDefinition, Radio, RadioDefinition, RadioGroup, RadioGroupDefinition, Row, SearchAutocomplete, SearchAutocompleteDefinition, SearchAutocompleteItem, SearchField, SearchFieldDefinition, Select, SelectDefinition, Skeleton, SkeletonDefinition, Slider, SliderDefinition, SubmenuTrigger, Switch, SwitchDefinition, Tab, TabList, TabPanel, Table, TableBody, TableBodySkeleton, TableDefinition, TableHeader, TablePagination, TablePaginationDefinition, TableRoot, Tabs, TabsDefinition, Tag, TagGroup, TagGroupDefinition, Text, TextDefinition, TextField, TextFieldDefinition, ToggleButton, ToggleButtonDefinition, ToggleButtonGroup, ToggleButtonGroupDefinition, Tooltip, TooltipDefinition, TooltipTrigger, VisuallyHidden, VisuallyHiddenDefinition, getNodeText, useAnalytics, useBgConsumer, useBgProvider, useBreakpoint, useTable };
+export type { AccordionGroupOwnProps, AccordionGroupProps, AccordionOwnProps, AccordionPanelOwnProps, AccordionPanelProps, AccordionProps, AccordionTriggerOwnProps, AccordionTriggerProps, AlertOwnProps, AlertProps, AlignItems, AnalyticsEventAttributes, AnalyticsTracker, AvatarOwnProps, AvatarProps, BUIProviderProps, BadgeOwnProps, BadgeProps, BgContextValue, BgProviderProps, Border, BorderRadius, BoxOwnProps, BoxProps, BoxUtilityProps, Breakpoint, ButtonIconOwnProps, ButtonIconProps, ButtonLinkOwnProps, ButtonLinkProps, ButtonOwnProps, ButtonProps, CardBaseProps, CardBodyOwnProps, CardBodyProps, CardButtonVariant, CardFooterOwnProps, CardFooterProps, CardHeaderOwnProps, CardHeaderProps, CardLinkVariant, CardOwnProps, CardProps, CardStaticVariant, CellOwnProps, CellProfileOwnProps, CellProfileProps, CellProps, CellTextOwnProps, CellTextProps, CheckboxGroupOwnProps, CheckboxGroupProps, CheckboxOwnProps, CheckboxProps, ColumnConfig, ColumnOwnProps, ColumnProps, Columns, CompletePaginationOptions, ContainerBg, ContainerOwnProps, ContainerProps, CursorParams, CursorResponse, DateRangePickerOwnProps, DateRangePickerProps, DialogBodyOwnProps, DialogBodyProps, DialogFooterOwnProps, DialogFooterProps, DialogHeaderOwnProps, DialogHeaderProps, DialogOwnProps, DialogProps, DialogTriggerProps, Display, FieldLabelOwnProps, FieldLabelProps, FilterState, FlexDirection, FlexItemProps, FlexOwnProps, FlexProps, FlexWrap, FullPageOwnProps, FullPageProps, GridItemOwnProps, GridItemProps, GridOwnProps, GridProps, HeaderBreadcrumb, HeaderMetadataItem, HeaderMetadataStatusProps, HeaderMetadataUser, HeaderNavTab, HeaderNavTabGroup, HeaderNavTabItem, HeaderOwnProps, HeaderPageBreadcrumb, HeaderPageOwnProps, HeaderPageProps, HeaderProps, HeaderTab, HeaderTag, JustifyContent, LinkOwnProps, LinkProps, ListOwnProps, ListProps, ListRowOwnProps, ListRowProps, MarginProps, MenuAutocompleteListBoxOwnProps, MenuAutocompleteListBoxProps, MenuAutocompleteOwnProps, MenuAutocompleteProps, MenuItemOwnProps, MenuItemProps, MenuListBoxItemOwnProps, MenuListBoxItemProps, MenuListBoxOwnProps, MenuListBoxProps, MenuOwnProps, MenuPopoverOwnProps, MenuProps, MenuSectionOwnProps, MenuSectionProps, MenuSeparatorOwnProps, MenuSeparatorProps, MenuTriggerProps, NoPagination, OffsetParams, OffsetResponse, Option, OptionSection, PaddingProps, PagePagination, PageSizeOption, PaginationOptions, PasswordFieldOwnProps, PasswordFieldProps, PluginHeaderOwnProps, PluginHeaderProps, PopoverOwnProps, PopoverProps, ProviderBg, QueryOptions, RadioGroupOwnProps, RadioGroupProps, RadioOwnProps, RadioProps, Responsive, RowConfig, RowOwnProps, RowProps, RowRenderFn, SearchAutocompleteItemOwnProps, SearchAutocompleteItemProps, SearchAutocompleteOwnProps, SearchAutocompleteProps, SearchFieldOwnProps, SearchFieldProps, SearchState, SelectOwnProps, SelectProps, SkeletonOwnProps, SkeletonProps, SliderOwnProps, SliderProps, SortDescriptor, SortState, Space, SpaceProps, SubmenuTriggerProps, SwitchOwnProps, SwitchProps, TabListOwnProps, TabListProps, TabMatchStrategy, TabOwnProps, TabPanelOwnProps, TabPanelProps, TabProps, TableBodyOwnProps, TableBodyProps, TableHeaderOwnProps, TableHeaderProps, TableItem, TablePaginationOwnProps, TablePaginationProps, TablePaginationType, TableProps, TableRootOwnProps, TableRootProps, TableSelection, TabsOwnProps, TabsProps, TagGroupOwnProps, TagGroupProps, TagOwnProps, TagProps, TextColorStatus, TextColors, TextFieldOwnProps, TextFieldProps, TextOwnProps, TextProps, TextVariants, TextWeights, ToggleButtonGroupOwnProps, ToggleButtonGroupProps, ToggleButtonOwnProps, ToggleButtonProps, TooltipOwnProps, TooltipProps, UseAnalyticsFn, UseTableCompleteOptions, UseTableCursorOptions, UseTableOffsetOptions, UseTableOptions, UseTableResult, UtilityProps, VirtualizedProp, VisuallyHiddenOwnProps, VisuallyHiddenProps };

package/dist/index.esm.js

@@ -31,6 +31,8 @@ export { PluginHeaderDefinition } from './components/PluginHeader/definition.esm
 export { Header, HeaderPage } from './components/Header/Header.esm.js';
 export { HeaderDefinition, HeaderPageDefinition } from './components/Header/definition.esm.js';
 export { HeaderNavDefinition, HeaderNavGroupDefinition, HeaderNavItemDefinition } from './components/Header/HeaderNavDefinition.esm.js';
+export { HeaderMetadataUsers } from './components/Header/HeaderMetadataUsers.esm.js';
+export { HeaderMetadataStatus } from './components/Header/HeaderMetadataStatus.esm.js';
 export { ButtonIcon } from './components/ButtonIcon/ButtonIcon.esm.js';
 export { ButtonIconDefinition } from './components/ButtonIcon/definition.esm.js';
 export { ButtonLink } from './components/ButtonLink/ButtonLink.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/provider/BUIProvider.esm.js

@@ -1,9 +1,10 @@
 import { jsx } from 'react/jsx-runtime';
 import { useMemo } from 'react';
 import { RouterProvider } from 'react-aria-components';
-import { useInRouterContext, useNavigate, useHref } from 'react-router-dom';
+import { useInRouterContext, useNavigate } from 'react-router-dom';
 import { createVersionedValueMap } from '@backstage/version-bridge';
 import { BUIContext } from '../analytics/useAnalytics.esm.js';
+import { useResolvedHref } from '../hooks/useResolvedHref.esm.js';
 
 function BUIProvider(props) {
   const { useAnalytics, children } = props;
@@ -21,7 +22,7 @@ function BUIProvider(props) {
 }
 function RoutedContent({ children }) {
   const navigate = useNavigate();
-  return /* @__PURE__ */ jsx(RouterProvider, { navigate, useHref, children });
+  return /* @__PURE__ */ jsx(RouterProvider, { navigate, useHref: useResolvedHref, children });
 }
 
 export { BUIProvider };

package/dist/provider/BUIProvider.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"BUIProvider.esm.js","sources":["../../src/provider/BUIProvider.tsx"],"sourcesContent":["/*\n * Copyright 2026 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 { useMemo, type ReactNode } from 'react';\nimport { RouterProvider } from 'react-aria-components';\nimport { useInRouterContext, useNavigate, useHref } from 'react-router-dom';\nimport { createVersionedValueMap } from '@backstage/version-bridge';\nimport { BUIContext } from '../analytics/useAnalytics';\nimport type { UseAnalyticsFn } from '../analytics/types';\n\n/** @public */\nexport type BUIProviderProps = {\n  useAnalytics?: UseAnalyticsFn;\n  children: ReactNode;\n};\n\n/**\n * Provides integration capabilities to all descendant BUI components.\n *\n * @example\n * ```tsx\n * import { BUIProvider } from '@backstage/ui';\n * import { useAnalytics as useBackstageAnalytics } from '@backstage/core-plugin-api';\n *\n * function App() {\n *   return (\n *     <BUIProvider useAnalytics={useBackstageAnalytics}>\n *       <AppContent />\n *     </BUIProvider>\n *   );\n * }\n * ```\n *\n * @public\n */\nexport function BUIProvider(props: BUIProviderProps) {\n  const { useAnalytics, children } = props;\n  const value = useMemo(\n    () =>\n      createVersionedValueMap({\n        1: { useAnalytics },\n      }),\n    [useAnalytics],\n  );\n\n  const content = (\n    <BUIContext.Provider value={value}>{children}</BUIContext.Provider>\n  );\n\n  if (useInRouterContext()) {\n    return <RoutedContent>{content}</RoutedContent>;\n  }\n\n  return content;\n}\n\nfunction RoutedContent({ children }: { children: ReactNode }) {\n  const navigate = useNavigate();\n  return (\n    <RouterProvider navigate={navigate} useHref={useHref}>\n      {children}\n    </RouterProvider>\n  );\n}\n"],"names":[],"mappings":";;;;;;;AAgDO,SAAS,YAAY,KAAA,EAAyB;AACnD,EAAA,MAAM,EAAE,YAAA,EAAc,QAAA,EAAS,GAAI,KAAA;AACnC,EAAA,MAAM,KAAA,GAAQ,OAAA;AAAA,IACZ,MACE,uBAAA,CAAwB;AAAA,MACtB,CAAA,EAAG,EAAE,YAAA;AAAa,KACnB,CAAA;AAAA,IACH,CAAC,YAAY;AAAA,GACf;AAEA,EAAA,MAAM,0BACJ,GAAA,CAAC,UAAA,CAAW,QAAA,EAAX,EAAoB,OAAe,QAAA,EAAS,CAAA;AAG/C,EAAA,IAAI,oBAAmB,EAAG;AACxB,IAAA,uBAAO,GAAA,CAAC,iBAAe,QAAA,EAAA,OAAA,EAAQ,CAAA;AAAA,EACjC;AAEA,EAAA,OAAO,OAAA;AACT;AAEA,SAAS,aAAA,CAAc,EAAE,QAAA,EAAS,EAA4B;AAC5D,EAAA,MAAM,WAAW,WAAA,EAAY;AAC7B,EAAA,uBACE,GAAA,CAAC,cAAA,EAAA,EAAe,QAAA,EAAoB,OAAA,EACjC,QAAA,EACH,CAAA;AAEJ;;;;"}
+{"version":3,"file":"BUIProvider.esm.js","sources":["../../src/provider/BUIProvider.tsx"],"sourcesContent":["/*\n * Copyright 2026 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 { useMemo, type ReactNode } from 'react';\nimport { RouterProvider } from 'react-aria-components';\nimport { useInRouterContext, useNavigate } from 'react-router-dom';\nimport { createVersionedValueMap } from '@backstage/version-bridge';\nimport { BUIContext } from '../analytics/useAnalytics';\nimport { useResolvedHref } from '../hooks/useResolvedHref';\nimport type { UseAnalyticsFn } from '../analytics/types';\n\n/** @public */\nexport type BUIProviderProps = {\n  useAnalytics?: UseAnalyticsFn;\n  children: ReactNode;\n};\n\n/**\n * Provides integration capabilities to all descendant BUI components.\n *\n * @example\n * ```tsx\n * import { BUIProvider } from '@backstage/ui';\n * import { useAnalytics as useBackstageAnalytics } from '@backstage/core-plugin-api';\n *\n * function App() {\n *   return (\n *     <BUIProvider useAnalytics={useBackstageAnalytics}>\n *       <AppContent />\n *     </BUIProvider>\n *   );\n * }\n * ```\n *\n * @public\n */\nexport function BUIProvider(props: BUIProviderProps) {\n  const { useAnalytics, children } = props;\n  const value = useMemo(\n    () =>\n      createVersionedValueMap({\n        1: { useAnalytics },\n      }),\n    [useAnalytics],\n  );\n\n  const content = (\n    <BUIContext.Provider value={value}>{children}</BUIContext.Provider>\n  );\n\n  if (useInRouterContext()) {\n    return <RoutedContent>{content}</RoutedContent>;\n  }\n\n  return content;\n}\n\nfunction RoutedContent({ children }: { children: ReactNode }) {\n  const navigate = useNavigate();\n  return (\n    <RouterProvider navigate={navigate} useHref={useResolvedHref}>\n      {children}\n    </RouterProvider>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;AAiDO,SAAS,YAAY,KAAA,EAAyB;AACnD,EAAA,MAAM,EAAE,YAAA,EAAc,QAAA,EAAS,GAAI,KAAA;AACnC,EAAA,MAAM,KAAA,GAAQ,OAAA;AAAA,IACZ,MACE,uBAAA,CAAwB;AAAA,MACtB,CAAA,EAAG,EAAE,YAAA;AAAa,KACnB,CAAA;AAAA,IACH,CAAC,YAAY;AAAA,GACf;AAEA,EAAA,MAAM,0BACJ,GAAA,CAAC,UAAA,CAAW,QAAA,EAAX,EAAoB,OAAe,QAAA,EAAS,CAAA;AAG/C,EAAA,IAAI,oBAAmB,EAAG;AACxB,IAAA,uBAAO,GAAA,CAAC,iBAAe,QAAA,EAAA,OAAA,EAAQ,CAAA;AAAA,EACjC;AAEA,EAAA,OAAO,OAAA;AACT;AAEA,SAAS,aAAA,CAAc,EAAE,QAAA,EAAS,EAA4B;AAC5D,EAAA,MAAM,WAAW,WAAA,EAAY;AAC7B,EAAA,uBACE,GAAA,CAAC,cAAA,EAAA,EAAe,QAAA,EAAoB,OAAA,EAAS,iBAC1C,QAAA,EACH,CAAA;AAEJ;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/ui",
-  "version": "0.15.0-next.0",
+  "version": "0.15.0-next.1",
   "backstage": {
     "role": "web-library"
   },
@@ -51,18 +51,22 @@
   },
   "dependencies": {
     "@backstage/version-bridge": "1.0.12",
+    "@braintree/sanitize-url": "^7.1.2",
     "@internationalized/date": "^3.12.0",
-    "@remixicon/react": "^4.6.0",
+    "@remixicon/react": ">=4.6.0 <4.9.0",
     "@tanstack/react-table": "^8.21.3",
     "clsx": "^2.1.1",
+    "marked": "^15.0.12",
     "react-aria": "~3.48.0",
     "react-aria-components": "~1.17.0",
     "react-stately": "~3.46.0",
     "use-sync-external-store": "^1.4.0"
   },
   "devDependencies": {
-    "@backstage/cli": "0.36.2-next.0",
+    "@backstage/cli": "0.36.2-next.1",
     "@storybook/react-vite": "^10.3.3",
+    "@testing-library/jest-dom": "^6.0.0",
+    "@testing-library/react": "^16.0.0",
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.0.0",
     "@types/use-sync-external-store": "^1.0.0",