add format check, update prettier rules, apply rules consistently

resources/js/Components/ui/table/Table.vue

@@ -1,16 +1,16 @@
 <script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
+import type { HTMLAttributes } from 'vue';
+import { cn } from '@/lib/utils';
 
 const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
+    class?: HTMLAttributes['class'];
+}>();
 </script>
 
 <template>
-  <div class="relative w-full overflow-auto">
-    <table :class="cn('w-full caption-bottom text-sm', props.class)">
-      <slot />
-    </table>
-  </div>
+    <div class="relative w-full overflow-auto">
+        <table :class="cn('w-full caption-bottom text-sm', props.class)">
+            <slot />
+        </table>
+    </div>
 </template>

resources/js/Components/ui/table/TableBody.vue

@@ -1,14 +1,14 @@
 <script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
+import type { HTMLAttributes } from 'vue';
+import { cn } from '@/lib/utils';
 
 const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
+    class?: HTMLAttributes['class'];
+}>();
 </script>
 
 <template>
-  <tbody :class="cn('[&_tr:last-child]:border-0', props.class)">
-    <slot />
-  </tbody>
+    <tbody :class="cn('[&_tr:last-child]:border-0', props.class)">
+        <slot />
+    </tbody>
 </template>

resources/js/Components/ui/table/TableCaption.vue

@@ -1,14 +1,14 @@
 <script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
+import type { HTMLAttributes } from 'vue';
+import { cn } from '@/lib/utils';
 
 const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
+    class?: HTMLAttributes['class'];
+}>();
 </script>
 
 <template>
-  <caption :class="cn('mt-4 text-sm text-muted-foreground', props.class)">
-    <slot />
-  </caption>
+    <caption :class="cn('mt-4 text-sm text-muted-foreground', props.class)">
+        <slot />
+    </caption>
 </template>

resources/js/Components/ui/table/TableCell.vue

@@ -1,21 +1,20 @@
 <script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
+import type { HTMLAttributes } from 'vue';
+import { cn } from '@/lib/utils';
 
 const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
+    class?: HTMLAttributes['class'];
+}>();
 </script>
 
 <template>
-  <td
-    :class="
-      cn(
-        'p-2 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-0.5',
-        props.class,
-      )
-    "
-  >
-    <slot />
-  </td>
+    <td
+        :class="
+            cn(
+                'p-2 align-middle [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-0.5',
+                props.class
+            )
+        ">
+        <slot />
+    </td>
 </template>

resources/js/Components/ui/table/TableEmpty.vue

@@ -1,37 +1,34 @@
 <script setup lang="ts">
-import { cn } from '@/lib/utils'
-import { computed, type HTMLAttributes } from 'vue'
-import TableCell from './TableCell.vue'
-import TableRow from './TableRow.vue'
+import { cn } from '@/lib/utils';
+import { computed, type HTMLAttributes } from 'vue';
+import TableCell from './TableCell.vue';
+import TableRow from './TableRow.vue';
 
-const props = withDefaults(defineProps<{
-  class?: HTMLAttributes['class']
-  colspan?: number
-}>(), {
-  colspan: 1,
-})
+const props = withDefaults(
+    defineProps<{
+        class?: HTMLAttributes['class'];
+        colspan?: number;
+    }>(),
+    {
+        colspan: 1,
+    }
+);
 
 const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
+    const { class: _, ...delegated } = props;
 
-  return delegated
-})
+    return delegated;
+});
 </script>
 
 <template>
-  <TableRow>
-    <TableCell
-      :class="
-        cn(
-          'p-4 whitespace-nowrap align-middle text-sm text-foreground',
-          props.class,
-        )
-      "
-      v-bind="delegatedProps"
-    >
-      <div class="flex items-center justify-center py-10">
-        <slot />
-      </div>
-    </TableCell>
-  </TableRow>
+    <TableRow>
+        <TableCell
+            :class="cn('p-4 whitespace-nowrap align-middle text-sm text-foreground', props.class)"
+            v-bind="delegatedProps">
+            <div class="flex items-center justify-center py-10">
+                <slot />
+            </div>
+        </TableCell>
+    </TableRow>
 </template>

resources/js/Components/ui/table/TableFooter.vue

@@ -1,14 +1,14 @@
 <script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
+import type { HTMLAttributes } from 'vue';
+import { cn } from '@/lib/utils';
 
 const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
+    class?: HTMLAttributes['class'];
+}>();
 </script>
 
 <template>
-  <tfoot :class="cn('border-t bg-muted/50 font-medium [&>tr]:last:border-b-0', props.class)">
-    <slot />
-  </tfoot>
+    <tfoot :class="cn('border-t bg-muted/50 font-medium [&>tr]:last:border-b-0', props.class)">
+        <slot />
+    </tfoot>
 </template>

resources/js/Components/ui/table/TableHead.vue

@@ -1,14 +1,20 @@
 <script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
+import type { HTMLAttributes } from 'vue';
+import { cn } from '@/lib/utils';
 
 const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
+    class?: HTMLAttributes['class'];
+}>();
 </script>
 
 <template>
-  <th :class="cn('h-10 px-2 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-0.5', props.class)">
-    <slot />
-  </th>
+    <th
+        :class="
+            cn(
+                'h-10 px-2 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-0.5',
+                props.class
+            )
+        ">
+        <slot />
+    </th>
 </template>

resources/js/Components/ui/table/TableHeader.vue

@@ -1,14 +1,14 @@
 <script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
+import type { HTMLAttributes } from 'vue';
+import { cn } from '@/lib/utils';
 
 const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
+    class?: HTMLAttributes['class'];
+}>();
 </script>
 
 <template>
-  <thead :class="cn('[&_tr]:border-b', props.class)">
-    <slot />
-  </thead>
+    <thead :class="cn('[&_tr]:border-b', props.class)">
+        <slot />
+    </thead>
 </template>

resources/js/Components/ui/table/TableRow.vue

@@ -1,14 +1,20 @@
 <script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
+import type { HTMLAttributes } from 'vue';
+import { cn } from '@/lib/utils';
 
 const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
+    class?: HTMLAttributes['class'];
+}>();
 </script>
 
 <template>
-  <tr :class="cn('border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted', props.class)">
-    <slot />
-  </tr>
+    <tr
+        :class="
+            cn(
+                'border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted',
+                props.class
+            )
+        ">
+        <slot />
+    </tr>
 </template>

resources/js/Components/ui/table/index.ts

@@ -1,9 +1,9 @@
-export { default as Table } from './Table.vue'
-export { default as TableBody } from './TableBody.vue'
-export { default as TableCaption } from './TableCaption.vue'
-export { default as TableCell } from './TableCell.vue'
-export { default as TableEmpty } from './TableEmpty.vue'
-export { default as TableFooter } from './TableFooter.vue'
-export { default as TableHead } from './TableHead.vue'
-export { default as TableHeader } from './TableHeader.vue'
-export { default as TableRow } from './TableRow.vue'
+export { default as Table } from './Table.vue';
+export { default as TableBody } from './TableBody.vue';
+export { default as TableCaption } from './TableCaption.vue';
+export { default as TableCell } from './TableCell.vue';
+export { default as TableEmpty } from './TableEmpty.vue';
+export { default as TableFooter } from './TableFooter.vue';
+export { default as TableHead } from './TableHead.vue';
+export { default as TableHeader } from './TableHeader.vue';
+export { default as TableRow } from './TableRow.vue';