@itwin/itwinui-react 1.20.0 → 1.21.0

package/esm/core/Header/Header.js

@@ -28,7 +28,7 @@ import SvgMoreVertical from '@itwin/itwinui-icons-react/cjs/icons/MoreVertical';
 import cx from 'classnames';
 import React from 'react';
 import { IconButton } from '../Buttons';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useTheme } from '../utils';
 import '@itwin/itwinui-css/css/header.css';
 import { DropdownMenu } from '../DropdownMenu';
 var defaultTranslations = {

package/esm/core/Header/HeaderBreadcrumbs.js

@@ -35,7 +35,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
  *--------------------------------------------------------------------------------------------*/
 import SvgChevronRight from '@itwin/itwinui-icons-react/cjs/icons/ChevronRight';
 import React from 'react';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useTheme } from '../utils';
 import '@itwin/itwinui-css/css/header.css';
 /**
  * Header breadcrumbs, adds chevron between each provided items.

package/esm/core/Header/HeaderButton.js

@@ -27,7 +27,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import cx from 'classnames';
 import React from 'react';
 import { Button, DropdownButton, SplitButton, } from '../Buttons';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useTheme } from '../utils';
 import '@itwin/itwinui-css/css/header.css';
 var isSplitButton = function (props) {
     return !!props.menuItems && !!props.onClick;

package/esm/core/Header/HeaderLogo.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
+import { CommonProps } from '../utils';
 import '@itwin/itwinui-css/css/header.css';
-import { CommonProps } from '../utils/props';
 export declare type HeaderLogoProps = {
     /**
      * Logo shown before the main content.

package/esm/core/Header/HeaderLogo.js

@@ -26,7 +26,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import cx from 'classnames';
 import React from 'react';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useTheme } from '../utils';
 import '@itwin/itwinui-css/css/header.css';
 /**
  * Header Title section

package/esm/core/Input/Input.js

@@ -26,8 +26,7 @@ var __rest = (this && this.__rest) || function (s, e) {
  *--------------------------------------------------------------------------------------------*/
 import cx from 'classnames';
 import React from 'react';
-import { useMergedRefs } from '../utils/hooks/useMergedRefs';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useMergedRefs, useTheme } from '../utils';
 import '@itwin/itwinui-css/css/inputs.css';
 /**
  * Basic input component

package/esm/core/InputGroup/InputGroup.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { CommonProps } from '../utils/props';
+import { CommonProps } from '../utils';
 import '@itwin/itwinui-css/css/inputs.css';
 export declare type InputGroupProps = {
     /**

package/esm/core/InputGroup/InputGroup.js

@@ -25,9 +25,7 @@ var __rest = (this && this.__rest) || function (s, e) {
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
-import { StatusIconMap } from '../utils/common';
-import { useTheme } from '../utils/hooks/useTheme';
-import { InputContainer } from '../utils/InputContainer';
+import { StatusIconMap, useTheme, InputContainer } from '../utils';
 import '@itwin/itwinui-css/css/inputs.css';
 /**
  * Group Checkbox/Radio components together

package/esm/core/LabeledInput/LabeledInput.js

@@ -26,9 +26,7 @@ var __rest = (this && this.__rest) || function (s, e) {
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
 import { Input } from '../Input/Input';
-import { StatusIconMap } from '../utils/common';
-import { useTheme } from '../utils/hooks/useTheme';
-import { InputContainer } from '../utils/InputContainer';
+import { StatusIconMap, useTheme, InputContainer } from '../utils';
 import '@itwin/itwinui-css/css/inputs.css';
 /**
  * Basic labeled input component

package/esm/core/LabeledSelect/LabeledSelect.js

@@ -26,9 +26,7 @@ var __rest = (this && this.__rest) || function (s, e) {
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
 import { Select } from '../Select';
-import { StatusIconMap } from '../utils/common';
-import { useTheme } from '../utils/hooks/useTheme';
-import { InputContainer } from '../utils/InputContainer';
+import { StatusIconMap, useTheme, InputContainer } from '../utils';
 import '@itwin/itwinui-css/css/inputs.css';
 /**
  * Labeled select component to select value from options.

package/esm/core/LabeledTextarea/LabeledTextarea.js

@@ -25,10 +25,8 @@ var __rest = (this && this.__rest) || function (s, e) {
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
-import { StatusIconMap } from '../utils/common';
+import { StatusIconMap, useTheme, InputContainer } from '../utils';
 import { Textarea } from '../Textarea';
-import { useTheme } from '../utils/hooks/useTheme';
-import { InputContainer } from '../utils/InputContainer';
 import '@itwin/itwinui-css/css/inputs.css';
 /**
  * Textarea wrapper that allows for additional styling and labelling

package/esm/core/Menu/Menu.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { CommonProps } from '../utils/props';
+import { CommonProps } from '../utils';
 import '@itwin/itwinui-css/css/menu.css';
 export declare type MenuProps = {
     /**
@@ -14,6 +14,11 @@ export declare type MenuProps = {
      * and selected item should have `aria-selected={true}`.
      */
     children: React.ReactNode;
