diff --git a/packages/libs/react-ui/src/components/Accordion/AccordionSection.tsx b/packages/libs/react-ui/src/components/Accordion/AccordionSection.tsx
index a0168ef800..e97482905a 100644
--- a/packages/libs/react-ui/src/components/Accordion/AccordionSection.tsx
+++ b/packages/libs/react-ui/src/components/Accordion/AccordionSection.tsx
@@ -1,5 +1,3 @@
-import { SystemIcon } from '../Icon';
-
 import {
   accordionSectionClass,
   accordionTitleClass,
@@ -7,6 +5,7 @@ import {
   toggleButtonClass,
 } from './Accordion.css';
 
+import { SystemIcon } from '@components/Icon';
 import classNames from 'classnames';
 import React, { FC, useEffect, useRef } from 'react';
 
diff --git a/packages/libs/react-ui/src/components/Footer/Footer.stories.tsx b/packages/libs/react-ui/src/components/Footer/Footer.stories.tsx
index 40f1459351..852ff72f6b 100644
--- a/packages/libs/react-ui/src/components/Footer/Footer.stories.tsx
+++ b/packages/libs/react-ui/src/components/Footer/Footer.stories.tsx
@@ -1,11 +1,10 @@
+import { Footer, IFooterIconItemProps, IFooterProps } from './index';
+
 import {
-  IFooterIconItemProps,
   IFooterLinkItemProps,
-  SystemIcon,
-} from './../../';
-import { Footer, FooterVariant, IFooterProps } from './index';
-
-import { Target } from '@components/Footer/FooterLinkItem';
+  Target,
+} from '@components/Footer/FooterLinkItem';
+import { SystemIcon } from '@components/Icon';
 import { IconType } from '@components/Icon/IconWrapper';
 import type { Meta, StoryObj } from '@storybook/react';
 import React from 'react';
diff --git a/packages/libs/react-ui/src/components/Footer/Footer.test.tsx b/packages/libs/react-ui/src/components/Footer/Footer.test.tsx
index 99852e0311..440f2fe7aa 100644
--- a/packages/libs/react-ui/src/components/Footer/Footer.test.tsx
+++ b/packages/libs/react-ui/src/components/Footer/Footer.test.tsx
@@ -26,7 +26,7 @@ describe('Footer', () => {
       },
     ];
 
