diff --git a/app/client/package.json b/app/client/package.json
index 33795134b1..283009322f 100644
--- a/app/client/package.json
+++ b/app/client/package.json
@@ -235,7 +235,7 @@
     "to-json-schema": "^0.2.5",
     "toposort": "^2.0.2",
     "tslib": "^2.3.1",
-    "typescript": "5.4",
+    "typescript": "^5.5.4",
     "unescape-js": "^1.1.4",
     "url-search-params-polyfill": "^8.0.0",
     "uuid": "^9.0.0",
diff --git a/app/client/packages/ast/package.json b/app/client/packages/ast/package.json
index 78945646fa..369e809026 100644
--- a/app/client/packages/ast/package.json
+++ b/app/client/packages/ast/package.json
@@ -28,7 +28,7 @@
     "rollup-plugin-generate-package-json": "^3.2.0",
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "rollup-plugin-typescript2": "^0.32.0",
-    "typescript": "5.4",
+    "typescript": "^5.5.4",
     "unescape-js": "^1.1.4"
   },
   "devDependencies": {
diff --git a/app/client/packages/design-system/ads/src/Radio/RadioGroup.stories.tsx b/app/client/packages/design-system/ads/src/Radio/RadioGroup.stories.tsx
index dfefdf715d..9c0aad9188 100644
--- a/app/client/packages/design-system/ads/src/Radio/RadioGroup.stories.tsx
+++ b/app/client/packages/design-system/ads/src/Radio/RadioGroup.stories.tsx
@@ -68,9 +68,7 @@ export function RadioTabStory() {
             <Radio value={value}>Value 1</Radio>
             {selectedValue == value && possibleTabPanels[index] && (
               <RadioPanel>
-                {/*@ts-expect-error type error*/}
                 <Text>{possibleTabPanels[index].name}</Text>
-                {/*@ts-expect-error type error*/}
                 <Text>{possibleTabPanels[index].fruit}</Text>
               </RadioPanel>
             )}
diff --git a/app/client/packages/design-system/theming/src/color/tests/DarkModeTheme.test.ts b/app/client/packages/design-system/theming/src/color/tests/DarkModeTheme.test.ts
index fd4a3b180e..e0a4a8594d 100644
--- a/app/client/packages/design-system/theming/src/color/tests/DarkModeTheme.test.ts
+++ b/app/client/packages/design-system/theming/src/color/tests/DarkModeTheme.test.ts
@@ -15,7 +15,7 @@ describe("bg color", () => {
 describe("bgAccent color", () => {
   it("should return correct color when lightness < 0.3", () => {
     const { bgAccent } = new DarkModeTheme("oklch(0.2 0.09 231)").getColors();
-    expect(bgAccent).toBe("rgb(0% 19.987% 30.122%)");
+    expect(bgAccent).toBe("rgb(0% 20.243% 31.25%)");
   });
 });
 
@@ -24,7 +24,7 @@ describe("bgAccentHover color", () => {
     const { bgAccentHover } = new DarkModeTheme(
       "oklch(0.2 0.09 231)",
     ).getColors();
-    expect(bgAccentHover).toBe("rgb(0% 25.498% 37.079%)");
+    expect(bgAccentHover).toBe("rgb(0% 25.612% 37.776%)");
   });
 
   it("should return correct color when lightness is between 0.3 and 0.45", () => {
@@ -75,7 +75,7 @@ describe("bgAccentActive color", () => {
     const { bgAccentActive } = new DarkModeTheme(
       "oklch(0.2 0.09 231)",
     ).getColors();
-    expect(bgAccentActive).toBe("rgb(0% 17.836% 27.428%)");
+    expect(bgAccentActive).toBe("rgb(0% 18.133% 28.462%)");
   });
 
   it("should return correct color when seedLightness is between 0.4 and 0.7", () => {
@@ -105,21 +105,21 @@ describe("bgAccentSubtle color", () => {
     const { bgAccentSubtle } = new DarkModeTheme(
       "oklch(0.30 0.09 231)",
     ).getColors();
-    expect(bgAccentSubtle).toBe("rgb(0% 14.671% 23.499%)");
+    expect(bgAccentSubtle).toBe("rgb(0% 15.035% 24.345%)");
   });
 
   it("should return correct color when seedLightness < 0.2", () => {
     const { bgAccentSubtle } = new DarkModeTheme(
       "oklch(0.15 0.09 231)",
     ).getColors();
-    expect(bgAccentSubtle).toBe("rgb(0% 9.5878% 17.677%)");
+    expect(bgAccentSubtle).toBe("rgb(0% 10.07% 17.756%)");
   });
 
   it("should return correct color when seedChroma > 0.1", () => {
     const { bgAccentSubtle } = new DarkModeTheme(
       "oklch(0.30 0.15 231)",
     ).getColors();
-    expect(bgAccentSubtle).toBe("rgb(0% 14.556% 23.9%)");
+    expect(bgAccentSubtle).toBe("rgb(0% 15.035% 24.348%)");
   });
 
   it("should return correct color when seedChroma < 0.04", () => {
@@ -135,21 +135,21 @@ describe("bgAccentSubtle color", () => {
     const { bgAccentSubtle } = new DarkModeTheme(
       "oklch(0.30 0.09 231)",
     ).getColors();
-    expect(bgAccentSubtle).toBe("rgb(0% 14.671% 23.499%)");
+    expect(bgAccentSubtle).toBe("rgb(0% 15.035% 24.345%)");
   });
 
   it("should return correct color when seedLightness < 0.2", () => {
     const { bgAccentSubtle } = new DarkModeTheme(
       "oklch(0.15 0.09 231)",
     ).getColors();
-    expect(bgAccentSubtle).toBe("rgb(0% 9.5878% 17.677%)");
+    expect(bgAccentSubtle).toBe("rgb(0% 10.07% 17.756%)");
   });
 
   it("should return correct color when seedChroma > 0.1", () => {
     const { bgAccentSubtle } = new DarkModeTheme(
       "oklch(0.30 0.15 231)",
     ).getColors();
-    expect(bgAccentSubtle).toBe("rgb(0% 14.556% 23.9%)");
+    expect(bgAccentSubtle).toBe("rgb(0% 15.035% 24.348%)");
   });
 
   it("should return correct color when seedChroma < 0.04", () => {
@@ -165,7 +165,7 @@ describe("bgAccentSubtleHover color", () => {
     const { bgAccentSubtleHover } = new DarkModeTheme(
       "oklch(0.35 0.09 70)",
     ).getColors();
-    expect(bgAccentSubtleHover).toBe("rgb(25.181% 12.291% 0%)");
+    expect(bgAccentSubtleHover).toBe("rgb(25.471% 12.268% 0%)");
   });
 });
 
@@ -174,7 +174,7 @@ describe("bgAccentSubtleActive color", () => {
     const { bgAccentSubtleActive } = new DarkModeTheme(
       "oklch(0.35 0.09 70)",
     ).getColors();
-    expect(bgAccentSubtleActive).toBe("rgb(19.651% 7.4427% 0%)");
+    expect(bgAccentSubtleActive).toBe("rgb(19.068% 8.15% 0%)");
   });
 });
 
@@ -464,7 +464,7 @@ describe("bgNegativeSubtleActive color", () => {
     const { bgNegativeSubtleActive } = new DarkModeTheme(
       "oklch(0.55 0.22 27)",
     ).getColors();
-    expect(bgNegativeSubtleActive).toEqual("rgb(24.04% 0.5234% 2.9937%)");
+    expect(bgNegativeSubtleActive).toEqual("rgb(24.04% 0.52339% 2.9937%)");
   });
 });
 
@@ -476,17 +476,17 @@ describe("bgWarning color", () => {
 
   it("should return correct color when seed color is yellow (hue between 60 and 115) but chroma is not greater than 0.09", () => {
     const { bgWarning } = new DarkModeTheme("oklch(0.75 0.05 85)").getColors();
-    expect(bgWarning).toEqual("rgb(85.145% 64.66% 8.0286%)");
+    expect(bgWarning).toEqual("rgb(85.145% 64.66% 8.0285%)");
   });
 
   it("should return correct color when seed color is not yellow (hue outside 60-115) and chroma > 0.09", () => {
     const { bgWarning } = new DarkModeTheme("oklch(0.75 0.15 50)").getColors();
-    expect(bgWarning).toEqual("rgb(85.145% 64.66% 8.0286%)");
+    expect(bgWarning).toEqual("rgb(85.145% 64.66% 8.0285%)");
   });
 
   it("should return correct color when seed color is not yellow (hue outside 60-115) and chroma is not greater than 0.09", () => {
     const { bgWarning } = new DarkModeTheme("oklch(0.75 0.05 50)").getColors();
-    expect(bgWarning).toEqual("rgb(85.145% 64.66% 8.0286%)");
+    expect(bgWarning).toEqual("rgb(85.145% 64.66% 8.0285%)");
   });
 });
 
@@ -623,25 +623,25 @@ describe("fgNegative color", () => {
   it("should return correct color when chroma < 0.04", () => {
     const { fgNegative } = new DarkModeTheme("oklch(0.45 0.03 60)").getColors();
 
-    expect(fgNegative).toEqual("rgb(93.903% 0% 24.24%)");
+    expect(fgNegative).toEqual("rgb(95.583% 0% 26.685%)");
   });
 
   it("should return correct color when chroma > 0.04", () => {
     const { fgNegative } = new DarkModeTheme("oklch(0.45 0.1 60)").getColors();
 
-    expect(fgNegative).toEqual("rgb(93.903% 0% 24.24%)");
+    expect(fgNegative).toEqual("rgb(95.583% 0% 26.685%)");
   });
 
   it("should return correct color hue is between 5 and 49", () => {
     const { fgNegative } = new DarkModeTheme("oklch(0.45 0.1 30)").getColors();
 
-    expect(fgNegative).toEqual("rgb(93.292% 0% 32.205%)");
+    expect(fgNegative).toEqual("rgb(94.917% 0% 33.564%)");
   });
 
   it("should return correct color hue is not between 5 and 49", () => {
     const { fgNegative } = new DarkModeTheme("oklch(0.45 0.1 120)").getColors();
 
-    expect(fgNegative).toEqual("rgb(93.903% 0% 24.24%)");
+    expect(fgNegative).toEqual("rgb(95.583% 0% 26.685%)");
   });
 });
 
@@ -649,7 +649,7 @@ describe("fgWarning color", () => {
   it("should return correct color", () => {
     const { fgWarning } = new DarkModeTheme("oklch(0.45 0.03 60)").getColors();
 
-    expect(fgWarning).toEqual("rgb(100% 78.06% 1.4578%)");
+    expect(fgWarning).toEqual("rgb(100% 77.487% 33.553%)");
   });
 });
 
@@ -693,7 +693,7 @@ describe("fgOnPositive color ", () => {
       "oklch(0.45 0.03 110)",
     ).getColors();
 
-    expect(fgOnPositive).toEqual("rgb(80.46% 100% 80.049%)");
+    expect(fgOnPositive).toEqual("rgb(76.168% 100% 76.567%)");
   });
 });
 
@@ -703,7 +703,7 @@ describe("fgOnNegative color ", () => {
       "oklch(0.45 0.03 110)",
     ).getColors();
 
-    expect(fgOnNegative).toEqual("rgb(100% 85.802% 83.139%)");
+    expect(fgOnNegative).toEqual("rgb(100% 87.307% 84.888%)");
   });
 });
 
