refactor(charts): migrate to @ui5/webcomponents-react(-base) subpath imports (#8490)

Lukas742 · web-flow · commit 0b27ab955207 · 2026-04-20T09:45:25.000+02:00
#8489 must be merged first
diff --git a/packages/charts/src/components/BarChart/BarChart.cy.tsx b/packages/charts/src/components/BarChart/BarChart.cy.tsx
@@ -5,7 +5,7 @@ import {
   testChartLegendConfig,
   testChartZoomingTool,
   testStackAggregateTotals,
-} from '@/cypress/support/utils';
+} from '../../../../../cypress/support/utils';
 
 const dimensions = [
   {
diff --git a/packages/charts/src/components/BarChart/BarChart.mdx b/packages/charts/src/components/BarChart/BarChart.mdx
@@ -1,4 +1,4 @@
-import { ControlsWithNote, DocsHeader, Footer } from '@sb/components';
+import { ControlsWithNote, DocsHeader, Footer } from '../../../../../.storybook/components';
 import { Canvas, Meta } from '@storybook/addon-docs/blocks';
 import TooltipStory from '../../resources/TooltipConfig.mdx';
 import LegendStory from '../../resources/LegendConfig.mdx';
diff --git a/packages/charts/src/components/BarChart/Placeholder.tsx b/packages/charts/src/components/BarChart/Placeholder.tsx
@@ -1,4 +1,4 @@
-import { ThemingParameters } from '@ui5/webcomponents-react-base';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import ContentLoader from 'react-content-loader';
 
 export const BarChartPlaceholder = () => {
diff --git a/packages/charts/src/components/BarChart/index.tsx b/packages/charts/src/components/BarChart/index.tsx
@@ -1,6 +1,8 @@
 'use client';
 
-import { enrichEventWithDetails, ThemingParameters, useIsRTL, useSyncRef } from '@ui5/webcomponents-react-base';
+import { useIsRTL, useSyncRef } from '@ui5/webcomponents-react-base/internal/hooks';
+import { enrichEventWithDetails } from '@ui5/webcomponents-react-base/internal/utils';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import type { CSSProperties } from 'react';
 import { forwardRef, useCallback } from 'react';
 import {
diff --git a/packages/charts/src/components/BulletChart/BulletChart.cy.tsx b/packages/charts/src/components/BulletChart/BulletChart.cy.tsx
@@ -1,6 +1,10 @@
 import { complexDataSet } from '../../resources/DemoProps.js';
 import { BulletChart } from './index.js';
-import { cypressPassThroughTestsFactory, testChartLegendConfig, testChartZoomingTool } from '@/cypress/support/utils';
+import {
+  cypressPassThroughTestsFactory,
+  testChartLegendConfig,
+  testChartZoomingTool,
+} from '../../../../../cypress/support/utils';
 
 const dimensions = [
   {
diff --git a/packages/charts/src/components/BulletChart/BulletChart.mdx b/packages/charts/src/components/BulletChart/BulletChart.mdx
@@ -1,4 +1,4 @@
-import { ControlsWithNote, DocsHeader, Footer } from '@sb/components';
+import { ControlsWithNote, DocsHeader, Footer } from '../../../../../.storybook/components';
 import { Canvas, Meta } from '@storybook/addon-docs/blocks';
 import TooltipStory from '../../resources/TooltipConfig.mdx';
 import LegendStory from '../../resources/LegendConfig.mdx';
diff --git a/packages/charts/src/components/BulletChart/Placeholder.tsx b/packages/charts/src/components/BulletChart/Placeholder.tsx
@@ -1,4 +1,4 @@
-import { ThemingParameters } from '@ui5/webcomponents-react-base';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import ContentLoader from 'react-content-loader';
 import type { IChartMeasure } from '../../interfaces/IChartMeasure.js';
 
diff --git a/packages/charts/src/components/BulletChart/index.tsx b/packages/charts/src/components/BulletChart/index.tsx
@@ -1,6 +1,8 @@
 'use client';
 
-import { enrichEventWithDetails, ThemingParameters, useIsRTL, useSyncRef } from '@ui5/webcomponents-react-base';
+import { useIsRTL, useSyncRef } from '@ui5/webcomponents-react-base/internal/hooks';
+import { enrichEventWithDetails } from '@ui5/webcomponents-react-base/internal/utils';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import type { CSSProperties } from 'react';
 import { forwardRef, useCallback, useMemo } from 'react';
 import {
diff --git a/packages/charts/src/components/ColumnChart/ColumnChart.cy.tsx b/packages/charts/src/components/ColumnChart/ColumnChart.cy.tsx
@@ -5,7 +5,7 @@ import {
   testChartLegendConfig,
   testChartZoomingTool,
   testStackAggregateTotals,
-} from '@/cypress/support/utils';
+} from '../../../../../cypress/support/utils';
 
 const dimensions = [
   {
diff --git a/packages/charts/src/components/ColumnChart/ColumnChart.mdx b/packages/charts/src/components/ColumnChart/ColumnChart.mdx
@@ -1,4 +1,4 @@
-import { ControlsWithNote, DocsHeader, Footer } from '@sb/components';
+import { ControlsWithNote, DocsHeader, Footer } from '../../../../../.storybook/components';
 import { Canvas, Meta } from '@storybook/addon-docs/blocks';
 import TooltipStory from '../../resources/TooltipConfig.mdx';
 import LegendStory from '../../resources/LegendConfig.mdx';
diff --git a/packages/charts/src/components/ColumnChart/Placeholder.tsx b/packages/charts/src/components/ColumnChart/Placeholder.tsx
@@ -1,4 +1,4 @@
-import { ThemingParameters } from '@ui5/webcomponents-react-base';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import ContentLoader from 'react-content-loader';
 
 export const ColumnChartPlaceholder = (props) => {
diff --git a/packages/charts/src/components/ColumnChart/index.tsx b/packages/charts/src/components/ColumnChart/index.tsx
@@ -1,6 +1,8 @@
 'use client';
 
-import { enrichEventWithDetails, ThemingParameters, useIsRTL, useSyncRef } from '@ui5/webcomponents-react-base';
+import { useIsRTL, useSyncRef } from '@ui5/webcomponents-react-base/internal/hooks';
+import { enrichEventWithDetails } from '@ui5/webcomponents-react-base/internal/utils';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import type { CSSProperties } from 'react';
 import { forwardRef, useCallback } from 'react';
 import {
diff --git a/packages/charts/src/components/ColumnChartWithTrend/ColumnChartWithTrend.cy.tsx b/packages/charts/src/components/ColumnChartWithTrend/ColumnChartWithTrend.cy.tsx
@@ -1,6 +1,10 @@
 import { complexDataSet } from '../../resources/DemoProps.js';
 import { ColumnChartWithTrend } from './index.js';
-import { cypressPassThroughTestsFactory, testChartLegendConfig, testChartZoomingTool } from '@/cypress/support/utils';
+import {
+  cypressPassThroughTestsFactory,
+  testChartLegendConfig,
+  testChartZoomingTool,
+} from '../../../../../cypress/support/utils';
 
 const dimensions = [
   {
diff --git a/packages/charts/src/components/ColumnChartWithTrend/ColumnChartWithTrend.mdx b/packages/charts/src/components/ColumnChartWithTrend/ColumnChartWithTrend.mdx
@@ -1,4 +1,4 @@
-import { ControlsWithNote, DocsHeader, Footer } from '@sb/components';
+import { ControlsWithNote, DocsHeader, Footer } from '../../../../../.storybook/components';
 import { Canvas, Meta } from '@storybook/addon-docs/blocks';
 import * as ComponentStories from './ColumnChartWithTrend.stories';
 import LegendStory from '../../resources/LegendConfig.mdx';
diff --git a/packages/charts/src/components/ColumnChartWithTrend/Placeholder.tsx b/packages/charts/src/components/ColumnChartWithTrend/Placeholder.tsx
@@ -1,4 +1,4 @@
-import { ThemingParameters } from '@ui5/webcomponents-react-base';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import ContentLoader from 'react-content-loader';
 
 export const ColumnChartWithTrendPlaceholder = (props) => {
diff --git a/packages/charts/src/components/ColumnChartWithTrend/index.tsx b/packages/charts/src/components/ColumnChartWithTrend/index.tsx
@@ -1,6 +1,7 @@
 'use client';
 
-import { ThemingParameters, useStylesheet } from '@ui5/webcomponents-react-base';
+import { useStylesheet } from '@ui5/webcomponents-react-base/internal/hooks';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import { clsx } from 'clsx';
 import type { CSSProperties } from 'react';
 import { forwardRef, useId } from 'react';
diff --git a/packages/charts/src/components/ComposedChart/ComposedChart.cy.tsx b/packages/charts/src/components/ComposedChart/ComposedChart.cy.tsx
@@ -5,7 +5,7 @@ import {
   testChartLegendConfig,
   testChartZoomingTool,
   testStackAggregateTotals,
-} from '@/cypress/support/utils';
+} from '../../../../../cypress/support/utils';
 
 const dimensions = [
   {
diff --git a/packages/charts/src/components/ComposedChart/ComposedChart.mdx b/packages/charts/src/components/ComposedChart/ComposedChart.mdx
@@ -1,4 +1,4 @@
-import { ControlsWithNote, DocsHeader, Footer } from '@sb/components';
+import { ControlsWithNote, DocsHeader, Footer } from '../../../../../.storybook/components';
 import { Canvas, Meta } from '@storybook/addon-docs/blocks';
 import TooltipStory from '../../resources/TooltipConfig.mdx';
 import LegendStory from '../../resources/LegendConfig.mdx';
diff --git a/packages/charts/src/components/ComposedChart/Placeholder.tsx b/packages/charts/src/components/ComposedChart/Placeholder.tsx
@@ -1,4 +1,4 @@
-import { ThemingParameters } from '@ui5/webcomponents-react-base';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import ContentLoader from 'react-content-loader';
 import type { IChartMeasure } from '../../interfaces/IChartMeasure.js';
 
diff --git a/packages/charts/src/components/ComposedChart/index.tsx b/packages/charts/src/components/ComposedChart/index.tsx
@@ -1,6 +1,8 @@
 'use client';
 
-import { enrichEventWithDetails, ThemingParameters, useIsRTL, useSyncRef } from '@ui5/webcomponents-react-base';
+import { useIsRTL, useSyncRef } from '@ui5/webcomponents-react-base/internal/hooks';
+import { enrichEventWithDetails } from '@ui5/webcomponents-react-base/internal/utils';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import type { CSSProperties, FC } from 'react';
 import { forwardRef, useCallback } from 'react';
 import {
diff --git a/packages/charts/src/components/DonutChart/DonutChart.cy.tsx b/packages/charts/src/components/DonutChart/DonutChart.cy.tsx
@@ -1,6 +1,6 @@
 import { complexDataSet, simpleDataSet } from '../../resources/DemoProps.js';
 import { DonutChart } from './index.js';
-import { cypressPassThroughTestsFactory, testChartLegendConfig } from '@/cypress/support/utils';
+import { cypressPassThroughTestsFactory, testChartLegendConfig } from '../../../../../cypress/support/utils';
 
 const dimension = {
   accessor: 'name',
diff --git a/packages/charts/src/components/DonutChart/DonutChart.mdx b/packages/charts/src/components/DonutChart/DonutChart.mdx
@@ -1,5 +1,5 @@
 import { Canvas, Meta } from '@storybook/addon-docs/blocks';
-import { ControlsWithNote, DocsHeader, Footer } from '@sb/components';
+import { ControlsWithNote, DocsHeader, Footer } from '../../../../../.storybook/components';
 import TooltipStory from '../../resources/TooltipConfig.mdx';
 import * as ComponentStories from './DonutChart.stories';
 import LegendStory from '../../resources/LegendConfig.mdx';
diff --git a/packages/charts/src/components/LineChart/LineChart.cy.tsx b/packages/charts/src/components/LineChart/LineChart.cy.tsx
@@ -1,6 +1,10 @@
 import { complexDataSet } from '../../resources/DemoProps.js';
 import { LineChart } from './index.js';
-import { cypressPassThroughTestsFactory, testChartLegendConfig, testChartZoomingTool } from '@/cypress/support/utils';
+import {
+  cypressPassThroughTestsFactory,
+  testChartLegendConfig,
+  testChartZoomingTool,
+} from '../../../../../cypress/support/utils';
 
 const dimensions = [
   {
diff --git a/packages/charts/src/components/LineChart/LineChart.mdx b/packages/charts/src/components/LineChart/LineChart.mdx
@@ -1,5 +1,5 @@
 import { Canvas, Meta } from '@storybook/addon-docs/blocks';
-import { ControlsWithNote, DocsHeader, Footer } from '@sb/components';
+import { ControlsWithNote, DocsHeader, Footer } from '../../../../../.storybook/components';
 import TooltipStory from '../../resources/TooltipConfig.mdx';
 import * as ComponentStories from './LineChart.stories';
 import LegendStory from '../../resources/LegendConfig.mdx';
diff --git a/packages/charts/src/components/LineChart/Placeholder.tsx b/packages/charts/src/components/LineChart/Placeholder.tsx
@@ -1,4 +1,4 @@
-import { ThemingParameters } from '@ui5/webcomponents-react-base';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import ContentLoader from 'react-content-loader';
 
 export const LineChartPlaceholder = (props) => {
diff --git a/packages/charts/src/components/LineChart/index.tsx b/packages/charts/src/components/LineChart/index.tsx
@@ -1,6 +1,8 @@
 'use client';
 
-import { enrichEventWithDetails, ThemingParameters, useIsRTL, useSyncRef } from '@ui5/webcomponents-react-base';
+import { useIsRTL, useSyncRef } from '@ui5/webcomponents-react-base/internal/hooks';
+import { enrichEventWithDetails } from '@ui5/webcomponents-react-base/internal/utils';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import { forwardRef, useRef } from 'react';
 import type { LineProps, YAxisProps } from 'recharts';
 import {
diff --git a/packages/charts/src/components/PieChart/PieChart.cy.tsx b/packages/charts/src/components/PieChart/PieChart.cy.tsx
@@ -1,7 +1,7 @@
 import { Text as RechartsText } from 'recharts';
 import { complexDataSet, simpleDataSet } from '../../resources/DemoProps.js';
 import { PieChart } from './index.js';
-import { cypressPassThroughTestsFactory, testChartLegendConfig } from '@/cypress/support/utils';
+import { cypressPassThroughTestsFactory, testChartLegendConfig } from '../../../../../cypress/support/utils';
 
 const dimension = {
   accessor: 'name',
diff --git a/packages/charts/src/components/PieChart/PieChart.mdx b/packages/charts/src/components/PieChart/PieChart.mdx
@@ -1,4 +1,4 @@
-import { ControlsWithNote, DocsHeader, Footer } from '@sb/components';
+import { ControlsWithNote, DocsHeader, Footer } from '../../../../../.storybook/components';
 import { Canvas, Meta } from '@storybook/addon-docs/blocks';
 import TooltipStory from '../../resources/TooltipConfig.mdx';
 import * as ComponentStories from './PieChart.stories';
diff --git a/packages/charts/src/components/PieChart/Placeholder.tsx b/packages/charts/src/components/PieChart/Placeholder.tsx
@@ -1,4 +1,4 @@
-import { ThemingParameters } from '@ui5/webcomponents-react-base';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import ContentLoader from 'react-content-loader';
 
 export const PieChartPlaceholder = (props) => {
diff --git a/packages/charts/src/components/PieChart/index.tsx b/packages/charts/src/components/PieChart/index.tsx
@@ -1,6 +1,7 @@
 'use client';
 
-import { enrichEventWithDetails, useStylesheet, useSyncRef } from '@ui5/webcomponents-react-base';
+import { useStylesheet, useSyncRef } from '@ui5/webcomponents-react-base/internal/hooks';
+import { enrichEventWithDetails } from '@ui5/webcomponents-react-base/internal/utils';
 import { clsx } from 'clsx';
 import type { CSSProperties } from 'react';
 import { cloneElement, forwardRef, isValidElement, useCallback, useMemo } from 'react';
diff --git a/packages/charts/src/components/RadarChart/RadarChart.cy.tsx b/packages/charts/src/components/RadarChart/RadarChart.cy.tsx
@@ -1,6 +1,6 @@
 import { complexDataSet } from '../../resources/DemoProps.js';
 import { RadarChart } from './index.js';
-import { cypressPassThroughTestsFactory, testChartLegendConfig } from '@/cypress/support/utils';
+import { cypressPassThroughTestsFactory, testChartLegendConfig } from '../../../../../cypress/support/utils';
 
 const dimensions = [
   {
diff --git a/packages/charts/src/components/RadarChart/RadarChart.mdx b/packages/charts/src/components/RadarChart/RadarChart.mdx
@@ -1,4 +1,4 @@
-import { ControlsWithNote, DocsHeader, Footer } from '@sb/components';
+import { ControlsWithNote, DocsHeader, Footer } from '../../../../../.storybook/components';
 import { Canvas, Meta } from '@storybook/addon-docs/blocks';
 import TooltipStory from '../../resources/TooltipConfig.mdx';
 import * as ComponentStories from './RadarChart.stories';
diff --git a/packages/charts/src/components/RadarChart/index.tsx b/packages/charts/src/components/RadarChart/index.tsx
@@ -1,6 +1,7 @@
 'use client';
 
-import { enrichEventWithDetails, ThemingParameters } from '@ui5/webcomponents-react-base';
+import { enrichEventWithDetails } from '@ui5/webcomponents-react-base/internal/utils';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import { forwardRef, useCallback, useRef } from 'react';
 import type { PolarGridProps } from 'recharts';
 import {
diff --git a/packages/charts/src/components/RadialChart/RadialChart.cy.tsx b/packages/charts/src/components/RadialChart/RadialChart.cy.tsx
@@ -1,5 +1,5 @@
 import { RadialChart } from './index.js';
-import { cypressPassThroughTestsFactory } from '@/cypress/support/utils';
+import { cypressPassThroughTestsFactory } from '../../../../../cypress/support/utils';
 
 describe('RadialChart', () => {
   it('Basic', () => {
diff --git a/packages/charts/src/components/RadialChart/RadialChart.mdx b/packages/charts/src/components/RadialChart/RadialChart.mdx
@@ -1,4 +1,4 @@
-import { ControlsWithNote, DocsHeader, Footer } from '@sb/components';
+import { ControlsWithNote, DocsHeader, Footer } from '../../../../../.storybook/components';
 import { Canvas, Meta } from '@storybook/addon-docs/blocks';
 import * as ComponentStories from './RadialChart.stories';
 
diff --git a/packages/charts/src/components/RadialChart/RadialChart.stories.tsx b/packages/charts/src/components/RadialChart/RadialChart.stories.tsx
@@ -1,6 +1,9 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
-import { FlexBox, FlexBoxAlignItems, FlexBoxJustifyContent, Text } from '@ui5/webcomponents-react';
-import { ThemingParameters } from '@ui5/webcomponents-react-base';
+import { FlexBoxAlignItems } from '@ui5/webcomponents-react/enums/FlexBoxAlignItems';
+import { FlexBoxJustifyContent } from '@ui5/webcomponents-react/enums/FlexBoxJustifyContent';
+import { FlexBox } from '@ui5/webcomponents-react/FlexBox';
+import { Text } from '@ui5/webcomponents-react/Text';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import { RadialChart } from './index.js';
 
 const meta = {
diff --git a/packages/charts/src/components/RadialChart/index.tsx b/packages/charts/src/components/RadialChart/index.tsx
@@ -1,7 +1,8 @@
 'use client';
 
-import type { CommonProps } from '@ui5/webcomponents-react';
-import { enrichEventWithDetails, ThemingParameters } from '@ui5/webcomponents-react-base';
+import type { CommonProps } from '@ui5/webcomponents-react-base/internal/types';
+import { enrichEventWithDetails } from '@ui5/webcomponents-react-base/internal/utils';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import type { CSSProperties } from 'react';
 import { forwardRef } from 'react';
 import { PolarAngleAxis, RadialBar, RadialBarChart } from 'recharts';
diff --git a/packages/charts/src/components/ScatterChart/Placeholder.tsx b/packages/charts/src/components/ScatterChart/Placeholder.tsx
@@ -1,4 +1,4 @@
-import { ThemingParameters } from '@ui5/webcomponents-react-base';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import ContentLoader from 'react-content-loader';
 
 export const ScatterChartPlaceholder = (props) => {
diff --git a/packages/charts/src/components/ScatterChart/ScatterChart.cy.tsx b/packages/charts/src/components/ScatterChart/ScatterChart.cy.tsx
@@ -1,6 +1,6 @@
 import { complexDataSet, scatterComplexDataSet } from '../../resources/DemoProps.js';
 import { ScatterChart } from './index.js';
-import { cypressPassThroughTestsFactory, testChartLegendConfig } from '@/cypress/support/utils';
+import { cypressPassThroughTestsFactory, testChartLegendConfig } from '../../../../../cypress/support/utils';
 
 const measures = [
   {
diff --git a/packages/charts/src/components/ScatterChart/ScatterChart.mdx b/packages/charts/src/components/ScatterChart/ScatterChart.mdx
@@ -1,4 +1,4 @@
-import { ControlsWithNote, DocsHeader, Footer } from '@sb/components';
+import { ControlsWithNote, DocsHeader, Footer } from '../../../../../.storybook/components';
 import { Canvas, Meta } from '@storybook/addon-docs/blocks';
 import TooltipStory from '../../resources/TooltipConfig.mdx';
 import * as ComponentStories from './ScatterChart.stories';
diff --git a/packages/charts/src/components/ScatterChart/index.tsx b/packages/charts/src/components/ScatterChart/index.tsx
@@ -1,6 +1,8 @@
 'use client';
 
-import { enrichEventWithDetails, ThemingParameters, useIsRTL, useSyncRef } from '@ui5/webcomponents-react-base';
+import { useIsRTL, useSyncRef } from '@ui5/webcomponents-react-base/internal/hooks';
+import { enrichEventWithDetails } from '@ui5/webcomponents-react-base/internal/utils';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import type { CSSProperties } from 'react';
 import { forwardRef, useCallback, useRef } from 'react';
 import type { ReferenceLineProps } from 'recharts';
diff --git a/packages/charts/src/components/TimelineChart/Placeholder.tsx b/packages/charts/src/components/TimelineChart/Placeholder.tsx
@@ -1,4 +1,4 @@
-import { ThemingParameters } from '@ui5/webcomponents-react-base';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import ContentLoader from 'react-content-loader';
 
 /**
diff --git a/packages/charts/src/components/TimelineChart/TimeLineChart.mdx b/packages/charts/src/components/TimelineChart/TimeLineChart.mdx
@@ -1,6 +1,6 @@
-import { ControlsWithNote, DocsHeader, Footer } from '@sb/components';
+import { ControlsWithNote, DocsHeader, Footer } from '../../../../../.storybook/components';
 import { Canvas, Meta, Markdown, ArgTypes } from '@storybook/addon-docs/blocks';
-import SubcomponentsSection from '@sb/docs/SubcomponentsSection.md?raw';
+import SubcomponentsSection from '../../../../../.storybook/docs/SubcomponentsSection.md?raw';
 import * as ComponentStories from './TimeLineChart.stories';
 import { TimelineChartAnnotation } from './TimelineChartAnnotation';
 
diff --git a/packages/charts/src/components/TimelineChart/TimeLineChart.stories.tsx b/packages/charts/src/components/TimelineChart/TimeLineChart.stories.tsx
@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
-import { ThemingParameters } from '@ui5/webcomponents-react-base';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import { Invention, TimingFigure } from './examples/Annotations.js';
 import { dummyDataSet, dummyDiscreteDataSet, inventionDataset, schedulingEDFData } from './examples/Dataset.js';
 import { TimelineChartAnnotation } from './TimelineChartAnnotation.js';
diff --git a/packages/charts/src/components/TimelineChart/TimelineChartAnnotation.tsx b/packages/charts/src/components/TimelineChart/TimelineChartAnnotation.tsx
@@ -1,5 +1,5 @@
-import type { CommonProps } from '@ui5/webcomponents-react';
-import { useStylesheet } from '@ui5/webcomponents-react-base';
+import { useStylesheet } from '@ui5/webcomponents-react-base/internal/hooks';
+import type { CommonProps } from '@ui5/webcomponents-react-base/internal/types';
 import type { CSSProperties, JSX } from 'react';
 import { forwardRef } from 'react';
 import { DEFAULT_ROW_HEIGHT } from './util/constants.js';
diff --git a/packages/charts/src/components/TimelineChart/TimelineChartHeaders.tsx b/packages/charts/src/components/TimelineChart/TimelineChartHeaders.tsx
@@ -1,4 +1,5 @@
-import { ThemingParameters, useStylesheet } from '@ui5/webcomponents-react-base';
+import { useStylesheet } from '@ui5/webcomponents-react-base/internal/hooks';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import type { CSSProperties, ReactElement } from 'react';
 import { useEffect, useState } from 'react';
 import type { ITimelineChartRow } from './types/TimelineChartTypes.js';
diff --git a/packages/charts/src/components/TimelineChart/chartbody/TimelineChartBody.tsx b/packages/charts/src/components/TimelineChart/chartbody/TimelineChartBody.tsx
@@ -1,4 +1,4 @@
-import { useStylesheet } from '@ui5/webcomponents-react-base';
+import { useStylesheet } from '@ui5/webcomponents-react-base/internal/hooks';
 import type { CSSProperties, ReactNode } from 'react';
 import { forwardRef, useEffect, useImperativeHandle, useRef, useState } from 'react';
 import type { ITimelineChartRow } from '../types/TimelineChartTypes.js';
diff --git a/packages/charts/src/components/TimelineChart/chartbody/TimelineChartGrid.tsx b/packages/charts/src/components/TimelineChart/chartbody/TimelineChartGrid.tsx
@@ -1,4 +1,4 @@
-import { ThemingParameters } from '@ui5/webcomponents-react-base';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import type { ReactElement } from 'react';
 import { DEFAULT_CHART_VERTICAL_COLS, TOLERANCE } from '../util/constants.js';
 
diff --git a/packages/charts/src/components/TimelineChart/chartbody/TimelineChartLayer.tsx b/packages/charts/src/components/TimelineChart/chartbody/TimelineChartLayer.tsx
@@ -1,4 +1,4 @@
-import { useStylesheet } from '@ui5/webcomponents-react-base';
+import { useStylesheet } from '@ui5/webcomponents-react-base/internal/hooks';
 import type { ReactNode } from 'react';
 import { classNames, styleData } from '../util/TimelineChart.module.css.js';
 
diff --git a/packages/charts/src/components/TimelineChart/chartbody/TimelineChartRow.tsx b/packages/charts/src/components/TimelineChart/chartbody/TimelineChartRow.tsx
@@ -1,4 +1,4 @@
-import { throttle } from '@ui5/webcomponents-react-base';
+import { throttle } from '@ui5/webcomponents-react-base/internal/utils';
 import type { CSSProperties, MouseEvent as ReactMouseEvent } from 'react';
 import { useEffect, useRef, useState } from 'react';
 import type { ITimelineChartRow } from '../types/TimelineChartTypes.js';
diff --git a/packages/charts/src/components/TimelineChart/chartbody/TimelineConnections.tsx b/packages/charts/src/components/TimelineChart/chartbody/TimelineConnections.tsx
@@ -1,4 +1,5 @@
-import { ThemingParameters, useIsomorphicLayoutEffect } from '@ui5/webcomponents-react-base';
+import { useIsomorphicLayoutEffect } from '@ui5/webcomponents-react-base/internal/hooks';
+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';
 import type { ReactElement } from 'react';
 import { useState } from 'react';
 import type { ITimelineChartMileStone, ITimelineChartRow, ITimelineChartTask } from '../types/TimelineChartTypes.js';
diff --git a/packages/charts/src/components/TimelineChart/examples/Annotations.tsx b/packages/charts/src/components/TimelineChart/examples/Annotations.tsx
diff --git a/packages/charts/src/components/TimelineChart/index.tsx b/packages/charts/src/components/TimelineChart/index.tsx
diff --git a/packages/charts/src/hooks/useCancelAnimationFallback.ts b/packages/charts/src/hooks/useCancelAnimationFallback.ts
diff --git a/packages/charts/src/hooks/useLegendItemClick.ts b/packages/charts/src/hooks/useLegendItemClick.ts
diff --git a/packages/charts/src/hooks/useObserveXAxisHeights.ts b/packages/charts/src/hooks/useObserveXAxisHeights.ts
diff --git a/packages/charts/src/hooks/useOnClickInternal.ts b/packages/charts/src/hooks/useOnClickInternal.ts
diff --git a/packages/charts/src/interfaces/IChartBaseProps.ts b/packages/charts/src/interfaces/IChartBaseProps.ts
diff --git a/packages/charts/src/internal/ChartContainer.tsx b/packages/charts/src/internal/ChartContainer.tsx
diff --git a/packages/charts/src/internal/ChartDataLabel.tsx b/packages/charts/src/internal/ChartDataLabel.tsx
diff --git a/packages/charts/src/internal/StackAggregateLabel.tsx b/packages/charts/src/internal/StackAggregateLabel.tsx
diff --git a/packages/charts/src/internal/StackedTooltipContent.tsx b/packages/charts/src/internal/StackedTooltipContent.tsx
diff --git a/packages/charts/src/internal/XAxisTicks.tsx b/packages/charts/src/internal/XAxisTicks.tsx
diff --git a/packages/charts/src/internal/YAxisTicks.tsx b/packages/charts/src/internal/YAxisTicks.tsx
diff --git a/packages/charts/src/internal/staticProps.ts b/packages/charts/src/internal/staticProps.ts
diff --git a/packages/charts/src/resources/CustomTooltipTotal.mdx b/packages/charts/src/resources/CustomTooltipTotal.mdx
diff --git a/packages/charts/src/resources/DemoProps.tsx b/packages/charts/src/resources/DemoProps.tsx

Original file line number	Diff line number	Diff line change
`@@ -5,7 +5,7 @@ import {`
`5`	`5`	`testChartLegendConfig,`
`6`	`6`	`testChartZoomingTool,`
`7`	`7`	`testStackAggregateTotals,`
`8`		`-} from '@/cypress/support/utils';`
	`8`	`+} from '../../../../../cypress/support/utils';`
`9`	`9`
`10`	`10`	`const dimensions = [`
`11`	`11`	`{`
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-import { ThemingParameters } from '@ui5/webcomponents-react-base';`
	`1`	`+import { ThemingParameters } from '@ui5/webcomponents-react-base/ThemingParameters';`
`2`	`2`	`import ContentLoader from 'react-content-loader';`
`3`	`3`
`4`	`4`	`export const BarChartPlaceholder = () => {`