feat: release v1.0.0

src/components/data-table/toolbar.tsx

@@ -0,0 +1,55 @@
+import type { ReactNode } from 'react'
+
+import type { Table } from '@tanstack/react-table'
+import { RefreshCcw } from 'lucide-react'
+
+import { DataTableViewOptions } from '@/components/data-table/view-options.tsx'
+import { Button } from '@/components/ui/button.tsx'
+import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip.tsx'
+
+type DataTableToolbarProps<TData> = {
+  table: Table<TData>
+  toolbarLeft?: ReactNode
+  toolbarRight?: ReactNode
+}
+
+export function DataTableToolbar<TData>({
+  table,
+  toolbarLeft,
+  toolbarRight,
+}: DataTableToolbarProps<TData>) {
+  const refetch = table.options.meta?.refetch
+  const isFetching = table.options.meta?.isFetching
+
+  return (
+    <div className='flex mb-4 items-center'>
+      <div className='flex-1 flex items-center'>{toolbarLeft}</div>
+      <div className='flex gap-2 items-center'>
+        {toolbarRight}
+
+        <div className='flex items-center'>
+          {refetch && (
+            <Tooltip>
+              <TooltipTrigger asChild>
+                <span className='inline-flex'>
+                  <Button
+                    disabled={isFetching}
+                    variant='ghost'
+                    size='icon'
+                    className='cursor-pointer'
+                    onClick={() => refetch()}
+                  >
+                    <RefreshCcw />
+                  </Button>
+                </span>
+              </TooltipTrigger>
+              <TooltipContent>刷新表格</TooltipContent>
+            </Tooltip>
+          )}
+
+          <DataTableViewOptions table={table} />
+        </div>
+      </div>
+    </div>
+  )
+}