@@ -713,7 +713,7 @@ describe("fgOnWarning color ", () => {
       "oklch(0.45 0.03 110)",
     ).getColors();
 
-    expect(fgOnWarning).toEqual("rgb(23.887% 11.273% 0%)");
+    expect(fgOnWarning).toEqual("rgb(21.445% 13.386% 0%)");
   });
 });
 
@@ -807,14 +807,14 @@ describe("bdNegativeHover", () => {
     const { bdNegativeHover } = new DarkModeTheme(
       "oklch(0.45 0.03 60)",
     ).getColors();
-    expect(bdNegativeHover).toEqual("rgb(65.578% 36.03% 32.933%)");
+    expect(bdNegativeHover).toEqual("rgb(65.578% 36.03% 32.932%)");
   });
 });
 
 describe("bdWarning", () => {
   it("should return correct color", () => {
     const { bdWarning } = new DarkModeTheme("oklch(0.45 0.03 60)").getColors();
-    expect(bdWarning).toEqual("rgb(47.158% 34.346% 0%)");
+    expect(bdWarning).toEqual("rgb(48.431% 33.879% 0%)");
   });
 });
 
@@ -823,14 +823,14 @@ describe("bdWarningHover", () => {
     const { bdWarningHover } = new DarkModeTheme(
       "oklch(0.45 0.03 60)",
     ).getColors();
-    expect(bdWarningHover).toEqual("rgb(61.76% 46.241% 0%)");
+    expect(bdWarningHover).toEqual("rgb(63.866% 45.645% 0%)");
   });
 });
 
 describe("bdOnAccent", () => {
   it("should return correct color", () => {
     const { bdOnAccent } = new DarkModeTheme("oklch(0.45 0.03 60)").getColors();
-    expect(bdOnAccent).toEqual("rgb(8.8239% 3.8507% 0.7917%)");
+    expect(bdOnAccent).toEqual("rgb(8.8239% 3.8507% 0.79169%)");
   });
 });
 
