From f386291cb00fa3719f61dfb0dca51bc46619f730 Mon Sep 17 00:00:00 2001
From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com>
Date: Sun, 2 Mar 2025 07:41:58 +0000
Subject: [PATCH] ci: apply automated fixes

---
 examples/vue/grouping/src/App.vue | 60 ++++++++++++++++++++-----------
 1 file changed, 39 insertions(+), 21 deletions(-)

diff --git a/examples/vue/grouping/src/App.vue b/examples/vue/grouping/src/App.vue
index b4a9a96d40..fda70c590f 100644
--- a/examples/vue/grouping/src/App.vue
+++ b/examples/vue/grouping/src/App.vue
@@ -1,14 +1,13 @@
 <script setup lang="ts">
-import
-  {
-    FlexRender,
-    getCoreRowModel,
-    getExpandedRowModel,
-    getGroupedRowModel,
-    useVueTable,
-    type ColumnDef,
-    type GroupingState,
-  } from '@tanstack/vue-table'
+import {
+  FlexRender,
+  getCoreRowModel,
+  getExpandedRowModel,
+  getGroupedRowModel,
+  useVueTable,
+  type ColumnDef,
+  type GroupingState,
+} from '@tanstack/vue-table'
 import { ref } from 'vue'
 
 // Define task type
@@ -76,14 +75,14 @@ const columns: ColumnDef<Task>[] = [
     accessorKey: 'status',
     header: 'Status',
     enableGrouping: true,
-    accessorFn: (row) => row.status.name,
+    accessorFn: row => row.status.name,
     cell: ({ row }) => row.original.status.name,
   },
   {
     accessorKey: 'priority',
     header: 'Priority',
     enableGrouping: true,
-    accessorFn: (row) => row.priority.name,
+    accessorFn: row => row.priority.name,
     cell: ({ row }) => row.original.priority.name,
   },
   {
@@ -117,13 +116,17 @@ const table = useVueTable({
       return expanded.value
     },
   },
-  onGroupingChange: (updaterOrValue) => {
+  onGroupingChange: updaterOrValue => {
     grouping.value =
-      typeof updaterOrValue === 'function' ? updaterOrValue(grouping.value) : updaterOrValue
+      typeof updaterOrValue === 'function'
+        ? updaterOrValue(grouping.value)
+        : updaterOrValue
   },
-  onExpandedChange: (updaterOrValue) => {
+  onExpandedChange: updaterOrValue => {
     expanded.value =
-      typeof updaterOrValue === 'function' ? updaterOrValue(expanded.value) : updaterOrValue
+      typeof updaterOrValue === 'function'
+        ? updaterOrValue(expanded.value)
+        : updaterOrValue
   },
 })
 
@@ -173,7 +176,11 @@ const clearGrouping = (): void => {
         Group by Priority
       </button>
 
-      <button v-if="grouping.length > 0" @click="clearGrouping" class="clear-button">
+      <button
+        v-if="grouping.length > 0"
+        @click="clearGrouping"
+        class="clear-button"
+      >
         Clear Grouping
       </button>
     </div>
@@ -183,7 +190,10 @@ const clearGrouping = (): void => {
       <table class="data-table">
         <thead>
           <tr>
-            <th v-for="header in table.getHeaderGroups()[0].headers" :key="header.id">
+            <th
+              v-for="header in table.getHeaderGroups()[0].headers"
+              :key="header.id"
+            >
               {{ header.column.columnDef.header }}
             </th>
           </tr>
@@ -197,7 +207,10 @@ const clearGrouping = (): void => {
             <td v-for="cell in row.getVisibleCells()" :key="cell.id">
               <!-- Grouped cell -->
               <div v-if="cell.getIsGrouped()" class="grouped-cell">
-                <button class="expand-button" @click="toggleRowExpanded(row.id)">
+                <button
+                  class="expand-button"
+                  @click="toggleRowExpanded(row.id)"
+                >
                   <span v-if="expanded[row.id]" class="icon">👇</span>
                   <span v-else class="icon">👉</span>
                   <span class="group-value">{{ cell.getValue() }}</span>
@@ -215,14 +228,19 @@ const clearGrouping = (): void => {
 
               <!-- Regular cell -->
               <div v-else>
-                <FlexRender :render="cell.column.columnDef.cell" :props="cell.getContext()" />
+                <FlexRender
+                  :render="cell.column.columnDef.cell"
+                  :props="cell.getContext()"
+                />
               </div>
             </td>
           </tr>
 
           <!-- Empty state -->
           <tr v-if="table.getRowModel().rows.length === 0">
-            <td :colspan="columns.length" class="empty-table">No tasks found.</td>
+            <td :colspan="columns.length" class="empty-table">
+              No tasks found.
+            </td>
           </tr>
         </tbody>
       </table>