@itwin/itwinui-react 2.10.1 → 2.11.0

package/esm/core/DatePicker/DatePicker.js

@@ -3,11 +3,11 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import cx from 'classnames';
-import React from 'react';
-import { useTheme, SvgChevronLeft, SvgChevronRight, SvgChevronLeftDouble, SvgChevronRightDouble, isBefore, } from '../utils';
+import * as React from 'react';
+import { useTheme, SvgChevronLeft, SvgChevronRight, SvgChevronLeftDouble, SvgChevronRightDouble, isBefore, } from '../utils/index.js';
 import '@itwin/itwinui-css/css/date-picker.css';
-import { IconButton } from '../Buttons/IconButton';
-import { TimePicker } from '../TimePicker';
+import { IconButton } from '../Buttons/IconButton/index.js';
+import { TimePicker } from '../TimePicker/index.js';
 const isSameDay = (a, b) => {
     return (a &&
         b &&

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

@@ -1,4 +1,4 @@
-export { DatePicker, generateLocalizedStrings } from './DatePicker';
-export type { DatePickerProps } from './DatePicker';
+export { DatePicker, generateLocalizedStrings } from './DatePicker.js';
+export type { DatePickerProps } from './DatePicker.js';
 declare const _default: "./DatePicker";
 export default _default;

package/esm/core/DatePicker/index.js

@@ -2,5 +2,5 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-export { DatePicker, generateLocalizedStrings } from './DatePicker';
+export { DatePicker, generateLocalizedStrings } from './DatePicker.js';
 export default './DatePicker';

package/esm/core/Dialog/Dialog.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
+import * as React from 'react';
 import '@itwin/itwinui-css/css/dialog.css';
-import { DialogContextProps } from './DialogContext';
+import type { DialogContextProps } from './DialogContext.js';
 export declare type DialogProps = {
     /**
      * Dialog content.
@@ -30,12 +30,12 @@ export declare type DialogProps = {
  * </Dialog>
  */
 export declare const Dialog: React.ForwardRefExoticComponent<Pick<DialogProps, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "onClose" | "setFocus" | "isOpen" | "isDismissible" | "isDraggable" | "closeOnExternalClick" | "closeOnEsc" | "trapFocus" | "preventDocumentScroll" | "isResizable" | "relativeTo"> & React.RefAttributes<HTMLDivElement>> & {
-    Backdrop: React.ForwardRefExoticComponent<Pick<import("./DialogBackdrop").DialogBackdropProps, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "onClose" | "isVisible" | "isDismissible" | "closeOnExternalClick" | "relativeTo"> & React.RefAttributes<HTMLDivElement>>;
-    Main: React.ForwardRefExoticComponent<Pick<import("./DialogMain").DialogMainProps, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "onClose" | "styleType" | "setFocus" | "isOpen" | "isDismissible" | "isDraggable" | "closeOnEsc" | "trapFocus" | "preventDocumentScroll" | "isResizable" | "relativeTo"> & React.RefAttributes<HTMLDivElement>>;
-    TitleBar: React.ForwardRefExoticComponent<Pick<import("./DialogTitleBar").DialogTitleBarProps, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "onClose" | "isDismissible" | "isDraggable" | "titleText"> & React.RefAttributes<HTMLDivElement>> & {
-        Title: React.ForwardRefExoticComponent<Pick<import("./DialogTitleBarTitle").DialogTitleBarTitleProps, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & React.RefAttributes<HTMLDivElement>>;
+    Backdrop: React.ForwardRefExoticComponent<Pick<import("./DialogBackdrop.js").DialogBackdropProps, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "onClose" | "isVisible" | "isDismissible" | "closeOnExternalClick" | "relativeTo"> & React.RefAttributes<HTMLDivElement>>;
+    Main: React.ForwardRefExoticComponent<Pick<import("./DialogMain.js").DialogMainProps, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "onClose" | "styleType" | "setFocus" | "isOpen" | "isDismissible" | "isDraggable" | "closeOnEsc" | "trapFocus" | "preventDocumentScroll" | "isResizable" | "relativeTo"> & React.RefAttributes<HTMLDivElement>>;
+    TitleBar: React.ForwardRefExoticComponent<Pick<import("./DialogTitleBar.js").DialogTitleBarProps, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "onClose" | "isDismissible" | "isDraggable" | "titleText"> & React.RefAttributes<HTMLDivElement>> & {
+        Title: React.ForwardRefExoticComponent<Pick<import("./DialogTitleBarTitle.js").DialogTitleBarTitleProps, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & React.RefAttributes<HTMLDivElement>>;
     };
-    Content: React.ForwardRefExoticComponent<Pick<import("./DialogContent").DialogContentProps, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & React.RefAttributes<HTMLDivElement>>;
-    ButtonBar: React.ForwardRefExoticComponent<Pick<import("./DialogButtonBar").DialogButtonBarProps, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & React.RefAttributes<HTMLDivElement>>;
+    Content: React.ForwardRefExoticComponent<Pick<import("./DialogContent.js").DialogContentProps, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & React.RefAttributes<HTMLDivElement>>;
+    ButtonBar: React.ForwardRefExoticComponent<Pick<import("./DialogButtonBar.js").DialogButtonBarProps, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & React.RefAttributes<HTMLDivElement>>;
 };
 export default Dialog;

package/esm/core/Dialog/Dialog.js

@@ -2,16 +2,16 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import React from 'react';
+import * as React from 'react';
 import cx from 'classnames';
 import '@itwin/itwinui-css/css/dialog.css';
-import { DialogTitleBar } from './DialogTitleBar';
-import { DialogContent } from './DialogContent';
-import { DialogBackdrop } from './DialogBackdrop';
-import { DialogContext } from './DialogContext';
-import { DialogButtonBar } from './DialogButtonBar';
-import { DialogMain } from './DialogMain';
-import { useMergedRefs } from '../utils';
+import { DialogTitleBar } from './DialogTitleBar.js';
+import { DialogContent } from './DialogContent.js';
+import { DialogBackdrop } from './DialogBackdrop.js';
+import { DialogContext } from './DialogContext.js';
+import { DialogButtonBar } from './DialogButtonBar.js';
+import { DialogMain } from './DialogMain.js';
+import { useMergedRefs } from '../utils/index.js';
 /**
  * Dialog component.
  * @example

package/esm/core/Dialog/DialogBackdrop.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
-import { BackdropProps } from '../Backdrop';
-import { DialogContextProps } from './DialogContext';
+import * as React from 'react';
+import type { BackdropProps } from '../Backdrop/index.js';
+import type { DialogContextProps } from './DialogContext.js';
 export declare type DialogBackdropProps = BackdropProps & Pick<DialogContextProps, 'onClose' | 'isDismissible' | 'closeOnExternalClick' | 'relativeTo'>;
 /**
  * Backdrop component for dialog. Recommended to be used with `Dialog`

package/esm/core/Dialog/DialogBackdrop.js

@@ -2,10 +2,10 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import React from 'react';
-import { Backdrop } from '../Backdrop';
-import { useMergedRefs } from '../utils';
-import { useDialogContext } from './DialogContext';
+import * as React from 'react';
+import { Backdrop } from '../Backdrop/index.js';
+import { useMergedRefs } from '../utils/index.js';
+import { useDialogContext } from './DialogContext.js';
 import cx from 'classnames';
 /**
  * Backdrop component for dialog. Recommended to be used with `Dialog`

package/esm/core/Dialog/DialogButtonBar.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import '@itwin/itwinui-css/css/dialog.css';
 export declare type DialogButtonBarProps = {
     /**

package/esm/core/Dialog/DialogButtonBar.js

@@ -2,9 +2,9 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import React from 'react';
+import * as React from 'react';
 import cx from 'classnames';
-import { useTheme } from '../utils';
+import { useTheme } from '../utils/index.js';
 import '@itwin/itwinui-css/css/dialog.css';
 /**
  * Container for Buttons in `Dialog`. Recommended to be used as a child of `Dialog`.

package/esm/core/Dialog/DialogContent.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import '@itwin/itwinui-css/css/dialog.css';
 export declare type DialogContentProps = {
     /**

package/esm/core/Dialog/DialogContent.js

@@ -2,9 +2,9 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import React from 'react';
+import * as React from 'react';
 import cx from 'classnames';
-import { useTheme } from '../utils';
+import { useTheme } from '../utils/index.js';
 import '@itwin/itwinui-css/css/dialog.css';
 /**
  * Container for content in `Dialog`. Recommended to be used as a child of `Dialog`.

package/esm/core/Dialog/DialogContext.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 export declare type DialogContextProps = {
     /**
      * Flag whether dialog should be shown.

package/esm/core/Dialog/DialogContext.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 React from 'react';
+import * as React from 'react';
 export const DialogContext = React.createContext(undefined);
 export const useDialogContext = () => {
     return React.useContext(DialogContext) || {};

package/esm/core/Dialog/DialogDragContext.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 export declare type DialogDragContextProps = {
     onPointerDown?: (e: React.PointerEvent<HTMLElement>) => void;
 };

package/esm/core/Dialog/DialogDragContext.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 React from 'react';
+import * as React from 'react';
 export const DialogDragContext = React.createContext(undefined);
 export const useDialogDragContext = () => {
     const context = React.useContext(DialogDragContext);

package/esm/core/Dialog/DialogMain.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
+import * as React from 'react';
 import '@itwin/itwinui-css/css/dialog.css';
-import { DialogContextProps } from './DialogContext';
+import type { DialogContextProps } from './DialogContext.js';
 export declare type DialogMainProps = {
     /**
      * Type of the dialog.

package/esm/core/Dialog/DialogMain.js

@@ -2,14 +2,14 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import React from 'react';
+import * as React from 'react';
 import cx from 'classnames';
-import { FocusTrap, getTranslateValues, Resizer, useMergedRefs, useTheme, useIsomorphicLayoutEffect, } from '../utils';
+import { FocusTrap, getTranslateValues, Resizer, useMergedRefs, useTheme, useIsomorphicLayoutEffect, } from '../utils/index.js';
 import '@itwin/itwinui-css/css/dialog.css';
-import { useDialogContext } from './DialogContext';
+import { useDialogContext } from './DialogContext.js';
 import { CSSTransition } from 'react-transition-group';
-import { DialogDragContext } from './DialogDragContext';
-import useDragAndDrop from '../utils/hooks/useDragAndDrop';
+import { DialogDragContext } from './DialogDragContext.js';
+import useDragAndDrop from '../utils/hooks/useDragAndDrop.js';
 /**
  * Dialog component which can wrap any content.
  * @example

package/esm/core/Dialog/DialogTitleBar.d.ts

@@ -1,6 +1,6 @@
-import React from 'react';
+import * as React from 'react';
 import '@itwin/itwinui-css/css/dialog.css';
-import { DialogContextProps } from './DialogContext';
+import type { DialogContextProps } from './DialogContext.js';
 export declare type DialogTitleBarProps = {
     /**
      * Dialog title bar content. If passed, then `title` prop is ignored.
@@ -29,6 +29,6 @@ export declare type DialogTitleBarProps = {
  * </Dialog.TitleBar>
  */
 export declare const DialogTitleBar: React.ForwardRefExoticComponent<Pick<DialogTitleBarProps, "key" | keyof React.HTMLAttributes<HTMLDivElement> | "onClose" | "isDismissible" | "isDraggable" | "titleText"> & React.RefAttributes<HTMLDivElement>> & {
-    Title: React.ForwardRefExoticComponent<Pick<import("./DialogTitleBarTitle").DialogTitleBarTitleProps, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & React.RefAttributes<HTMLDivElement>>;
+    Title: React.ForwardRefExoticComponent<Pick<import("./DialogTitleBarTitle.js").DialogTitleBarTitleProps, "key" | keyof React.HTMLAttributes<HTMLDivElement>> & React.RefAttributes<HTMLDivElement>>;
 };
 export default DialogTitleBar;

package/esm/core/Dialog/DialogTitleBar.js

@@ -2,14 +2,14 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import React from 'react';
+import * as React from 'react';
 import cx from 'classnames';
-import { useTheme, SvgClose } from '../utils';
-import { IconButton } from '../Buttons';
+import { useTheme, SvgClose } from '../utils/index.js';
+import { IconButton } from '../Buttons/index.js';
 import '@itwin/itwinui-css/css/dialog.css';
-import { useDialogContext } from './DialogContext';
-import { DialogTitleBarTitle } from './DialogTitleBarTitle';
-import { useDialogDragContext } from './DialogDragContext';
+import { useDialogContext } from './DialogContext.js';
+import { DialogTitleBarTitle } from './DialogTitleBarTitle.js';
+import { useDialogDragContext } from './DialogDragContext.js';
 /**
  * Dialog title bar. Recommended to be used as a child of `Dialog`.
  * @example

package/esm/core/Dialog/DialogTitleBarTitle.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import '@itwin/itwinui-css/css/dialog.css';
 export declare type DialogTitleBarTitleProps = {
     /**

package/esm/core/Dialog/DialogTitleBarTitle.js

@@ -2,9 +2,9 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import React from 'react';
+import * as React from 'react';
 import cx from 'classnames';
-import { useTheme } from '../utils';
+import { useTheme } from '../utils/index.js';
 import '@itwin/itwinui-css/css/dialog.css';
 /**
  * Dialog title bar. Recommended to be used as a child of `Dialog`.

package/esm/core/Dialog/index.d.ts

@@ -1,8 +1,8 @@
-export { Dialog } from './Dialog';
-export type { DialogProps } from './Dialog';
-export type { DialogMainProps } from './DialogMain';
-export type { DialogTitleBarProps } from './DialogTitleBar';
-export type { DialogContentProps } from './DialogContent';
-export type { DialogButtonBarProps } from './DialogButtonBar';
+export { Dialog } from './Dialog.js';
+export type { DialogProps } from './Dialog.js';
+export type { DialogMainProps } from './DialogMain.js';
+export type { DialogTitleBarProps } from './DialogTitleBar.js';
+export type { DialogContentProps } from './DialogContent.js';
+export type { DialogButtonBarProps } from './DialogButtonBar.js';
 declare const _default: "./Dialog";
 export default _default;

package/esm/core/Dialog/index.js

@@ -2,5 +2,5 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-export { Dialog } from './Dialog';
+export { Dialog } from './Dialog.js';
 export default './Dialog';

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

@@ -1,5 +1,5 @@
-import React from 'react';
-import { CommonProps, PopoverProps } from '../utils';
+import * as React from 'react';
+import type { CommonProps, PopoverProps } from '../utils/index.js';
 export declare type DropdownMenuProps = {
     /**
      * List of menu items. Recommended to use MenuItem component.

package/esm/core/DropdownMenu/DropdownMenu.js

@@ -2,9 +2,9 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import React from 'react';
-import { useTheme, Popover, mergeRefs, } from '../utils';
-import { Menu } from '../Menu';
+import * as React from 'react';
+import { useTheme, Popover, mergeRefs } from '../utils/index.js';
+import { Menu } from '../Menu/index.js';
 /**
  * Dropdown menu component.
  * Uses the {@link Popover} component, which is a wrapper around [tippy.js](https://atomiks.github.io/tippyjs).

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

@@ -1,4 +1,4 @@
-export { DropdownMenu } from './DropdownMenu';
-export type { DropdownMenuProps } from './DropdownMenu';
+export { DropdownMenu } from './DropdownMenu.js';
+export type { DropdownMenuProps } from './DropdownMenu.js';
 declare const _default: "./DropdownMenu";
 export default _default;

package/esm/core/DropdownMenu/index.js

@@ -2,5 +2,5 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-export { DropdownMenu } from './DropdownMenu';
+export { DropdownMenu } from './DropdownMenu.js';
 export default './DropdownMenu';

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

@@ -1,5 +1,5 @@
-import React from 'react';
-import { CommonProps } from '../utils';
+import * as React from 'react';
+import type { CommonProps } from '../utils/index.js';
 import '@itwin/itwinui-css/css/expandable-block.css';
 export declare type ExpandableBlockProps = {
     /**

package/esm/core/ExpandableBlock/ExpandableBlock.js

@@ -3,8 +3,8 @@
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
 import cx from 'classnames';
-import React from 'react';
-import { useTheme, StatusIconMap, WithCSSTransition, SvgChevronRight, Icon, } from '../utils';
+import * as React from 'react';
+import { useTheme, StatusIconMap, WithCSSTransition, SvgChevronRight, Icon, } from '../utils/index.js';
 import '@itwin/itwinui-css/css/expandable-block.css';
 /**
  * Container that allows content to be hidden behind a brief title and a caption.

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

@@ -1,4 +1,4 @@
-export { ExpandableBlock } from './ExpandableBlock';
-export type { ExpandableBlockProps } from './ExpandableBlock';
+export { ExpandableBlock } from './ExpandableBlock.js';
+export type { ExpandableBlockProps } from './ExpandableBlock.js';
 declare const _default: "./ExpandableBlock";
 export default _default;

package/esm/core/ExpandableBlock/index.js

@@ -2,5 +2,5 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-export { ExpandableBlock } from './ExpandableBlock';
+export { ExpandableBlock } from './ExpandableBlock.js';
 export default './ExpandableBlock';

package/esm/core/Fieldset/Fieldset.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import '@itwin/itwinui-css/css/fieldset.css';
 export declare type FieldsetProps = {
     /**

package/esm/core/Fieldset/Fieldset.js

@@ -2,8 +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 React from 'react';
-import { useTheme } from '../utils';
+import * as React from 'react';
+import { useTheme } from '../utils/index.js';
 import cx from 'classnames';
 import '@itwin/itwinui-css/css/fieldset.css';
 /**

package/esm/core/Fieldset/index.d.ts

@@ -1,4 +1,4 @@
-export { Fieldset } from './Fieldset';
-export type { FieldsetProps } from './Fieldset';
+export { Fieldset } from './Fieldset.js';
+export type { FieldsetProps } from './Fieldset.js';
 declare const _default: "./Fieldset";
 export default _default;

package/esm/core/Fieldset/index.js

@@ -2,5 +2,5 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-export { Fieldset } from './Fieldset';
+export { Fieldset } from './Fieldset.js';
 export default './Fieldset';

package/esm/core/FileUpload/FileEmptyCard.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 export declare type FileEmptyCardIconProps = React.ComponentPropsWithRef<'span'>;
 export declare type FileEmptyCardTextProps = React.ComponentPropsWithRef<'span'>;
 export declare type FileEmptyCardProps = React.ComponentPropsWithoutRef<'div'>;

package/esm/core/FileUpload/FileEmptyCard.js

@@ -2,10 +2,10 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import React from 'react';
-import { SvgUpload } from '../utils';
+import * as React from 'react';
+import { SvgUpload } from '../utils/index.js';
 import cx from 'classnames';
-import FileUploadCard from './FileUploadCard';
+import FileUploadCard from './FileUploadCard.js';
 const FileEmptyCardIcon = React.forwardRef((props, ref) => {
     const { children, className, ...rest } = props;
     return (React.createElement("span", { className: cx('iui-file-card-empty-icon', className), ref: ref, ...rest }, children !== null && children !== void 0 ? children : React.createElement(SvgUpload, null)));

package/esm/core/FileUpload/FileUpload.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import { CommonProps } from '../utils';
+import * as React from 'react';
+import type { CommonProps } from '../utils/index.js';
 import '@itwin/itwinui-css/css/file-upload.css';
 export declare type FileUploadProps = {
     /**
@@ -46,5 +46,5 @@ export declare const FileUpload: React.ForwardRefExoticComponent<{
     id?: string | undefined;
 } & {
     style?: React.CSSProperties | undefined;
-} & import("../utils").ClassNameProps & React.RefAttributes<HTMLDivElement>>;
+} & import("../utils/props.js").ClassNameProps & React.RefAttributes<HTMLDivElement>>;
 export default FileUpload;

package/esm/core/FileUpload/FileUpload.js

@@ -2,9 +2,9 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import React from 'react';
+import * as React from 'react';
 import cx from 'classnames';
-import { useTheme, useMergedRefs } from '../utils';
+import { useTheme, useMergedRefs } from '../utils/index.js';
 import '@itwin/itwinui-css/css/file-upload.css';
 /**
  * File upload component to be wrapped around `FileUploadTemplate` or any arbitrary component.

package/esm/core/FileUpload/FileUploadCard.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 export declare type FileUploadCardIconProps = React.ComponentPropsWithRef<'span'>;
 export declare type FileUploadCardInfoProps = React.ComponentPropsWithRef<'span'>;
 export declare type FileUploadCardTitleProps = React.ComponentPropsWithRef<'span'>;

package/esm/core/FileUpload/FileUploadCard.js

@@ -2,11 +2,10 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import React from 'react';
-import { getWindow, SvgDocument, useMergedRefs, useSafeContext, } from '../utils';
+import * as React from 'react';
+import { getWindow, SvgDocument, useMergedRefs, useSafeContext, useId, } from '../utils/index.js';
 import cx from 'classnames';
-import { FileEmptyCard } from './FileEmptyCard';
-import { useId } from '../utils';
+import { FileEmptyCard } from './FileEmptyCard.js';
 const toBytes = (bytes) => {
     const units = [' bytes', 'KB', 'MB', 'GB', 'TB'];
     let i = 0;

package/esm/core/FileUpload/FileUploadTemplate.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import '@itwin/itwinui-css/css/file-upload.css';
 export declare type FileUploadTemplateProps = {
     /**

package/esm/core/FileUpload/FileUploadTemplate.js

@@ -2,9 +2,9 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import React from 'react';
+import * as React from 'react';
 import cx from 'classnames';
-import { useTheme, SvgUpload } from '../utils';
+import { useTheme, SvgUpload } from '../utils/index.js';
 import '@itwin/itwinui-css/css/file-upload.css';
 /**
  * Default template to be used with the `FileUpload` wrapper component.

package/esm/core/FileUpload/index.d.ts

@@ -1,10 +1,10 @@
-export { FileUpload } from './FileUpload';
-export type { FileUploadProps } from './FileUpload';
+export { FileUpload } from './FileUpload.js';
+export type { FileUploadProps } from './FileUpload.js';
 declare const _default: "./FileUpload";
 export default _default;
-export { FileUploadTemplate } from './FileUploadTemplate';
-export type { FileUploadTemplateProps } from './FileUploadTemplate';
-export { FileUploadCard } from './FileUploadCard';
-export type { FileUploadCardProps, FileUploadCardIconProps, FileUploadCardInfoProps, FileUploadCardTitleProps, FileUploadCardDescriptionProps, FileUploadCardActionProps, FileUploadCardInputLabelProps, FileUploadCardInputProps, } from './FileUploadCard';
-export { FileEmptyCard } from './FileEmptyCard';
-export type { FileEmptyCardProps, FileEmptyCardIconProps, FileEmptyCardTextProps, } from './FileEmptyCard';
+export { FileUploadTemplate } from './FileUploadTemplate.js';
+export type { FileUploadTemplateProps } from './FileUploadTemplate.js';
+export { FileUploadCard } from './FileUploadCard.js';
+export type { FileUploadCardProps, FileUploadCardIconProps, FileUploadCardInfoProps, FileUploadCardTitleProps, FileUploadCardDescriptionProps, FileUploadCardActionProps, FileUploadCardInputLabelProps, FileUploadCardInputProps, } from './FileUploadCard.js';
+export { FileEmptyCard } from './FileEmptyCard.js';
+export type { FileEmptyCardProps, FileEmptyCardIconProps, FileEmptyCardTextProps, } from './FileEmptyCard.js';

package/esm/core/FileUpload/index.js

@@ -2,8 +2,8 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-export { FileUpload } from './FileUpload';
+export { FileUpload } from './FileUpload.js';
 export default './FileUpload';
-export { FileUploadTemplate } from './FileUploadTemplate';
-export { FileUploadCard } from './FileUploadCard';
-export { FileEmptyCard } from './FileEmptyCard';
+export { FileUploadTemplate } from './FileUploadTemplate.js';
+export { FileUploadCard } from './FileUploadCard.js';
+export { FileEmptyCard } from './FileEmptyCard.js';

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

@@ -1,5 +1,5 @@
-import React from 'react';
-import { StylingProps } from '../utils';
+import * as React from 'react';
+import type { StylingProps } from '../utils/index.js';
 import '@itwin/itwinui-css/css/footer.css';
 export declare type TitleTranslations = {
     termsOfService: string;
@@ -60,6 +60,6 @@ export declare const Footer: ((props: FooterProps) => JSX.Element) & {
     Item: (props: Pick<React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "key" | keyof React.LiHTMLAttributes<HTMLLIElement>> & {
         ref?: ((instance: HTMLLIElement | null) => void) | React.RefObject<HTMLLIElement> | null | undefined;
     }) => JSX.Element;
-    Separator: (props: import("./FooterSeparator").FooterSeparatorProps) => JSX.Element;
+    Separator: (props: import("./FooterSeparator.js").FooterSeparatorProps) => JSX.Element;
 };
 export default Footer;

package/esm/core/Footer/Footer.js

@@ -2,13 +2,13 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-import React from 'react';
+import * as React from 'react';
 import cx from 'classnames';
-import { useTheme } from '../utils';
+import { useTheme } from '../utils/index.js';
 import '@itwin/itwinui-css/css/footer.css';
-import { FooterItem } from './FooterItem';
-import { FooterSeparator } from './FooterSeparator';
-import { FooterList } from './FooterList';
+import { FooterItem } from './FooterItem.js';
+import { FooterSeparator } from './FooterSeparator.js';
+import { FooterList } from './FooterList.js';
 const footerTranslations = {
     cookies: 'Cookies',
     legalNotices: 'Legal notices',

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

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import '@itwin/itwinui-css/css/footer.css';
 export declare type FooterItemProps = React.ComponentPropsWithRef<'li'>;
 /**