@@ -848,7 +848,7 @@ describe("bdOnPositive", () => {
     const { bdOnPositive } = new DarkModeTheme(
       "oklch(0.45 0.03 60)",
     ).getColors();
-    expect(bdOnPositive).toEqual("rgb(0% 38.175% 0%)");
+    expect(bdOnPositive).toEqual("rgb(0% 38.221% 0%)");
   });
 });
 
@@ -857,7 +857,7 @@ describe("bdOnNegative", () => {
     const { bdOnNegative } = new DarkModeTheme(
       "oklch(0.45 0.03 60)",
     ).getColors();
-    expect(bdOnNegative).toEqual("rgb(36.138% 0% 2.5021%)");
+    expect(bdOnNegative).toEqual("rgb(38.766% 0% 0%)");
   });
 });
 
@@ -866,6 +866,6 @@ describe("bdOnWarning", () => {
     const { bdOnWarning } = new DarkModeTheme(
       "oklch(0.45 0.03 60)",
     ).getColors();
-    expect(bdOnWarning).toEqual("rgb(49.811% 36.357% 0%)");
+    expect(bdOnWarning).toEqual("rgb(51.176% 35.973% 0%)");
   });
 });
diff --git a/app/client/packages/design-system/theming/src/color/tests/LightModeTheme.test.ts b/app/client/packages/design-system/theming/src/color/tests/LightModeTheme.test.ts
index 380da921d5..db589351b6 100644
--- a/app/client/packages/design-system/theming/src/color/tests/LightModeTheme.test.ts
+++ b/app/client/packages/design-system/theming/src/color/tests/LightModeTheme.test.ts
@@ -39,28 +39,28 @@ describe("bgAccentHover color", () => {
     const { bgAccentHover } = new LightModeTheme(
       "oklch(0.05 0.09 231)",
     ).getColors();
-    expect(bgAccentHover).toBe("rgb(0% 23.271% 34.263%)");
+    expect(bgAccentHover).toBe("rgb(0% 23.472% 35.518%)");
   });
 
   it("should return correct color when lightness is between 0.06 and 0.14", () => {
     const { bgAccentHover } = new LightModeTheme(
       "oklch(0.08 0.09 231)",
     ).getColors();
-    expect(bgAccentHover).toBe("rgb(0% 17.836% 27.428%)");
+    expect(bgAccentHover).toBe("rgb(0% 18.133% 28.462%)");
   });
 
   it("should return correct color when lightness is between 0.14 and 0.21 and hue is between 120 and 300", () => {
     const { bgAccentHover } = new LightModeTheme(
       "oklch(0.17 0.09 231)",
     ).getColors();
-    expect(bgAccentHover).toBe("rgb(0% 16.773% 26.103%)");
+    expect(bgAccentHover).toBe("rgb(0% 17.091% 27.078%)");
   });
 
   it("should return correct color when lightness is between 0.14 and 0.21 and hue is not between 120 and 300", () => {
     const { bgAccentHover } = new LightModeTheme(
       "oklch(0.17 0.09 110)",
     ).getColors();
-    expect(bgAccentHover).toBe("rgb(19.339% 18.943% 0%)");
+    expect(bgAccentHover).toBe("rgb(19.253% 19.006% 0%)");
   });
 
   it("should return correct color when lightness is between 0.21 and 0.4", () => {
@@ -104,7 +104,7 @@ describe("bgAccentActive color", () => {
     const { bgAccentActive } = new LightModeTheme(
       "oklch(0.35 0.09 70)",
     ).getColors();
-    expect(bgAccentActive).toBe("rgb(28.712% 15.185% 0%)");
+    expect(bgAccentActive).toBe("rgb(29.443% 14.834% 0%)");
   });
 
   it("should return correct color when lightness is between 0.4 and 0.7", () => {
@@ -134,14 +134,14 @@ describe("bgAccentSubtle color", () => {
     const { bgAccentSubtle } = new LightModeTheme(
       "oklch(0.95 0.09 231)",
     ).getColors();
-    expect(bgAccentSubtle).toBe("rgb(85.876% 96.17% 100%)");
+    expect(bgAccentSubtle).toBe("rgb(80.68% 97.025% 100%)");
   });
 
   it("should return correct color when seedLightness < 0.93", () => {
     const { bgAccentSubtle } = new LightModeTheme(
       "oklch(0.92 0.09 231)",
     ).getColors();
-    expect(bgAccentSubtle).toBe("rgb(78.235% 93.705% 100%)");
+    expect(bgAccentSubtle).toBe("rgb(73.159% 94.494% 100%)");
   });
 
   it("should return correct color when seedChroma >  0.09 and hue is between 116 and 165", () => {
@@ -171,7 +171,7 @@ describe("bgAccentSubtleHover color", () => {
     const { bgAccentSubtleHover } = new LightModeTheme(
       "oklch(0.35 0.09 70)",
     ).getColors();
-    expect(bgAccentSubtleHover).toBe("rgb(100% 91.599% 80.256%)");
+    expect(bgAccentSubtleHover).toBe("rgb(100% 91.101% 76.695%)");
   });
 });
 
@@ -189,7 +189,7 @@ describe("bgAssistive color", () => {
     const { bgAssistive } = new LightModeTheme(
       "oklch(0.95 0.03 170)",
     ).getColors();
-    expect(bgAssistive).toBe("rgb(5.1758% 5.1758% 5.1759%)");
+    expect(bgAssistive).toBe("rgb(5.1758% 5.1758% 5.1758%)");
   });
 });
 
@@ -364,21 +364,21 @@ describe("bgPositive color", () => {
     const { bgPositive } = new LightModeTheme(
       "oklch(0.62 0.1 145)",
     ).getColors();
-    expect(bgPositive).toEqual("rgb(6.7435% 63.436% 18.481%)");
+    expect(bgPositive).toEqual("rgb(6.7436% 63.436% 18.481%)");
   });
 
   it("should return correct color when seed color is not green (hue outside 116-165) and chroma > 0.11", () => {
     const { bgPositive } = new LightModeTheme(
       "oklch(0.62 0.19 100)",
     ).getColors();
-    expect(bgPositive).toEqual("rgb(6.7435% 63.436% 18.481%)");
+    expect(bgPositive).toEqual("rgb(6.7436% 63.436% 18.481%)");
   });
 
   it("should return correct color when seed color is not green (hue outside 116-165) and chroma is not greater than 0.11", () => {
     const { bgPositive } = new LightModeTheme(
       "oklch(0.62 0.1 100)",
     ).getColors();
-    expect(bgPositive).toEqual("rgb(6.7435% 63.436% 18.481%)");
+    expect(bgPositive).toEqual("rgb(6.7436% 63.436% 18.481%)");
   });
 });
 
