@backstage/core-components 0.9.5-next.2 → 0.9.6-next.1

package/CHANGELOG.md

@@ -1,5 +1,45 @@
 # @backstage/core-components
 
+## 0.9.6-next.1
+
+### Patch Changes
+
+- 3c440ea77e: Change BackstageIconLinkVertical style to use pallette instead of explicit color
+- 7e115d42f9: Support displaying subtitle text in `SidebarSubmenuItem`
+- Updated dependencies
+  - @backstage/errors@1.1.0-next.0
+  - @backstage/theme@0.2.16-next.0
+
+## 0.9.6-next.0
+
+### Patch Changes
+
+- c3cfc83af2: Updated JSDoc to be MDX compatible.
+
+## 0.9.5
+
+### Patch Changes
+
+- feb4e8de07: Fix EntityPage tab scrolling overflow bug on Firefox
+- 65840b17be: Fix issue where right arrow icon was incorrectly added to side bar items without a sub-menu
+- de593ec78f: Updated dependency `react-text-truncate` to `^0.19.0`.
+- 8f7b1835df: Updated dependency `msw` to `^0.41.0`.
+- 6968b65ba1: Updated dependency `@react-hookz/web` to `^14.0.0`.
+- ee2cd642c5: Updated dependency `rc-progress` to `3.3.3`.
+- 96d1e01641: Accessibility updates:
+
+  - Added `aria-label` to the `Select` component
+  - Changed heading level used in the header of `Table` component
+
+- 7d355c4b3f: Fix the missing filter in the toolbar when passing a custom component in the core-components Table
+- 1cf9caecd6: fix Sidebar Contexts deprecation message
+- bff65e6958: The `SidebarPinStateContext` and `SidebarContext` have been deprecated and will be removed in a future release. Instead, use `<SidebarPinStateProvider>` + `useSidebarPinState()` and/or `<SidebarOpenStateProvider>` + `useSidebarOpenState()`.
+
+  This was done to ensure that sidebar state can be shared successfully across components exported by different packages, regardless of what version of this package is resolved and installed for each individual package.
+
+- Updated dependencies
+  - @backstage/core-plugin-api@1.0.3
+
 ## 0.9.5-next.2
 
 ### Patch Changes

package/dist/index.d.ts

@@ -375,7 +375,7 @@ declare namespace types_d {
  *
  * @public
  * @remarks
- * <NodeData> and <EdgeData> are useful when rendering custom or edge labels
+ * `<NodeData>` and `<EdgeData>` are useful when rendering custom or edge labels
  */
 interface DependencyGraphProps<NodeData, EdgeData> extends React__default.SVGProps<SVGSVGElement> {
     /**
@@ -1344,7 +1344,7 @@ declare type ItemCardHeaderProps = Partial<WithStyles<typeof styles>> & {
  * A simple card header, rendering a default look for "item cards" - cards that
  * are arranged in a grid for users to select among several options.
  *
- * This component expects to be placed within a MUI <CardMedia>.
+ * This component expects to be placed within a MUI `<CardMedia>`.
  *
  * Styles for the header can be overridden using the `classes` prop, e.g.:
  *
@@ -1504,6 +1504,7 @@ declare type SidebarSubmenuItemDropdownItem = {
  * Holds submenu item content.
  *
  * title: Text content of submenu item
+ * subtitle: A subtitle displayed under the main title
  * to: Path to navigate to when item is clicked
  * icon: Icon displayed on the left of text content
  * dropdownItems: Optional array of dropdown items displayed when submenu item is clicked.
@@ -1512,6 +1513,7 @@ declare type SidebarSubmenuItemDropdownItem = {
  */
 declare type SidebarSubmenuItemProps = {
     title: string;
+    subtitle?: string;
     to?: string;
     icon?: IconComponent;
     dropdownItems?: SidebarSubmenuItemDropdownItem[];

package/dist/index.esm.js

@@ -1384,7 +1384,7 @@ const useIconStyles = makeStyles((theme) => ({
     textAlign: "center"
   },
   disabled: {
-    color: "gray",
+    color: theme.palette.text.secondary,
     cursor: "default"
   },
   primary: {
@@ -3545,6 +3545,13 @@ const useStyles$j = makeStyles((theme) => ({
     fontSize: 14,
     whiteSpace: "nowrap",
     overflow: "hidden",
+    "text-overflow": "ellipsis",
+    lineHeight: 1
+  },
+  subtitle: {
+    fontSize: 10,
+    whiteSpace: "nowrap",
+    overflow: "hidden",
     "text-overflow": "ellipsis"
   },
   dropdownArrow: {
@@ -3575,7 +3582,7 @@ const useStyles$j = makeStyles((theme) => ({
   }
 }), { name: "BackstageSidebarSubmenuItem" });
 const SidebarSubmenuItem = (props) => {
-  const { title, to, icon: Icon, dropdownItems } = props;
+  const { title, subtitle, to, icon: Icon, dropdownItems } = props;
   const classes = useStyles$j();
   const { setIsHoveredOn } = useContext(SidebarItemWithSubmenuContext);
   const closeSubmenu = () => {
@@ -3609,7 +3616,10 @@ const SidebarSubmenuItem = (props) => {
     }), /* @__PURE__ */ React.createElement(Typography, {
       variant: "subtitle1",
       className: classes.label
-    }, title), showDropDown ? /* @__PURE__ */ React.createElement(ArrowDropUpIcon, {
+    }, title, /* @__PURE__ */ React.createElement("br", null), subtitle && /* @__PURE__ */ React.createElement(Typography, {
+      variant: "caption",
+      className: classes.subtitle
+    }, subtitle)), showDropDown ? /* @__PURE__ */ React.createElement(ArrowDropUpIcon, {
       className: classes.dropdownArrow
     }) : /* @__PURE__ */ React.createElement(ArrowDropDownIcon, {
       className: classes.dropdownArrow
@@ -3647,7 +3657,10 @@ const SidebarSubmenuItem = (props) => {
   }), /* @__PURE__ */ React.createElement(Typography, {
     variant: "subtitle1",
     className: classes.label
-  }, title))));
+  }, title, /* @__PURE__ */ React.createElement("br", null), subtitle && /* @__PURE__ */ React.createElement(Typography, {
+    variant: "caption",
+    className: classes.subtitle
+  }, subtitle)))));
 };
 
 const useStyles$i = makeStyles((theme) => ({
@@ -4741,6 +4754,7 @@ function Table(props) {
     initialState,
     emptyContent,
     onStateChange,
+    components,
     ...restProps
   } = props;
   const tableClasses = useTableStyles();
@@ -4867,7 +4881,8 @@ function Table(props) {
     components: {
       Header: StyledMTableHeader,
       Toolbar,
-      Body
+      Body,
+      ...components
     },
     options: { ...defaultOptions, ...options },
     columns: MTColumns,