@itwin/itwinui-react 3.0.0-dev.9 → 3.0.0

package/esm/core/ComboBox/ComboBoxInput.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Input } from '../Input/index.js';
+import { Input } from '../Input/Input.js';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
 type ComboBoxInputProps = {
     selectTags?: JSX.Element[];

package/esm/core/ComboBox/ComboBoxInput.js

@@ -3,7 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
-import { Input } from '../Input/index.js';
+import { Input } from '../Input/Input.js';
 import {
   useSafeContext,
   useMergedRefs,

package/esm/core/ComboBox/ComboBoxInputContainer.js

@@ -3,7 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
-import { StatusMessage } from '../StatusMessage/index.js';
+import { StatusMessage } from '../StatusMessage/StatusMessage.js';
 import { InputContainer, useSafeContext, Box } from '../utils/index.js';
 import { ComboBoxStateContext } from './helpers.js';
 export const ComboBoxInputContainer = React.forwardRef(

package/esm/core/ComboBox/ComboBoxMenu.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Menu } from '../Menu/index.js';
+import { Menu } from '../Menu/Menu.js';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
 type ComboBoxMenuProps = Omit<React.ComponentPropsWithoutRef<typeof Menu>, 'onClick'> & React.ComponentPropsWithoutRef<'div'>;
 export declare const ComboBoxMenu: PolymorphicForwardRefComponent<"div", ComboBoxMenuProps>;

package/esm/core/ComboBox/ComboBoxMenu.js

@@ -2,9 +2,8 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import cx from 'classnames';
 import * as React from 'react';
-import { Menu } from '../Menu/index.js';
+import { Menu } from '../Menu/Menu.js';
 import {
   useSafeContext,
   useMergedRefs,
@@ -54,7 +53,7 @@ const VirtualizedComboBoxMenu = (props) => {
   );
 };
 export const ComboBoxMenu = React.forwardRef((props, forwardedRef) => {
-  const { className, children, style, ...rest } = props;
+  const { children, style, ...rest } = props;
   const { id, enableVirtualization, popover } =
     useSafeContext(ComboBoxStateContext);
   const { menuRef } = useSafeContext(ComboBoxRefsContext);
@@ -71,7 +70,6 @@ export const ComboBoxMenu = React.forwardRef((props, forwardedRef) => {
           setFocus: false,
           role: 'listbox',
           ref: refs,
-          className: cx('iui-scroll', className),
           ...popover.getFloatingProps({
             style: !enableVirtualization
               ? style

package/esm/core/ComboBox/helpers.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import type { SelectOption } from '../Select/Select.js';
-import type { usePopover } from '../utils/index.js';
+import type { usePopover } from '../Popover/Popover.js';
 type ComboBoxAction = {
     type: 'multiselect';
     value: number[];

package/esm/core/DatePicker/DatePicker.d.ts

@@ -87,6 +87,15 @@ type DatePickerProps = {
      * Disabled dates cannot be selected.
      */
     isDateDisabled?: (date: Date) => boolean;
+    /**
+     * Whether there is a background, border, shadow, etc.
+     *
+     * Should be set to true if used in a popover that doesn't have its own background,
+     * or set to false if the popover has its own background or embedding within a page.
+     *
+     * @default true
+     */
+    applyBackground?: boolean;
 } & DateRangePickerProps & Omit<TimePickerProps, 'date' | 'onChange' | 'setFocusHour'>;
 /**
  * Date picker component

package/esm/core/DatePicker/DatePicker.js

@@ -13,8 +13,8 @@ import {
   Box,
   useId,
 } from '../utils/index.js';
-import { IconButton } from '../Buttons/IconButton/index.js';
-import { TimePicker } from '../TimePicker/index.js';
+import { IconButton } from '../Buttons/IconButton.js';
+import { TimePicker } from '../TimePicker/TimePicker.js';
 const isSameDay = (a, b) => {
   return (
     a &&
@@ -149,6 +149,7 @@ export const DatePicker = React.forwardRef((props, forwardedRef) => {
     dayProps,
     weekProps,
     isDateDisabled,
+    applyBackground = true,
     ...rest
   } = props;
   const monthNames = localizedNames?.months ?? defaultMonths;
@@ -419,7 +420,15 @@ export const DatePicker = React.forwardRef((props, forwardedRef) => {
   const dateTableId = useId();
   return React.createElement(
     Box,
-    { className: cx('iui-date-picker', className), ref: forwardedRef, ...rest },
+    {
+      className: cx(
+        'iui-date-picker',
+        { 'iui-popover-surface': applyBackground },
+        className,
+      ),
+      ref: forwardedRef,
+      ...rest,
+    },
     React.createElement(
       'div',
       null,

package/esm/core/Dialog/DialogBackdrop.js

@@ -3,7 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
-import { Backdrop } from '../Backdrop/index.js';
+import { Backdrop } from '../Backdrop/Backdrop.js';
 import { useMergedRefs } from '../utils/index.js';
 import { useDialogContext } from './DialogContext.js';
 import cx from 'classnames';

package/esm/core/Dialog/DialogTitleBar.js

@@ -5,7 +5,7 @@
 import * as React from 'react';
 import cx from 'classnames';
 import { SvgClose, mergeEventHandlers, Box } from '../utils/index.js';
-import { IconButton } from '../Buttons/index.js';
+import { IconButton } from '../Buttons/IconButton.js';
 import { useDialogContext } from './DialogContext.js';
 import { DialogTitleBarTitle } from './DialogTitleBarTitle.js';
 import { useDialogDragContext } from './DialogDragContext.js';

package/esm/core/{utils/components → Divider}/Divider.d.ts

@@ -1,4 +1,4 @@
-import type { PolymorphicForwardRefComponent } from '../props.js';
+import type { PolymorphicForwardRefComponent } from '../utils/props.js';
 type DividerProps = {
     /**
      * Sets the orientation of the divider

package/esm/core/{utils/components → Divider}/Divider.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import cx from 'classnames';
-import { Box } from './Box.js';
+import { Box } from '../utils/components/Box.js';
 /**
  * Shows a divider
  */

package/esm/core/DropdownMenu/DropdownMenu.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { Popover } from '../utils/index.js';
 import type { PolymorphicForwardRefComponent, PortalProps } from '../utils/index.js';
+import { usePopover } from '../Popover/Popover.js';
 export type DropdownMenuProps = {
     /**
      * List of menu items. Recommended to use MenuItem component.
@@ -16,7 +16,7 @@ export type DropdownMenuProps = {
      * Child element to wrap dropdown with.
      */
     children: React.ReactNode;
-} & Pick<React.ComponentProps<typeof Popover>, 'visible' | 'onVisibleChange' | 'placement' | 'matchWidth'> & React.ComponentPropsWithoutRef<'ul'> & Pick<PortalProps, 'portal'>;
+} & Pick<Parameters<typeof usePopover>[0], 'visible' | 'onVisibleChange' | 'placement' | 'matchWidth'> & React.ComponentPropsWithoutRef<'ul'> & Pick<PortalProps, 'portal'>;
 /**
  * Dropdown menu component.
  * Built on top of the {@link Popover} component.

package/esm/core/DropdownMenu/DropdownMenu.js

@@ -4,16 +4,15 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import {
-  Popover,
   useMergedRefs,
-  usePopover,
   Portal,
   cloneElementWithRef,
   useControlledState,
   mergeRefs,
   mergeEventHandlers,
 } from '../utils/index.js';
-import { Menu } from '../Menu/index.js';
+import { Menu } from '../Menu/Menu.js';
+import { usePopover } from '../Popover/Popover.js';
 /**
  * Dropdown menu component.
  * Built on top of the {@link Popover} component.

package/esm/core/ExpandableBlock/ExpandableBlock.d.ts

@@ -106,7 +106,7 @@ export declare const ExpandableBlock: PolymorphicForwardRefComponent<"div", Expa
     EndIcon: PolymorphicForwardRefComponent<"span", Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
         ref?: ((instance: HTMLSpanElement | null) => void) | React.RefObject<HTMLSpanElement> | null | undefined;
     }, "fill" | "as" | "key" | "size" | keyof React.HTMLAttributes<HTMLSpanElement> | "padded"> & {
-        size?: "small" | "large" | "auto" | "medium" | import("../utils/types.js").AnyString | undefined;
+        size?: "small" | "auto" | "medium" | "large" | import("../utils/types.js").AnyString | undefined;
         fill?: "default" | "informational" | "negative" | "positive" | "warning" | import("../utils/types.js").AnyString | undefined;
         padded?: boolean | undefined;
     } & Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {

package/esm/core/ExpandableBlock/ExpandableBlock.js

@@ -7,13 +7,13 @@ import * as React from 'react';
 import {
   StatusIconMap,
   SvgChevronRight,
-  Icon,
   Box,
   useSafeContext,
   polymorphic,
   mergeEventHandlers,
   ButtonBase,
 } from '../utils/index.js';
+import { Icon } from '../Icon/Icon.js';
 const ExpandableBlockContext = React.createContext(undefined);
 ExpandableBlockContext.displayName = 'ExpandableBlockContext';
 const ExpandableBlockComponent = React.forwardRef((props, forwardedRef) => {

package/esm/core/FileUpload/FileUploadCard.js

@@ -12,11 +12,11 @@ import {
   mergeEventHandlers,
   polymorphic,
   Box,
-  VisuallyHidden,
 } from '../utils/index.js';
 import cx from 'classnames';
 import { FileEmptyCard } from './FileEmptyCard.js';
-import { Anchor } from '../Typography/Anchor/Anchor.js';
+import { Anchor } from '../Typography/Anchor.js';
+import { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden.js';
 const toBytes = (bytes) => {
   const units = [' bytes', 'KB', 'MB', 'GB', 'TB'];
   let i = 0;

package/esm/core/FileUpload/FileUploadTemplate.js

@@ -5,7 +5,7 @@
 import * as React from 'react';
 import cx from 'classnames';
 import { SvgUpload, Box } from '../utils/index.js';
-import { Anchor } from '../Typography/Anchor/Anchor.js';
+import { Anchor } from '../Typography/Anchor.js';
 /**
  * @deprecated Use `FileUploadCard` instead.
  * Default template to be used with the `FileUpload` wrapper component.

package/esm/core/{utils/components → Flex}/Flex.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import type { AnyString } from '../types.js';
-import type { PolymorphicForwardRefComponent } from '../props.js';
+import type { AnyString } from '../utils/types.js';
+import type { PolymorphicForwardRefComponent } from '../utils/props.js';
 declare const sizeTokens: readonly ["3xs", "2xs", "xs", "s", "m", "l", "xl", "2xl", "3xl"];
 /**
  * String literal shorthands that correspond to the size tokens in [itwinui-variables](https://github.com/iTwin/iTwinUI/blob/main/packages/itwinui-variables/src/sizes.scss).

package/esm/core/{utils/components → Flex}/Flex.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import cx from 'classnames';
-import { Box } from './Box.js';
+import { Box } from '../utils/components/Box.js';
 const sizeTokens = ['3xs', '2xs', 'xs', 's', 'm', 'l', 'xl', '2xl', '3xl'];
 const getValueForToken = (token) => {
   if (sizeTokens.includes(token)) {

package/esm/core/Header/Header.js

@@ -4,9 +4,9 @@
  *--------------------------------------------------------------------------------------------*/
 import cx from 'classnames';
 import * as React from 'react';
-import { IconButton } from '../Buttons/index.js';
+import { IconButton } from '../Buttons/IconButton.js';
 import { SvgMoreVertical, Box } from '../utils/index.js';
-import { DropdownMenu } from '../DropdownMenu/index.js';
+import { DropdownMenu } from '../DropdownMenu/DropdownMenu.js';
 const defaultTranslations = {
   moreOptions: 'More options',
 };

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

@@ -1,4 +1,4 @@
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import type { ButtonProps } from '../Buttons/Button/Button.js';
+import type { ButtonProps } from '../Buttons/Button.js';
 export declare const HeaderBasicButton: PolymorphicForwardRefComponent<"button", ButtonProps>;
 export default HeaderBasicButton;

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

@@ -1,7 +1,7 @@
 import * as React from 'react';
-import type { ButtonProps } from '../Buttons/Button/Button.js';
+import type { ButtonProps } from '../Buttons/Button.js';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import type { DropdownButtonProps } from '../Buttons/DropdownButton/DropdownButton.js';
+import type { DropdownButtonProps } from '../Buttons/DropdownButton.js';
 type HeaderButtonProps = {
     /**
      * Main label of the header button.

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

@@ -1,4 +1,4 @@
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import type { DropdownButtonProps } from '../Buttons/DropdownButton/DropdownButton.js';
+import type { DropdownButtonProps } from '../Buttons/DropdownButton.js';
 export declare const HeaderDropdownButton: PolymorphicForwardRefComponent<"button", DropdownButtonProps>;
 export default HeaderDropdownButton;

package/esm/core/Header/HeaderDropdownButton.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import cx from 'classnames';
 import * as React from 'react';
-import { DropdownMenu } from '../DropdownMenu/index.js';
+import { DropdownMenu } from '../DropdownMenu/DropdownMenu.js';
 import {
   useMergedRefs,
   SvgCaretDownSmall,

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

@@ -1,4 +1,4 @@
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import type { SplitButtonProps } from '../Buttons/SplitButton/SplitButton.js';
+import type { SplitButtonProps } from '../Buttons/SplitButton.js';
 export declare const HeaderSplitButton: PolymorphicForwardRefComponent<"button", SplitButtonProps>;
 export default HeaderSplitButton;

package/esm/core/Header/HeaderSplitButton.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import cx from 'classnames';
 import * as React from 'react';
-import { DropdownMenu } from '../DropdownMenu/index.js';
+import { DropdownMenu } from '../DropdownMenu/DropdownMenu.js';
 import {
   SvgCaretDownSmall,
   SvgCaretUpSmall,

package/{cjs/core/utils/components → esm/core/Icon}/Icon.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import type { AnyString } from '../types.js';
-import type { PolymorphicForwardRefComponent } from '../props.js';
+import type { AnyString } from '../utils/types.js';
+import type { PolymorphicForwardRefComponent } from '../utils/props.js';
 export type IconProps = {
     /**
      * Size of the svg.

package/esm/core/{utils/components → Icon}/Icon.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import cx from 'classnames';
-import { Box } from './Box.js';
+import { Box } from '../utils/components/Box.js';
 const getSizeValue = (size) => {
   switch (size) {
     case 'small':

package/esm/core/InformationPanel/InformationPanelHeader.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import cx from 'classnames';
-import { IconButton } from '../Buttons/index.js';
+import { IconButton } from '../Buttons/IconButton.js';
 import { SvgCloseSmall, Box } from '../utils/index.js';
 /**
  * Header of the InformationPanel to be passed in the `header` prop.

package/esm/core/Input/Input.d.ts

@@ -17,7 +17,6 @@ export type InputProps = {
 /**
  * Basic input component
  * @example
- * <Input setFocus />
  * <Input disabled />
  * <Input size='small' />
  */

package/esm/core/Input/Input.js

@@ -8,7 +8,6 @@ import { useMergedRefs, Box } from '../utils/index.js';
 /**
  * Basic input component
  * @example
- * <Input setFocus />
  * <Input disabled />
  * <Input size='small' />
  */

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

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import { StatusMessage } from '../StatusMessage/index.js';
+import { StatusMessage } from '../StatusMessage/StatusMessage.js';
 type InputGroupProps = {
     /**
      * Label of the group.

package/esm/core/InputGroup/InputGroup.js

@@ -5,9 +5,9 @@
 import * as React from 'react';
 import cx from 'classnames';
 import { StatusIconMap, Box } from '../utils/index.js';
-import { InputGrid } from '../InputGrid/index.js';
-import { Label } from '../Label/index.js';
-import { StatusMessage } from '../StatusMessage/index.js';
+import { InputGrid } from '../InputGrid/InputGrid.js';
+import { Label } from '../Label/Label.js';
+import { StatusMessage } from '../StatusMessage/StatusMessage.js';
 /**
  * Group Checkbox/Radio components together
  * @example

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

@@ -33,7 +33,7 @@ export declare const InputWithDecorations: PolymorphicForwardRefComponent<"div",
         isActive?: boolean | undefined;
         label?: React.ReactNode;
         iconProps?: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement> | undefined;
-    } & Omit<import("../Buttons/Button/Button.js").ButtonProps, "startIcon" | "endIcon" | "labelProps" | "startIconProps" | "endIconProps"> & {
+    } & Omit<import("../Buttons/Button.js").ButtonProps, "startIcon" | "endIcon" | "labelProps" | "startIconProps" | "endIconProps"> & {
         as?: "button" | undefined;
     }>;
 };

package/esm/core/InputWithDecorations/InputWithDecorations.js

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import { Box, InputFlexContainer, useSafeContext } from '../utils/index.js';
-import { IconButton } from '../Buttons/index.js';
+import { IconButton } from '../Buttons/IconButton.js';
 const InputWithDecorationsContext = React.createContext(undefined);
 const InputWithDecorationsComponent = React.forwardRef((props, ref) => {
   const { children, size, isDisabled, ...rest } = props;

package/esm/core/LabeledInput/LabeledInput.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
 import { Input } from '../Input/Input.js';
-import { Icon } from '../utils/index.js';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
-import { InputGrid } from '../InputGrid/index.js';
-import { InputWithDecorations } from '../InputWithDecorations/index.js';
+import { InputGrid } from '../InputGrid/InputGrid.js';
+import { InputWithDecorations } from '../InputWithDecorations/InputWithDecorations.js';
+import { Icon } from '../Icon/Icon.js';
 export type LabeledInputProps = {
     /**
      * Label of the input.
@@ -56,7 +56,7 @@ export type LabeledInputProps = {
  * <LabeledInput label='My label' />
  * <LabeledInput disabled label='My label' />
  * <LabeledInput status='positive' label='Positive' />
- * <LabeledInput status='negative' label='Negative' setFocus />
+ * <LabeledInput status='negative' label='Negative' />
  */
 export declare const LabeledInput: PolymorphicForwardRefComponent<"input", LabeledInputProps>;
 export default LabeledInput;

package/esm/core/LabeledInput/LabeledInput.js

@@ -4,18 +4,19 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import { Input } from '../Input/Input.js';
-import { StatusIconMap, useId, Icon } from '../utils/index.js';
-import { InputGrid } from '../InputGrid/index.js';
-import { InputWithDecorations } from '../InputWithDecorations/index.js';
+import { StatusIconMap, useId } from '../utils/index.js';
+import { InputGrid } from '../InputGrid/InputGrid.js';
+import { InputWithDecorations } from '../InputWithDecorations/InputWithDecorations.js';
 import { StatusMessage } from '../StatusMessage/StatusMessage.js';
 import { Label } from '../Label/Label.js';
+import { Icon } from '../Icon/Icon.js';
 /**
  * Basic labeled input component
  * @example
  * <LabeledInput label='My label' />
  * <LabeledInput disabled label='My label' />
  * <LabeledInput status='positive' label='Positive' />
- * <LabeledInput status='negative' label='Negative' setFocus />
+ * <LabeledInput status='negative' label='Negative' />
  */
 export const LabeledInput = React.forwardRef((props, ref) => {
   const uid = useId();

package/esm/core/LabeledSelect/LabeledSelect.d.ts

@@ -1,8 +1,8 @@
 import * as React from 'react';
 import type { SelectProps } from '../Select/Select.js';
-import { Icon } from '../utils/index.js';
 import type { LabeledInputProps } from '../LabeledInput/LabeledInput.js';
 import { InputGrid } from '../InputGrid/InputGrid.js';
+import { Icon } from '../Icon/Icon.js';
 export type LabeledSelectProps<T> = {
     /**
      * Label of the select.
@@ -76,5 +76,5 @@ export type LabeledSelectProps<T> = {
  *   svgIcon={<SvgCamera />}
  * />
  */
-export declare const LabeledSelect: <T>(props: LabeledSelectProps<T>) => JSX.Element;
+export declare const LabeledSelect: React.ForwardRefExoticComponent<LabeledSelectProps<unknown> & React.RefAttributes<HTMLElement>>;
 export default LabeledSelect;

package/esm/core/LabeledSelect/LabeledSelect.js

@@ -3,11 +3,12 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
-import { Select } from '../Select/index.js';
-import { StatusIconMap, useId, Icon } from '../utils/index.js';
+import { Select } from '../Select/Select.js';
+import { StatusIconMap, useId } from '../utils/index.js';
 import { StatusMessage } from '../StatusMessage/StatusMessage.js';
 import { InputGrid } from '../InputGrid/InputGrid.js';
 import { Label } from '../Label/Label.js';
+import { Icon } from '../Icon/Icon.js';
 /**
  * Labeled select component to select value from options.
  * @example
@@ -41,7 +42,7 @@ import { Label } from '../Label/Label.js';
  *   svgIcon={<SvgCamera />}
  * />
  */
-export const LabeledSelect = (props) => {
+export const LabeledSelect = React.forwardRef((props, forwardedRef) => {
   const {
     className,
     disabled = false,
@@ -90,6 +91,7 @@ export const LabeledSelect = (props) => {
       style: style,
       status: status,
       ...rest,
+      ref: forwardedRef,
       triggerProps: {
         'aria-labelledby': labelId,
         ...triggerProps,
@@ -108,5 +110,5 @@ export const LabeledSelect = (props) => {
         )
       : message,
   );
-};
+});
 export default LabeledSelect;

package/esm/core/LabeledTextarea/LabeledTextarea.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { Icon } from '../utils/index.js';
+import { Icon } from '../Icon/Icon.js';
 import type { PolymorphicForwardRefComponent } from '../utils/index.js';
 import type { LabeledInputProps } from '../LabeledInput/LabeledInput.js';
 import { InputGrid } from '../InputGrid/InputGrid.js';

package/esm/core/LabeledTextarea/LabeledTextarea.js

@@ -3,9 +3,9 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
-import { Icon } from '../utils/index.js';
+import { Icon } from '../Icon/Icon.js';
 import { InputGrid } from '../InputGrid/InputGrid.js';
-import { LabeledInput } from '../LabeledInput/index.js';
+import { LabeledInput } from '../LabeledInput/LabeledInput.js';
 /**
  * Textarea wrapper that allows for additional styling and labelling
  * @example

package/{cjs/core/utils/components → esm/core/LinkAction}/LinkAction.d.ts

@@ -8,7 +8,7 @@
  *   </Surface>
  * </LinkBox>
  */
-export declare const LinkAction: import("../props.js").PolymorphicForwardRefComponent<"a", {}>;
+export declare const LinkAction: import("../utils/props.js").PolymorphicForwardRefComponent<"a", {}>;
 /**
  * Polymorphic link box component.
  * Used to wrap around your component to use LinkAction.
@@ -20,4 +20,4 @@ export declare const LinkAction: import("../props.js").PolymorphicForwardRefComp
  *   </Surface>
  * </LinkBox>
  */
-export declare const LinkBox: import("../props.js").PolymorphicForwardRefComponent<"div", {}>;
+export declare const LinkBox: import("../utils/props.js").PolymorphicForwardRefComponent<"div", {}>;

package/esm/core/{utils/components → LinkAction}/LinkAction.js

@@ -2,7 +2,7 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import { polymorphic } from '../functions/polymorphic.js';
+import { polymorphic } from '../utils/functions/polymorphic.js';
 /**
  * Polymorphic link action component.
  * It is rendered as `a` by default.

package/esm/core/Menu/MenuItem.js

@@ -5,7 +5,6 @@
 import * as React from 'react';
 import {
   SvgCaretRightSmall,
-  usePopover,
   Portal,
   useMergedRefs,
   useId,
@@ -13,6 +12,7 @@ import {
 import { Menu } from './Menu.js';
 import { ListItem } from '../List/ListItem.js';
 import { flushSync } from 'react-dom';
+import { usePopover } from '../Popover/Popover.js';
 /**
  * Context used to provide menu item ref to sub-menu items.
  */

package/esm/core/Menu/MenuItemSkeleton.js

@@ -4,7 +4,8 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import cx from 'classnames';
-import { Box, VisuallyHidden } from '../utils/index.js';
+import { Box } from '../utils/index.js';
+import { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden.js';
 /**
  * Menu item that uses skeletons to indicate loading state.
  */

package/esm/core/Modal/Modal.js

@@ -3,7 +3,7 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import * as React from 'react';
-import { Dialog } from '../Dialog/index.js';
+import { Dialog } from '../Dialog/Dialog.js';
 /**
  * Modal component which can wrap any content.
  * @example