@@ -414,7 +414,7 @@ describe("bgPositiveSubtleHover color", () => {
     const { bgPositiveSubtleHover } = new LightModeTheme(
       "oklch(0.62 0.19 100)",
     ).getColors();
-    expect(bgPositiveSubtleHover).toEqual("rgb(84.848% 100% 84.841%)");
+    expect(bgPositiveSubtleHover).toEqual("rgb(83.899% 100% 83.95%)");
   });
 });
 
@@ -432,7 +432,7 @@ describe("bgNegative color", () => {
     const { bgNegative } = new LightModeTheme(
       "oklch(0.55 0.22 27)",
     ).getColors();
-    expect(bgNegative).toEqual("rgb(82.941% 0.9786% 21.484%)");
+    expect(bgNegative).toEqual("rgb(82.941% 0.97856% 21.484%)");
   });
 
   it("should return correct color when seed color is red (hue between 5 and 49) but chroma is not greater than 0.12", () => {
@@ -476,7 +476,7 @@ describe("bgNegativeSubtle color", () => {
     const { bgNegativeSubtle } = new LightModeTheme(
       "oklch(0.55 0.22 27)",
     ).getColors();
-    expect(bgNegativeSubtle).toEqual("rgb(100% 89.936% 89.52%)");
+    expect(bgNegativeSubtle).toEqual("rgb(100% 88.914% 88.427%)");
   });
 });
 