+    /**
+     * If true, the first selected or enabled menu item will be focused automatically.
+     * @default true
+     */
+    setFocus?: boolean;
 } & Omit<CommonProps, 'title'>;
 /**
  * Basic menu component. Can be used for select or dropdown components.
@@ -31,5 +36,10 @@ export declare const Menu: React.ForwardRefExoticComponent<{
      * and selected item should have `aria-selected={true}`.
      */
     children: React.ReactNode;
+    /**
+     * If true, the first selected or enabled menu item will be focused automatically.
+     * @default true
+     */
+    setFocus?: boolean | undefined;
 } & Omit<CommonProps, "title"> & React.RefAttributes<HTMLUListElement>>;
 export default Menu;

package/esm/core/Menu/Menu.js

@@ -26,17 +26,15 @@ var __rest = (this && this.__rest) || function (s, e) {
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
 import cx from 'classnames';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useTheme, useMergedRefs, getFocusableElements, } from '../utils';
 import '@itwin/itwinui-css/css/menu.css';
-import { useMergedRefs } from '../utils/hooks/useMergedRefs';
-import { getFocusableElements } from '../utils/common';
 /**
  * Basic menu component. Can be used for select or dropdown components.
  */
 export var Menu = React.forwardRef(function (props, ref) {
-    var children = props.children, _a = props.role, role = _a === void 0 ? 'menu' : _a, className = props.className, style = props.style, rest = __rest(props, ["children", "role", "className", "style"]);
+    var children = props.children, _a = props.role, role = _a === void 0 ? 'menu' : _a, _b = props.setFocus, setFocus = _b === void 0 ? true : _b, className = props.className, style = props.style, rest = __rest(props, ["children", "role", "setFocus", "className", "style"]);
     useTheme();
-    var _b = React.useState(), focusedIndex = _b[0], setFocusedIndex = _b[1];
+    var _c = React.useState(), focusedIndex = _c[0], setFocusedIndex = _c[1];
     var menuRef = React.useRef(null);
     var refs = useMergedRefs(menuRef, ref);
     React.useEffect(function () {
@@ -47,8 +45,10 @@ export var Menu = React.forwardRef(function (props, ref) {
             return;
         }
         var selectedIndex = items.findIndex(function (el) { return el.getAttribute('aria-selected') === 'true'; });
-        setFocusedIndex(selectedIndex > -1 ? selectedIndex : 0);
-    }, [focusedIndex]);
+        if (setFocus) {
+            setFocusedIndex(selectedIndex > -1 ? selectedIndex : 0);
+        }
+    }, [setFocus, focusedIndex]);
     React.useEffect(function () {
         setFocusedIndex(null);
     }, [children]);

package/esm/core/Menu/MenuDivider.js

@@ -3,7 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useTheme } from '../utils';
 import '@itwin/itwinui-css/css/menu.css';
 export var MenuDivider = function () {
     useTheme();

package/esm/core/Menu/MenuItem.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { CommonProps } from '../utils/props';
+import { CommonProps } from '../utils';
 import '@itwin/itwinui-css/css/menu.css';
 export declare type MenuItemProps = {
     /**
@@ -108,5 +108,5 @@ export declare const MenuItem: React.ForwardRefExoticComponent<{
     id?: string | undefined;
 } & {
     style?: React.CSSProperties | undefined;
-} & import("../utils/props").ClassNameProps & React.RefAttributes<HTMLLIElement>>;
+} & import("../utils").ClassNameProps & React.RefAttributes<HTMLLIElement>>;
 export default MenuItem;

package/esm/core/Menu/MenuItem.js

@@ -26,12 +26,10 @@ var __rest = (this && this.__rest) || function (s, e) {
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
 import cx from 'classnames';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useTheme, Popover, useMergedRefs } from '../utils';
 import '@itwin/itwinui-css/css/menu.css';
 import SvgCaretRightSmall from '@itwin/itwinui-icons-react/cjs/icons/CaretRightSmall';
-import { Popover } from '../utils/Popover';
 import { Menu } from './Menu';
-import { useMergedRefs } from '../utils/hooks/useMergedRefs';
 /**
  * Context used to provide menu item ref to sub-menu items.
  */
@@ -82,7 +80,7 @@ export var MenuItem = React.forwardRef(function (props, ref) {
             'iui-large': size === 'large',
             'iui-active': isSelected,
             'iui-disabled': disabled,
-        }, className), onClick: function () { return !disabled && (onClick === null || onClick === void 0 ? void 0 : onClick(value)); }, ref: refs, style: style, role: role, tabIndex: disabled ? undefined : -1, "aria-selected": isSelected, "aria-haspopup": subMenuItems.length > 0, "aria-disabled": disabled, onKeyDown: onKeyDown, onMouseEnter: function () { return setIsSubmenuVisible(true); }, onMouseLeave: function (e) {
+        }, className), onClick: function () { return !disabled && (onClick === null || onClick === void 0 ? void 0 : onClick(value)); }, ref: refs, style: style, role: role, tabIndex: disabled || role === 'presentation' ? undefined : -1, "aria-selected": isSelected, "aria-haspopup": subMenuItems.length > 0, "aria-disabled": disabled, onKeyDown: onKeyDown, onMouseEnter: function () { return setIsSubmenuVisible(true); }, onMouseLeave: function (e) {
             var _a;
             if (!(e.relatedTarget instanceof Node) ||
                 !((_a = subMenuRef.current) === null || _a === void 0 ? void 0 : _a.contains(e.relatedTarget))) {

package/esm/core/Modal/Modal.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { CommonProps } from '../utils/props';
+import { CommonProps } from '../utils';
 import '@itwin/itwinui-css/css/modal.css';
 export declare type ModalProps = {
     /**

package/esm/core/Modal/Modal.js

@@ -28,11 +28,9 @@ import React from 'react';
 import ReactDOM from 'react-dom';
 import cx from 'classnames';
 import SvgClose from '@itwin/itwinui-icons-react/cjs/icons/Close';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useTheme, getContainer, getDocument, FocusTrap, } from '../utils';
 import '@itwin/itwinui-css/css/modal.css';
 import { IconButton } from '../Buttons/IconButton';
-import { getContainer, getDocument } from '../utils/common';
-import FocusTrap from '../utils/FocusTrap';
 /**
  * Modal component which can wrap any content.
  * @example

package/esm/core/Modal/ModalButtonBar.js

@@ -25,7 +25,7 @@ var __rest = (this && this.__rest) || function (s, e) {
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useTheme } from '../utils';
 import '@itwin/itwinui-css/css/modal.css';
 /**
  * Container for Buttons in modal.

package/esm/core/ProgressIndicators/ProgressLinear/ProgressLinear.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { CommonProps } from '../../utils/props';
+import { CommonProps } from '../../utils';
 import '@itwin/itwinui-css/css/progress-indicator.css';
 export declare type ProgressLinearProps = {
     /**

package/esm/core/ProgressIndicators/ProgressLinear/ProgressLinear.js

@@ -26,7 +26,7 @@ var __rest = (this && this.__rest) || function (s, e) {
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
 import cx from 'classnames';
-import { useTheme } from '../../utils/hooks/useTheme';
+import { useTheme } from '../../utils';
 import '@itwin/itwinui-css/css/progress-indicator.css';
 /**
  * Shows progress on a linear bar

package/esm/core/ProgressIndicators/ProgressRadial/ProgressRadial.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { CommonProps } from '../../utils/props';
+import { CommonProps } from '../../utils';
 import '@itwin/itwinui-css/css/progress-indicator.css';
 export declare type ProgressRadialProps = {
     /**

package/esm/core/ProgressIndicators/ProgressRadial/ProgressRadial.js

@@ -28,7 +28,7 @@ import Positive from '@itwin/itwinui-icons-react/cjs/icons/CheckmarkSmall';
 import Negative from '@itwin/itwinui-icons-react/cjs/icons/ImportantSmall';
 import cx from 'classnames';
 import React from 'react';
-import { useTheme } from '../../utils/hooks/useTheme';
+import { useTheme } from '../../utils';
 import '@itwin/itwinui-css/css/progress-indicator.css';
 /**
  * Circular Progress Indicator

package/esm/core/Radio/Radio.js

@@ -26,8 +26,7 @@ var __rest = (this && this.__rest) || function (s, e) {
  *--------------------------------------------------------------------------------------------*/
 import cx from 'classnames';
 import React from 'react';
-import { useMergedRefs } from '../utils/hooks/useMergedRefs';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useMergedRefs, useTheme } from '../utils';
 import '@itwin/itwinui-css/css/inputs.css';
 /**
  * Basic radio input component

package/esm/core/RadioTiles/RadioTile.js

@@ -27,8 +27,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import SvgCheckmark from '@itwin/itwinui-icons-react/cjs/icons/Checkmark';
 import cx from 'classnames';
 import React from 'react';
-import { useMergedRefs } from '../utils/hooks/useMergedRefs';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useMergedRefs, useTheme } from '../utils';
 import '@itwin/itwinui-css/css/inputs.css';
 /**
  * RadioTile component to be used in RadioTileGroup component

package/esm/core/RadioTiles/RadioTileGroup.js

@@ -27,7 +27,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import React from 'react';
 import { InputGroup } from '../InputGroup';
 import '@itwin/itwinui-css/css/inputs.css';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useTheme } from '../utils';
 /**
  * RadioTileGroup component to group RadioTile components together
  * @example

package/esm/core/Select/Select.d.ts

@@ -1,6 +1,5 @@
 import React from 'react';
-import { PopoverProps } from '../utils/Popover';
-import { CommonProps } from '../utils/props';
+import { PopoverProps, CommonProps } from '../utils';
 import '@itwin/itwinui-css/css/inputs.css';
 export declare type ItemRendererProps = {
     /**

package/esm/core/Select/Select.js

@@ -27,8 +27,8 @@ var __rest = (this && this.__rest) || function (s, e) {
 import React from 'react';
 import cx from 'classnames';
 import { DropdownMenu } from '../DropdownMenu';
-import MenuItem from '../Menu/MenuItem';
-import { useTheme } from '../utils/hooks/useTheme';
+import { MenuItem } from '../Menu/MenuItem';
+import { useTheme } from '../utils';
 import '@itwin/itwinui-css/css/inputs.css';
 /**
  * Select component to select value from options.

package/esm/core/SideNavigation/SideNavigation.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { CommonProps } from '../utils/props';
+import { CommonProps } from '../utils';
 import '@itwin/itwinui-css/css/side-navigation.css';
 export declare type SideNavigationProps = {
     /**

package/esm/core/SideNavigation/SideNavigation.js

@@ -26,7 +26,7 @@ var __rest = (this && this.__rest) || function (s, e) {
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
 import cx from 'classnames';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useTheme } from '../utils';
 import SvgChevronRight from '@itwin/itwinui-icons-react/cjs/icons/ChevronRight';
 import { IconButton } from '../Buttons';
 import { Tooltip } from '../Tooltip';

package/esm/core/SideNavigation/SidenavButton.js

@@ -26,7 +26,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import cx from 'classnames';
 import React from 'react';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useTheme } from '../utils';
 import { Button } from '../Buttons';
 import '@itwin/itwinui-css/css/side-navigation.css';
 /**

package/esm/core/Slider/Slider.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
+import { CommonProps } from '../utils';
 import '@itwin/itwinui-css/css/slider.css';
 import { TooltipProps } from '../Tooltip';
-import { CommonProps } from '../utils/props';
 /**
  * Determines which segments are shown with color.
  */

package/esm/core/Slider/Slider.js

@@ -35,10 +35,8 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
  *--------------------------------------------------------------------------------------------*/
 import cx from 'classnames';
 import React from 'react';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useTheme, getBoundedValue, useEventListener, } from '../utils';
 import '@itwin/itwinui-css/css/slider.css';
-import { getBoundedValue } from '../utils/common';
-import { useEventListener } from '../utils/hooks/useEventListener';
 import { Track } from './Track';
 import { Thumb } from './Thumb';
 var getPercentageOfRectangle = function (rect, pointer) {

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { CellProps, TableOptions, Row, TableState } from 'react-table';
+import { CommonProps } from '../utils';
 import '@itwin/itwinui-css/css/table.css';
-import { CommonProps } from '../utils/props';
 import { TableFilterValue } from './filters';
 /**
  * Table props.

package/esm/core/Table/Table.js

@@ -28,7 +28,7 @@ import React from 'react';
 import cx from 'classnames';
 import { actions as TableActions, useFlexLayout, useFilters, useRowSelect, useSortBy, useTable, useExpanded, } from 'react-table';
 import { ProgressRadial } from '../ProgressIndicators';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useTheme } from '../utils';
 import '@itwin/itwinui-css/css/table.css';
 import SvgSortDown from '@itwin/itwinui-icons-react/cjs/icons/SortDown';
 import SvgSortUp from '@itwin/itwinui-icons-react/cjs/icons/SortUp';

package/esm/core/Table/TableRowMemoized.js

@@ -15,9 +15,8 @@ var __assign = (this && this.__assign) || function () {
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
 import cx from 'classnames';
-import { useIntersection } from '../utils/hooks/useIntersection';
+import { useIntersection, useMergedRefs } from '../utils';
 import { CSSTransition } from 'react-transition-group';
-import { useMergedRefs } from '../utils/hooks/useMergedRefs';
 import { TableCell } from './TableCell';
 /**
  * Memoization is needed to avoid unnecessary re-renders of all rows when additional data is added when lazy-loading.

package/esm/core/Table/filters/BaseFilter.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import '@itwin/itwinui-css/css/table.css';
-import { CommonProps } from '../../utils/props';
+import { CommonProps } from '../../utils';
 export declare type BaseFilterProps = {
     /**
      * Filter body.

package/esm/core/Table/filters/BaseFilter.js

@@ -5,7 +5,7 @@
 import React from 'react';
 import cx from 'classnames';
 import '@itwin/itwinui-css/css/table.css';
-import { useTheme } from '../../utils/hooks/useTheme';
+import { useTheme } from '../../utils';
 /**
  * Filter wrapper that should be used when creating custom filters.
  * @example

package/esm/core/Table/filters/DateRangeFilter/DatePickerInput.js

@@ -26,7 +26,7 @@ var __rest = (this && this.__rest) || function (s, e) {
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
 import SvgCalendar from '@itwin/itwinui-icons-react/cjs/icons/Calendar';
-import { Popover } from '../../../utils/Popover';
+import { Popover } from '../../../utils';
 import { LabeledInput } from '../../../LabeledInput';
 import { DatePicker } from '../../../DatePicker';
 import { IconButton } from '../../../Buttons';

package/esm/core/Table/filters/DateRangeFilter/DateRangeFilter.js

@@ -14,7 +14,7 @@ var __assign = (this && this.__assign) || function () {
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
-import { useTheme } from '../../../utils/hooks/useTheme';
+import { useTheme } from '../../../utils';
 import { FilterButtonBar, } from '../FilterButtonBar';
 import { BaseFilter } from '../BaseFilter';
 import '@itwin/itwinui-css/css/table.css';

package/esm/core/Table/filters/FilterButtonBar.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import '@itwin/itwinui-css/css/table.css';
-import { CommonProps } from '../../utils/props';
+import { CommonProps } from '../../utils';
 export declare type FilterButtonBarTranslation = {
     filter: string;
     clear: string;

package/esm/core/Table/filters/FilterButtonBar.js

@@ -16,7 +16,7 @@ var __assign = (this && this.__assign) || function () {
 import React from 'react';
 import cx from 'classnames';
 import '@itwin/itwinui-css/css/table.css';
-import { useTheme } from '../../utils/hooks/useTheme';
+import { useTheme } from '../../utils';
 import { Button } from '../../Buttons';
 var defaultStrings = {
     filter: 'Filter',

package/esm/core/Table/filters/FilterToggle.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 import { HeaderGroup } from 'react-table';
 import '@itwin/itwinui-css/css/table.css';
-import { StylingProps } from '../../utils/props';
+import { StylingProps } from '../../utils';
 export declare type FilterToggleProps<T extends Record<string, unknown>> = {
     column: HeaderGroup<T>;
     ownerDocument?: Document;

package/esm/core/Table/filters/FilterToggle.js

@@ -29,9 +29,7 @@ import SvgFilter from '@itwin/itwinui-icons-react/cjs/icons/Filter';
 import React from 'react';
 import cx from 'classnames';
 import '@itwin/itwinui-css/css/table.css';
-import { useTheme } from '../../utils/hooks/useTheme';
-import { Popover } from '../../utils/Popover';
-import { getDocument } from '../../utils/common';
+import { useTheme, Popover, getDocument } from '../../utils';
 import { IconButton } from '../../Buttons';
 /**
  * Handles showing filter icon and opening filter component.

package/esm/core/Table/filters/NumberRangeFilter/NumberRangeFilter.js

@@ -14,7 +14,7 @@ var __assign = (this && this.__assign) || function () {
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
-import { useTheme } from '../../../utils/hooks/useTheme';
+import { useTheme } from '../../../utils';
 import { FilterButtonBar, } from '../FilterButtonBar';
 import { BaseFilter } from '../BaseFilter';
 import '@itwin/itwinui-css/css/table.css';

package/esm/core/Table/filters/TextFilter/TextFilter.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
 import '@itwin/itwinui-css/css/table.css';
-import { useTheme } from '../../../utils/hooks/useTheme';
+import { useTheme } from '../../../utils';
 import { Input } from '../../../Input';
 import { FilterButtonBar, } from '../FilterButtonBar';
 import { BaseFilter } from '../BaseFilter';

package/esm/core/Tabs/Tab.js

@@ -26,7 +26,7 @@ var __rest = (this && this.__rest) || function (s, e) {
  *--------------------------------------------------------------------------------------------*/
 import cx from 'classnames';
 import React from 'react';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useTheme } from '../utils';
 import '@itwin/itwinui-css/css/tabs.css';
 /**
  * Individual tab component to be used in the `labels` prop of `Tabs`.

package/esm/core/Tabs/Tabs.js

@@ -26,12 +26,9 @@ var __rest = (this && this.__rest) || function (s, e) {
  *--------------------------------------------------------------------------------------------*/
 import cx from 'classnames';
 import React from 'react';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useTheme, useResizeObserver, useMergedRefs, getBoundedValue, } from '../utils';
 import '@itwin/itwinui-css/css/tabs.css';
-import { useResizeObserver } from '../utils/hooks/useResizeObserver';
-import { useMergedRefs } from '../utils/hooks/useMergedRefs';
 import { Tab } from './Tab';
-import { getBoundedValue } from '../utils/common';
 /**
  * Tabs organize and allow navigation between groups of content that are related and at the same level of hierarchy.
  * @example

package/esm/core/Tag/Tag.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
+import { CommonProps } from '../utils';
 import '@itwin/itwinui-css/css/tag.css';
-import { CommonProps } from '../utils/props';
 export declare type TagProps = {
     /**
      * Callback function that handles click on close icon.

package/esm/core/Tag/Tag.js

@@ -27,7 +27,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import cx from 'classnames';
 import React from 'react';
 import SvgCloseSmall from '@itwin/itwinui-icons-react/cjs/icons/CloseSmall';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useTheme } from '../utils';
 import '@itwin/itwinui-css/css/tag.css';
 import { IconButton } from '../Buttons';
 /**

package/esm/core/Tag/TagContainer.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
+import { CommonProps } from '../utils';
 import '@itwin/itwinui-css/css/tag.css';
-import { CommonProps } from '../utils/props';
 export declare type TagContainerProps = {
     /**
      * Tags inside the container.

package/esm/core/Tag/TagContainer.js

@@ -26,7 +26,7 @@ var __rest = (this && this.__rest) || function (s, e) {
  *--------------------------------------------------------------------------------------------*/
 import React from 'react';
 import cx from 'classnames';
-import { useTheme } from '../utils/hooks/useTheme';
+import { useTheme } from '../utils';
 import '@itwin/itwinui-css/css/tag.css';
 /**
  * TagContainer for grouping tags.