From c90d7165d3177fb48defdf264870e49b08a4d720 Mon Sep 17 00:00:00 2001 From: NataliaTepluhina Date: Wed, 7 May 2025 21:34:22 +0200 Subject: [PATCH 1/2] fix: removed todo mvc example --- src/examples/src/todomvc/App/composition.js | 99 ------------------- src/examples/src/todomvc/App/options.js | 100 -------------------- src/examples/src/todomvc/App/style.css | 1 - src/examples/src/todomvc/App/template.html | 65 ------------- src/examples/src/todomvc/description.txt | 2 - 5 files changed, 267 deletions(-) delete mode 100644 src/examples/src/todomvc/App/composition.js delete mode 100644 src/examples/src/todomvc/App/options.js delete mode 100644 src/examples/src/todomvc/App/style.css delete mode 100644 src/examples/src/todomvc/App/template.html delete mode 100644 src/examples/src/todomvc/description.txt diff --git a/src/examples/src/todomvc/App/composition.js b/src/examples/src/todomvc/App/composition.js deleted file mode 100644 index 3d168e840f..0000000000 --- a/src/examples/src/todomvc/App/composition.js +++ /dev/null @@ -1,99 +0,0 @@ -import { ref, computed, watchEffect } from 'vue' - -const STORAGE_KEY = 'vue-todomvc' - -const filters = { - all: (todos) => todos, - active: (todos) => todos.filter((todo) => !todo.completed), - completed: (todos) => todos.filter((todo) => todo.completed) -} - -export default { - setup() { - // state - const todos = ref(JSON.parse(localStorage.getItem(STORAGE_KEY) || '[]')) - const visibility = ref('all') - const editedTodo = ref() - - // derived state - const filteredTodos = computed(() => filters[visibility.value](todos.value)) - const remaining = computed(() => filters.active(todos.value).length) - - // handle routing - window.addEventListener('hashchange', onHashChange) - onHashChange() - - // persist state - watchEffect(() => { - localStorage.setItem(STORAGE_KEY, JSON.stringify(todos.value)) - }) - - function toggleAll(e) { - todos.value.forEach((todo) => (todo.completed = e.target.checked)) - } - - function addTodo(e) { - const value = e.target.value.trim() - if (value) { - todos.value.push({ - id: Date.now(), - title: value, - completed: false - }) - e.target.value = '' - } - } - - function removeTodo(todo) { - todos.value.splice(todos.value.indexOf(todo), 1) - } - - let beforeEditCache = '' - function editTodo(todo) { - beforeEditCache = todo.title - editedTodo.value = todo - } - - function cancelEdit(todo) { - editedTodo.value = null - todo.title = beforeEditCache - } - - function doneEdit(todo) { - if (editedTodo.value) { - editedTodo.value = null - todo.title = todo.title.trim() - if (!todo.title) removeTodo(todo) - } - } - - function removeCompleted() { - todos.value = filters.active(todos.value) - } - - function onHashChange() { - const route = window.location.hash.replace(/#\/?/, '') - if (filters[route]) { - visibility.value = route - } else { - window.location.hash = '' - visibility.value = 'all' - } - } - - return { - todos, - visibility, - editedTodo, - filteredTodos, - remaining, - toggleAll, - addTodo, - removeTodo, - editTodo, - doneEdit, - cancelEdit, - removeCompleted, - } - } -} diff --git a/src/examples/src/todomvc/App/options.js b/src/examples/src/todomvc/App/options.js deleted file mode 100644 index 6adf5706df..0000000000 --- a/src/examples/src/todomvc/App/options.js +++ /dev/null @@ -1,100 +0,0 @@ -const STORAGE_KEY = 'vue-todomvc' - -const filters = { - all: (todos) => todos, - active: (todos) => todos.filter((todo) => !todo.completed), - completed: (todos) => todos.filter((todo) => todo.completed) -} - -export default { - // app initial state - data: () => ({ - todos: JSON.parse(localStorage.getItem(STORAGE_KEY) || '[]'), - editedTodo: null, - visibility: 'all' - }), - - // watch todos change for localStorage persistence - watch: { - todos: { - handler(todos) { - localStorage.setItem(STORAGE_KEY, JSON.stringify(todos)) - }, - deep: true - } - }, - - mounted() { - window.addEventListener('hashchange', this.onHashChange) - this.onHashChange() - }, - - computed: { - filteredTodos() { - return filters[this.visibility](this.todos) - }, - remaining() { - return filters.active(this.todos).length - } - }, - - // methods that implement data logic. - // note there's no DOM manipulation here at all. - methods: { - toggleAll(e) { - this.todos.forEach((todo) => (todo.completed = e.target.checked)) - }, - - addTodo(e) { - const value = e.target.value.trim() - if (!value) { - return - } - this.todos.push({ - id: Date.now(), - title: value, - completed: false - }) - e.target.value = '' - }, - - removeTodo(todo) { - this.todos.splice(this.todos.indexOf(todo), 1) - }, - - editTodo(todo) { - this.beforeEditCache = todo.title - this.editedTodo = todo - }, - - doneEdit(todo) { - if (!this.editedTodo) { - return - } - this.editedTodo = null - todo.title = todo.title.trim() - if (!todo.title) { - this.removeTodo(todo) - } - }, - - cancelEdit(todo) { - this.editedTodo = null - todo.title = this.beforeEditCache - }, - - removeCompleted() { - this.todos = filters.active(this.todos) - }, - - onHashChange() { - var visibility = window.location.hash.replace(/#\/?/, '') - if (filters[visibility]) { - this.visibility = visibility - } else { - window.location.hash = '' - this.visibility = 'all' - } - } - } -} diff --git a/src/examples/src/todomvc/App/style.css b/src/examples/src/todomvc/App/style.css deleted file mode 100644 index 6011b41b58..0000000000 --- a/src/examples/src/todomvc/App/style.css +++ /dev/null @@ -1 +0,0 @@ -@import "https://unpkg.com/todomvc-app-css@2.4.1/index.css"; \ No newline at end of file diff --git a/src/examples/src/todomvc/App/template.html b/src/examples/src/todomvc/App/template.html deleted file mode 100644 index 9be7c5911d..0000000000 --- a/src/examples/src/todomvc/App/template.html +++ /dev/null @@ -1,65 +0,0 @@ -
-
-

Todos

- -
-
- - -
    -
  • -
    - - - -
    - -
    • -
-
-
- - {{ remaining }} - {{ remaining === 1 ? ' item' : ' items' }} left - - - -
-
diff --git a/src/examples/src/todomvc/description.txt b/src/examples/src/todomvc/description.txt deleted file mode 100644 index 5892ea1f99..0000000000 --- a/src/examples/src/todomvc/description.txt +++ /dev/null @@ -1,2 +0,0 @@ -A fully spec-compliant TodoMVC implementation -https://todomvc.com/ \ No newline at end of file From b4b1aeaf64a9299cf1bd89b31012fe68d870d40f Mon Sep 17 00:00:00 2001 From: NataliaTepluhina Date: Wed, 7 May 2025 21:38:21 +0200 Subject: [PATCH 2/2] fix: removed todo mvc from the navigation --- .vitepress/config.ts | 4 ---- 1 file changed, 4 deletions(-) diff --git a/.vitepress/config.ts b/.vitepress/config.ts index 58486e2fe6..80c74de089 100644 --- a/.vitepress/config.ts +++ b/.vitepress/config.ts @@ -497,10 +497,6 @@ export const sidebar: ThemeConfig['sidebar'] = { text: 'List with Transitions', link: '/examples/#list-transition' }, - { - text: 'TodoMVC', - link: '/examples/#todomvc' - } ] }, {