@@ -485,7 +485,7 @@ describe("bgNegativeSubtleHover color", () => {
     const { bgNegativeSubtleHover } = new LightModeTheme(
       "oklch(0.55 0.22 27)",
     ).getColors();
-    expect(bgNegativeSubtleHover).toEqual("rgb(100% 93.507% 93.192%)");
+    expect(bgNegativeSubtleHover).toEqual("rgb(100% 92.552% 92.132%)");
   });
 });
 
@@ -494,7 +494,7 @@ describe("bgNegativeSubtleActive color", () => {
     const { bgNegativeSubtleActive } = new LightModeTheme(
       "oklch(0.55 0.22 27)",
     ).getColors();
-    expect(bgNegativeSubtleActive).toEqual("rgb(100% 88.131% 87.677%)");
+    expect(bgNegativeSubtleActive).toEqual("rgb(100% 87.314% 86.814%)");
   });
 });
 
@@ -506,7 +506,7 @@ describe("bgWarning color", () => {
 
   it("should return correct color when seed color is yellow (hue between 60 and 115) but chroma is not greater than 0.09", () => {
     const { bgWarning } = new LightModeTheme("oklch(0.75 0.05 85)").getColors();
-    expect(bgWarning).toEqual("rgb(85.145% 64.66% 8.0286%)");
+    expect(bgWarning).toEqual("rgb(85.145% 64.66% 8.0285%)");
   });
 
   it("should return correct color when seed color is not yellow (hue outside 60-115) and chroma > 0.09", () => {
@@ -516,7 +516,7 @@ describe("bgWarning color", () => {
 
   it("should return correct color when seed color is not yellow (hue outside 60-115) and chroma is not greater than 0.09", () => {
     const { bgWarning } = new LightModeTheme("oklch(0.75 0.05 85)").getColors();
-    expect(bgWarning).toEqual("rgb(85.145% 64.66% 8.0286%)");
+    expect(bgWarning).toEqual("rgb(85.145% 64.66% 8.0285%)");
   });
 });
 
@@ -543,7 +543,7 @@ describe("bgWarningSubtle color", () => {
     const { bgWarningSubtle } = new LightModeTheme(
       "oklch(0.75 0.15 85)",
     ).getColors();
-    expect(bgWarningSubtle).toEqual("rgb(100% 93.263% 83.925%)");
+    expect(bgWarningSubtle).toEqual("rgb(100% 92.843% 80.874%)");
   });
 });
 
@@ -552,7 +552,7 @@ describe("bgWarningSubtleHover color", () => {
     const { bgWarningSubtleHover } = new LightModeTheme(
       "oklch(0.75 0.15 85)",
     ).getColors();
-    expect(bgWarningSubtleHover).toEqual("rgb(100% 96.499% 91.027%)");
+    expect(bgWarningSubtleHover).toEqual("rgb(100% 95.606% 84.445%)");
   });
 });
 
@@ -561,7 +561,7 @@ describe("bgWarningSubtleActive color", () => {
     const { bgWarningSubtleActive } = new LightModeTheme(
       "oklch(0.75 0.15 85)",
     ).getColors();
-    expect(bgWarningSubtleActive).toEqual("rgb(100% 91.621% 80.174%)");
+    expect(bgWarningSubtleActive).toEqual("rgb(100% 91.541% 79.601%)");
   });
 });
 
@@ -629,13 +629,13 @@ describe("fgPositive color", () => {
       "oklch(0.45 0.03 60)",
     ).getColors();
 
-    expect(fgPositive).toEqual("rgb(6.7435% 63.436% 18.481%)");
+    expect(fgPositive).toEqual("rgb(6.7436% 63.436% 18.481%)");
   });
 
   it("should return correct color when lightness >  0.04", () => {
     const { fgPositive } = new LightModeTheme("oklch(0.45 0.1 60)").getColors();
 
-    expect(fgPositive).toEqual("rgb(6.7435% 63.436% 18.481%)");
+    expect(fgPositive).toEqual("rgb(6.7436% 63.436% 18.481%)");
   });
 
   it("should return correct color hue is between 116 and 165", () => {
@@ -643,13 +643,13 @@ describe("fgPositive color", () => {
       "oklch(0.45 0.1 120)",
     ).getColors();
 
-    expect(fgPositive).toEqual("rgb(6.7435% 63.436% 18.481%)");
+    expect(fgPositive).toEqual("rgb(6.7436% 63.436% 18.481%)");
   });
 
   it("should return correct color hue is not between 116 and 165", () => {
     const { fgPositive } = new LightModeTheme("oklch(0.45 0.1 30)").getColors();
 
-    expect(fgPositive).toEqual("rgb(6.7435% 63.436% 18.481%)");
+    expect(fgPositive).toEqual("rgb(6.7436% 63.436% 18.481%)");
   });
 });
 
