@itwin/itwinui-react 3.14.0 → 3.14.2

package/DEV-esm/styles.js

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

package/DEV-esm/utils/functions/dev.js

@@ -5,15 +5,4 @@ let isMocha =
     `${globalThis.beforeEach}`.replace(/\s/g, '');
 let isVitest = void 0 !== globalThis.__vitest_index__;
 let isUnitTest = isJest || isVitest || isMocha;
-let createWarningLogger = isUnitTest
-  ? () => () => {}
-  : () => {
-      let logged = false;
-      return (message) => {
-        if (!logged) {
-          console.warn(message);
-          logged = true;
-        }
-      };
-    };
-export { isUnitTest, createWarningLogger };
+export { isUnitTest };

package/DEV-esm/utils/hooks/index.js

@@ -14,3 +14,4 @@ export * from './useId.js';
 export * from './useControlledState.js';
 export * from './useSyncExternalStore.js';
 export * from './useVirtualScroll.js';
+export * from './useWarningLogger.js';

package/DEV-esm/utils/hooks/useWarningLogger.js

@@ -0,0 +1,31 @@
+import * as React from 'react';
+import { isUnitTest } from '../functions/dev.js';
+let _React = React;
+let ReactInternals = _React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+export const useWarningLogger = isUnitTest
+  ? () => () => {}
+  : function () {
+      let loggedRef = React.useRef(false);
+      let timeoutRef = React.useRef(null);
+      let stack = ReactInternals?.ReactDebugCurrentFrame?.getCurrentStack?.();
+      let componentName = stack?.trim().split('\n')[1]?.trim();
+      let prefix = componentName ? `Warning (${componentName}):` : 'Warning:';
+      let logWarning = React.useCallback(
+        (message) => {
+          timeoutRef.current = window.setTimeout(() => {
+            if (!loggedRef.current) {
+              console.error(prefix, message);
+              loggedRef.current = true;
+            }
+          });
+        },
+        [prefix],
+      );
+      React.useEffect(
+        () => () => {
+          if (timeoutRef.current) window.clearTimeout(timeoutRef.current);
+        },
+        [],
+      );
+      return logWarning;
+    };

package/cjs/core/Breadcrumbs/Breadcrumbs.js

@@ -15,7 +15,6 @@ const _classnames = _interop_require_default._(require('classnames'));
 const _index = require('../../utils/index.js');
 const _Button = require('../Buttons/Button.js');
 const _Anchor = require('../Typography/Anchor.js');
