diff --git a/README.md b/README.md
index 162b9b5..d34e21c 100644
--- a/README.md
+++ b/README.md
@@ -1,5 +1,4 @@
 <!-- default badges list -->
-![](https://img.shields.io/endpoint?url=https://codecentral.devexpress.com/api/v1/VersionRange/1015331587/25.1.3%2B)
 [![](https://img.shields.io/badge/Open_in_DevExpress_Support_Center-FF7200?style=flat-square&logo=DevExpress&logoColor=white)](https://supportcenter.devexpress.com/ticket/details/T1298736)
 [![](https://img.shields.io/badge/📖_How_to_use_DevExpress_Examples-e9f6fc?style=flat-square)](https://docs.devexpress.com/GeneralInformation/403183)
 [![](https://img.shields.io/badge/💬_Leave_Feedback-feecdd?style=flat-square)](#does-this-example-address-your-development-requirementsobjectives)
diff --git a/Vue/package-lock.json b/Vue/package-lock.json
index 05f6ad9..4d2f1c2 100644
--- a/Vue/package-lock.json
+++ b/Vue/package-lock.json
@@ -8,8 +8,8 @@
       "name": "vue-project",
       "version": "0.0.0",
       "dependencies": {
-        "devextreme": "24.2.3",
-        "devextreme-vue": "24.2.3",
+        "devextreme": "25.1.3",
+        "devextreme-vue": "25.1.3",
         "vue": "^3.2.45",
         "vue-router": "^4.1.6"
       },
@@ -625,16 +625,6 @@
         "tslib": "2.3.1"
       }
     },
-    "node_modules/@devextreme/runtime": {
-      "version": "3.0.13",
-      "resolved": "https://registry.npmjs.org/@devextreme/runtime/-/runtime-3.0.13.tgz",
-      "integrity": "sha512-//24I6vo5a+XG/Ul3+vOGqU4M22IWyldpECxLY8iyGJWA5fiNaYzAedrMV2Ixo5oRj8DawiHTZKy5iKKF9ks5g==",
-      "dependencies": {
-        "inferno": "^7.4.6",
-        "inferno-create-element": "^7.4.6",
-        "inferno-hydrate": "^7.4.6"
-      }
-    },
     "node_modules/@esbuild/win32-x64": {
       "version": "0.18.20",
       "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.18.20.tgz",
@@ -911,6 +901,16 @@
         "node": ">=14"
       }
     },
+    "node_modules/@preact/signals-core": {
+      "version": "1.11.0",
+      "resolved": "https://registry.npmjs.org/@preact/signals-core/-/signals-core-1.11.0.tgz",
+      "integrity": "sha512-jglbibeWHuFRzEWVFY/TT7wB1PppJxmcSfUHcK+2J9vBRtiooMfw6tAPttojNYrrpdGViqAYCbPpmWYlMm+eMQ==",
+      "license": "MIT",
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/preact"
+      }
+    },
     "node_modules/@rushstack/eslint-patch": {
       "version": "1.10.3",
       "resolved": "https://registry.npmjs.org/@rushstack/eslint-patch/-/eslint-patch-1.10.3.tgz",
@@ -2129,10 +2129,11 @@
       "dev": true
     },
     "node_modules/core-js": {
-      "version": "3.37.1",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.37.1.tgz",
-      "integrity": "sha512-Xn6qmxrQZyB0FFY8E3bgRXei3lWDJHhvI+u0q9TKIYM49G8pAr0FgnnrFRAmsbptZL1yxRADVXn+x5AGsbBfyw==",
+      "version": "3.44.0",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.44.0.tgz",
+      "integrity": "sha512-aFCtd4l6GvAXwVEh3XbbVqJGHDJt0OZRa+5ePGx3LLwi12WfexqQxcsohb2wgsa/92xtl19Hd66G/L+TaAxDMw==",
       "hasInstallScript": true,
+      "license": "MIT",
       "funding": {
         "type": "opencollective",
         "url": "https://opencollective.com/core-js"
@@ -2445,9 +2446,9 @@
       }
     },
     "node_modules/devexpress-diagram": {
-      "version": "2.2.13",
-      "resolved": "https://registry.npmjs.org/devexpress-diagram/-/devexpress-diagram-2.2.13.tgz",
-      "integrity": "sha512-OfAcfcFWJYlU/1kMtqrSSQUY3GQWKPHqU27A9e+TzFEhxI8XDyIPOCOnslRxnzYkfhB/RZ7hbGv9U0aHmtVbRg==",
+      "version": "2.2.18",
+      "resolved": "https://registry.npmjs.org/devexpress-diagram/-/devexpress-diagram-2.2.18.tgz",
+      "integrity": "sha512-zHWkrBbGDBbMBgK4fFsNlaMzcngf1DrTvbs0IHNHfBSsIDrNy8t3BXRgrLXWgFr8UCsYpkYx2aHGZ6kvsN/kWg==",
       "license": "SEE LICENSE IN README.md",
       "dependencies": {
         "@devexpress/utils": "^1.4.3",
@@ -2455,9 +2456,9 @@
       }
     },
     "node_modules/devexpress-gantt": {
-      "version": "4.1.56",
-      "resolved": "https://registry.npmjs.org/devexpress-gantt/-/devexpress-gantt-4.1.56.tgz",
-      "integrity": "sha512-jnnvDYDDzjqr8pnWYsAM96mug6yXEQ1H26QLLBRbwLC72ckb1yv0Rk6DUae9ZwewIFNzIKHt1klQMF/KD9Mb8A==",
+      "version": "4.1.62",
+      "resolved": "https://registry.npmjs.org/devexpress-gantt/-/devexpress-gantt-4.1.62.tgz",
+      "integrity": "sha512-8ULKoAyStlFnATNkkYFZWB7eQHrxJPallq04+HHiu9fn1TIRz0SgYlQdZuXoOmEhcRhaNwk5d+38sJ6OMC0HnQ==",
       "license": "SEE LICENSE IN README.md",
       "dependencies": {
         "@devexpress/utils": "^1.4.3",
@@ -2465,43 +2466,48 @@
       }
     },
     "node_modules/devextreme": {
-      "version": "24.2.3",
-      "resolved": "https://registry.npmjs.org/devextreme/-/devextreme-24.2.3.tgz",
-      "integrity": "sha512-5KdXaZWLOhlncS26U8G9q5QpoO7gTluJfoUjgB74NN2Pe0S8yX0YAXylx5CqbEh1w2MjNfIU36fuFn2zwGP/nQ==",
+      "version": "25.1.3",
+      "resolved": "https://registry.npmjs.org/devextreme/-/devextreme-25.1.3.tgz",
+      "integrity": "sha512-72J3vL+QbQWEfUTzNuPTEsyN/+Nnb4jI/BwymcUHcBUKKp4vf3m72KviteHxutobblcfzvZmxLQCEvn01T/EqA==",
       "license": "SEE LICENSE IN README.md",
       "dependencies": {
         "@babel/runtime": "^7.12.1",
-        "@devextreme/runtime": "3.0.13",
-        "devexpress-diagram": "2.2.13",
-        "devexpress-gantt": "4.1.56",
-        "devextreme-quill": "1.7.1",
-        "inferno": "^7.4.9",
-        "inferno-hydrate": "^7.4.9",
+        "@preact/signals-core": "^1.8.0",
+        "devexpress-diagram": "2.2.18",
+        "devexpress-gantt": "4.1.62",
+        "devextreme-quill": "1.7.3",
+        "inferno": "^8.2.3",
+        "inferno-create-element": "^8.2.3",
+        "inferno-hydrate": "^8.2.3",
         "jszip": "^3.10.1",
         "rrule": "^2.7.1"
+      },
+      "bin": {
+        "devextreme-bundler": "bin/bundler.js",
+        "devextreme-bundler-init": "bin/bundler-init.js"
       }
     },
     "node_modules/devextreme-quill": {
-      "version": "1.7.1",
-      "resolved": "https://registry.npmjs.org/devextreme-quill/-/devextreme-quill-1.7.1.tgz",
-      "integrity": "sha512-0smNE/Br+m9gQDxSPaJxwmrX5ZFubnBHWdbBtY8p6L3ATrF00mFqNQIflVi1tUAr8ndYeHY6Oih46Z1EWDGSQA==",
+      "version": "1.7.3",
+      "resolved": "https://registry.npmjs.org/devextreme-quill/-/devextreme-quill-1.7.3.tgz",
+      "integrity": "sha512-YPE9e8UOOByf/QUBAGZRmCDHFzQDnM+hyPet6vFNFGm2UsJAIz4xkL6gDhfan/a6otInQUB5wLsbPZqldZrliQ==",
+      "license": "BSD-3-Clause",
       "dependencies": {
         "core-js": "^3.34.0",
         "eventemitter3": "^4.0.7",
         "lodash.clonedeep": "^4.5.0",
-        "lodash.isequal": "^4.5.0",
         "lodash.merge": "^4.6.2",
         "parchment": "^2.0.1",
         "quill-delta": "^5.0.0"
       }
     },
     "node_modules/devextreme-vue": {
-      "version": "24.2.3",
-      "resolved": "https://registry.npmjs.org/devextreme-vue/-/devextreme-vue-24.2.3.tgz",
-      "integrity": "sha512-zbK2wTkBF2Q9FGCT5eaiNIE+l3Hx6oMCkcmKFstodYZHNORif5Z8Tt9HMVWUibByUYUtIJ6NSrudkDGXZezt3A==",
+      "version": "25.1.3",
+      "resolved": "https://registry.npmjs.org/devextreme-vue/-/devextreme-vue-25.1.3.tgz",
+      "integrity": "sha512-x4nd2EO5zqtHBa8oNQas2h3TbxU4dLooYk6DdRE7nAQFJd6XqRaswnPPyrjTWs27L5phBhpZqEisvJ+Eviajsw==",
       "license": "MIT",
       "peerDependencies": {
-        "devextreme": "~24.2.3",
+        "devextreme": "25.1.3",
         "vue": "^3.0.0"
       }
     },
@@ -3625,7 +3631,8 @@
     "node_modules/eventemitter3": {
       "version": "4.0.7",
       "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz",
-      "integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw=="
+      "integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==",
+      "license": "MIT"
     },
     "node_modules/fast-deep-equal": {
       "version": "3.1.3",
@@ -4309,41 +4316,44 @@
       }
     },
     "node_modules/inferno": {
-      "version": "7.4.11",
-      "resolved": "https://registry.npmjs.org/inferno/-/inferno-7.4.11.tgz",
-      "integrity": "sha512-N+cs33ESWI8fdToCd98yMRYl7jkLnCkJskxov3FKKlaKOvk3PRlAttbhmUaYdWXlRvt2WeXi+J4MbzNj3V6G0w==",
+      "version": "8.2.3",
+      "resolved": "https://registry.npmjs.org/inferno/-/inferno-8.2.3.tgz",
+      "integrity": "sha512-LMeRlCe+RlXw8kHCLyOWRk2PsZ3Fo4jkESyAR1g4FfPT48N78i11YhTVXW2ukCx5MFjv+qrfa73JzJWU9sg4CQ==",
       "hasInstallScript": true,
+      "license": "MIT",
       "dependencies": {
-        "inferno-shared": "7.4.11",
-        "inferno-vnode-flags": "7.4.11",
+        "csstype": "^3.1.2",
+        "inferno-vnode-flags": "8.2.3",
         "opencollective-postinstall": "^2.0.3"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/inferno"
       }
     },
     "node_modules/inferno-create-element": {
-      "version": "7.4.11",
-      "resolved": "https://registry.npmjs.org/inferno-create-element/-/inferno-create-element-7.4.11.tgz",
-      "integrity": "sha512-kE6XIx2hPAd5qpDli2iGjNXgubvuyxdLvoiW71WnSzIIxA+Uxa/s8lY8m03VyHHVypFV3n329ZY5dFvKc7UQMg==",
+      "version": "8.2.3",
+      "resolved": "https://registry.npmjs.org/inferno-create-element/-/inferno-create-element-8.2.3.tgz",
+      "integrity": "sha512-YEwX4OiFlgeTutvE16uCGxkaSVwZ1DklpAPX8okjVsGaLIWQrM8QIQFxn3mTLWSu70Uea+afQfKL5wE4hxn39Q==",
+      "license": "MIT",
       "dependencies": {
-        "inferno": "7.4.11"
+        "inferno": "8.2.3"
       }
     },
     "node_modules/inferno-hydrate": {
-      "version": "7.4.11",
-      "resolved": "https://registry.npmjs.org/inferno-hydrate/-/inferno-hydrate-7.4.11.tgz",
-      "integrity": "sha512-hF9Ke4GHAkj8GQrMXBZPfsUqhq6WjkoDCAfXhPBuF1Wiceqyy8KerOOXEnuocHky77fuEXq0AzVnQcC064Bkfw==",
+      "version": "8.2.3",
+      "resolved": "https://registry.npmjs.org/inferno-hydrate/-/inferno-hydrate-8.2.3.tgz",
+      "integrity": "sha512-AyCiswnjYg7D9veJdjiQg06Npp0/iXKhwOm2hjoY3cjadT3fIdz2XtDElLB7imU4icuJ3xOmXA8FgIfnSJfHrQ==",
+      "license": "MIT",
       "dependencies": {
-        "inferno": "7.4.11"
+        "inferno": "8.2.3"
       }
     },
-    "node_modules/inferno-shared": {
-      "version": "7.4.11",
-      "resolved": "https://registry.npmjs.org/inferno-shared/-/inferno-shared-7.4.11.tgz",
-      "integrity": "sha512-pN725bDSTxkQmRS3e/3H02/xAqgHl+xgddCMjPm8M0etRdRcVCisi3NGPhzSbDDmiftrxhY31exs7+dwsngcDA=="
-    },
     "node_modules/inferno-vnode-flags": {
-      "version": "7.4.11",
-      "resolved": "https://registry.npmjs.org/inferno-vnode-flags/-/inferno-vnode-flags-7.4.11.tgz",
-      "integrity": "sha512-L7lslEQCq3IfwgT/b9zhuMf8fv6KXCNXXHZevk/WYxnqJsOWGDcKpJn0zkzXfvmj0otbB149iLUQVBq3oe2sfA=="
+      "version": "8.2.3",
+      "resolved": "https://registry.npmjs.org/inferno-vnode-flags/-/inferno-vnode-flags-8.2.3.tgz",
+      "integrity": "sha512-dfC0MIwFv9PCbZCUsuk9ISejFS3fKJODC0rZ/LjxxzE+OrCk+PMwPLsUnGU6O9/jbBnPACVz1BkACDf5LWgU5Q==",
+      "license": "MIT"
     },
     "node_modules/inflight": {
       "version": "1.0.6",
@@ -5118,12 +5128,15 @@
     "node_modules/lodash.clonedeep": {
       "version": "4.5.0",
       "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz",
-      "integrity": "sha512-H5ZhCF25riFd9uB5UCkVKo61m3S/xZk1x4wA6yp/L3RFP6Z/eHH1ymQcGLo7J3GMPfm0V/7m1tryHuGVxpqEBQ=="
+      "integrity": "sha512-H5ZhCF25riFd9uB5UCkVKo61m3S/xZk1x4wA6yp/L3RFP6Z/eHH1ymQcGLo7J3GMPfm0V/7m1tryHuGVxpqEBQ==",
+      "license": "MIT"
     },
     "node_modules/lodash.isequal": {
       "version": "4.5.0",
       "resolved": "https://registry.npmjs.org/lodash.isequal/-/lodash.isequal-4.5.0.tgz",
-      "integrity": "sha512-pDo3lu8Jhfjqls6GkMgpahsF9kCyayhgykjyLMNFTKWrpVdAQtYyB4muAMWozBB4ig/dtWAmsMxLEI8wuz+DYQ=="
+      "integrity": "sha512-pDo3lu8Jhfjqls6GkMgpahsF9kCyayhgykjyLMNFTKWrpVdAQtYyB4muAMWozBB4ig/dtWAmsMxLEI8wuz+DYQ==",
+      "deprecated": "This package is deprecated. Use require('node:util').isDeepStrictEqual instead.",
+      "license": "MIT"
     },
     "node_modules/lodash.merge": {
       "version": "4.6.2",
@@ -5703,6 +5716,7 @@
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/opencollective-postinstall/-/opencollective-postinstall-2.0.3.tgz",
       "integrity": "sha512-8AV/sCtuzUeTo8gQK5qDZzARrulB3egtLzFgteqB2tcT4Mw7B8Kt7JcDHmltjz6FOAHsvTevk70gZEbhM4ZS9Q==",
+      "license": "MIT",
       "bin": {
         "opencollective-postinstall": "index.js"
       }
@@ -5762,7 +5776,8 @@
     "node_modules/parchment": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/parchment/-/parchment-2.0.1.tgz",
-      "integrity": "sha512-VBKrlEoZCBD+iwoeag0QTtY1Cti+Ma4nLpVYcc/uus/wHhMsPOi5InH3RL1s4aekahPZpabcS2ToKyGf7RMH/g=="
+      "integrity": "sha512-VBKrlEoZCBD+iwoeag0QTtY1Cti+Ma4nLpVYcc/uus/wHhMsPOi5InH3RL1s4aekahPZpabcS2ToKyGf7RMH/g==",
+      "license": "BSD-3-Clause"
     },
     "node_modules/parent-module": {
       "version": "1.0.1",
@@ -6106,6 +6121,7 @@
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/quill-delta/-/quill-delta-5.1.0.tgz",
       "integrity": "sha512-X74oCeRI4/p0ucjb5Ma8adTXd9Scumz367kkMK5V/IatcX6A0vlgLgKbzXWy5nZmCGeNJm2oQX0d2Eqj+ZIlCA==",
+      "license": "MIT",
       "dependencies": {
         "fast-diff": "^1.3.0",
         "lodash.clonedeep": "^4.5.0",
diff --git a/Vue/package.json b/Vue/package.json
index 84052f3..948760e 100644
--- a/Vue/package.json
+++ b/Vue/package.json
@@ -12,8 +12,8 @@
     "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore"
   },
   "dependencies": {
-    "devextreme": "24.2.3",
-    "devextreme-vue": "24.2.3",
+    "devextreme": "25.1.3",
+    "devextreme-vue": "25.1.3",
     "vue": "^3.2.45",
     "vue-router": "^4.1.6"
   },
diff --git a/Vue/src/components/HomeContent.vue b/Vue/src/components/HomeContent.vue
index a03e9b9..260332d 100644
--- a/Vue/src/components/HomeContent.vue
+++ b/Vue/src/components/HomeContent.vue
@@ -1,25 +1,97 @@
 <script setup lang="ts">
-import { computed, ref } from 'vue';
+import { ref } from 'vue';
 
 import 'devextreme/dist/css/dx.material.blue.light.compact.css';
-import DxButton from 'devextreme-vue/button';
+import DxChart, { DxBackgroundColor, DxCommonPaneSettings, DxConstantLine, DxLabel, DxSeries, DxTooltip, DxValueAxis } from 'devextreme-vue/chart';
+import { registerGradient } from 'devextreme-vue/common/charts';
+import { formatNumber } from 'devextreme/localization';
 
-const props = defineProps({
-  text: String,
-});
-const count = ref(0);
-const buttonText = computed<string>(
-  () => `Click ${props.text}: ${count.value}`
-);
-function clickHandler() {
-  count.value += 1;
+const chartData = [
+  { month: 'January', targetSpend: 12000, actualSpend: 9500 },
+  { month: 'February', targetSpend: 15500, actualSpend: 16500 },
+  { month: 'March', targetSpend: 13500, actualSpend: 12000 },
+  { month: 'April', targetSpend: 16000, actualSpend: 14000 },
+  { month: 'May', targetSpend: 17000, actualSpend: 18500 },
+  { month: 'June', targetSpend: 20000, actualSpend: 17500 },
+  { month: 'July', targetSpend: 14500, actualSpend: 11000 },
+  { month: 'August', targetSpend: 21000, actualSpend: 22500 },
+  { month: 'September', targetSpend: 19000, actualSpend: 18000 },
+  { month: 'October', targetSpend: 22000, actualSpend: 25000 },
+  { month: 'November', targetSpend: 16000, actualSpend: 14500 },
+  { month: 'December', targetSpend: 25000, actualSpend: 27000 },
+];
+
+function calculateAverageSpend() {
+  const sum = chartData.reduce((accumulator, { actualSpend }) => accumulator + actualSpend, 0);
+
+  return sum / chartData.length;
+}
+
+const averageSpend = ref(calculateAverageSpend());
+
+function customizeTooltip(data: { value: number; seriesName: string }) {
+  if (data.seriesName === 'Budget') {
+    return { text: formatNumber(data.value, 'currency') };
+  }
+  const isValueAboveAverage = data.value > calculateAverageSpend();
+  if (isValueAboveAverage) {
+    return { text: `${formatNumber(data.value, 'currency')}\n${formatNumber(data.value - averageSpend.value, 'currency')} above average spending.` };
+  }
+
+  return { text: `${formatNumber(data.value, 'currency')}\n${formatNumber(averageSpend.value - data.value, 'currency')} below average spending.` };
 }
+
+const chartGradient = registerGradient('linear', {
+  colors: [{
+    offset: '20%',
+    color: '#dee4ff',
+  }, {
+    offset: '90%',
+    color: '#ffdeff',
+  }],
+});
+
 </script>
 <template>
   <div>
-    <DxButton
-      :text="buttonText"
-      @click="clickHandler"
-    />
+    <DxChart
+      title="Target vs Actual Spending 2024"
+      :data-source="chartData"
+    >
+      <DxSeries
+        type="bar"
+        argument-field="month"
+        value-field="targetSpend"
+        name="Budget"
+        color="#5996ff"
+      />
+      <DxSeries
+        type="spline"
+        argument-field="month"
+        value-field="actualSpend"
+        name="Amount Spent"
+        color="#cb4bfa"
+      />
+      <DxValueAxis>
+        <DxConstantLine
+          :value="averageSpend"
+          color="#0000c7"
+        >
+          <DxLabel
+            text="Yearly Spend Average"
+          />
+        </DxConstantLine>
+      </DxValueAxis>
+      <DxTooltip
+        :enabled="true"
+        :customize-tooltip="customizeTooltip"
+      />
+      <DxCommonPaneSettings>
+        <DxBackgroundColor
+          base="#ffffff"
+          :fill-id="chartGradient"
+        />
+      </DxCommonPaneSettings>
+    </DxChart>
   </div>
 </template>