@@ -659,19 +659,19 @@ describe("fgNegative color", () => {
       "oklch(0.45 0.03 60)",
     ).getColors();
 
-    expect(fgNegative).toEqual("rgb(100% 0% 28.453%)");
+    expect(fgNegative).toEqual("rgb(100% 0% 31.57%)");
   });
 
   it("should return correct color when chroma >  0.04", () => {
     const { fgNegative } = new LightModeTheme("oklch(0.45 0.1 60)").getColors();
 
-    expect(fgNegative).toEqual("rgb(100% 0% 28.453%)");
+    expect(fgNegative).toEqual("rgb(100% 0% 31.57%)");
   });
 
   it("should return correct color hue is between 5 and 49", () => {
     const { fgNegative } = new LightModeTheme("oklch(0.45 0.1 30)").getColors();
 
-    expect(fgNegative).toEqual("rgb(100% 0% 28.453%)");
+    expect(fgNegative).toEqual("rgb(100% 0% 31.57%)");
   });
 
   it("should return correct color hue is not between 5 and 49", () => {
@@ -679,7 +679,7 @@ describe("fgNegative color", () => {
       "oklch(0.45 0.1 120)",
     ).getColors();
 
-    expect(fgNegative).toEqual("rgb(100% 0% 28.453%)");
+    expect(fgNegative).toEqual("rgb(100% 0% 31.57%)");
   });
 });
 
@@ -687,7 +687,7 @@ describe("fgWarning color", () => {
   it("should return correct color", () => {
     const { fgWarning } = new LightModeTheme("oklch(0.45 0.03 60)").getColors();
 
-    expect(fgWarning).toEqual("rgb(71.79% 51.231% 0%)");
+    expect(fgWarning).toEqual("rgb(76.894% 49.631% 0%)");
   });
 });
 
@@ -733,7 +733,7 @@ describe("fgOnPositive color ", () => {
       "oklch(0.45 0.03 110)",
     ).getColors();
 
-    expect(fgOnPositive).toEqual("rgb(89.702% 100% 89.053%)");
+    expect(fgOnPositive).toEqual("rgb(81.009% 100% 81.169%)");
   });
 });
 
@@ -743,7 +743,7 @@ describe("fgOnNegative color ", () => {
       "oklch(0.45 0.03 110)",
     ).getColors();
 
-    expect(fgOnNegative).toEqual("rgb(100% 87.612% 85.249%)");
+    expect(fgOnNegative).toEqual("rgb(100% 89.124% 86.925%)");
   });
 });
 
@@ -753,7 +753,7 @@ describe("fgOnWarning color ", () => {
       "oklch(0.45 0.03 110)",
     ).getColors();
 
-    expect(fgOnWarning).toEqual("rgb(21.953% 9.0775% 0%)");
+    expect(fgOnWarning).toEqual("rgb(19.085% 11.601% 0%)");
   });
 });
 
@@ -779,17 +779,17 @@ describe("bdAccent color", () => {
 describe("bdFocus color", () => {
   it("should return correct color when lightness < 0.6", () => {
     const { bdFocus } = new LightModeTheme("oklch(0.45 0.4 60)").getColors();
-    expect(bdFocus).toEqual("rgb(64.509% 31.604% 0%)");
+    expect(bdFocus).toEqual("rgb(68.381% 33.855% 0%)");
   });
 
   it("should return correct color when lightness > 0.8", () => {
     const { bdFocus } = new LightModeTheme("oklch(0.85 0.03 60)").getColors();
-    expect(bdFocus).toEqual("rgb(64.667% 36.271% 0%)");
+    expect(bdFocus).toEqual("rgb(68.313% 33.908% 0%)");
   });
 
   it("should return correct color when chroma < 0.15", () => {
     const { bdFocus } = new LightModeTheme("oklch(0.85 0.1 60)").getColors();
-    expect(bdFocus).toEqual("rgb(64.667% 36.271% 0%)");
+    expect(bdFocus).toEqual("rgb(68.313% 33.908% 0%)");
   });
 
   it("should return correct color when hue is between 0 and 55", () => {
@@ -842,7 +842,7 @@ describe("bdNegative", () => {
     const { bdNegative } = new LightModeTheme(
       "oklch(0.45 0.03 60)",
     ).getColors();
-    expect(bdNegative).toEqual("rgb(100% 54.045% 48.162%)");
+    expect(bdNegative).toEqual("rgb(100% 55.521% 50.654%)");
   });
 });
 
@@ -851,7 +851,7 @@ describe("bdNegativeHover", () => {
     const { bdNegativeHover } = new LightModeTheme(
       "oklch(0.45 0.03 60)",
     ).getColors();
-    expect(bdNegativeHover).toEqual("rgb(100% 70.673% 65.818%)");
+    expect(bdNegativeHover).toEqual("rgb(100% 72.272% 68.285%)");
   });
 });
 
@@ -867,7 +867,7 @@ describe("bdWarningHover", () => {
     const { bdWarningHover } = new LightModeTheme(
       "oklch(0.45 0.03 60)",
     ).getColors();
-    expect(bdWarningHover).toEqual("rgb(100% 87.513% 57.392%)");
+    expect(bdWarningHover).toEqual("rgb(100% 86.971% 47.122%)");
   });
 });
 