-const logWarning = (0, _index.createWarningLogger)();
 const BreadcrumbsComponent = _react.forwardRef((props, ref) => {
   let {
     children: items,
@@ -108,6 +107,7 @@ const BreadcrumbsComponent = _react.forwardRef((props, ref) => {
 });
 const ListItem = ({ item, isActive }) => {
   let children = item;
+  let logWarning = (0, _index.useWarningLogger)();
   if (
     children?.type === 'span' ||
     children?.type === 'a' ||

package/cjs/core/Buttons/IconButton.js

@@ -17,7 +17,6 @@ const _Tooltip = require('../Tooltip/Tooltip.js');
 const _VisuallyHidden = require('../VisuallyHidden/VisuallyHidden.js');
 const _ButtonGroup = require('../ButtonGroup/ButtonGroup.js');
 const _Popover = require('../Popover/Popover.js');
-const logWarning = (0, _index.createWarningLogger)();
 const IconButton = _react.forwardRef((props, ref) => {
   let {
     isActive,
@@ -35,6 +34,7 @@ const IconButton = _react.forwardRef((props, ref) => {
     _ButtonGroup.ButtonGroupContext,
   );
   let hasPopoverOpen = _react.useContext(_Popover.PopoverOpenContext);
+  let logWarning = (0, _index.useWarningLogger)();
   let button = _react.createElement(
     _index.ButtonBase,
     {

package/cjs/core/Footer/Footer.d.ts

@@ -1,11 +1,11 @@
 import * as React from 'react';
 import type { CommonProps } from '../../utils/index.js';
 export type TitleTranslations = {
-    termsOfService: string;
-    privacy: string;
-    termsOfUse: string;
-    cookies: string;
-    legalNotices: string;
+    termsOfService?: string;
+    privacy?: string;
+    termsOfUse?: string;
+    cookies?: string;
+    legalNotices?: string;
 };
 type FooterProps = {
     /**

package/cjs/core/Footer/Footer.js

@@ -26,7 +26,7 @@ const _FooterItem = require('./FooterItem.js');
 const _FooterSeparator = require('./FooterSeparator.js');
 const _FooterList = require('./FooterList.js');
 const _Anchor = require('../Typography/Anchor.js');
-const footerTranslations = {
+const defaultTranslatedTitles = {
   cookies: 'Cookies',
   legalNotices: 'Legal notices',
   privacy: 'Privacy',
@@ -40,27 +40,27 @@ const defaultFooterElements = [
   },
   {
     key: 'termsOfService',
-    title: footerTranslations.termsOfService,
+    title: defaultTranslatedTitles.termsOfService,
     url: 'https://connect-agreementportal.bentley.com/AgreementApp/Home/Eula/view/readonly/BentleyConnect',
   },
   {
     key: 'privacy',
-    title: footerTranslations.privacy,
+    title: defaultTranslatedTitles.privacy,
     url: 'https://www.bentley.com/en/privacy-policy',
   },
   {
     key: 'termsOfUse',
-    title: footerTranslations.termsOfUse,
+    title: defaultTranslatedTitles.termsOfUse,
     url: 'https://www.bentley.com/en/terms-of-use-and-select-online-agreement',
   },
   {
     key: 'cookies',
-    title: footerTranslations.cookies,
+    title: defaultTranslatedTitles.cookies,
     url: 'https://www.bentley.com/en/cookie-policy',
   },
   {
     key: 'legalNotices',
-    title: footerTranslations.legalNotices,
+    title: defaultTranslatedTitles.legalNotices,
     url: 'https://connect.bentley.com/Legal',
   },
 ];
@@ -69,7 +69,7 @@ const Footer = Object.assign(
     let { children, customElements, translatedTitles, className, ...rest } =
       props;
     let titles = {
-      ...footerTranslations,
+      ...defaultTranslatedTitles,
       ...translatedTitles,
     };
     let translatedElements = defaultFooterElements.map((element) => {

package/cjs/core/Menu/MenuItem.js

@@ -15,7 +15,6 @@ const _index = require('../../utils/index.js');
 const _Menu = require('./Menu.js');
 const _ListItem = require('../List/ListItem.js');
 const _classnames = _interop_require_default._(require('classnames'));
-const logWarning = (0, _index.createWarningLogger)();
 const MenuItem = _react.forwardRef((props, forwardedRef) => {
   let {
     className,
@@ -34,6 +33,7 @@ const MenuItem = _react.forwardRef((props, forwardedRef) => {
     subMenuItems = [],
     ...rest
   } = props;
+  let logWarning = (0, _index.useWarningLogger)();
   let parentMenu = _react.useContext(_Menu.MenuContext);
   let menuItemRef = _react.useRef(null);
   let submenuId = (0, _index.useId)();

package/cjs/core/Popover/Popover.js

@@ -27,7 +27,6 @@ const _classnames = _interop_require_default._(require('classnames'));
 const _react1 = require('@floating-ui/react');
 const _index = require('../../utils/index.js');
 const _Portal = require('../../utils/components/Portal.js');
-const _ThemeProvider = require('../ThemeProvider/ThemeProvider.js');
 const PopoverOpenContext = _react.createContext(void 0);
 const usePopover = (options) => {
   let {
@@ -222,11 +221,9 @@ const Popover = _react.forwardRef((props, forwardedRef) => {
     role: 'dialog',
     middleware,
   });
-  let [popoverElement, setPopoverElement] = _react.useState();
   let popoverRef = (0, _index.useMergedRefs)(
     popover.refs.setFloating,
     forwardedRef,
-    setPopoverElement,
   );
   let triggerId = `${(0, _index.useId)()}-trigger`;
   let hasAriaLabel = !!props['aria-labelledby'] || !!props['aria-label'];
@@ -256,34 +253,27 @@ const Popover = _react.forwardRef((props, forwardedRef) => {
             portal: portal,
           },
           _react.createElement(
-            _ThemeProvider.ThemeProvider,
+            _react1.FloatingFocusManager,
             {
-              portalContainer: popoverElement,
+              context: popover.context,
+              modal: false,
             },
-            _react.createElement(DisplayContents, null),
             _react.createElement(
-              _react1.FloatingFocusManager,
+              _index.Box,
               {
-                context: popover.context,
-                modal: false,
+                className: (0, _classnames.default)(
+                  {
+                    'iui-popover-surface': applyBackground,
+                  },
+                  className,
+                ),
+                'aria-labelledby': hasAriaLabel
+                  ? void 0
+                  : popover.refs.domReference.current?.id,
+                ...popover.getFloatingProps(rest),
+                ref: popoverRef,
               },
-              _react.createElement(
-                _index.Box,
-                {
-                  className: (0, _classnames.default)(
-                    {
-                      'iui-popover-surface': applyBackground,
-                    },
-                    className,
-                  ),
-                  'aria-labelledby': hasAriaLabel
-                    ? void 0
-                    : popover.refs.domReference.current?.id,
-                  ...popover.getFloatingProps(rest),
-                  ref: popoverRef,
-                },
-                content,
-              ),
+              content,
             ),
           ),
         )

package/cjs/core/Table/Table.js

@@ -35,7 +35,6 @@ const singleRowSelectedAction = 'singleRowSelected';
 const shiftRowSelectedAction = 'shiftRowSelected';
 const tableResizeStartAction = 'tableResizeStart';
 const tableResizeEndAction = 'tableResizeEnd';
-const logWarning = (0, _index.createWarningLogger)();
 const flattenColumns = (columns) => {
   let flatColumns = [];
   columns.forEach((column) => {
@@ -282,6 +281,7 @@ const Table = (props) => {
     setGlobalFilter,
   } = instance;
   let headerGroups = _headerGroups;
+  let logWarning = (0, _index.useWarningLogger)();
   if (1 === columns.length && 'columns' in columns[0])
     headerGroups = _headerGroups.slice(1);
   let ariaDataAttributes = Object.entries(rest).reduce(
@@ -510,7 +510,7 @@ const Table = (props) => {
   return _react.createElement(
     _utils.TableColumnsContext.Provider,
     {
-      value: columns,
+      value: instance.columns,
     },
     _react.createElement(
       _index.Box,
@@ -571,7 +571,7 @@ const Table = (props) => {
                 let dragAndDropProps = column.getDragAndDropProps();
                 return _react.createElement(_ColumnHeader.ColumnHeader, {
                   ...dragAndDropProps,
-                  key: dragAndDropProps.key,
+                  key: dragAndDropProps.key || column.id || index,
                   columnRefs: columnRefs,
                   column: column,
                   index: index,

package/cjs/core/Table/cells/DefaultCell.js

@@ -11,17 +11,17 @@ Object.defineProperty(exports, 'DefaultCell', {
 const _interop_require_default = require('@swc/helpers/_/_interop_require_default');
 const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
 const _react = _interop_require_wildcard._(require('react'));
+const _reacttable = require('react-table');
 const _classnames = _interop_require_default._(require('classnames'));
 const _index = require('../../../utils/index.js');
 const _utils = require('../utils.js');
 const DefaultCell = (props) => {
-  let columnsProp = _react.useContext(_utils.TableColumnsContext);
+  let instanceColumns = _react.useContext(_utils.TableColumnsContext);
   let isCustomCell = _react.useMemo(
     () =>
-      columnsProp
-        .find(({ id }) => props.cellProps.column.id === id)
-        ?.hasOwnProperty('Cell'),
-    [props.cellProps.column.id, columnsProp],
+      instanceColumns.find(({ id }) => props.cellProps.column.id === id)
+        ?.Cell !== _reacttable.defaultColumn.Cell,
+    [instanceColumns, props.cellProps.column.id],
   );
   let {
     cellElementProps: {

package/cjs/core/Table/utils.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import type { ColumnInstance, Column } from '../../react-table/react-table.js';
+import type { ColumnInstance } from '../../react-table/react-table.js';
 export declare const getCellStyle: <T extends Record<string, unknown>>(column: ColumnInstance<T>, isTableResizing: boolean) => React.CSSProperties | undefined;
 export declare const getStickyStyle: <T extends Record<string, unknown>>(column: ColumnInstance<T>, columnList: ColumnInstance<T>[]) => React.CSSProperties;
 export declare const getSubRowStyle: ({ density, depth }: {
@@ -8,4 +8,4 @@ export declare const getSubRowStyle: ({ density, depth }: {
 }) => {
     paddingInlineStart: number;
 };
-export declare const TableColumnsContext: React.Context<Column<Record<string, unknown>>[]>;
+export declare const TableColumnsContext: React.Context<ColumnInstance<{}>[]>;

package/cjs/core/ThemeProvider/ThemeProvider.js

@@ -246,7 +246,7 @@ const FallbackStyles = ({ root }) => {
       } catch (error) {
         console.log('Error loading styles.css locally', error);
         let css = await (0, _index.importCss)(
-          'https://cdn.jsdelivr.net/npm/@itwin/itwinui-react@3/styles.css',
+          `https://cdn.jsdelivr.net/npm/@itwin/itwinui-react@${_meta.meta.version}/styles.css`,
         );
         document.adoptedStyleSheets = [
           ...document.adoptedStyleSheets,

package/cjs/styles.js

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

package/cjs/utils/functions/dev.d.ts

@@ -1,17 +1,2 @@
 declare const isUnitTest: boolean;
-/**
- * Returns a function that can be used to log one-time warnings in dev environments.
- *
- * **Note**: The actual log call should be wrapped in a check against `process.env.NODE_ENV === 'development'`
- * to ensure that it is removed from the production build output (by SWC).
- * Read more about the [`NODE_ENV` convention](https://nodejs.org/en/learn/getting-started/nodejs-the-difference-between-development-and-production).
- *
- * @example
- * const logWarning = createWarningLogger();
- *
- * if (process.env.NODE_ENV === 'development') {
- *   logWarning("please don't use this")
- * }
- */
-declare const createWarningLogger: () => (message: string) => void;
-export { isUnitTest, createWarningLogger };
+export { isUnitTest };

package/cjs/utils/functions/dev.js

@@ -2,18 +2,9 @@
 Object.defineProperty(exports, '__esModule', {
   value: true,
 });
-function _export(target, all) {
-  for (var name in all)
-    Object.defineProperty(target, name, {
-      enumerable: true,
-      get: all[name],
-    });
-}
-_export(exports, {
-  createWarningLogger: function () {
-    return createWarningLogger;
-  },
-  isUnitTest: function () {
+Object.defineProperty(exports, 'isUnitTest', {
+  enumerable: true,
+  get: function () {
     return isUnitTest;
   },
 });
@@ -24,4 +15,3 @@ const isMocha =
     `${globalThis.beforeEach}`.replace(/\s/g, '');
 const isVitest = void 0 !== globalThis.__vitest_index__;
 const isUnitTest = isJest || isVitest || isMocha;
-const createWarningLogger = () => () => {};

package/cjs/utils/hooks/index.d.ts

@@ -14,3 +14,4 @@ export * from './useId.js';
 export * from './useControlledState.js';
 export * from './useSyncExternalStore.js';
 export * from './useVirtualScroll.js';
+export * from './useWarningLogger.js';

package/cjs/utils/hooks/index.js

@@ -19,3 +19,4 @@ _export_star._(require('./useId.js'), exports);
 _export_star._(require('./useControlledState.js'), exports);
 _export_star._(require('./useSyncExternalStore.js'), exports);
 _export_star._(require('./useVirtualScroll.js'), exports);
+_export_star._(require('./useWarningLogger.js'), exports);

package/cjs/utils/hooks/useWarningLogger.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Returns a function that can be used to log one-time warnings in dev environments.
+ *
+ * **Note**: The actual log call should be wrapped in a check against `process.env.NODE_ENV === 'development'`
+ * to ensure that it is removed from the production build output (by SWC).
+ * Read more about the [`NODE_ENV` convention](https://nodejs.org/en/learn/getting-started/nodejs-the-difference-between-development-and-production).
+ *
+ * @example
+ * const logWarning = useWarningLogger();
+ *
+ * if (process.env.NODE_ENV === 'development') {
+ *   logWarning("please don't use this")
+ * }
+ */
+export declare const useWarningLogger: () => (message: string) => void;

package/cjs/utils/hooks/useWarningLogger.js

@@ -0,0 +1,17 @@
+'use strict';
+Object.defineProperty(exports, '__esModule', {
+  value: true,
+});
+Object.defineProperty(exports, 'useWarningLogger', {
+  enumerable: true,
+  get: function () {
+    return useWarningLogger;
+  },
+});
+const _interop_require_wildcard = require('@swc/helpers/_/_interop_require_wildcard');
+const _react = _interop_require_wildcard._(require('react'));
+const _dev = require('../functions/dev.js');
+const _React = _react;
+const ReactInternals =
+  _React.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+const useWarningLogger = () => () => {};

package/esm/core/Breadcrumbs/Breadcrumbs.js

@@ -5,11 +5,10 @@ import {
   useOverflow,
   SvgChevronRight,
   Box,
-  createWarningLogger,
+  useWarningLogger,
 } from '../../utils/index.js';
 import { Button } from '../Buttons/Button.js';
 import { Anchor } from '../Typography/Anchor.js';
-let logWarning = createWarningLogger();
 let BreadcrumbsComponent = React.forwardRef((props, ref) => {
   let {
     children: items,
@@ -102,6 +101,7 @@ let BreadcrumbsComponent = React.forwardRef((props, ref) => {
 });
 let ListItem = ({ item, isActive }) => {
   let children = item;
+  let logWarning = useWarningLogger();
   if (
     children?.type === 'span' ||
     children?.type === 'a' ||

package/esm/core/Buttons/IconButton.js

@@ -1,11 +1,10 @@
 import cx from 'classnames';
 import * as React from 'react';
-import { Box, ButtonBase, createWarningLogger } from '../../utils/index.js';
+import { Box, ButtonBase, useWarningLogger } from '../../utils/index.js';
 import { Tooltip } from '../Tooltip/Tooltip.js';
 import { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden.js';
 import { ButtonGroupContext } from '../ButtonGroup/ButtonGroup.js';
 import { PopoverOpenContext } from '../Popover/Popover.js';
-let logWarning = createWarningLogger();
 export const IconButton = React.forwardRef((props, ref) => {
   let {
     isActive,
@@ -21,6 +20,7 @@ export const IconButton = React.forwardRef((props, ref) => {
   } = props;
   let buttonGroupOrientation = React.useContext(ButtonGroupContext);
   let hasPopoverOpen = React.useContext(PopoverOpenContext);
+  let logWarning = useWarningLogger();
   let button = React.createElement(
     ButtonBase,
     {

package/esm/core/Footer/Footer.d.ts

@@ -1,11 +1,11 @@
 import * as React from 'react';
 import type { CommonProps } from '../../utils/index.js';
 export type TitleTranslations = {
-    termsOfService: string;
-    privacy: string;
-    termsOfUse: string;
-    cookies: string;
-    legalNotices: string;
+    termsOfService?: string;
+    privacy?: string;
+    termsOfUse?: string;
+    cookies?: string;
+    legalNotices?: string;
 };
 type FooterProps = {
     /**

package/esm/core/Footer/Footer.js

@@ -5,7 +5,7 @@ import { FooterItem } from './FooterItem.js';
 import { FooterSeparator } from './FooterSeparator.js';
 import { FooterList } from './FooterList.js';
 import { Anchor } from '../Typography/Anchor.js';
-let footerTranslations = {
+let defaultTranslatedTitles = {
   cookies: 'Cookies',
   legalNotices: 'Legal notices',
   privacy: 'Privacy',
@@ -19,27 +19,27 @@ export const defaultFooterElements = [
   },
   {
     key: 'termsOfService',
-    title: footerTranslations.termsOfService,
+    title: defaultTranslatedTitles.termsOfService,
     url: 'https://connect-agreementportal.bentley.com/AgreementApp/Home/Eula/view/readonly/BentleyConnect',
   },
   {
     key: 'privacy',
-    title: footerTranslations.privacy,
+    title: defaultTranslatedTitles.privacy,
     url: 'https://www.bentley.com/en/privacy-policy',
   },
   {
     key: 'termsOfUse',
-    title: footerTranslations.termsOfUse,
+    title: defaultTranslatedTitles.termsOfUse,
     url: 'https://www.bentley.com/en/terms-of-use-and-select-online-agreement',
   },
   {
     key: 'cookies',
-    title: footerTranslations.cookies,
+    title: defaultTranslatedTitles.cookies,
     url: 'https://www.bentley.com/en/cookie-policy',
   },
   {
     key: 'legalNotices',
-    title: footerTranslations.legalNotices,
+    title: defaultTranslatedTitles.legalNotices,
     url: 'https://connect.bentley.com/Legal',
   },
 ];
@@ -48,7 +48,7 @@ export const Footer = Object.assign(
     let { children, customElements, translatedTitles, className, ...rest } =
       props;
     let titles = {
-      ...footerTranslations,
+      ...defaultTranslatedTitles,
       ...translatedTitles,
     };
     let translatedElements = defaultFooterElements.map((element) => {

package/esm/core/Menu/MenuItem.js

@@ -3,12 +3,11 @@ import {
   SvgCaretRightSmall,
   useMergedRefs,
   useId,
-  createWarningLogger,
+  useWarningLogger,
 } from '../../utils/index.js';
 import { Menu, MenuContext } from './Menu.js';
 import { ListItem } from '../List/ListItem.js';
 import cx from 'classnames';
-let logWarning = createWarningLogger();
 export const MenuItem = React.forwardRef((props, forwardedRef) => {
   let {
     className,
@@ -27,6 +26,7 @@ export const MenuItem = React.forwardRef((props, forwardedRef) => {
     subMenuItems = [],
     ...rest
   } = props;
+  let logWarning = useWarningLogger();
   let parentMenu = React.useContext(MenuContext);
   let menuItemRef = React.useRef(null);
   let submenuId = useId();

package/esm/core/Popover/Popover.js

@@ -32,7 +32,6 @@ import {
   useMergedRefs,
 } from '../../utils/index.js';
 import { usePortalTo } from '../../utils/components/Portal.js';
-import { ThemeProvider } from '../ThemeProvider/ThemeProvider.js';
 export const PopoverOpenContext = React.createContext(void 0);
 export const usePopover = (options) => {
   let {
@@ -224,12 +223,7 @@ export const Popover = React.forwardRef((props, forwardedRef) => {
     role: 'dialog',
     middleware,
   });
-  let [popoverElement, setPopoverElement] = React.useState();
-  let popoverRef = useMergedRefs(
-    popover.refs.setFloating,
-    forwardedRef,
-    setPopoverElement,
-  );
+  let popoverRef = useMergedRefs(popover.refs.setFloating, forwardedRef);
   let triggerId = `${useId()}-trigger`;
   let hasAriaLabel = !!props['aria-labelledby'] || !!props['aria-label'];
   useLayoutEffect(() => {
@@ -258,34 +252,27 @@ export const Popover = React.forwardRef((props, forwardedRef) => {
             portal: portal,
           },
           React.createElement(
-            ThemeProvider,
+            FloatingFocusManager,
             {
-              portalContainer: popoverElement,
+              context: popover.context,
+              modal: false,
             },
-            React.createElement(DisplayContents, null),
             React.createElement(
-              FloatingFocusManager,
+              Box,
               {
-                context: popover.context,
-                modal: false,
+                className: cx(
+                  {
+                    'iui-popover-surface': applyBackground,
+                  },
+                  className,
+                ),
+                'aria-labelledby': hasAriaLabel
+                  ? void 0
+                  : popover.refs.domReference.current?.id,
+                ...popover.getFloatingProps(rest),
+                ref: popoverRef,
               },
-              React.createElement(
-                Box,
-                {
-                  className: cx(
-                    {
-                      'iui-popover-surface': applyBackground,
-                    },
-                    className,
-                  ),
-                  'aria-labelledby': hasAriaLabel
-                    ? void 0
-                    : popover.refs.domReference.current?.id,
-                  ...popover.getFloatingProps(rest),
-                  ref: popoverRef,
-                },
-                content,
-              ),
+              content,
             ),
           ),
         )