From 65223754937d94086fee11a330ee3a8388fb6f69 Mon Sep 17 00:00:00 2001
From: Serhii Pylypchuk <pylypchukserhii1991@gmail.com>
Date: Mon, 10 Jun 2024 12:41:43 +0400
Subject: [PATCH] Add minor fix after review

---
 docs/guides/integration_with_angular.md |  2 +-
 docs/guides/integration_with_react.md   |  2 +-
 docs/guides/integration_with_svelte.md  |  2 +-
 docs/guides/integration_with_vue.md     | 30 ++++++++++++++-----------
 4 files changed, 20 insertions(+), 16 deletions(-)

diff --git a/docs/guides/integration_with_angular.md b/docs/guides/integration_with_angular.md
index a22e0c3..b36ece0 100644
--- a/docs/guides/integration_with_angular.md
+++ b/docs/guides/integration_with_angular.md
@@ -199,7 +199,7 @@ Open the **todo.component.ts** file and complete the `ngOnInit()` method as in:
 ngOnInit() {
     const todo = new ToDo(this.container.nativeElement,{ /*...*/ });
 
-    todo.events.on("add-task", (obj) => {
+    todo.api.on("add-task", (obj) => {
         console.log("A new task is added", obj);
     });
 }
diff --git a/docs/guides/integration_with_react.md b/docs/guides/integration_with_react.md
index 0cf046a..7b3ba5b 100644
--- a/docs/guides/integration_with_react.md
+++ b/docs/guides/integration_with_react.md
@@ -242,7 +242,7 @@ Open **ToDo.jsx** and complete the `useEffect()` method in the following way:
 useEffect(() => {
     const todo = new ToDo(container.current, {});
 
-    todo.events.on("add-task", (obj) => {
+    todo.api.on("add-task", (obj) => {
         console.log("A new task is added", obj);
     });
     
diff --git a/docs/guides/integration_with_svelte.md b/docs/guides/integration_with_svelte.md
index ad906f6..52df8c8 100644
--- a/docs/guides/integration_with_svelte.md
+++ b/docs/guides/integration_with_svelte.md
@@ -234,7 +234,7 @@ Open ***ToDo.svelte*** and complete the `onMount()` method as in:
 ~~~jsx title="ToDo.svelte"
 onMount(() => {
     const todo = new ToDo(container, { columns, cards });
-    todo.events.on("add-task", (obj) => {
+    todo.api.on("add-task", (obj) => {
         console.log("A new task is added", obj);
     });
 });
diff --git a/docs/guides/integration_with_vue.md b/docs/guides/integration_with_vue.md
index 3d2cf75..bbad18a 100644
--- a/docs/guides/integration_with_vue.md
+++ b/docs/guides/integration_with_vue.md
@@ -263,7 +263,7 @@ Open ***ToDo.vue*** and complete the `mounted()` method:
         // ...
         mounted() {
             this.todo = new ToDo(this.$refs.cont, {});
-            this.todo.events.on("add-card", (obj) => {
+            this.todo.api.on("add-card", (obj) => {
                 console.log(obj.columnId);
             });
         }
@@ -277,24 +277,28 @@ To add the component into the app, open the **App.vue** file and replace the def
 
 ~~~html title="App.vue"
 <script>
-    import ToDo from "./components/ToDo.vue";
-    import { getData } from "./data";
-
-    export default {
-        components: { ToDo },
-        data() {
-            const { columns, cards } = getData();
-            return { columns, cards };
-        }
-    };
+import ToDo from "./components/ToDo.vue";
+import { getData } from "./data";
+
+export default {
+    components: { ToDo },
+    data() {
+        const { users, projects, tasks } = getData();
+        return {
+            users,
+            projects,
+            tasks
+        };
+    }
+};
 </script>
 
 <template>
-    <ToDo :columns="columns" :cards="cards" />
+  <ToDo :users="users" :tasks="tasks" :projects="projects" />
 </template>
 ~~~
 
-After that, when you can start the app to see To Do List loaded with data on a page.
+After that, you can start the app to see To Do List loaded with data on a page.
 
 ![To Do List initialization](../assets/trial_todolist.png)