@@ -894,7 +894,7 @@ describe("bdOnPositive", () => {
     const { bdOnPositive } = new LightModeTheme(
       "oklch(0.45 0.03 60)",
     ).getColors();
-    expect(bdOnPositive).toEqual("rgb(0% 22.552% 3.6201%)");
+    expect(bdOnPositive).toEqual("rgb(0% 22.253% 0%)");
   });
 });
 
@@ -903,7 +903,7 @@ describe("bdOnNegative", () => {
     const { bdOnNegative } = new LightModeTheme(
       "oklch(0.45 0.03 60)",
     ).getColors();
-    expect(bdOnNegative).toEqual("rgb(21.923% 0% 2.8118%)");
+    expect(bdOnNegative).toEqual("rgb(25.15% 0% 0%)");
   });
 });
 
@@ -912,6 +912,6 @@ describe("bdOnWarning", () => {
     const { bdOnWarning } = new LightModeTheme(
       "oklch(0.45 0.03 60)",
     ).getColors();
-    expect(bdOnWarning).toEqual("rgb(39.972% 27.552% 0%)");
+    expect(bdOnWarning).toEqual("rgb(40.354% 27.735% 0%)");
   });
 });
diff --git a/app/client/packages/design-system/widgets/package.json b/app/client/packages/design-system/widgets/package.json
index cbbc284f48..6fe7d1c212 100644
--- a/app/client/packages/design-system/widgets/package.json
+++ b/app/client/packages/design-system/widgets/package.json
@@ -21,7 +21,7 @@
     "@react-types/shared": "^3.23.1",
     "@tabler/icons-react": "^3.10.0",
     "clsx": "^2.0.0",
-    "colorjs.io": "^0.4.3",
+    "colorjs.io": "^0.5.2",
     "lodash": "*",
     "react-aria-components": "^1.2.1"
   },
diff --git a/app/client/packages/dsl/package.json b/app/client/packages/dsl/package.json
index d22e40cbb5..626e0eaf15 100644
--- a/app/client/packages/dsl/package.json
+++ b/app/client/packages/dsl/package.json
@@ -21,7 +21,7 @@
     "rollup-plugin-generate-package-json": "^3.2.0",
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "rollup-plugin-typescript2": "^0.32.0",
-    "typescript": "5.4"
+    "typescript": "^5.5.4"
   },
   "devDependencies": {
     "@rollup/plugin-json": "^6.0.0",
diff --git a/app/client/packages/rts/package.json b/app/client/packages/rts/package.json
index 08570fc176..ebbc6aa8a3 100644
--- a/app/client/packages/rts/package.json
+++ b/app/client/packages/rts/package.json
@@ -37,6 +37,6 @@
     "supertest": "^6.3.3",
     "ts-jest": "29.1.0",
     "tsc-alias": "^1.8.2",
-    "typescript": "5.4"
+    "typescript": "^5.5.4"
   }
 }
diff --git a/app/client/packages/storybook/package.json b/app/client/packages/storybook/package.json
index c1a9eaa587..f103abcfcd 100644
--- a/app/client/packages/storybook/package.json
+++ b/app/client/packages/storybook/package.json
@@ -44,6 +44,6 @@
     "@design-system/widgets": "workspace:^",
     "@design-system/widgets-old": "workspace:^",
     "appsmith-icons": "workspace:^",
-    "colorjs.io": "^0.4.3"
+    "colorjs.io": "^0.5.2"
   }
 }
