fix(Table)!: consistent args order in select event

Author: benjamincanac

docs/app/components/content/examples/table/TableRowSelectEventExample.vue

@@ -103,11 +103,9 @@ const table = useTemplateRef('table')
 
 const rowSelection = ref<Record<string, boolean>>({ })
 
-function onSelect(row: TableRow<Payment>, e?: Event) {
+function onSelect(e: Event, row: TableRow<Payment>) {
   /* If you decide to also select the column you can do this  */
   row.toggleSelected(!row.getIsSelected())
-
-  console.log(e)
 }
 </script>
 

docs/content/docs/2.components/table.md

@@ -328,7 +328,7 @@ You can use the `row-selection` prop to control the selection state of the rows
 You can add a `@select` listener to make rows clickable with or without a checkbox column.
 
 ::note
-The handler function receives the `TableRow` instance as the first argument and an optional `Event` as the second argument.
+The handler function receives the `Event` and `TableRow` instance as the first and second arguments respectively.
 ::
 
 ::component-example

playgrounds/nuxt/app/pages/components/table.vue

@@ -320,7 +320,7 @@ function randomize() {
 
 const rowSelection = ref<Record<string, boolean>>({})
 
-function onSelect(row: TableRow<Payment>) {
+function onSelect(e: Event, row: TableRow<Payment>) {
   row.toggleSelected(!row.getIsSelected())
 }
 

src/runtime/components/Table.vue

@@ -197,7 +197,7 @@ export interface TableProps<T extends TableData = TableData> extends TableOption
    * @see [Guide](https://tanstack.com/table/v8/docs/guide/column-faceting)
    */
   facetedOptions?: FacetedOptions<T>
-  onSelect?: (row: TableRow<T>, e?: Event) => void
+  onSelect?: (e: Event, row: TableRow<T>) => void
   onHover?: (e: Event, row: TableRow<T> | null) => void
   onContextmenu?: ((e: Event, row: TableRow<T>) => void) | Array<((e: Event, row: TableRow<T>) => void)>
   class?: any
@@ -437,8 +437,7 @@ function onRowSelect(e: Event, row: TableRow<T>) {
   e.preventDefault()
   e.stopPropagation()
 
-  // FIXME: `e` should be the first argument for consistency
-  props.onSelect(row, e)
+  props.onSelect(e, row)
 }
 
 function onRowHover(e: Event, row: TableRow<T> | null) {