chore: update docs

Author: mfuu

docs/.vitepress/config.mjs

@@ -2,17 +2,17 @@ import { defineConfig } from 'vitepress';
 import { componentPreview, containerPreview } from '@vitepress-demo-preview/plugin';
 
 export default defineConfig({
-  base: '/vue3-virtual-drag-list/',
+  base: '/vue3-virtual-sortable/',
   lang: 'en-US',
-  title: 'vue3-virtual-drag-list',
+  title: 'vue3-virtual-sortable',
   description: 'A virtual scrolling list component that can be sorted by dragging',
 
   themeConfig: {
     search: {
       provider: 'local',
     },
 
-    socialLinks: [{ icon: 'github', link: 'https://github.com/mfuu/vue-virtual-drag-list' }],
+    socialLinks: [{ icon: 'github', link: 'https://github.com/mfuu/vue3-virtual-sortable' }],
 
     footer: {
       message: 'Released under the MIT License.',

docs/components/basic.vue

@@ -9,7 +9,7 @@
     <template v-slot:item="{ record, index, dateKey }">
       <div class="list-item">
         <div class="item-title">
-          <span class="index">#{{ index }}</span>
+          <span class="index">#{{ record.index }}</span>
           <span class="handle">☰</span>
         </div>
         <p>{{ record.desc }}</p>

docs/components/group.vue

@@ -11,7 +11,7 @@
       <template v-slot:item="{ record, index, dateKey }">
         <div class="list-item">
           <div class="item-title">
-            <span class="index">#  {{ index }}-{{ record.name }}</span>
+            <span class="index">#  {{ record.index }}-{{ record.name }}</span>
             <span class="handle">☰</span>
           </div>
         </div>
@@ -29,7 +29,7 @@
       <template v-slot:item="{ record, index, dateKey }">
         <div class="list-item">
           <div class="item-title">
-            <span class="index">#  {{ index }}-{{ record.name }}</span>
+            <span class="index">#  {{ record.index }}-{{ record.name }}</span>
             <span class="handle">☰</span>
           </div>
         </div>

docs/components/horizontal.vue

@@ -11,7 +11,7 @@
     <template v-slot:item="{ record, index, dateKey }">
       <div class="list-item">
         <div class="item-title">
-          <span class="index">#{{ index }}</span>
+          <span class="index">#{{ record.index }}</span>
           <span class="handle">☰</span>
         </div>
         <p>{{ record.desc }}</p>

docs/components/infinity.vue

@@ -10,7 +10,7 @@
     <template v-slot:item="{ record, index, dateKey }">
       <div class="list-item">
         <div class="item-title">
-          <span class="index">#{{ index }}</span>
+          <span class="index">#{{ record.index }}</span>
           <span class="handle">☰</span>
         </div>
         <p>{{ record.desc }}</p>

docs/components/scroller.vue

@@ -10,7 +10,7 @@
     <template v-slot:item="{ record, index, dateKey }">
       <div class="list-item">
         <div class="item-title">
-          <span class="index">#{{ index }}</span>
+          <span class="index">#{{ record.index }}</span>
           <span class="handle">☰</span>
         </div>
         <p>{{ record.desc }}</p>

docs/components/scrollto.vue

@@ -20,7 +20,7 @@
     <template v-slot:item="{ record, index, dateKey }">
       <div class="list-item">
         <div class="item-title">
-          <span class="index">#{{ index }}</span>
+          <span class="index">#{{ record.index }}</span>
           <span class="handle">☰</span>
         </div>
         <p>{{ record.desc }}</p>

docs/components/table.vue

@@ -19,7 +19,7 @@
     <template v-slot:item="{ record, index, dateKey }">
       <tr>
         <td>
-          <span class="index">#{{ index }}</span>
+          <span class="index">#{{ record.index }}</span>
           <span class="handle">☰</span>
         </td>
         <td>{{ record.name }}</td>

docs/guide/install.md

@@ -5,11 +5,11 @@
 ::: code-group
 
 ```sh [npm]
-$ npm i vue-virtual-draglist@next
+$ npm i vue-virtual-sortable@next
 ```
 
 ```sh [yarn]
-$ yarn add vue-virtual-draglist@next
+$ yarn add vue-virtual-sortable@next
 ```
 
 :::
@@ -31,7 +31,7 @@ $ yarn add vue-virtual-draglist@next
 </template>
 
 <script setup>
-import VirtualList from 'vue-virtual-draglist';
+import VirtualList from 'vue-virtual-sortable';
 import { ref } from 'vue';
 
 const list = ref([{ id: 'a', text: 'a', id: 'b', text: 'b' }]);

docs/guide/props.md

@@ -130,20 +130,12 @@ Disables the sortable if set to true
 
 ## `draggable`
 
-| **Type** | **Default**              |
-| -------- | ------------------------ |
-| `String` | `.virtual-dnd-list-item` |
+| **Type** | **Default**     |
+| -------- | --------------- |
+| `String` | `[role="item"]` |
 
 Specifies which items inside the element should be draggable
 
-## `itemClass`
-
-| **Type** | **Default**              |
-| -------- | ------------------------ |
-| `String` | `virtual-dnd-list-item` |
-
-Default list item class
-
 ## `animation`
 
 | **Type** | **Default** |