diff --git a/app/client/src/plugins/Linting/utils/groupDifferencesByType.ts b/app/client/src/plugins/Linting/utils/groupDifferencesByType.ts
index 5ccc730ba5..8621aa55db 100644
--- a/app/client/src/plugins/Linting/utils/groupDifferencesByType.ts
+++ b/app/client/src/plugins/Linting/utils/groupDifferencesByType.ts
@@ -1,10 +1,16 @@
-import type { Diff, DiffArray } from "deep-diff";
+import type {
+  Diff,
+  DiffArray,
+  DiffDeleted,
+  DiffEdit,
+  DiffNew,
+} from "deep-diff";
 import { isEmpty, partition } from "lodash";
 
 export function groupDifferencesByType(differences: Diff<unknown>[]): {
-  edits: Diff<unknown>[];
-  additions: Diff<unknown>[];
-  deletions: Diff<unknown>[];
+  edits: DiffEdit<unknown, unknown>[];
+  additions: DiffNew<unknown>[];
+  deletions: DiffDeleted<unknown>[];
 } {
   if (isEmpty(differences)) return { edits: [], additions: [], deletions: [] };
   const [edits, others] = partition(differences, (diff) => diff.kind === "E");
diff --git a/app/client/yarn.lock b/app/client/yarn.lock
index 7259c7a908..9d6c743ad0 100644
--- a/app/client/yarn.lock
+++ b/app/client/yarn.lock
@@ -3044,7 +3044,7 @@ __metadata:
     appsmith-icons: "workspace:^"
     babel-loader: 9.1.2
     chromatic: ^11.3.0
-    colorjs.io: ^0.4.3
+    colorjs.io: ^0.5.2
     react-docgen-typescript: ^2.2.2
     storybook: ^8.2.6
     vite: ^5.2.9
@@ -3117,7 +3117,7 @@ __metadata:
     "@tabler/icons-react": ^3.10.0
     "@types/fs-extra": ^11.0.4
     clsx: ^2.0.0
-    colorjs.io: ^0.4.3
+    colorjs.io: ^0.5.2
     eslint-plugin-storybook: ^0.6.10
     lodash: "*"
     react-aria-components: ^1.2.1
@@ -8616,7 +8616,7 @@ __metadata:
     rollup-plugin-peer-deps-external: ^2.2.4
     rollup-plugin-typescript2: ^0.32.0
     ts-jest: 29.1.0
-    typescript: 5.4
+    typescript: ^5.5.4
     unescape-js: ^1.1.4
   languageName: unknown
   linkType: soft
@@ -8637,7 +8637,7 @@ __metadata:
     rollup-plugin-peer-deps-external: ^2.2.4
     rollup-plugin-typescript2: ^0.32.0
     ts-jest: ^29.1.0
-    typescript: 5.4
+    typescript: ^5.5.4
   languageName: unknown
   linkType: soft
 
@@ -13176,7 +13176,7 @@ __metadata:
     supertest: ^6.3.3
     ts-jest: 29.1.0
     tsc-alias: ^1.8.2
-    typescript: 5.4
+    typescript: ^5.5.4
   languageName: unknown
   linkType: soft
 
@@ -13496,7 +13496,7 @@ __metadata:
     ts-loader: ^9.4.1
     ts-node: ^10.9.1
     tslib: ^2.3.1
-    typescript: 5.4
+    typescript: ^5.5.4
     unescape-js: ^1.1.4
     url-search-params-polyfill: ^8.0.0
     uuid: ^9.0.0
@@ -15748,10 +15748,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"colorjs.io@npm:^0.4.3":
-  version: 0.4.3
-  resolution: "colorjs.io@npm:0.4.3"
-  checksum: 5f597a6889219fcfa2171c5da326759c9c747546b847b41db64a474f941b623b5a4346bad30fbe61f4861ca6187bdbc5f389475be4ba3f570c6e30ee29f18e5c
+"colorjs.io@npm:^0.5.2":
+  version: 0.5.2
+  resolution: "colorjs.io@npm:0.5.2"
+  checksum: f4ad8a0ead4e7eb74612a5fed9ae999201116b215b2eac70660c1f643e21980922741641209bdbd010723923762e8e80bd499250acf7505605309f01b76f53fa
   languageName: node
   linkType: hard
 
@@ -34624,23 +34624,23 @@ __metadata:
   languageName: node
   linkType: hard
 
-"typescript@npm:5.4":
-  version: 5.4.5
-  resolution: "typescript@npm:5.4.5"
+"typescript@npm:^5.5.4":
+  version: 5.5.4
+  resolution: "typescript@npm:5.5.4"
   bin:
     tsc: bin/tsc
     tsserver: bin/tsserver
-  checksum: 53c879c6fa1e3bcb194b274d4501ba1985894b2c2692fa079db03c5a5a7140587a1e04e1ba03184605d35f439b40192d9e138eb3279ca8eee313c081c8bcd9b0
+  checksum: b309040f3a1cd91c68a5a58af6b9fdd4e849b8c42d837b2c2e73f9a4f96a98c4f1ed398a9aab576ee0a4748f5690cf594e6b99dbe61de7839da748c41e6d6ca8
   languageName: node
   linkType: hard
 
-"typescript@patch:typescript@5.4#~builtin<compat/typescript>":
-  version: 5.4.5
-  resolution: "typescript@patch:typescript@npm%3A5.4.5#~builtin<compat/typescript>::version=5.4.5&hash=77c9e2"
+"typescript@patch:typescript@^5.5.4#~builtin<compat/typescript>":
+  version: 5.5.4
+  resolution: "typescript@patch:typescript@npm%3A5.5.4#~builtin<compat/typescript>::version=5.5.4&hash=77c9e2"
   bin:
     tsc: bin/tsc
     tsserver: bin/tsserver
-  checksum: 2373c693f3b328f3b2387c3efafe6d257b057a142f9a79291854b14ff4d5367d3d730810aee981726b677ae0fd8329b23309da3b6aaab8263dbdccf1da07a3ba
+  checksum: fc52962f31a5bcb716d4213bef516885e4f01f30cea797a831205fc9ef12b405a40561c40eae3127ab85ba1548e7df49df2bcdee6b84a94bfbe3a0d7eff16b14
   languageName: node
   linkType: hard