diff --git a/src/core/__tests__/chart-core-axes.test.tsx b/src/core/__tests__/chart-core-axes.test.tsx
index d9455e86..4b941918 100644
--- a/src/core/__tests__/chart-core-axes.test.tsx
+++ b/src/core/__tests__/chart-core-axes.test.tsx
@@ -3,13 +3,13 @@
 
 import type Highcharts from "highcharts";
 import highcharts from "highcharts";
-import HighchartsReact from "highcharts-react-official";
+import { HighchartsReact } from "highcharts-react-official";
 import { vi } from "vitest";
 
 import testClasses from "../../../lib/components/core/test-classes/styles.selectors";
 import { objectContainingDeep, renderChart } from "./common";
 
-vi.mock("highcharts-react-official", () => ({ __esModule: true, default: vi.fn(() => null) }));
+vi.mock("highcharts-react-official", () => ({ HighchartsReact: vi.fn(() => null) }));
 
 const series: Highcharts.SeriesOptionsType[] = [
   { type: "line", name: "Line 1", data: [1, 2, 3] },
diff --git a/src/core/__tests__/chart-core-fit-size.test.tsx b/src/core/__tests__/chart-core-fit-size.test.tsx
index b41b4723..140f3513 100644
--- a/src/core/__tests__/chart-core-fit-size.test.tsx
+++ b/src/core/__tests__/chart-core-fit-size.test.tsx
@@ -4,7 +4,7 @@
 import { useEffect, useRef } from "react";
 import { render as rtlRender, waitFor } from "@testing-library/react";
 import highcharts from "highcharts";
-import HighchartsReact from "highcharts-react-official";
+import { HighchartsReact } from "highcharts-react-official";
 import { vi } from "vitest";
 
 import { circleIndex } from "@cloudscape-design/component-toolkit/internal";
@@ -13,7 +13,7 @@ import { ChartContainer } from "../../../lib/components/core/chart-container";
 import testClasses from "../../../lib/components/core/test-classes/styles.selectors";
 import { objectContainingDeep, renderChart } from "./common";
 
-vi.mock("highcharts-react-official", () => ({ __esModule: true, default: vi.fn(() => null) }));
+vi.mock("highcharts-react-official", () => ({ HighchartsReact: vi.fn(() => null) }));
 
 // In chart container we use three container queries, that run in the following order: chart, header, footer.
 let queryMeasurementIndex = 0;
diff --git a/src/core/__tests__/chart-core-options.test.tsx b/src/core/__tests__/chart-core-options.test.tsx
index bea9a3b0..5526dc58 100644
--- a/src/core/__tests__/chart-core-options.test.tsx
+++ b/src/core/__tests__/chart-core-options.test.tsx
@@ -3,14 +3,14 @@
 
 import type Highcharts from "highcharts";
 import highcharts from "highcharts";
-import HighchartsReact from "highcharts-react-official";
+import { HighchartsReact } from "highcharts-react-official";
 import { vi } from "vitest";
 
 import { CoreChartProps } from "../../../lib/components/core/interfaces";
 import { objectContainingDeep, renderChart } from "./common";
 import { ChartRendererStub } from "./highcharts-utils";
 
-vi.mock("highcharts-react-official", () => ({ __esModule: true, default: vi.fn(() => null) }));
+vi.mock("highcharts-react-official", () => ({ HighchartsReact: vi.fn(() => null) }));
 
 const rendererStub = new ChartRendererStub();
 const chartStub = {
diff --git a/src/core/chart-core.tsx b/src/core/chart-core.tsx
index adf28c27..625722b6 100644
--- a/src/core/chart-core.tsx
+++ b/src/core/chart-core.tsx
@@ -4,7 +4,7 @@
 import { useEffect, useRef } from "react";
 import clsx from "clsx";
 import type Highcharts from "highcharts";
-import HighchartsReact from "highcharts-react-official";
+import { HighchartsReact } from "highcharts-react-official";
 
 import {
   getIsRtl,