Update module resolution and provide mandatory file extensions

apps/test-app/package.json

@@ -107,7 +107,7 @@
     "@itwin/reality-data-client": "0.9.0",
     "@itwin/webgl-compatibility": "^4.0.0",
     "@tanstack/react-router": "~1.46.8",
-    "classnames": "2.3.1",
+    "classnames": "2.5.1",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-markdown": "~9.0.1",

apps/test-providers/package.json

@@ -4,21 +4,17 @@
   "description": "Package used to exercise adding UI components and stages",
   "private": true,
   "type": "module",
-  "main": "lib/cjs/appui-test-providers.js",
-  "module": "lib/esm/appui-test-providers.js",
-  "types": "lib/cjs/appui-test-providers",
+  "main": "lib/appui-test-providers.js",
+  "types": "lib/appui-test-providers",
   "exports": {
-    "import": "./lib/esm/appui-test-providers.js",
-    "require": "./lib/cjs/appui-test-providers.js"
+    ".": "./lib/appui-test-providers.js"
   },
   "scripts": {
-    "start": "run-p -l \"build:** -- -w\" \"copy:** -- -w\"",
-    "build": "run-p -l \"build:**\" \"copy:**\"",
-    "copy:cjs": "cpx \"./src/**/*.{*css,json,svg}\" \"./lib/cjs\"",
-    "copy:esm": "cpx \"./src/**/*.{*css,json,svg}\" \"./lib/esm\"",
+    "start": "run-p -l \"build:tsc -- -w\" \"copy:** -- -w\"",
+    "build": "run-p -l build:tsc \"copy:**\"",
+    "copy:src": "cpx \"./src/**/*.{*css,json,svg}\" \"./lib\"",
     "copy:locale": "cpx \"./public/**/*\" ./lib/public",
-    "build:cjs": "tsc 1>&2 --outDir lib/cjs",
-    "build:esm": "tsc 1>&2 --module ES2020 --outDir lib/esm",
+    "build:tsc": "tsc 1>&2",
     "clean": "rimraf lib .rush/temp/package-deps*.json",
     "cover": "",
     "docs": "betools extract --fileExt=ts,tsx --extractFrom=./src --recursive --out=../../generated-docs/extract",
@@ -66,7 +62,7 @@
     "@itwin/itwinui-icons-react": "^2.8.0",
     "@itwin/itwinui-variables": "^3.0.0",
     "@itwin/webgl-compatibility": "^4.0.0",
-    "classnames": "2.3.1",
+    "classnames": "2.5.1",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-redux": "^7.2.2",

apps/test-providers/src/appui-test-providers.ts

@@ -2,54 +2,54 @@
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
  * See LICENSE.md in the project root for license terms and full copyright notice.
  *--------------------------------------------------------------------------------------------*/
-export * from "./tools/ContentLayoutTools";
-export * from "./tools/GenericLocateTool";
-export * from "./tools/InspectUiItemInfoTool";
-export * from "./tools/OpenAbstractModalDialogTool";
-export * from "./tools/OpenCustomDialogTool";
-export * from "./tools/OpenPopoutDialogTool";
-export * from "./tools/OpenPopoutViewTool";
-export * from "./tools/OpenSynchronizedViewTool";
-export * from "./tools/RegisterUiProviderTool";
-export * from "./tools/SampleTool";
-export * from "./tools/ToolWithDynamicSettings";
-export * from "./tools/UiLayoutTools";
-
-export * from "./ui/buttons/ViewSelectorPanel";
-
-export * from "./ui/components/EditorExampleComponent";
-export * from "./ui/components/LanguageSelect";
-
-export * from "./ui/dialogs/SampleModalDialog";
-
-export * from "./ui/frontstages/ComponentExamples";
-export * from "./ui/frontstages/ContentLayoutFrontstage";
-export * from "./ui/frontstages/CustomContentFrontstage";
-export * from "./ui/frontstages/CustomFrontstageProvider";
-export * from "./ui/frontstages/PopoutWindowsFrontstage";
-export * from "./ui/frontstages/registerCustomFrontstage";
-export * from "./ui/frontstages/SynchronizedViewportFrontstage";
-
-export * from "./ui/providers/AbstractUiItemsProvider";
-export * from "./ui/providers/ContentLayoutStageUiItemsProvider";
-export * from "./ui/providers/CustomContentStageUiProvider";
-export * from "./ui/providers/FloatingWidgetsUiItemsProvider";
-export * from "./ui/providers/InspectUiItemInfoToolProvider";
-export * from "./ui/providers/MessageUiItemsProvider";
-export * from "./ui/providers/PopoutWindowsProvider";
-export * from "./ui/providers/PreviewFeaturesToggleProvider";
-export * from "./ui/providers/SynchronizedViewportProvider";
-export * from "./ui/providers/UpdatedUiItemsProvider";
-export * from "./ui/providers/WidgetContentProvider";
-
-export * from "./ui/widgets/ITwinUIv2Widget";
-export * from "./ui/widgets/LayoutWidget";
-export * from "./ui/widgets/LogLifecycleWidget";
-export * from "./ui/widgets/UseWidgetHookWidget";
-
-export * from "./ui/useActiveContentId";
-export * from "./ui/ViewportContent";
-
-export * from "./AppUiTestProviders";
-export * from "./createBlankConnection";
-export * from "./store";
+export * from "./tools/ContentLayoutTools.js";
+export * from "./tools/GenericLocateTool.js";
+export * from "./tools/InspectUiItemInfoTool.js";
+export * from "./tools/OpenAbstractModalDialogTool.js";
+export * from "./tools/OpenCustomDialogTool.js";
+export * from "./tools/OpenPopoutDialogTool.js";
+export * from "./tools/OpenPopoutViewTool.js";
+export * from "./tools/OpenSynchronizedViewTool.js";
+export * from "./tools/RegisterUiProviderTool.js";
+export * from "./tools/SampleTool.js";
+export * from "./tools/ToolWithDynamicSettings.js";
+export * from "./tools/UiLayoutTools.js";
+
+export * from "./ui/buttons/ViewSelectorPanel.js";
+
+export * from "./ui/components/EditorExampleComponent.js";
+export * from "./ui/components/LanguageSelect.js";
+
+export * from "./ui/dialogs/SampleModalDialog.js";
+
+export * from "./ui/frontstages/ComponentExamples.js";
+export * from "./ui/frontstages/ContentLayoutFrontstage.js";
+export * from "./ui/frontstages/CustomContentFrontstage.js";
+export * from "./ui/frontstages/CustomFrontstageProvider.js";
+export * from "./ui/frontstages/PopoutWindowsFrontstage.js";
+export * from "./ui/frontstages/registerCustomFrontstage.js";
+export * from "./ui/frontstages/SynchronizedViewportFrontstage.js";
+
+export * from "./ui/providers/AbstractUiItemsProvider.js";
+export * from "./ui/providers/ContentLayoutStageUiItemsProvider.js";
+export * from "./ui/providers/CustomContentStageUiProvider.js";
+export * from "./ui/providers/FloatingWidgetsUiItemsProvider.js";
+export * from "./ui/providers/InspectUiItemInfoToolProvider.js";
+export * from "./ui/providers/MessageUiItemsProvider.js";
+export * from "./ui/providers/PopoutWindowsProvider.js";
+export * from "./ui/providers/PreviewFeaturesToggleProvider.js";
+export * from "./ui/providers/SynchronizedViewportProvider.js";
+export * from "./ui/providers/UpdatedUiItemsProvider.js";
+export * from "./ui/providers/WidgetContentProvider.js";
+
+export * from "./ui/widgets/ITwinUIv2Widget.js";
+export * from "./ui/widgets/LayoutWidget.js";
+export * from "./ui/widgets/LogLifecycleWidget.js";
+export * from "./ui/widgets/UseWidgetHookWidget.js";
+
+export * from "./ui/useActiveContentId.js";
+export * from "./ui/ViewportContent.js";
+
+export * from "./AppUiTestProviders.js";
+export * from "./createBlankConnection.js";
+export * from "./store.js";

apps/test-providers/src/docs/UiItemsProvider.Override.ts

@@ -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 { provider } from "./UiItemsProvider.Provider";
+import { provider } from "./UiItemsProvider.Provider.js";
 // __PUBLISH_EXTRACT_START__ AppUI.UiItemsProvider.Override
 import { UiItemsManager } from "@itwin/appui-react";
 

apps/test-providers/src/docs/UiItemsProvider.Register.ts

@@ -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 { provider } from "./UiItemsProvider.Provider";
+import { provider } from "./UiItemsProvider.Provider.js";
 // __PUBLISH_EXTRACT_START__ AppUI.UiItemsProvider.Register
 import { UiItemsManager } from "@itwin/appui-react";
 

apps/test-providers/src/tools/ContentLayoutTools.tsx

@@ -24,7 +24,7 @@ import { SvgWindow, SvgWindowSplitVertical } from "@itwin/itwinui-icons-react";
 
 import layoutRestoreIconSvg from "@bentley/icons-generic/icons/download.svg";
 import layoutSaveIconSvg from "@bentley/icons-generic/icons/upload.svg";
-import { ViewportContent } from "../ui/ViewportContent";
+import { ViewportContent } from "../ui/ViewportContent.js";
 
 function getIModelSpecificKey(
   inKey: string,

apps/test-providers/src/tools/GenericLocateTool.ts

@@ -19,7 +19,7 @@ import {
 import { Point3d } from "@itwin/core-geometry";
 import { UiFramework } from "@itwin/appui-react";
 import { ToolbarItemUtilities } from "@itwin/appui-abstract";
-import { AppUiTestProviders } from "../AppUiTestProviders";
+import { AppUiTestProviders } from "../AppUiTestProviders.js";
 import genericToolSvg from "./generic-tool.svg";
 
 /** Sample Primitive tool where user selects an element for processing */

apps/test-providers/src/tools/OpenAbstractModalDialogTool.ts

@@ -7,8 +7,8 @@
  */
 
 import { Tool } from "@itwin/core-frontend";
-import { AbstractDialogDataProvider } from "../ui/dialogs/TestUiProviderDialog";
-import { AppUiTestProviders } from "../AppUiTestProviders";
+import { AbstractDialogDataProvider } from "../ui/dialogs/TestUiProviderDialog.js";
+import { AppUiTestProviders } from "../AppUiTestProviders.js";
 import { UiFramework } from "@itwin/appui-react";
 
 /**

apps/test-providers/src/tools/OpenCustomDialogTool.tsx

@@ -8,8 +8,8 @@
 
 import * as React from "react";
 import { Tool } from "@itwin/core-frontend";
-import { SampleModalDialog } from "../ui/dialogs/SampleModalDialog";
-import { AppUiTestProviders } from "../AppUiTestProviders";
+import { SampleModalDialog } from "../ui/dialogs/SampleModalDialog.js";
+import { AppUiTestProviders } from "../AppUiTestProviders.js";
 import connectedQuerySvg from "../ui/icons/connected-query.svg";
 import { UiFramework } from "@itwin/appui-react";
 

apps/test-providers/src/tools/OpenPopoutDialogTool.tsx

@@ -10,7 +10,7 @@ import {
 } from "@itwin/appui-abstract";
 import windowAddSvg from "@bentley/icons-generic/icons/window-add.svg";
 import { ChildWindowLocationProps, UiFramework } from "@itwin/appui-react";
-import { PopoutDialog } from "../ui/dialogs/PopoutDialog";
+import { PopoutDialog } from "../ui/dialogs/PopoutDialog.js";
 
 /**
  * Immediate tool that will open an example popout dialog.The tool is created and register to allow the user

apps/test-providers/src/tools/OpenPopoutViewTool.tsx

@@ -7,7 +7,7 @@ import { ChildWindowLocationProps, UiFramework } from "@itwin/appui-react";
 import { IModelApp, Tool } from "@itwin/core-frontend";
 import * as React from "react";
 import windowPopoutSvg from "@bentley/icons-generic/icons/window-new.svg";
-import { PopupTestView } from "../ui/dialogs/PopupTestView";
+import { PopupTestView } from "../ui/dialogs/PopupTestView.js";
 
 export class OpenPopoutViewTool extends Tool {
   private static _counter = 0;

apps/test-providers/src/tools/OpenSynchronizedViewTool.tsx

@@ -5,7 +5,7 @@
 import { UiFramework } from "@itwin/appui-react";
 import { IModelApp, Tool } from "@itwin/core-frontend";
 import * as React from "react";
-import { SynchronizedFloatingView } from "../ui/dialogs/SynchronizedFloatingViewComponent";
+import { SynchronizedFloatingView } from "../ui/dialogs/SynchronizedFloatingViewComponent.js";
 import panoramaconSvg from "@bentley/icons-generic/icons/panorama.svg";
 import { Dialog } from "@itwin/itwinui-react";
 

apps/test-providers/src/tools/SampleTool.ts

@@ -39,7 +39,7 @@ import {
   CursorMenuItemProps,
   UiFramework,
 } from "@itwin/appui-react";
-import { AppUiTestProviders } from "../AppUiTestProviders";
+import { AppUiTestProviders } from "../AppUiTestProviders.js";
 import sampleToolSvg from "./SampleTool.svg";
 
 enum ToolOptions {

apps/test-providers/src/tools/ToolWithDynamicSettings.ts

@@ -21,7 +21,7 @@ import {
   PropertyDescription,
 } from "@itwin/appui-abstract";
 import dynamicToolSvg from "./DynamicTool.svg";
-import { AppUiTestProviders } from "../AppUiTestProviders";
+import { AppUiTestProviders } from "../AppUiTestProviders.js";
 
 interface MajorCities {
   state: number;

apps/test-providers/src/ui/components/LanguageSelect.tsx

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 import * as React from "react";
 import { LabeledSelect } from "@itwin/itwinui-react";
-import { useTranslation } from "../../useTranslation";
+import { useTranslation } from "../../useTranslation.js";
 import "./LanguageSelect.scss";
 
 export type Language = "en-US" | "en-PSEUDO";

apps/test-providers/src/ui/components/ViewsTable.tsx

@@ -6,7 +6,7 @@
 import * as React from "react";
 import { Table } from "@itwin/itwinui-react";
 import { useActiveIModelConnection } from "@itwin/appui-react";
-import { getViewDefinitions } from "./ViewDefinitionSelector";
+import { getViewDefinitions } from "./ViewDefinitionSelector.js";
 import type { Column } from "@itwin/itwinui-react/react-table";
 
 interface ViewDataItem {

apps/test-providers/src/ui/dialogs/PopoutDialog.tsx

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 
 import * as React from "react";
-import { ViewsTable } from "../components/ViewsTable";
+import { ViewsTable } from "../components/ViewsTable.js";
 import "./PopoutDialog.scss";
 
 export function PopoutDialog() {

apps/test-providers/src/ui/dialogs/PopupTestView.tsx

@@ -5,6 +5,7 @@
 
 import * as React from "react";
 import {
+  CursorMenuItemProps,
   FloatingViewportContent,
   UiFramework,
   useActiveIModelConnection,
@@ -13,9 +14,8 @@ import {
 import "./PopupTestView.scss";
 import ViewDefinitionSelector, {
   getViewDefinitions,
-} from "../components/ViewDefinitionSelector";
+} from "../components/ViewDefinitionSelector.js";
 import { Id64String } from "@itwin/core-bentley";
-import { CursorMenuItemProps } from "@itwin/appui-react/lib/cjs/appui-react/shared/MenuItem";
 import { Button } from "@itwin/itwinui-react";
 import { ScreenViewport } from "@itwin/core-frontend";
 

apps/test-providers/src/ui/dialogs/SampleModalDialog.tsx

@@ -5,7 +5,7 @@
 import * as React from "react";
 
 import { UiFramework } from "@itwin/appui-react";
-import { useTranslation } from "../../useTranslation";
+import { useTranslation } from "../../useTranslation.js";
 import { Button, Dialog } from "@itwin/itwinui-react";
 
 /**

apps/test-providers/src/ui/dialogs/SynchronizedFloatingViewComponent.tsx

@@ -11,7 +11,7 @@ import {
 } from "@itwin/appui-react";
 import { ScreenViewport, Viewport, ViewState } from "@itwin/core-frontend";
 import { ViewportComponentEvents } from "@itwin/imodel-components-react";
-import { getViewDefinitions } from "../components/ViewDefinitionSelector";
+import { getViewDefinitions } from "../components/ViewDefinitionSelector.js";
 
 interface SynchronizedViewDefInterfaceLocal {
   id: string;

apps/test-providers/src/ui/frontstages/ComponentExamples.tsx

@@ -14,9 +14,9 @@ import {
   UiFramework,
 } from "@itwin/appui-react";
 import { ToggleSwitch } from "@itwin/itwinui-react";
-import { ComponentExamplesProvider } from "../providers/ComponentExamplesProvider";
-import { AppUiTestProviders } from "../../AppUiTestProviders";
-import { useTranslation } from "../../useTranslation";
+import { ComponentExamplesProvider } from "../providers/ComponentExamplesProvider.js";
+import { AppUiTestProviders } from "../../AppUiTestProviders.js";
+import { useTranslation } from "../../useTranslation.js";
 
 export interface ComponentExampleCategory {
   title: string;

apps/test-providers/src/ui/frontstages/ContentLayoutFrontstage.tsx

@@ -14,8 +14,8 @@ import {
   StandardContentLayouts,
   UiFramework,
 } from "@itwin/appui-react";
-import { getSavedViewLayoutProps } from "../../tools/ContentLayoutTools";
-import { ViewportContent } from "../ViewportContent";
+import { getSavedViewLayoutProps } from "../../tools/ContentLayoutTools.js";
+import { ViewportContent } from "../ViewportContent.js";
 
 /** The ContentLayoutStageContentGroupProvider provides a class with the primary method `provideContentGroup` to provide a ContentGroup
  * to a stage when the stage is activated. This provider will look to see if the user saved out a ContentGroup to use when a stage and

apps/test-providers/src/ui/frontstages/CustomContentFrontstage.tsx

@@ -13,8 +13,8 @@ import {
   UiFramework,
   ViewToolWidgetComposer,
 } from "@itwin/appui-react";
-import { SampleContentControl } from "../content/SampleContentControl";
-import { useActiveContentId } from "../useActiveContentId";
+import { SampleContentControl } from "../content/SampleContentControl.js";
+import { useActiveContentId } from "../useActiveContentId.js";
 
 function CustomViewToolWidgetComposer() {
   const activeId = useActiveContentId();

apps/test-providers/src/ui/frontstages/PopoutWindowsFrontstage.tsx

@@ -9,7 +9,7 @@ import {
   StageUsage,
   StandardContentLayouts,
 } from "@itwin/appui-react";
-import { ViewportContent } from "../ViewportContent";
+import { ViewportContent } from "../ViewportContent.js";
 
 export function createPopoutWindowsFrontstage() {
   return FrontstageUtilities.createStandardFrontstage({

apps/test-providers/src/ui/frontstages/SynchronizedViewportFrontstage.tsx

@@ -10,7 +10,7 @@ import {
   StageUsage,
   StandardContentLayouts,
 } from "@itwin/appui-react";
-import { ViewportContent } from "../ViewportContent";
+import { ViewportContent } from "../ViewportContent.js";
 
 export function createSynchronizedViewportFrontstage(): Frontstage {
   return FrontstageUtilities.createStandardFrontstage({

apps/test-providers/src/ui/frontstages/registerCustomFrontstage.tsx

@@ -5,7 +5,7 @@
 // __PUBLISH_EXTRACT_START__ AppUI.Frontstage.Register.Imports
 import { UiFramework } from "@itwin/appui-react";
 // __PUBLISH_EXTRACT_END__
-import { customFrontstageProvider } from "./CustomFrontstageProvider";
+import { customFrontstageProvider } from "./CustomFrontstageProvider.js";
 
 export function registerCustomFrontstage() {
   // __PUBLISH_EXTRACT_START__ AppUI.Frontstage.Register

apps/test-providers/src/ui/providers/AbstractUiItemsProvider.tsx

@@ -14,11 +14,11 @@ import {
   ToolbarUsage,
   UiItemsProvider,
 } from "@itwin/appui-react";
-import { SampleTool } from "../../tools/SampleTool";
-import { AppUiTestProviders } from "../../AppUiTestProviders";
-import { OpenAbstractDialogTool } from "../../tools/OpenAbstractModalDialogTool";
-import { ToolWithDynamicSettings } from "../../tools/ToolWithDynamicSettings";
-import { UnitsField } from "../statusfields/unitsfield/UnitsField";
+import { SampleTool } from "../../tools/SampleTool.js";
+import { AppUiTestProviders } from "../../AppUiTestProviders.js";
+import { OpenAbstractDialogTool } from "../../tools/OpenAbstractModalDialogTool.js";
+import { ToolWithDynamicSettings } from "../../tools/ToolWithDynamicSettings.js";
+import { UnitsField } from "../statusfields/unitsfield/UnitsField.js";
 
 /** The AbstractUiItemsProvider provides additional items to any frontstage that has a usage value of StageUsage.General.
  * The unique thing about the items provided with this provider is that the toolbar and and statusbar items provider simply