@itwin/itwinui-react 3.19.0 → 3.19.2

package/cjs/core/Table/columns/selectionColumn.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { CellRendererProps, HeaderProps } from '../../../react-table/react-table.js';
+import type { CellProps, CellRendererProps, HeaderProps } from '../../../react-table/react-table.js';
 export declare const SELECTION_CELL_ID = "iui-table-checkbox-selector";
 /**
  * Selection column that adds selection checkbox column to the Table.
@@ -28,6 +28,6 @@ export declare const SelectionColumn: <T extends Record<string, unknown>>(props?
     columnClassName: string;
     cellClassName: string;
     Header: ({ getToggleAllRowsSelectedProps, toggleAllRowsSelected, rows, preFilteredFlatRows, state, }: HeaderProps<T>) => React.JSX.Element;
-    Cell: () => null;
+    Cell: ({ row, selectSubRows }: CellProps<T>) => React.JSX.Element;
     cellRenderer: (props: CellRendererProps<T>) => React.JSX.Element;
 };

package/cjs/core/Table/columns/selectionColumn.js

@@ -64,10 +64,8 @@ const SelectionColumn = (props = {}) => {
         onChange: () => toggleAllRowsSelected(nextToggleState),
       });
     },
-    Cell: () => null,
-    cellRenderer: (props) => {
-      let { row, selectSubRows = true } = props.cellProps;
-      let children = _react.createElement(_Checkbox.Checkbox, {
+    Cell: ({ row, selectSubRows = true }) =>
+      _react.createElement(_Checkbox.Checkbox, {
         ...row.getToggleRowSelectedProps(),
         style: {},
         title: '',
@@ -87,15 +85,11 @@ const SelectionColumn = (props = {}) => {
             );
           else row.toggleRowSelected(!row.isSelected);
         },
-      });
-      return _react.createElement(
-        _index.DefaultCell,
-        {
-          ...props,
-          isDisabled: (rowData) => !!isDisabled?.(rowData),
-        },
-        children,
-      );
-    },
+      }),
+    cellRenderer: (props) =>
+      _react.createElement(_index.DefaultCell, {
+        ...props,
+        isDisabled: (rowData) => !!isDisabled?.(rowData),
+      }),
   };
 };

package/cjs/core/Table/hooks/useExpanderCell.js

@@ -11,7 +11,6 @@ Object.defineProperty(exports, 'useExpanderCell', {
 const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
 const _react = /*#__PURE__*/ _interop_require_wildcard._(require('react'));
 const _index = require('../columns/index.js');