-    const { getByTestId, getAllByTestId } = render(
+    const { getByTestId } = render(
       <Footer.Root>
         <Footer.Panel>
           {menuLinks.map((item, index) => {
diff --git a/packages/libs/react-ui/src/components/Footer/index.ts b/packages/libs/react-ui/src/components/Footer/index.ts
index 9dbad722d7..65416ab8ec 100644
--- a/packages/libs/react-ui/src/components/Footer/index.ts
+++ b/packages/libs/react-ui/src/components/Footer/index.ts
@@ -1,4 +1,4 @@
-import { FooterContainer, IFooterProps, FooterVariant } from './Footer';
+import { FooterContainer, FooterVariant, IFooterProps } from './Footer';
 import { FooterIconItem, IFooterIconItemProps } from './FooterIconItem';
 import { FooterLinkItem, IFooterLinkItemProps } from './FooterLinkItem';
 import { FooterPanel, IFooterPanelProps } from './FooterPanel';
diff --git a/packages/libs/react-ui/src/components/InputWrapper/InputWrapper.css.ts b/packages/libs/react-ui/src/components/InputWrapper/InputWrapper.css.ts
index fc711c2739..bcef7bd07a 100644
--- a/packages/libs/react-ui/src/components/InputWrapper/InputWrapper.css.ts
+++ b/packages/libs/react-ui/src/components/InputWrapper/InputWrapper.css.ts
@@ -1,10 +1,9 @@
-import { inputStatusColor } from '../Input/Input.css';
-
 import {
   helperIconColor,
   helperTextColor,
 } from './InputHelper/InputHelper.css';
 
+import { inputStatusColor } from '@components/Input/Input.css';
 import { sprinkles } from '@theme/sprinkles.css';
 import { vars } from '@theme/vars.css';
 import { styleVariants } from '@vanilla-extract/css';
diff --git a/packages/libs/react-ui/src/components/MaskedValue/MaskedValue.css.ts b/packages/libs/react-ui/src/components/MaskedValue/MaskedValue.css.ts
index 2bc938efe0..fc3a07c993 100644
--- a/packages/libs/react-ui/src/components/MaskedValue/MaskedValue.css.ts
+++ b/packages/libs/react-ui/src/components/MaskedValue/MaskedValue.css.ts
@@ -1,5 +1,4 @@
-import { sprinkles } from '../../styles';
-
+import { sprinkles } from '@theme/sprinkles.css';
 import { createVar, style } from '@vanilla-extract/css';
 
 export const inputStatusColor = createVar();
diff --git a/packages/libs/react-ui/src/components/MaskedValue/MaskedValue.tsx b/packages/libs/react-ui/src/components/MaskedValue/MaskedValue.tsx
index 124c9fd0b2..f1d0da27bc 100644
--- a/packages/libs/react-ui/src/components/MaskedValue/MaskedValue.tsx
+++ b/packages/libs/react-ui/src/components/MaskedValue/MaskedValue.tsx
@@ -1,5 +1,3 @@
-import { SystemIcon } from '../Icon';
-
 import {
   iconContainer,
   titleContainer,
@@ -7,6 +5,7 @@ import {
   valueIconContainer,
 } from './MaskedValue.css';
 
+import { SystemIcon } from '@components/Icon';
 import React, { FC, useState } from 'react';
 
 export interface IMaskedValueProps {
diff --git a/packages/libs/react-ui/src/components/Select/Select.css.ts b/packages/libs/react-ui/src/components/Select/Select.css.ts
index b7199d6483..4373421b95 100644
--- a/packages/libs/react-ui/src/components/Select/Select.css.ts
+++ b/packages/libs/react-ui/src/components/Select/Select.css.ts
@@ -1,5 +1,4 @@
-import { sprinkles } from '../../styles';
-
+import { sprinkles } from '@theme/sprinkles.css';
 import { style } from '@vanilla-extract/css';
 
 export const containerClass = style([
diff --git a/packages/libs/react-ui/src/components/Select/Select.stories.tsx b/packages/libs/react-ui/src/components/Select/Select.stories.tsx
index 52a84c07e5..2bfe4c6ebf 100644
--- a/packages/libs/react-ui/src/components/Select/Select.stories.tsx
+++ b/packages/libs/react-ui/src/components/Select/Select.stories.tsx
@@ -1,8 +1,7 @@
-import { SystemIcon } from '../Icon';
-
 import { Option } from './Option';
 import { ISelectProps, Select } from './Select';
 
+import { SystemIcon } from '@components/Icon';
 import type { Meta, StoryObj } from '@storybook/react';
 import React, { useState } from 'react';
 
diff --git a/packages/libs/react-ui/src/components/Select/Select.tsx b/packages/libs/react-ui/src/components/Select/Select.tsx
index 0b34226cf3..bb73b07bb5 100644
--- a/packages/libs/react-ui/src/components/Select/Select.tsx
+++ b/packages/libs/react-ui/src/components/Select/Select.tsx
@@ -1,5 +1,3 @@
-import { SystemIcon } from '../Icon';
-
 import {
   containerClass,
   containerClassDisabled,
@@ -8,6 +6,7 @@ import {
   selectContainerClass,
 } from './Select.css';
 
+import { SystemIcon } from '@components/Icon';
 import classNames from 'classnames';
 import React, { FC, forwardRef } from 'react';
 
diff --git a/packages/libs/react-ui/src/components/Stack/Stack.tsx b/packages/libs/react-ui/src/components/Stack/Stack.tsx
index 00ac634c41..1a7f5ba5c4 100644
--- a/packages/libs/react-ui/src/components/Stack/Stack.tsx
+++ b/packages/libs/react-ui/src/components/Stack/Stack.tsx
@@ -1,5 +1,4 @@
-import { Sprinkles, sprinkles } from '../../styles';
-
+import { Sprinkles, sprinkles } from '@theme/sprinkles.css';
 import React, { createElement, ElementType } from 'react';
 
 export interface IStackProps
diff --git a/packages/libs/react-ui/src/components/TextField/TextField.stories.tsx b/packages/libs/react-ui/src/components/TextField/TextField.stories.tsx
index 9152dbf101..aeeaa950e1 100644
--- a/packages/libs/react-ui/src/components/TextField/TextField.stories.tsx
+++ b/packages/libs/react-ui/src/components/TextField/TextField.stories.tsx
@@ -1,7 +1,6 @@
-import { statusVariant } from '../InputWrapper/InputWrapper.css';
-
 import { SystemIcon } from '@components/Icon';
 import { IInputProps } from '@components/Input';
+import { statusVariant } from '@components/InputWrapper/InputWrapper.css';
 import { ITextFieldProps, TextField } from '@components/TextField';
 import type { Meta, StoryObj } from '@storybook/react';
 import React from 'react';
diff --git a/packages/libs/react-ui/src/components/Tooltip/Tooltip.css.ts b/packages/libs/react-ui/src/components/Tooltip/Tooltip.css.ts
index 4619553298..28243c3ef5 100644
--- a/packages/libs/react-ui/src/components/Tooltip/Tooltip.css.ts
+++ b/packages/libs/react-ui/src/components/Tooltip/Tooltip.css.ts
@@ -1,5 +1,5 @@
-import { sprinkles, vars } from '../../styles';
-
+import { sprinkles } from '@theme/sprinkles.css';
+import { vars } from '@theme/vars.css';
 import { style, styleVariants } from '@vanilla-extract/css';
 
 export const container = style([
diff --git a/packages/libs/react-ui/src/components/Tooltip/Tooltip.stories.tsx b/packages/libs/react-ui/src/components/Tooltip/Tooltip.stories.tsx
index f80f05a61b..f894b8dd61 100644
--- a/packages/libs/react-ui/src/components/Tooltip/Tooltip.stories.tsx
+++ b/packages/libs/react-ui/src/components/Tooltip/Tooltip.stories.tsx
@@ -1,8 +1,8 @@
-import { IconButton, SystemIcon } from '..';
-
 import { container } from './stories.css';
 import { ITooltipProps, Tooltip } from './';
 
+import { SystemIcon } from '@components/Icon';
+import { IconButton } from '@components/IconButton';
 import type { Meta, StoryObj } from '@storybook/react';
 import React, { useRef } from 'react';
 
diff --git a/packages/libs/react-ui/src/components/Tooltip/stories.css.ts b/packages/libs/react-ui/src/components/Tooltip/stories.css.ts
index 35c56c714b..5da2bdd5ec 100644
--- a/packages/libs/react-ui/src/components/Tooltip/stories.css.ts
+++ b/packages/libs/react-ui/src/components/Tooltip/stories.css.ts
@@ -1,5 +1,4 @@
-import { sprinkles } from '../../styles';
-
+import { sprinkles } from '@theme/sprinkles.css';
 import { style } from '@vanilla-extract/css';
 
 export const container = style([
diff --git a/packages/libs/react-ui/src/components/Tree/TreeItems.tsx b/packages/libs/react-ui/src/components/Tree/TreeItems.tsx
index 047937b2e2..b9a322fd34 100644
--- a/packages/libs/react-ui/src/components/Tree/TreeItems.tsx
+++ b/packages/libs/react-ui/src/components/Tree/TreeItems.tsx
@@ -1,5 +1,3 @@
-import { SystemIcon } from '../Icon';
-
 import {
   treeBranchWrapperVariant,
   treeTitleClass,
@@ -10,6 +8,7 @@ import {
   treeWrapperClass,
 } from './Tree.css';
 
+import { SystemIcon } from '@components/Icon';
 import classNames from 'classnames';
 import React, { FC, useState } from 'react';