From 499afb2b2a79fac93f96476c8508793f1796d7c9 Mon Sep 17 00:00:00 2001
From: Anmol Singh Bhatia <anmolsinghbhatia@plane.so>
Date: Thu, 28 Aug 2025 12:41:31 +0530
Subject: [PATCH 1/8] chore: tailwind merge added to propel

---
 packages/propel/package.json | 3 ++-
 pnpm-lock.yaml               | 8 ++++++++
 2 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/packages/propel/package.json b/packages/propel/package.json
index 648a630ac31..600833f9acb 100644
--- a/packages/propel/package.json
+++ b/packages/propel/package.json
@@ -40,7 +40,8 @@
     "lucide-react": "^0.469.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "recharts": "^2.15.1"
+    "recharts": "^2.15.1",
+    "tailwind-merge": "^3.3.1"
   },
   "devDependencies": {
     "@plane/eslint-config": "workspace:*",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 36dc0088e3e..0df674df443 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -985,6 +985,9 @@ importers:
       recharts:
         specifier: ^2.15.1
         version: 2.15.4(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+      tailwind-merge:
+        specifier: ^3.3.1
+        version: 3.3.1
     devDependencies:
       '@plane/eslint-config':
         specifier: workspace:*
@@ -7226,6 +7229,9 @@ packages:
   tailwind-merge@2.6.0:
     resolution: {integrity: sha512-P+Vu1qXfzediirmHOC3xKGAYeZtPcV9g76X+xg2FD4tYgR71ewMA35Y3sCz3zhiN/dwefRpJX0yBcgwi1fXNQA==}
 
+  tailwind-merge@3.3.1:
+    resolution: {integrity: sha512-gBXpgUm/3rp1lMZZrM/w7D8GKqshif0zAymAhbCyIt8KMe+0v9DQ7cdYLR4FHH/cKpdTXb+A/tKKU3eolfsI+g==}
+
   tailwindcss-animate@1.0.7:
     resolution: {integrity: sha512-bl6mpH3T7I3UFxuvDEXLxy/VuFxBk5bbzplh7tXI68mwMokNYd1t9qPBHlnyTwfa4JGC4zP516I1hYYtQ/vspA==}
     peerDependencies:
@@ -14550,6 +14556,8 @@ snapshots:
 
   tailwind-merge@2.6.0: {}
 
+  tailwind-merge@3.3.1: {}
+
   tailwindcss-animate@1.0.7(tailwindcss@3.4.17(ts-node@10.9.2(@swc/core@1.13.3(@swc/helpers@0.5.17))(@types/node@22.17.2)(typescript@5.8.3))):
     dependencies:
       tailwindcss: 3.4.17(ts-node@10.9.2(@swc/core@1.13.3(@swc/helpers@0.5.17))(@types/node@22.17.2)(typescript@5.8.3))

From 574ad42e38d2f5224f00afe01bfe097917875463 Mon Sep 17 00:00:00 2001
From: Anmol Singh Bhatia <anmolsinghbhatia@plane.so>
Date: Thu, 28 Aug 2025 12:41:58 +0530
Subject: [PATCH 2/8] chore: classname utils updated

---
 packages/propel/src/utils/classname.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/propel/src/utils/classname.tsx b/packages/propel/src/utils/classname.tsx
index 2daa71e6268..a500a738583 100644
--- a/packages/propel/src/utils/classname.tsx
+++ b/packages/propel/src/utils/classname.tsx
@@ -1,3 +1,4 @@
 import { clsx, type ClassValue } from "clsx";
+import { twMerge } from "tailwind-merge";
 
-export const cn = (...inputs: ClassValue[]) => clsx(inputs);
+export const cn = (...inputs: ClassValue[]) => twMerge(clsx(inputs));

From 7128bc9fb19689c7b5b7a7a841cbe02f164e5f8e Mon Sep 17 00:00:00 2001
From: Anmol Singh Bhatia <anmolsinghbhatia@plane.so>
Date: Thu, 28 Aug 2025 12:42:52 +0530
Subject: [PATCH 3/8] chore: utils import alias added

---
 packages/propel/tsconfig.json | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/propel/tsconfig.json b/packages/propel/tsconfig.json
index 873c92af078..abcefca7e28 100644
--- a/packages/propel/tsconfig.json
+++ b/packages/propel/tsconfig.json
@@ -2,7 +2,11 @@
   "extends": "@plane/typescript-config/react-library.json",
   "compilerOptions": {
     "jsx": "react-jsx",
-    "lib": ["esnext", "dom"]
+    "lib": ["esnext", "dom"],
+    "baseUrl": ".",
+    "paths": {
+      "@utils/*": ["src/utils/*"]
+    }
   },
   "include": ["src"],
   "exclude": ["node_modules", "dist"]

From 7e95782c9446e9bbc3132ef68ca66ee4324bbbaf Mon Sep 17 00:00:00 2001
From: Anmol Singh Bhatia <anmolsinghbhatia@plane.so>
Date: Thu, 28 Aug 2025 12:47:09 +0530
Subject: [PATCH 4/8] chore: code refactor

---
 packages/propel/src/avatar/avatar.tsx               | 2 +-
 packages/propel/src/card/card.tsx                   | 2 +-
 packages/propel/src/charts/bar-chart/bar.tsx        | 2 +-
 packages/propel/src/charts/components/legend.tsx    | 2 +-
 packages/propel/src/charts/components/tooltip.tsx   | 2 +-
 packages/propel/src/charts/tree-map/map-content.tsx | 2 +-
 packages/propel/src/charts/tree-map/root.tsx        | 2 +-
 packages/propel/src/combobox/combobox.tsx           | 2 +-
 packages/propel/src/command/command.tsx             | 2 +-
 packages/propel/src/dialog/root.tsx                 | 2 +-
 packages/propel/src/menu/menu.tsx                   | 3 +--
 packages/propel/src/switch/root.tsx                 | 2 +-
 packages/propel/src/table/core.tsx                  | 2 +-
 packages/propel/src/tabs/list.tsx                   | 2 +-
 packages/propel/src/tabs/tabs.tsx                   | 4 +---
 packages/propel/src/tooltip/root.tsx                | 2 +-
 packages/propel/tsconfig.json                       | 2 +-
 17 files changed, 17 insertions(+), 20 deletions(-)

diff --git a/packages/propel/src/avatar/avatar.tsx b/packages/propel/src/avatar/avatar.tsx
index 305b4033221..df4e2d8a10f 100644
--- a/packages/propel/src/avatar/avatar.tsx
+++ b/packages/propel/src/avatar/avatar.tsx
@@ -1,7 +1,7 @@
 import React from "react";
 import { Avatar as AvatarPrimitive } from "@base-ui-components/react/avatar";
 // utils
-import { cn } from "@plane/utils";
+import { cn } from "@/utils/classname";
 
 export type TAvatarSize = "sm" | "md" | "base" | "lg" | number;
 
diff --git a/packages/propel/src/card/card.tsx b/packages/propel/src/card/card.tsx
index f70e95cd4ea..9032b0fd7d7 100644
--- a/packages/propel/src/card/card.tsx
+++ b/packages/propel/src/card/card.tsx
@@ -1,5 +1,4 @@
 import * as React from "react";
-import { cn } from "@plane/utils";
 import {
   ECardDirection,
   ECardSpacing,
@@ -9,6 +8,7 @@ import {
   TCardSpacing,
   TCardVariant,
 } from "./helper";
+import { cn } from "@/utils/classname";
 
 export interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
   variant?: TCardVariant;
diff --git a/packages/propel/src/charts/bar-chart/bar.tsx b/packages/propel/src/charts/bar-chart/bar.tsx
index 49ccf3de794..084ebad4951 100644
--- a/packages/propel/src/charts/bar-chart/bar.tsx
+++ b/packages/propel/src/charts/bar-chart/bar.tsx
@@ -2,7 +2,7 @@
 import React from "react";
 // plane imports
 import { TBarChartShapeVariant, TBarItem, TChartData } from "@plane/types";
-import { cn } from "@plane/utils";
+import { cn } from "@/utils/classname";
 
 // Constants
 const MIN_BAR_HEIGHT_FOR_INTERNAL_TEXT = 14; // Minimum height required to show text inside bar
diff --git a/packages/propel/src/charts/components/legend.tsx b/packages/propel/src/charts/components/legend.tsx
index 94ca2a2bfe9..10d2e92f1c2 100644
--- a/packages/propel/src/charts/components/legend.tsx
+++ b/packages/propel/src/charts/components/legend.tsx
@@ -2,7 +2,7 @@ import React from "react";
 import { LegendProps } from "recharts";
 // plane imports
 import { TChartLegend } from "@plane/types";
-import { cn } from "@plane/utils";
+import { cn } from "@/utils/classname";
 
 export const getLegendProps = (args: TChartLegend): LegendProps => {
   const { align, layout, verticalAlign } = args;
diff --git a/packages/propel/src/charts/components/tooltip.tsx b/packages/propel/src/charts/components/tooltip.tsx
index 44ed5177442..f89f37ebc0c 100644
--- a/packages/propel/src/charts/components/tooltip.tsx
+++ b/packages/propel/src/charts/components/tooltip.tsx
@@ -3,7 +3,7 @@ import { NameType, Payload, ValueType } from "recharts/types/component/DefaultTo
 // plane imports
 import { Card, ECardSpacing } from "../../card";
 
-import { cn } from "@plane/utils";
+import { cn } from "@/utils/classname";
 
 type Props = {
   active: boolean | undefined;
diff --git a/packages/propel/src/charts/tree-map/map-content.tsx b/packages/propel/src/charts/tree-map/map-content.tsx
index 0e4a6e2f352..087be9486ce 100644
--- a/packages/propel/src/charts/tree-map/map-content.tsx
+++ b/packages/propel/src/charts/tree-map/map-content.tsx
@@ -1,7 +1,7 @@
 import React, { useMemo } from "react";
 // plane imports
 import { TBottomSectionConfig, TContentVisibility, TTopSectionConfig } from "@plane/types";
-import { cn } from "@plane/utils";
+import { cn } from "@/utils/classname";
 
 const LAYOUT = {
   PADDING: 2,
diff --git a/packages/propel/src/charts/tree-map/root.tsx b/packages/propel/src/charts/tree-map/root.tsx
index 7add4a6b6b7..8b6dde0f666 100644
--- a/packages/propel/src/charts/tree-map/root.tsx
+++ b/packages/propel/src/charts/tree-map/root.tsx
@@ -2,10 +2,10 @@ import React from "react";
 import { Treemap, ResponsiveContainer, Tooltip } from "recharts";
 // plane imports
 import { TreeMapChartProps } from "@plane/types";
-import { cn } from "@plane/utils";
 // local imports
 import { CustomTreeMapContent } from "./map-content";
 import { TreeMapTooltip } from "./tooltip";
+import { cn } from "@/utils/classname";
 
 export const TreeMapChart = React.memo((props: TreeMapChartProps) => {
   const { data, className = "w-full h-96", isAnimationActive = false, showTooltip = true } = props;
diff --git a/packages/propel/src/combobox/combobox.tsx b/packages/propel/src/combobox/combobox.tsx
index b5b571f5bcc..05bb22f0e70 100644
--- a/packages/propel/src/combobox/combobox.tsx
+++ b/packages/propel/src/combobox/combobox.tsx
@@ -1,7 +1,7 @@
 import * as React from "react";
-import { cn } from "@plane/utils";
 import { Command } from "../command/command";
 import { Popover } from "../popover/root";
+import { cn } from "@/utils/classname";
 
 export interface ComboboxOption {
   value: unknown;
diff --git a/packages/propel/src/command/command.tsx b/packages/propel/src/command/command.tsx
index e691e3d76fc..062ad099d72 100644
--- a/packages/propel/src/command/command.tsx
+++ b/packages/propel/src/command/command.tsx
@@ -1,7 +1,7 @@
 import * as React from "react";
 import { Command as CommandPrimitive } from "cmdk";
 import { SearchIcon } from "lucide-react";
-import { cn } from "@plane/utils";
+import { cn } from "@/utils/classname";
 
 function CommandComponent({ className, ...props }: React.ComponentProps<typeof CommandPrimitive>) {
   return <CommandPrimitive data-slot="command" className={cn("", className)} {...props} />;
diff --git a/packages/propel/src/dialog/root.tsx b/packages/propel/src/dialog/root.tsx
index f981c19fb5c..dca74304153 100644
--- a/packages/propel/src/dialog/root.tsx
+++ b/packages/propel/src/dialog/root.tsx
@@ -2,7 +2,7 @@
 
 import * as React from "react";
 import { Dialog as BaseDialog } from "@base-ui-components/react";
-import { cn } from "@plane/utils";
+import { cn } from "@/utils/classname";
 
 // enums
 
diff --git a/packages/propel/src/menu/menu.tsx b/packages/propel/src/menu/menu.tsx
index b67375e20a0..5efc5f3670b 100644
--- a/packages/propel/src/menu/menu.tsx
+++ b/packages/propel/src/menu/menu.tsx
@@ -1,9 +1,8 @@
 import * as React from "react";
 import { Menu as BaseMenu } from "@base-ui-components/react/menu";
 import { ChevronDown, ChevronRight, MoreHorizontal } from "lucide-react";
-// plane imports
-import { cn } from "@plane/utils";
 import { TMenuProps, TSubMenuProps, TMenuItemProps } from "./types";
+import { cn } from "@/utils/classname";
 
 // Context for main menu to communicate with submenus
 const MenuContext = React.createContext<{
diff --git a/packages/propel/src/switch/root.tsx b/packages/propel/src/switch/root.tsx
index 19a37b89608..4c307dacd04 100644
--- a/packages/propel/src/switch/root.tsx
+++ b/packages/propel/src/switch/root.tsx
@@ -1,6 +1,6 @@
 import * as React from "react";
 import { Switch as BaseSwitch } from "@base-ui-components/react/switch";
-import { cn } from "@plane/utils";
+import { cn } from "@/utils/classname";
 
 interface IToggleSwitchProps {
   value: boolean;
diff --git a/packages/propel/src/table/core.tsx b/packages/propel/src/table/core.tsx
index cb0156b562e..7d02571e354 100644
--- a/packages/propel/src/table/core.tsx
+++ b/packages/propel/src/table/core.tsx
@@ -1,6 +1,6 @@
 import * as React from "react";
 
-import { cn } from "@plane/utils";
+import { cn } from "@/utils/classname";
 
 const Table = React.forwardRef<React.ComponentRef<"table">, React.ComponentPropsWithoutRef<"table">>(
   ({ className, ...props }, ref) => (
diff --git a/packages/propel/src/tabs/list.tsx b/packages/propel/src/tabs/list.tsx
index 6155b10cebd..107da6b84dd 100644
--- a/packages/propel/src/tabs/list.tsx
+++ b/packages/propel/src/tabs/list.tsx
@@ -2,7 +2,7 @@ import React, { FC } from "react";
 import { Tabs as BaseTabs } from "@base-ui-components/react/tabs";
 import { LucideProps } from "lucide-react";
 // helpers
-import { cn } from "@plane/utils";
+import { cn } from "@/utils/classname";
 
 export type TabListItem = {
   key: string;
diff --git a/packages/propel/src/tabs/tabs.tsx b/packages/propel/src/tabs/tabs.tsx
index ad40370cf33..0ac687b8f90 100644
--- a/packages/propel/src/tabs/tabs.tsx
+++ b/packages/propel/src/tabs/tabs.tsx
@@ -1,10 +1,8 @@
 import React, { FC, useEffect, useState } from "react";
 import { Tabs as BaseTabs } from "@base-ui-components/react/tabs";
-// helpers
 import { useLocalStorage } from "@plane/hooks";
-import { cn } from "@plane/utils";
-// types
 import { TabList, TabListItem } from "./list";
+import { cn } from "@/utils/classname";
 
 export type TabContent = {
   content: React.ReactNode;
diff --git a/packages/propel/src/tooltip/root.tsx b/packages/propel/src/tooltip/root.tsx
index 3f71950f035..89aea63cde9 100644
--- a/packages/propel/src/tooltip/root.tsx
+++ b/packages/propel/src/tooltip/root.tsx
@@ -1,7 +1,7 @@
 import * as React from "react";
 import { Tooltip as BaseTooltip } from "@base-ui-components/react/tooltip";
-import { cn } from "@plane/utils";
 import { TPlacement, TSide, TAlign, convertPlacementToSideAndAlign } from "../utils/placement";
+import { cn } from "@/utils/classname";
 
 type ITooltipProps = {
   tooltipHeading?: string;
diff --git a/packages/propel/tsconfig.json b/packages/propel/tsconfig.json
index abcefca7e28..46fa96232bb 100644
--- a/packages/propel/tsconfig.json
+++ b/packages/propel/tsconfig.json
@@ -5,7 +5,7 @@
     "lib": ["esnext", "dom"],
     "baseUrl": ".",
     "paths": {
-      "@utils/*": ["src/utils/*"]
+      "@/utils/*": ["src/utils/*"]
     }
   },
   "include": ["src"],

From 81a0f95e5c527e905630d07ab2dde177362f5424 Mon Sep 17 00:00:00 2001
From: Anmol Singh Bhatia <anmolsinghbhatia@plane.so>
Date: Thu, 28 Aug 2025 12:54:15 +0530
Subject: [PATCH 5/8] chore: code refactor

---
 packages/propel/src/avatar/avatar.tsx               | 3 +--
 packages/propel/src/card/card.tsx                   | 2 +-
 packages/propel/src/charts/bar-chart/bar.tsx        | 2 +-
 packages/propel/src/charts/components/legend.tsx    | 2 +-
 packages/propel/src/charts/components/tooltip.tsx   | 3 +--
 packages/propel/src/charts/tree-map/map-content.tsx | 2 +-
 packages/propel/src/charts/tree-map/root.tsx        | 2 +-
 packages/propel/src/combobox/combobox.tsx           | 2 +-
 packages/propel/src/command/command.tsx             | 2 +-
 packages/propel/src/dialog/root.tsx                 | 2 +-
 packages/propel/src/menu/menu.tsx                   | 2 +-
 packages/propel/src/switch/root.tsx                 | 2 +-
 packages/propel/src/table/core.tsx                  | 2 +-
 packages/propel/src/tabs/list.tsx                   | 2 +-
 packages/propel/src/tabs/tabs.tsx                   | 2 +-
 packages/propel/src/tooltip/root.tsx                | 2 +-
 packages/propel/tsconfig.json                       | 5 +----
 17 files changed, 17 insertions(+), 22 deletions(-)

diff --git a/packages/propel/src/avatar/avatar.tsx b/packages/propel/src/avatar/avatar.tsx
index df4e2d8a10f..ec19dbf238c 100644
--- a/packages/propel/src/avatar/avatar.tsx
+++ b/packages/propel/src/avatar/avatar.tsx
@@ -1,7 +1,6 @@
 import React from "react";
 import { Avatar as AvatarPrimitive } from "@base-ui-components/react/avatar";
-// utils
-import { cn } from "@/utils/classname";
+import { cn } from "../utils/classname";
 
 export type TAvatarSize = "sm" | "md" | "base" | "lg" | number;
 
diff --git a/packages/propel/src/card/card.tsx b/packages/propel/src/card/card.tsx
index 9032b0fd7d7..a58ec95d2a9 100644
--- a/packages/propel/src/card/card.tsx
+++ b/packages/propel/src/card/card.tsx
@@ -1,4 +1,5 @@
 import * as React from "react";
+import { cn } from "../utils/classname";
 import {
   ECardDirection,
   ECardSpacing,
@@ -8,7 +9,6 @@ import {
   TCardSpacing,
   TCardVariant,
 } from "./helper";
-import { cn } from "@/utils/classname";
 
 export interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
   variant?: TCardVariant;
diff --git a/packages/propel/src/charts/bar-chart/bar.tsx b/packages/propel/src/charts/bar-chart/bar.tsx
index 084ebad4951..558e73ad603 100644
--- a/packages/propel/src/charts/bar-chart/bar.tsx
+++ b/packages/propel/src/charts/bar-chart/bar.tsx
@@ -2,7 +2,7 @@
 import React from "react";
 // plane imports
 import { TBarChartShapeVariant, TBarItem, TChartData } from "@plane/types";
-import { cn } from "@/utils/classname";
+import { cn } from "../../utils/classname";
 
 // Constants
 const MIN_BAR_HEIGHT_FOR_INTERNAL_TEXT = 14; // Minimum height required to show text inside bar
diff --git a/packages/propel/src/charts/components/legend.tsx b/packages/propel/src/charts/components/legend.tsx
index 10d2e92f1c2..8ca12f0459f 100644
--- a/packages/propel/src/charts/components/legend.tsx
+++ b/packages/propel/src/charts/components/legend.tsx
@@ -2,7 +2,7 @@ import React from "react";
 import { LegendProps } from "recharts";
 // plane imports
 import { TChartLegend } from "@plane/types";
-import { cn } from "@/utils/classname";
+import { cn } from "../../utils/classname";
 
 export const getLegendProps = (args: TChartLegend): LegendProps => {
   const { align, layout, verticalAlign } = args;
diff --git a/packages/propel/src/charts/components/tooltip.tsx b/packages/propel/src/charts/components/tooltip.tsx
index f89f37ebc0c..c978cd7e2d0 100644
--- a/packages/propel/src/charts/components/tooltip.tsx
+++ b/packages/propel/src/charts/components/tooltip.tsx
@@ -2,8 +2,7 @@ import React from "react";
 import { NameType, Payload, ValueType } from "recharts/types/component/DefaultTooltipContent";
 // plane imports
 import { Card, ECardSpacing } from "../../card";
-
-import { cn } from "@/utils/classname";
+import { cn } from "../../utils/classname";
 
 type Props = {
   active: boolean | undefined;
diff --git a/packages/propel/src/charts/tree-map/map-content.tsx b/packages/propel/src/charts/tree-map/map-content.tsx
index 087be9486ce..1a79a8df20b 100644
--- a/packages/propel/src/charts/tree-map/map-content.tsx
+++ b/packages/propel/src/charts/tree-map/map-content.tsx
@@ -1,7 +1,7 @@
 import React, { useMemo } from "react";
 // plane imports
 import { TBottomSectionConfig, TContentVisibility, TTopSectionConfig } from "@plane/types";
-import { cn } from "@/utils/classname";
+import { cn } from "../../utils/classname";
 
 const LAYOUT = {
   PADDING: 2,
diff --git a/packages/propel/src/charts/tree-map/root.tsx b/packages/propel/src/charts/tree-map/root.tsx
index 8b6dde0f666..1dc874f07cb 100644
--- a/packages/propel/src/charts/tree-map/root.tsx
+++ b/packages/propel/src/charts/tree-map/root.tsx
@@ -3,9 +3,9 @@ import { Treemap, ResponsiveContainer, Tooltip } from "recharts";
 // plane imports
 import { TreeMapChartProps } from "@plane/types";
 // local imports
+import { cn } from "../../utils/classname";
 import { CustomTreeMapContent } from "./map-content";
 import { TreeMapTooltip } from "./tooltip";
-import { cn } from "@/utils/classname";
 
 export const TreeMapChart = React.memo((props: TreeMapChartProps) => {
   const { data, className = "w-full h-96", isAnimationActive = false, showTooltip = true } = props;
diff --git a/packages/propel/src/combobox/combobox.tsx b/packages/propel/src/combobox/combobox.tsx
index 05bb22f0e70..7a132b9ac6c 100644
--- a/packages/propel/src/combobox/combobox.tsx
+++ b/packages/propel/src/combobox/combobox.tsx
@@ -1,7 +1,7 @@
 import * as React from "react";
 import { Command } from "../command/command";
 import { Popover } from "../popover/root";
-import { cn } from "@/utils/classname";
+import { cn } from "../utils/classname";
 
 export interface ComboboxOption {
   value: unknown;
diff --git a/packages/propel/src/command/command.tsx b/packages/propel/src/command/command.tsx
index 062ad099d72..25c977c3e98 100644
--- a/packages/propel/src/command/command.tsx
+++ b/packages/propel/src/command/command.tsx
@@ -1,7 +1,7 @@
 import * as React from "react";
 import { Command as CommandPrimitive } from "cmdk";
 import { SearchIcon } from "lucide-react";
-import { cn } from "@/utils/classname";
+import { cn } from "../utils/classname";
 
 function CommandComponent({ className, ...props }: React.ComponentProps<typeof CommandPrimitive>) {
   return <CommandPrimitive data-slot="command" className={cn("", className)} {...props} />;
diff --git a/packages/propel/src/dialog/root.tsx b/packages/propel/src/dialog/root.tsx
index dca74304153..580e4359f0b 100644
--- a/packages/propel/src/dialog/root.tsx
+++ b/packages/propel/src/dialog/root.tsx
@@ -2,7 +2,7 @@
 
 import * as React from "react";
 import { Dialog as BaseDialog } from "@base-ui-components/react";
-import { cn } from "@/utils/classname";
+import { cn } from "../utils/classname";
 
 // enums
 
diff --git a/packages/propel/src/menu/menu.tsx b/packages/propel/src/menu/menu.tsx
index 5efc5f3670b..1510f6b8dcd 100644
--- a/packages/propel/src/menu/menu.tsx
+++ b/packages/propel/src/menu/menu.tsx
@@ -1,8 +1,8 @@
 import * as React from "react";
 import { Menu as BaseMenu } from "@base-ui-components/react/menu";
 import { ChevronDown, ChevronRight, MoreHorizontal } from "lucide-react";
+import { cn } from "../utils/classname";
 import { TMenuProps, TSubMenuProps, TMenuItemProps } from "./types";
-import { cn } from "@/utils/classname";
 
 // Context for main menu to communicate with submenus
 const MenuContext = React.createContext<{
diff --git a/packages/propel/src/switch/root.tsx b/packages/propel/src/switch/root.tsx
index 4c307dacd04..d202a923521 100644
--- a/packages/propel/src/switch/root.tsx
+++ b/packages/propel/src/switch/root.tsx
@@ -1,6 +1,6 @@
 import * as React from "react";
 import { Switch as BaseSwitch } from "@base-ui-components/react/switch";
-import { cn } from "@/utils/classname";
+import { cn } from "../utils/classname";
 
 interface IToggleSwitchProps {
   value: boolean;
diff --git a/packages/propel/src/table/core.tsx b/packages/propel/src/table/core.tsx
index 7d02571e354..074bb7f3704 100644
--- a/packages/propel/src/table/core.tsx
+++ b/packages/propel/src/table/core.tsx
@@ -1,6 +1,6 @@
 import * as React from "react";
 
-import { cn } from "@/utils/classname";
+import { cn } from "../utils/classname";
 
 const Table = React.forwardRef<React.ComponentRef<"table">, React.ComponentPropsWithoutRef<"table">>(
   ({ className, ...props }, ref) => (
diff --git a/packages/propel/src/tabs/list.tsx b/packages/propel/src/tabs/list.tsx
index 107da6b84dd..cdb177dbf57 100644
--- a/packages/propel/src/tabs/list.tsx
+++ b/packages/propel/src/tabs/list.tsx
@@ -2,7 +2,7 @@ import React, { FC } from "react";
 import { Tabs as BaseTabs } from "@base-ui-components/react/tabs";
 import { LucideProps } from "lucide-react";
 // helpers
-import { cn } from "@/utils/classname";
+import { cn } from "../utils/classname";
 
 export type TabListItem = {
   key: string;
diff --git a/packages/propel/src/tabs/tabs.tsx b/packages/propel/src/tabs/tabs.tsx
index 0ac687b8f90..3984ad6659f 100644
--- a/packages/propel/src/tabs/tabs.tsx
+++ b/packages/propel/src/tabs/tabs.tsx
@@ -1,8 +1,8 @@
 import React, { FC, useEffect, useState } from "react";
 import { Tabs as BaseTabs } from "@base-ui-components/react/tabs";
 import { useLocalStorage } from "@plane/hooks";
+import { cn } from "../utils/classname";
 import { TabList, TabListItem } from "./list";
-import { cn } from "@/utils/classname";
 
 export type TabContent = {
   content: React.ReactNode;
diff --git a/packages/propel/src/tooltip/root.tsx b/packages/propel/src/tooltip/root.tsx
index 89aea63cde9..aeb6c52c039 100644
--- a/packages/propel/src/tooltip/root.tsx
+++ b/packages/propel/src/tooltip/root.tsx
@@ -1,7 +1,7 @@
 import * as React from "react";
 import { Tooltip as BaseTooltip } from "@base-ui-components/react/tooltip";
+import { cn } from "../utils/classname";
 import { TPlacement, TSide, TAlign, convertPlacementToSideAndAlign } from "../utils/placement";
-import { cn } from "@/utils/classname";
 
 type ITooltipProps = {
   tooltipHeading?: string;
diff --git a/packages/propel/tsconfig.json b/packages/propel/tsconfig.json
index 46fa96232bb..c97eeb1f0fb 100644
--- a/packages/propel/tsconfig.json
+++ b/packages/propel/tsconfig.json
@@ -3,10 +3,7 @@
   "compilerOptions": {
     "jsx": "react-jsx",
     "lib": ["esnext", "dom"],
-    "baseUrl": ".",
-    "paths": {
-      "@/utils/*": ["src/utils/*"]
-    }
+    "baseUrl": "."
   },
   "include": ["src"],
   "exclude": ["node_modules", "dist"]

From 3b675ea47363353e30f2b0eb29c75b7bd89ffe55 Mon Sep 17 00:00:00 2001
From: Anmol Singh Bhatia <anmolsinghbhatia@plane.so>
Date: Thu, 28 Aug 2025 12:57:03 +0530
Subject: [PATCH 6/8] chore: code refactor

---
 packages/propel/package.json  | 3 +--
 packages/propel/tsconfig.json | 3 +--
 2 files changed, 2 insertions(+), 4 deletions(-)

diff --git a/packages/propel/package.json b/packages/propel/package.json
index 600833f9acb..a007f06aaa6 100644
--- a/packages/propel/package.json
+++ b/packages/propel/package.json
@@ -33,7 +33,6 @@
     "@plane/constants": "workspace:*",
     "@plane/hooks": "workspace:*",
     "@plane/types": "workspace:*",
-    "@plane/utils": "workspace:*",
     "@tanstack/react-table": "^8.21.3",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
@@ -54,4 +53,4 @@
     "storybook": "^9.1.2",
     "typescript": "5.8.3"
   }
-}
+}
\ No newline at end of file
diff --git a/packages/propel/tsconfig.json b/packages/propel/tsconfig.json
index c97eeb1f0fb..873c92af078 100644
--- a/packages/propel/tsconfig.json
+++ b/packages/propel/tsconfig.json
@@ -2,8 +2,7 @@
   "extends": "@plane/typescript-config/react-library.json",
   "compilerOptions": {
     "jsx": "react-jsx",
-    "lib": ["esnext", "dom"],
-    "baseUrl": "."
+    "lib": ["esnext", "dom"]
   },
   "include": ["src"],
   "exclude": ["node_modules", "dist"]

From 183d11fd907d90fa7d4177d23a0d0c749b881abb Mon Sep 17 00:00:00 2001
From: Anmol Singh Bhatia <anmolsinghbhatia@plane.so>
Date: Thu, 28 Aug 2025 12:58:39 +0530
Subject: [PATCH 7/8] chore: code refactor

---
 packages/propel/package.json | 2 +-
 pnpm-lock.yaml               | 3 ---
 2 files changed, 1 insertion(+), 4 deletions(-)

diff --git a/packages/propel/package.json b/packages/propel/package.json
index a007f06aaa6..e023abeee03 100644
--- a/packages/propel/package.json
+++ b/packages/propel/package.json
@@ -53,4 +53,4 @@
     "storybook": "^9.1.2",
     "typescript": "5.8.3"
   }
-}
\ No newline at end of file
+}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 0df674df443..7d60c48e02b 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -961,9 +961,6 @@ importers:
       '@plane/types':
         specifier: workspace:*
         version: link:../types
-      '@plane/utils':
-        specifier: workspace:*
-        version: link:../utils
       '@tanstack/react-table':
         specifier: ^8.21.3
         version: 8.21.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1)

From 0a2216016eca187cb060c365b7a321eb00f506df Mon Sep 17 00:00:00 2001
From: Anmol Singh Bhatia <anmolsinghbhatia@plane.so>
Date: Thu, 28 Aug 2025 14:43:01 +0530
Subject: [PATCH 8/8] chore: code refactor

---
 packages/propel/src/utils/classname.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/propel/src/utils/classname.tsx b/packages/propel/src/utils/classname.tsx
index a500a738583..a0b59291248 100644
--- a/packages/propel/src/utils/classname.tsx
+++ b/packages/propel/src/utils/classname.tsx
@@ -1,4 +1,4 @@
-import { clsx, type ClassValue } from "clsx";
+import clsx, { type ClassValue } from "clsx";
 import { twMerge } from "tailwind-merge";
 
 export const cn = (...inputs: ClassValue[]) => twMerge(clsx(inputs));