-const _DefaultCell = require('../cells/DefaultCell.js');
 const useExpanderCell =
   (subComponent, expanderCell, isRowDisabled) => (hooks) => {
     if (!subComponent) return;
@@ -27,17 +26,14 @@ const useExpanderCell =
       return [
         {
           ...expanderColumn,
-          cellRenderer: expanderCell
-            ? (props) =>
+          Cell: expanderCell
+            ? (cellProps) =>
                 _react.createElement(
-                  _DefaultCell.DefaultCell,
-                  {
-                    ...props,
-                    isDisabled: (rowData) => !!isRowDisabled?.(rowData),
-                  },
-                  expanderCell(props.cellProps),
+                  _react.Fragment,
+                  null,
+                  expanderCell(cellProps),
                 )
-            : expanderColumn.cellRenderer,
+            : expanderColumn.Cell,
         },
         ...columns,
       ];

package/cjs/core/Tile/Tile.d.ts

@@ -247,13 +247,13 @@ export declare const Tile: PolymorphicForwardRefComponent<"div", TileLegacyProps
     /**
      * `IconButton` subcomponent: custom icon for `QuickAction` and `TypeIndicator` buttons.
      */
-    IconButton: PolymorphicForwardRefComponent<"button", Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "stretched" | "isActive" | "iconProps"> & {
+    IconButton: PolymorphicForwardRefComponent<"button", Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "isActive" | "iconProps"> & {
         isActive?: boolean;
         label?: React.ReactNode;
         labelProps?: Omit<React.ComponentPropsWithoutRef<typeof import("../Tooltip/Tooltip.js").Tooltip>, "content" | "reference" | "ariaStrategy" | "children">;
         iconProps?: React.ComponentProps<"span">;
         title?: string;
-    } & Omit<import("../Buttons/Button.js").ButtonProps, "loading" | "startIcon" | "endIcon" | "labelProps" | "startIconProps" | "endIconProps"> & {
+    } & Omit<import("../Buttons/Button.js").ButtonProps, "loading" | "startIcon" | "endIcon" | "labelProps" | "startIconProps" | "endIconProps" | "stretched"> & {
         as?: "button" | undefined;
     }, "ref">>;
     /**

package/cjs/core/TransferList/TransferList.d.ts

@@ -32,25 +32,27 @@ type TransferListListboxLabelOwnProps = {
  */
 export declare const TransferList: PolymorphicForwardRefComponent<"div", {}> & {
     /**
-     * 	TransferList listbox wrapper subcomponent
+     * TransferList listbox wrapper subcomponent
      */
     ListboxWrapper: PolymorphicForwardRefComponent<"div", TransferListListboxWrapperOwnProps>;
     /**
-     * 	TransferList listbox subcomponent
+     * TransferList listbox subcomponent
      */
     Listbox: PolymorphicForwardRefComponent<"ul", Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "as"> & {
         as?: "div" | undefined;
     }>;
     /**
-     * 	TransferList item subcomponent
+     * TransferList item subcomponent.
+     *
+     * Renders a `ListItem` and is compatible with `ListItem`'s [subcomponents](https://itwinui.bentley.com/docs/list#with-subcomponents).
      */
     Item: PolymorphicForwardRefComponent<"li", TransferListItemOwnProps>;
     /**
-     * 	TransferList listbox label subcomponent
+     * TransferList listbox label subcomponent
      */
     ListboxLabel: PolymorphicForwardRefComponent<"div", TransferListListboxLabelOwnProps>;
     /**
-     * 	TransferList toolbar subcomponent
+     * TransferList toolbar subcomponent
      */
     Toolbar: PolymorphicForwardRefComponent<"div", object>;
 };

package/cjs/core/Typography/Kbd.d.ts

@@ -27,7 +27,7 @@ type KbdProps = {
  * A keyboard key element.
  * @example
  * <Kbd>A</Kbd>
- * <Kbd title='Enter'>{KbdKeys.Enter}</Kbd>
+ * <Kbd>{KbdKeys.Enter}</Kbd>
  */
 export declare const Kbd: PolymorphicForwardRefComponent<"kbd", KbdProps>;
 export {};

package/cjs/styles.js

@@ -1,6 +1,6 @@
 'use strict';
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-const e = '3.19.0';
+const e = '3.19.2';
 const u = new Proxy(
   {},
   {

package/esm/core/Avatar/Avatar.d.ts

@@ -15,10 +15,6 @@ type AvatarProps = {
      * Status/Availability of a user.
      */
     status?: AvatarStatus;
-    /**
-     * Text which will appear when hovering over the icon.
-     */
-    title?: string;
     /**
      * Abbreviation to be displayed.
      */
@@ -41,16 +37,16 @@ export declare const defaultStatusTitles: StatusTitles;
  * Basic avatar component
  * @example
  * <caption>Small icon with abbreviation</caption>
- * <Avatar size='small' title='Terry Rivers' abbreviation='TR' backgroundColor='green'/>
+ * <Avatar size='small' abbreviation='TR' backgroundColor='green'/>
  * @example
  * <caption>Medium icon with image</caption>
- * <Avatar size='medium' title='Terry Rivers' abbreviation='TR' backgroundColor='green' image={<img src="https://cdn.example.com/user/profile/pic.png" />}/>
+ * <Avatar size='medium' abbreviation='TR' backgroundColor='green' image={<img src="https://cdn.example.com/user/profile/pic.png" />}/>
  * @example
  * <caption>Large icon with status</caption>
- * <Avatar size='large' title='Terry Rivers' abbreviation='TR' backgroundColor='green' status='online' />
+ * <Avatar size='large' abbreviation='TR' backgroundColor='green' status='online' />
  * @example
  * <caption>X-large icon with image</caption>
- * <Avatar size='x-large' title='Terry Rivers' abbreviation='TR' backgroundColor='green' image={<img src="https://cdn.example.com/user/profile/pic.png" />}/>
+ * <Avatar size='x-large' abbreviation='TR' backgroundColor='green' image={<img src="https://cdn.example.com/user/profile/pic.png" />}/>
  */
 export declare const Avatar: PolymorphicForwardRefComponent<"span", AvatarProps>;
 export {};

package/esm/core/Avatar/Avatar.js

@@ -19,7 +19,6 @@ export const Avatar = React.forwardRef((props, ref) => {
     abbreviation,
     image,
     backgroundColor,
-    title,
     translatedStatusTitles,
     className,
     style,
@@ -36,7 +35,6 @@ export const Avatar = React.forwardRef((props, ref) => {
       className: cx('iui-avatar', className),
       'data-iui-size': 'medium' !== size ? size : void 0,
       'data-iui-status': status,
-      title: title,
       style: {
         backgroundColor: getBackground(backgroundColor),
         ...style,

package/esm/core/AvatarGroup/AvatarGroup.d.ts

@@ -43,17 +43,14 @@ type AvatarGroupProps = {
  *  <Avatar
  *    abbreviation="TR"
  *    backgroundColor={getUserColor("Terry Rivers")}
- *    title="Terry Rivers"
  *  />
  *  <Avatar
  *    abbreviation="RM"
  *    backgroundColor={getUserColor("Robin Mercer")}
- *    title="Robin Mercer"
  *  />
  *  <Avatar
  *    abbreviation="JM"
  *    backgroundColor={getUserColor("Jean Mullins")}
- *    title="Jean Mullins"
  *  />
  * </AvatarGroup>
  */

package/esm/core/Breadcrumbs/Breadcrumbs.js

@@ -5,6 +5,7 @@ import {
   Box,
   OverflowContainer,
   useWarningLogger,
+  cloneElementWithRef,
 } from '../../utils/index.js';
 import { Button } from '../Buttons/Button.js';
 import { Anchor } from '../Typography/Anchor.js';
@@ -134,17 +135,22 @@ let ListItem = ({ item, isActive }) => {
       );
     children = React.createElement(BreadcrumbsItem, children.props);
   }
+  let getProps = React.useCallback(
+    (children) => {
+      let defaultAriaCurrent = isActive ? 'location' : void 0;
+      return {
+        'aria-current': children.props['aria-current'] ?? defaultAriaCurrent,
+      };
+    },
+    [isActive],
+  );
   return React.createElement(
     Box,
     {
       as: 'li',
       className: 'iui-breadcrumbs-item',
     },
-    children &&
-      React.cloneElement(children, {
-        'aria-current':
-          children.props['aria-current'] ?? isActive ? 'location' : void 0,
-      }),
+    children ? cloneElementWithRef(children, getProps) : null,
   );
 };
 let Separator = ({ separator }) =>

package/esm/core/Buttons/IconButton.d.ts

@@ -25,7 +25,7 @@ export type IconButtonProps = {
      * @deprecated Use `label` instead.
      */
     title?: string;
-} & Omit<ButtonProps, 'startIcon' | 'endIcon' | 'startIconProps' | 'endIconProps' | 'labelProps' | 'loading'>;
+} & Omit<ButtonProps, 'startIcon' | 'endIcon' | 'startIconProps' | 'endIconProps' | 'labelProps' | 'loading' | 'stretched'>;
 /**
  * Icon button
  * @example

package/esm/core/Carousel/Carousel.d.ts

@@ -40,22 +40,22 @@ export declare const Carousel: PolymorphicForwardRefComponent<"section", Carouse
      * Contains the dots and previous/next buttons for navigating the slides. Must be present _before_ the slides in DOM.
      */
     Navigation: PolymorphicForwardRefComponent<"div", {}> & {
-        PreviousButton: PolymorphicForwardRefComponent<"button", Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "stretched" | "isActive" | "iconProps"> & {
+        PreviousButton: PolymorphicForwardRefComponent<"button", Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "isActive" | "iconProps"> & {
             isActive?: boolean;
             label?: React.ReactNode;
             labelProps?: Omit<React.ComponentPropsWithoutRef<typeof import("../Tooltip/Tooltip.js").Tooltip>, "content" | "reference" | "ariaStrategy" | "children">;
             iconProps?: React.ComponentProps<"span">;
             title?: string;
-        } & Omit<import("../Buttons/Button.js").ButtonProps, "loading" | "startIcon" | "endIcon" | "labelProps" | "startIconProps" | "endIconProps"> & {
+        } & Omit<import("../Buttons/Button.js").ButtonProps, "loading" | "startIcon" | "endIcon" | "labelProps" | "startIconProps" | "endIconProps" | "stretched"> & {
             as?: "button" | undefined;
         }>;
-        NextButton: PolymorphicForwardRefComponent<"button", Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "stretched" | "isActive" | "iconProps"> & {
+        NextButton: PolymorphicForwardRefComponent<"button", Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "isActive" | "iconProps"> & {
             isActive?: boolean;
             label?: React.ReactNode;
             labelProps?: Omit<React.ComponentPropsWithoutRef<typeof import("../Tooltip/Tooltip.js").Tooltip>, "content" | "reference" | "ariaStrategy" | "children">;
             iconProps?: React.ComponentProps<"span">;
             title?: string;
-        } & Omit<import("../Buttons/Button.js").ButtonProps, "loading" | "startIcon" | "endIcon" | "labelProps" | "startIconProps" | "endIconProps"> & {
+        } & Omit<import("../Buttons/Button.js").ButtonProps, "loading" | "startIcon" | "endIcon" | "labelProps" | "startIconProps" | "endIconProps" | "stretched"> & {
             as?: "button" | undefined;
         }>;
     };

package/esm/core/Carousel/CarouselNavigation.d.ts

@@ -7,22 +7,22 @@ import type { PolymorphicForwardRefComponent } from '../../utils/index.js';
  * `children` can be specified to override what is shown in this navigation section.
  */
 export declare const CarouselNavigation: PolymorphicForwardRefComponent<"div", {}> & {
-    PreviousButton: PolymorphicForwardRefComponent<"button", Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "stretched" | "isActive" | "iconProps"> & {
+    PreviousButton: PolymorphicForwardRefComponent<"button", Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "isActive" | "iconProps"> & {
         isActive?: boolean;
         label?: React.ReactNode;
         labelProps?: Omit<React.ComponentPropsWithoutRef<typeof import("../Tooltip/Tooltip.js").Tooltip>, "content" | "reference" | "ariaStrategy" | "children">;
         iconProps?: React.ComponentProps<"span">;
         title?: string;
-    } & Omit<import("../Buttons/Button.js").ButtonProps, "loading" | "startIcon" | "endIcon" | "labelProps" | "startIconProps" | "endIconProps"> & {
+    } & Omit<import("../Buttons/Button.js").ButtonProps, "loading" | "startIcon" | "endIcon" | "labelProps" | "startIconProps" | "endIconProps" | "stretched"> & {
         as?: "button" | undefined;
     }>;
-    NextButton: PolymorphicForwardRefComponent<"button", Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "stretched" | "isActive" | "iconProps"> & {
+    NextButton: PolymorphicForwardRefComponent<"button", Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "isActive" | "iconProps"> & {
         isActive?: boolean;
         label?: React.ReactNode;
         labelProps?: Omit<React.ComponentPropsWithoutRef<typeof import("../Tooltip/Tooltip.js").Tooltip>, "content" | "reference" | "ariaStrategy" | "children">;
         iconProps?: React.ComponentProps<"span">;
         title?: string;
-    } & Omit<import("../Buttons/Button.js").ButtonProps, "loading" | "startIcon" | "endIcon" | "labelProps" | "startIconProps" | "endIconProps"> & {
+    } & Omit<import("../Buttons/Button.js").ButtonProps, "loading" | "startIcon" | "endIcon" | "labelProps" | "startIconProps" | "endIconProps" | "stretched"> & {
         as?: "button" | undefined;
     }>;
 };

package/esm/core/InputWithDecorations/InputWithDecorations.d.ts

@@ -28,7 +28,7 @@ export declare const InputWithDecorations: PolymorphicForwardRefComponent<"div",
      * Although similar to `IconButton`, this subcomponent additionally collapses the padding between the button and the input/textarea
      * in `InputWithDecorations`.
      */
-    Button: PolymorphicForwardRefComponent<"button", Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "stretched" | "isActive" | "iconProps"> & Omit<import("../Buttons/IconButton.js").IconButtonProps, "styleType"> & {
+    Button: PolymorphicForwardRefComponent<"button", Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "isActive" | "iconProps"> & Omit<import("../Buttons/IconButton.js").IconButtonProps, "styleType"> & {
         styleType?: import("../Buttons/IconButton.js").IconButtonProps["styleType"];
     } & {
         as?: "button" | undefined;

package/esm/core/Table/columns/expanderColumn.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { CellRendererProps, Row } from '../../../react-table/react-table.js';
+import type { CellProps, CellRendererProps, Row } from '../../../react-table/react-table.js';
 export declare const EXPANDER_CELL_ID = "iui-table-expander";
 /**
  * Expander column that adds sub-content expander column to the Table.
@@ -39,6 +39,6 @@ export declare const ExpanderColumn: <T extends Record<string, unknown>>(props?:
     maxWidth: number;
     columnClassName: string;
     cellClassName: string;
-    Cell: () => null;
+    Cell: (props: CellProps<T>) => React.JSX.Element | null;
     cellRenderer: (props: CellRendererProps<T>) => React.JSX.Element;
 };

package/esm/core/Table/columns/expanderColumn.js

@@ -15,35 +15,30 @@ export const ExpanderColumn = (props = {}) => {
     maxWidth: 48,
     columnClassName: 'iui-slot',
     cellClassName: 'iui-slot',
-    Cell: () => null,
-    cellRenderer: (props) => {
-      let { row } = props.cellProps;
-      let children = subComponent?.(row)
-        ? React.createElement(
-            IconButton,
-            {
-              'aria-label': 'Toggle expandable content',
-              className: 'iui-table-row-expander',
-              styleType: 'borderless',
-              size: 'small',
-              onClick: (e) => {
-                e.stopPropagation();
-                row.toggleRowExpanded();
-              },
-              disabled: isDisabled?.(row.original),
-              'aria-expanded': row.isExpanded,
-            },
-            React.createElement(SvgChevronRight, null),
-          )
-        : null;
+    Cell: (props) => {
+      let { row } = props;
+      if (!subComponent?.(row)) return null;
       return React.createElement(
-        DefaultCell,
+        IconButton,
         {
-          ...props,
-          isDisabled: (rowData) => !!isDisabled?.(rowData),
+          'aria-label': 'Toggle expandable content',
+          className: 'iui-table-row-expander',
+          styleType: 'borderless',
+          size: 'small',
+          onClick: (e) => {
+            e.stopPropagation();
+            row.toggleRowExpanded();
+          },
+          disabled: isDisabled?.(props.row.original),
+          'aria-expanded': row.isExpanded,
         },
-        children,
+        React.createElement(SvgChevronRight, null),
       );
     },
+    cellRenderer: (props) =>
+      React.createElement(DefaultCell, {
+        ...props,
+        isDisabled: (rowData) => !!isDisabled?.(rowData),
+      }),
   };
 };

package/esm/core/Table/columns/selectionColumn.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { CellRendererProps, HeaderProps } from '../../../react-table/react-table.js';
+import type { CellProps, CellRendererProps, HeaderProps } from '../../../react-table/react-table.js';
 export declare const SELECTION_CELL_ID = "iui-table-checkbox-selector";
 /**
  * Selection column that adds selection checkbox column to the Table.
@@ -28,6 +28,6 @@ export declare const SelectionColumn: <T extends Record<string, unknown>>(props?
     columnClassName: string;
     cellClassName: string;
     Header: ({ getToggleAllRowsSelectedProps, toggleAllRowsSelected, rows, preFilteredFlatRows, state, }: HeaderProps<T>) => React.JSX.Element;
-    Cell: () => null;
+    Cell: ({ row, selectSubRows }: CellProps<T>) => React.JSX.Element;
     cellRenderer: (props: CellRendererProps<T>) => React.JSX.Element;
 };

package/esm/core/Table/columns/selectionColumn.js

@@ -44,10 +44,8 @@ export const SelectionColumn = (props = {}) => {
         onChange: () => toggleAllRowsSelected(nextToggleState),
       });
     },
-    Cell: () => null,
-    cellRenderer: (props) => {
-      let { row, selectSubRows = true } = props.cellProps;
-      let children = React.createElement(Checkbox, {
+    Cell: ({ row, selectSubRows = true }) =>
+      React.createElement(Checkbox, {
         ...row.getToggleRowSelectedProps(),
         style: {},
         title: '',
@@ -67,15 +65,11 @@ export const SelectionColumn = (props = {}) => {
             );
           else row.toggleRowSelected(!row.isSelected);
         },
-      });
-      return React.createElement(
-        DefaultCell,
-        {
-          ...props,
-          isDisabled: (rowData) => !!isDisabled?.(rowData),
-        },
-        children,
-      );
-    },
+      }),
+    cellRenderer: (props) =>
+      React.createElement(DefaultCell, {
+        ...props,
+        isDisabled: (rowData) => !!isDisabled?.(rowData),
+      }),
   };
 };

package/esm/core/Table/hooks/useExpanderCell.js

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import { ExpanderColumn, EXPANDER_CELL_ID } from '../columns/index.js';
-import { DefaultCell } from '../cells/DefaultCell.js';
 export const useExpanderCell =
   (subComponent, expanderCell, isRowDisabled) => (hooks) => {
     if (!subComponent) return;
@@ -14,17 +13,14 @@ export const useExpanderCell =
       return [
         {
           ...expanderColumn,
-          cellRenderer: expanderCell
-            ? (props) =>
+          Cell: expanderCell
+            ? (cellProps) =>
                 React.createElement(
-                  DefaultCell,
-                  {
-                    ...props,
-                    isDisabled: (rowData) => !!isRowDisabled?.(rowData),
-                  },
-                  expanderCell(props.cellProps),
+                  React.Fragment,
+                  null,
+                  expanderCell(cellProps),
                 )
-            : expanderColumn.cellRenderer,
+            : expanderColumn.Cell,
         },
         ...columns,
       ];

package/esm/core/Tile/Tile.d.ts

@@ -247,13 +247,13 @@ export declare const Tile: PolymorphicForwardRefComponent<"div", TileLegacyProps
     /**
      * `IconButton` subcomponent: custom icon for `QuickAction` and `TypeIndicator` buttons.
      */
-    IconButton: PolymorphicForwardRefComponent<"button", Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "stretched" | "isActive" | "iconProps"> & {
+    IconButton: PolymorphicForwardRefComponent<"button", Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "title" | "as" | "size" | "htmlDisabled" | "styleType" | "labelProps" | "isActive" | "iconProps"> & {
         isActive?: boolean;
         label?: React.ReactNode;
         labelProps?: Omit<React.ComponentPropsWithoutRef<typeof import("../Tooltip/Tooltip.js").Tooltip>, "content" | "reference" | "ariaStrategy" | "children">;
         iconProps?: React.ComponentProps<"span">;
         title?: string;
-    } & Omit<import("../Buttons/Button.js").ButtonProps, "loading" | "startIcon" | "endIcon" | "labelProps" | "startIconProps" | "endIconProps"> & {
+    } & Omit<import("../Buttons/Button.js").ButtonProps, "loading" | "startIcon" | "endIcon" | "labelProps" | "startIconProps" | "endIconProps" | "stretched"> & {
         as?: "button" | undefined;
     }, "ref">>;
     /**

package/esm/core/TransferList/TransferList.d.ts

@@ -32,25 +32,27 @@ type TransferListListboxLabelOwnProps = {
  */
 export declare const TransferList: PolymorphicForwardRefComponent<"div", {}> & {
     /**
-     * 	TransferList listbox wrapper subcomponent
+     * TransferList listbox wrapper subcomponent
      */
     ListboxWrapper: PolymorphicForwardRefComponent<"div", TransferListListboxWrapperOwnProps>;
     /**
-     * 	TransferList listbox subcomponent
+     * TransferList listbox subcomponent
      */
     Listbox: PolymorphicForwardRefComponent<"ul", Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "as"> & {
         as?: "div" | undefined;
     }>;
     /**
-     * 	TransferList item subcomponent
+     * TransferList item subcomponent.
+     *
+     * Renders a `ListItem` and is compatible with `ListItem`'s [subcomponents](https://itwinui.bentley.com/docs/list#with-subcomponents).
      */
     Item: PolymorphicForwardRefComponent<"li", TransferListItemOwnProps>;
     /**
-     * 	TransferList listbox label subcomponent
+     * TransferList listbox label subcomponent
      */
     ListboxLabel: PolymorphicForwardRefComponent<"div", TransferListListboxLabelOwnProps>;
     /**
-     * 	TransferList toolbar subcomponent
+     * TransferList toolbar subcomponent
      */
     Toolbar: PolymorphicForwardRefComponent<"div", object>;
 };

package/esm/core/Typography/Kbd.d.ts

@@ -27,7 +27,7 @@ type KbdProps = {
  * A keyboard key element.
  * @example
  * <Kbd>A</Kbd>
- * <Kbd title='Enter'>{KbdKeys.Enter}</Kbd>
+ * <Kbd>{KbdKeys.Enter}</Kbd>
  */
 export declare const Kbd: PolymorphicForwardRefComponent<"kbd", KbdProps>;
 export {};

package/esm/styles.js

@@ -1,4 +1,4 @@
-const t = '3.19.0';
+const t = '3.19.2';
 const u = new Proxy(
   {},
   {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itwin/itwinui-react",
-  "version": "3.19.0",
+  "version": "3.19.2",
   "author": "Bentley Systems",
   "license": "MIT",
   "type": "module",