@codefast/ui 0.2.24 → 0.2.25

package/dist/chunk-VIZADH2K.cjs

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});"use client";var _chunkQ2R7BKY2cjs = require('./chunk-Q2R7BKY2.cjs');var _chunkR4NBV7W4cjs = require('./chunk-R4NBV7W4.cjs');var _chunkEGY5ICBLcjs = require('./chunk-EGY5ICBL.cjs');var _chunkRD5ZOT6Ncjs = require('./chunk-RD5ZOT6N.cjs');var _chunkSMJEDCFPcjs = require('./chunk-SMJEDCFP.cjs');var _lucidereact = require('lucide-react');var _jsxruntime = require('react/jsx-runtime');function X({table:n}){return _jsxruntime.jsxs.call(void 0, _chunkR4NBV7W4cjs.a,{children:[_jsxruntime.jsxs.call(void 0, _chunkR4NBV7W4cjs.b,{className:_chunkRD5ZOT6Ncjs.a.call(void 0, {size:"xs",variant:"outline"}),children:[_jsxruntime.jsx.call(void 0, _lucidereact.Settings2Icon,{className:"size-4"}),"View"]}),_jsxruntime.jsxs.call(void 0, _chunkR4NBV7W4cjs.h,{align:"end",className:"w-36",children:[_jsxruntime.jsx.call(void 0, _chunkR4NBV7W4cjs.l,{children:"Toggle columns"}),_jsxruntime.jsx.call(void 0, _chunkR4NBV7W4cjs.m,{}),n.getAllColumns().filter(a=>a.accessorFn!==void 0&&a.getCanHide()).map(a=>_jsxruntime.jsx.call(void 0, _chunkR4NBV7W4cjs.j,{checked:a.getIsVisible(),className:"capitalize",onCheckedChange:r=>{a.toggleVisibility(!!r)},children:a.id},a.id))]})]})}function G({className:n,table:a,...r}){let u=a.getState().pagination.pageSize;return _jsxruntime.jsxs.call(void 0, "div",{className:_chunkSMJEDCFPcjs.a.call(void 0, "flex flex-wrap items-center justify-between gap-4 px-2",n),...r,children:[_jsxruntime.jsxs.call(void 0, "div",{className:"text-muted-foreground min-w-max flex-1 text-sm",children:[a.getFilteredSelectedRowModel().rows.length," of ",a.getFilteredRowModel().rows.length," row(s) selected."]}),_jsxruntime.jsxs.call(void 0, "div",{className:"flex grow flex-wrap items-center justify-between gap-4 md:justify-end md:gap-x-6 lg:gap-x-8",children:[_jsxruntime.jsxs.call(void 0, "div",{className:"flex flex-wrap items-center gap-x-2 gap-y-4",children:[_jsxruntime.jsx.call(void 0, "p",{className:"text-sm font-medium",children:"Rows per page"}),_jsxruntime.jsxs.call(void 0, _chunkQ2R7BKY2cjs.a,{value:u.toString(),onValueChange:s=>{a.setPageSize(Number(s))},children:[_jsxruntime.jsx.call(void 0, _chunkQ2R7BKY2cjs.d,{className:"w-18 h-8",children:_jsxruntime.jsx.call(void 0, _chunkQ2R7BKY2cjs.c,{placeholder:u})}),_jsxruntime.jsx.call(void 0, _chunkQ2R7BKY2cjs.g,{side:"top",children:[10,20,30,40,50].map(s=>_jsxruntime.jsx.call(void 0, _chunkQ2R7BKY2cjs.i,{value:String(s),children:s},s))})]})]}),_jsxruntime.jsxs.call(void 0, "div",{className:"flex flex-wrap items-center justify-center text-sm font-medium",children:["Page ",a.getState().pagination.pageIndex+1," of ",a.getPageCount()]}),_jsxruntime.jsxs.call(void 0, "div",{className:"flex flex-wrap items-center gap-x-2 gap-y-4",children:[_jsxruntime.jsxs.call(void 0, _chunkEGY5ICBLcjs.a,{icon:!0,className:"max-md:hidden",disabled:!a.getCanPreviousPage(),size:"xs",variant:"outline",onClick:()=>{a.setPageIndex(0)},children:[_jsxruntime.jsx.call(void 0, "span",{className:"sr-only",children:"Go to first page"}),_jsxruntime.jsx.call(void 0, _lucidereact.ChevronsLeftIcon,{className:"size-4"})]}),_jsxruntime.jsxs.call(void 0, _chunkEGY5ICBLcjs.a,{icon:!0,disabled:!a.getCanPreviousPage(),size:"xs",variant:"outline",onClick:()=>{a.previousPage()},children:[_jsxruntime.jsx.call(void 0, "span",{className:"sr-only",children:"Go to previous page"}),_jsxruntime.jsx.call(void 0, _lucidereact.ChevronLeftIcon,{className:"size-4"})]}),_jsxruntime.jsxs.call(void 0, _chunkEGY5ICBLcjs.a,{icon:!0,disabled:!a.getCanNextPage(),size:"xs",variant:"outline",onClick:()=>{a.nextPage()},children:[_jsxruntime.jsx.call(void 0, "span",{className:"sr-only",children:"Go to next page"}),_jsxruntime.jsx.call(void 0, _lucidereact.ChevronRightIcon,{className:"size-4"})]}),_jsxruntime.jsxs.call(void 0, _chunkEGY5ICBLcjs.a,{icon:!0,className:"max-md:hidden",disabled:!a.getCanNextPage(),size:"xs",variant:"outline",onClick:()=>{a.setPageIndex(a.getPageCount()-1)},children:[_jsxruntime.jsx.call(void 0, "span",{className:"sr-only",children:"Go to last page"}),_jsxruntime.jsx.call(void 0, _lucidereact.ChevronsRightIcon,{className:"size-4"})]})]})]})]})}function L({column:n,title:a}){return n.getCanSort()?_jsxruntime.jsxs.call(void 0, _chunkR4NBV7W4cjs.a,{children:[_jsxruntime.jsx.call(void 0, _chunkR4NBV7W4cjs.b,{asChild:!0,children:_jsxruntime.jsx.call(void 0, _chunkEGY5ICBLcjs.a,{className:_chunkSMJEDCFPcjs.a.call(void 0, "hover:not-disabled:bg-initial p-0 text-sm focus-visible:ring-0"),size:"xs",suffix:_jsxruntime.jsx.call(void 0, V,{sorted:n.getIsSorted()}),variant:"ghost",children:a})}),_jsxruntime.jsxs.call(void 0, _chunkR4NBV7W4cjs.h,{align:"start",children:[_jsxruntime.jsxs.call(void 0, _chunkR4NBV7W4cjs.i,{onClick:()=>{n.toggleSorting(!1)},children:[_jsxruntime.jsx.call(void 0, _lucidereact.ChevronUpIcon,{className:"text-muted-foreground group-focus:text-accent-foreground size-4"}),"Asc"]}),_jsxruntime.jsxs.call(void 0, _chunkR4NBV7W4cjs.i,{onClick:()=>{n.toggleSorting(!0)},children:[_jsxruntime.jsx.call(void 0, _lucidereact.ChevronDownIcon,{className:"text-muted-foreground group-focus:text-accent-foreground size-4"}),"Desc"]}),_jsxruntime.jsx.call(void 0, _chunkR4NBV7W4cjs.m,{}),_jsxruntime.jsxs.call(void 0, _chunkR4NBV7W4cjs.i,{onClick:()=>{n.toggleVisibility(!1)},children:[_jsxruntime.jsx.call(void 0, _lucidereact.EyeOffIcon,{className:"text-muted-foreground group-focus:text-accent-foreground size-4"}),"Hide"]})]})]}):_jsxruntime.jsx.call(void 0, _jsxruntime.Fragment,{children:a})}function V({sorted:n}){switch(n){case"desc":return _jsxruntime.jsx.call(void 0, _lucidereact.ChevronDownIcon,{});case"asc":return _jsxruntime.jsx.call(void 0, _lucidereact.ChevronUpIcon,{});default:return _jsxruntime.jsx.call(void 0, _lucidereact.ChevronsUpDownIcon,{})}}exports.a = X; exports.b = G; exports.c = L;
-//# sourceMappingURL=chunk-VIZADH2K.cjs.map

package/dist/chunk-VIZADH2K.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["/home/runner/work/codefast/codefast/packages/ui/dist/chunk-VIZADH2K.cjs","../src/components/data-table.tsx"],"names":["jsxs","DropdownMenu","DropdownMenuTrigger","buttonVariants","jsx","Settings2Icon","DropdownMenuContent","DropdownMenuLabel","column","DropdownMenuCheckboxItem","DataTablePagination","className","props","pageSize","table","cn","SelectTrigger","SelectValue","size","SelectItem","Button","DataTableColumnHeader","DropdownMenuItem","ChevronUpIcon","ChevronDownIcon","DropdownMenuSeparator","EyeOffIcon","Fragment","title","SortIcon","sorted"],"mappings":"AAAA,qFAAY,CAAC,wDAAoE,wDAA8E,wDAAyC,wDAAyC,wDCM/O,2CA+KS,+CA9I4B,SACrC,CAAA,CAAA,CAAA,KACEA,CAACC,CAAAA,CAAA,CACC,CAAA,OAAA,8BAAA,mBAAAD,CAACE,CAAAA,QAAoB,CAAA,CAAA,8BAAA,mBAAWC,CAAe,CAAE,SAAM,CAAM,iCAAA,CAAA,IAAA,CAAS,IAAA,CAAA,OACpE,CAAA,SAAAC,CAAAA,CAACC,CAAAA,QAAc,CAAA,CAAA,6BAAA,0BAAU,CAAA,CAAA,SAAW,CAAA,QAGtCL,CAAAA,CAACM,CAAAA,MAAoB,CAAA,CAAM,CAAA,CAAA,8BAAA,mBAAA,CAAM,CAAA,KAAA,CAAA,KAAU,CAAA,SACzC,CAAA,MAACC,CAAAA,QAAkB,CAAA,CAAA,6BAAA,mBAAA,CAAA,CAAA,QAAA,CAAA,gBAGhB,CAAA,CAAA,CAAA,6BAAA,mBAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,aACmBC,CAAAA,CAAO,CAAA,MAAA,CAAA,CAAA,EAAA,CAAA,CAAe,UAAoB,GAAA,KAAA,CAAA,EAAW,CAAC,CAAA,UAEvEC,CAAAA,CAAA,CAEC,CAAA,GAAA,CAAA,CAAA,EAASD,6BAAAA,mBAAO,CAAA,CAAA,OAAA,CAAA,CAAA,CAAa,YACnB,CAAA,CAAA,CAAA,SAAA,CACV,YAAA,CAAA,eACS,CAAA,CAAA,EAAA,CAAA,CAAA,CAAA,gBAGR,CAAA,CAAA,CAAAA,CAAAA,CAAO,CAAA,CAAA,QAEX,CAAA,CACL,CAAA,EACF,CAEJ,CAUA,CAAA,CAAA,EAAA,CAAA,CAAA,CAAA,CAAA,CAASE,CAAAA,CAA2B,CAAE,CAAA,SAAAC,CAAAA,CAAW,CAAA,SAAO,CAAGC,CAAM,CAAA,KAC/D,CAAMC,CAAAA,CAAWC,GAAM,CAAA,CAAA,CAAA,CAAA,IAAS,CAAA,CAAE,CAAA,CAAA,QAAA,CAAW,CAAA,CAAA,UAE7C,CAAA,QACG,CAAA,OAAI,8BAAA,KAAWC,CAAG,CAAA,SAAA,CAAA,iCAAA,wDACjB,CAAA,CAAA,CAAA,CAAA,GAAAf,CAAC,CAAA,QAAI,CAAA,CAAA,8BAAA,KAAU,CAAA,CAAA,SAAA,CAAA,gDACN,CAAA,QAAA,CAAA,CAAA,CAAA,CAAA,2BAAmC,CAAA,CAAO,CAAA,IAAA,CAAA,MAAW,CAAA,MAAA,CAAA,CAAA,CAAA,mBAA2B,CAAA,CAAO,CAAA,IAAA,CAAA,MAAA,CAAA,mBAG3F,CAAA,CAAA,CAAA,CAAA,8BAAA,KAAU,CAAA,CAAA,SAAA,CAAA,6FACZ,CAAA,QAAI,CAAA,CAAA,8BAAA,KAAU,CAAA,CAAA,SAAA,CAAA,6CACZ,CAAA,QAAE,CAAA,CAAA,6BAAA,GAAU,CAAA,CAAA,SAAA,CAAA,qBAAsB,CAAA,QAAA,CAAA,eAEjC,CAAOa,CAAAA,CAAS,8BAAA,mBAAA,CAAA,CAAA,KAAS,CACzB,CAAA,CAAA,QAAA,CAAA,CAAA,CAAA,aACQ,CAAA,CAAA,EAAA,CAAA,CAAY,CAAA,WAGpB,CAAA,MAAA,CAAA,CAAA,CAAAT,CAAAA,CAACY,CAAAA,QAAc,CAAA,CAAA,6BAAA,mBAAU,CAAA,CAAA,SACvB,CAAA,UAACC,CAAA,QAAY,CAAA,6BAAA,mBAAA,CAAaJ,CAAAA,WAEb,CAAA,CAAA,CAAA,CAAK,CAAA,CAAA,CAAA,6BAAA,mBACjB,CAAA,CAAA,IAAA,CAAA,KAAC,CAAI,QAAQ,CAAI,CAAA,EAAE,CAAE,EAAA,CAAA,EAAKK,CAAAA,EACzBd,CAACe,EAAA,CAAsB,CAAA,GAAA,CAAA,CAAO,EAAA,6BAAA,mBAAA,CAAA,CAAOD,KAClC,CAAA,MAAAA,CAAAA,CAAAA,CADcA,CAEjB,QAGN,CACF,CAAA,CACAlB,CAAAA,CAAC,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAI,CAAA,CAAA,CAAA,CAAA,8BAAA,KAAU,CAAA,CAAA,SAAA,CAAA,gEAAiE,CAAA,QAClE,CAAA,CAAA,OAAS,CAAE,CAAA,CAAA,QAAA,CAAW,CAAA,CAAA,UAAc,CAAA,SAAW,CAAA,CAAA,CAAA,MAAA,CAAA,CAAA,CAAa,YAEzE,CAAA,CAAI,CAAA,CAAA,CAAA,CAAA,8BAAA,KAAU,CAAA,CAAA,SAAA,CAAA,6CACZoB,CAAAA,QACK,CAAA,CACJ,8BAAA,mBAAA,CAAA,CAAA,IAAA,CAAU,CAAA,CAAA,CAAA,SAAA,CAAA,eACO,CAAA,QAAA,CAAA,CAAA,CAAA,CAAA,kBAEjB,CAAA,CAAA,CAAA,IAAA,CAAQ,IAAA,CAAA,OACR,CAAA,SAAe,CACbN,OAAM,CAAA,CAAA,CAAA,EAAA,CAAA,CAAA,CAAa,YAGrB,CAAA,CAAAV,CAAAA,CAAC,CAAA,QAAK,CAAA,CAAA,6BAAA,MAAU,CAAA,CAAA,SAAU,CAAA,SAAA,CAAA,QAAA,CAAA,kBACR,CAAA,CAAA,CAAA,6BAAA,6BAAU,CAAA,CAAA,SAC9B,CAAA,QAEE,CAAA,CAAA,CAAI,CAAA,CAAA,CACJ,8BAAA,mBAAA,CAAA,CAAA,IAAU,CAACU,CAAAA,CAAM,CAAA,QAAA,CAAA,CAAA,CAAA,CAAA,kBAEjB,CAAA,CAAA,CAAA,IAAA,CAAQ,IAAA,CAAA,OACR,CAAA,SAAe,CACbA,OAAM,CAAA,CAAA,CAAA,EAAA,CAAA,CAAA,CAAa,YAGrB,CAAAV,CAAAA,CAAC,CAAA,QAAK,CAAA,CAAA,6BAAA,MAAU,CAAA,CAAA,SAAU,CAAA,SAAA,CAAA,QAAA,CAAA,qBACT,CAAA,CAAA,CAAA,6BAAA,4BAAU,CAAA,CAAA,SAC7B,CAAA,QAEE,CAAA,CAAA,CAAI,CAAA,CAAA,CACJ,8BAAA,mBAAA,CAAA,CAAA,IAAU,CAACU,CAAAA,CAAM,CAAA,QAAA,CAAA,CAAA,CAAA,CAAA,cAEjB,CAAA,CAAA,CAAA,IAAA,CAAQ,IAAA,CAAA,OACR,CAAA,SAAe,CACbA,OAAM,CAAA,CAAA,CAAA,EACR,CAAA,CAEA,CAAA,QAAA,CAAAV,CAAAA,CAAC,CAAA,QAAK,CAAA,CAAA,6BAAA,MAAU,CAAA,CAAA,SAAU,CAAA,SAAA,CAAA,QAAA,CAAA,iBACR,CAAA,CAAA,CAAA,6BAAA,6BAAU,CAAA,CAAA,SAC9B,CAAA,QAEE,CAAA,CAAA,CAAI,CAAA,CAAA,CACJ,8BAAA,mBAAA,CAAA,CAAA,IAAA,CAAU,CAAA,CAAA,CAAA,SAAA,CAAA,eACO,CAAA,QAAA,CAAA,CAAA,CAAA,CAAA,cAEjB,CAAA,CAAA,CAAA,IAAA,CAAQ,IAAA,CAAA,OACR,CAAA,SAAe,CACbU,OAAM,CAAA,CAAA,CAAA,EAAA,CAAA,CAAA,CAAaA,YAAM,CAAA,CAAA,CAAa,YAGxC,CAAA,CAAA,CAAA,CAAAV,CAAAA,CAAC,CAAA,QAAK,CAAA,CAAA,6BAAA,MAAU,CAAA,CAAA,SAAU,CAAA,SAAA,CAAA,QAAA,CAAA,iBACP,CAAA,CAAA,CAAA,6BAAA,8BAAU,CAAA,CAAA,SAC/B,CAAA,QAGN,CAEJ,CAWA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAASiB,CAAAA,CAAqC,CAC5C,CAAA,SACA,CAAA,CAAA,CAAA,MAEA,CAAA,CAAA,CAAA,KAAKb,CAAO,CAAA,CAAA,CAAA,CAAA,OAAW,CAAA,CAKrBR,UACE,CAAA,CAAA,CAAA,8BAAA,mBAAAI,CAACF,CAAAA,QAAoB,CAAA,CAAO,6BAAA,mBAC1B,CAAA,CAAA,OAAAE,CAAAA,CAACgB,CAAAA,CAAA,QACC,CAAA,6BAAA,mBAAWL,CAAG,CAAA,SAAA,CAAA,iCAAA,gEAEd,CAAA,CAAA,IAAQX,CAAAA,IAAU,CAAA,MAAQI,CAAAA,6BAAO,CAAA,CAAA,CAAA,MAAA,CAAA,CAAY,CAAA,WACrC,CAAA,CAAA,CAAA,CAAA,CAAA,OAEP,CAAA,OACH,CACF,QAEqB,CAAA,CAAA,CAAA,CAAA,CAAM,CAAA,CAAA,8BAAA,mBAAA,CAAA,CAAA,KACzB,CAAA,OAACc,CAAAA,QACC,CAAA,CAAS,8BAAA,mBAAA,CAAM,CACbd,OAAO,CAAA,CAAA,CAAA,EAAA,CAAA,CAAA,CAAA,aAGT,CAAA,CAAA,CAAAJ,CAAAA,CAACmB,CAAAA,QAAc,CAAA,CAAA,6BAAA,0BAAU,CAAA,CAAA,SAAA,CAAA,iEAG3BvB,CAACsB,CAAAA,CAAA,KACC,CAAA,CAAA,CAAA,CAAS,8BAAA,mBAAA,CAAM,CACbd,OAAO,CAAA,CAAA,CAAA,EAAA,CAAA,CAAA,CAAA,aAGT,CAAA,CAAA,CAAAJ,CAAAA,CAACoB,CAAAA,QAAgB,CAAA,CAAA,6BAAA,4BAAU,CAAA,CAAA,SAAA,CAAA,iEAG7BpB,CAAAA,CAACqB,CAAAA,MACDzB,CAACsB,CAAAA,CAAA,CACC,6BAAA,mBAAA,CAAA,CAAA,CAAA,CAAA,CAAS,8BAAA,mBAAA,CAAM,CACbd,OAAO,CAAA,CAAA,CAAA,EAAA,CAAA,CAAA,CAAA,gBAGT,CAAA,CAAA,CAAAJ,CAAAA,CAACsB,CAAAA,QAAW,CAAA,CAAA,6BAAA,uBAAU,CAAA,CAAA,SAAA,CAAA,iEAExB,CACF,CAAA,CAAA,MA1CKC,CAAA,CAAG,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,6BAAAC,oBAAM,CA6CpB,CAEA,QAAA,CAASC,CAAAA,CAAS,CAAE,CAAA,SAAqE,CACvF,CAAA,CAAA,MAAQC,CAAQ,CACd,CAAA,CAAA,CAAA,MAAK,CAAA,CACH,CAAA,CAAA,IAAA,MAAQ,CAAgB,OAGrB,6BAAA,4BAAA,CAAA,CACH,CAAA,CAAA,CAAA,IAAO1B,KAAC,CAAc,OAGxB,6BAAA,0BACE,CAAA,CAAA,CAAA,CAAA,CAAA,OAAQ,CAAmB,OAGjC,6BAAA,+BAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,4CAAA","file":"/home/runner/work/codefast/codefast/packages/ui/dist/chunk-VIZADH2K.cjs","sourcesContent":[null,"'use client';\n\nimport type * as ReactTable from '@tanstack/react-table';\nimport type { ComponentProps, JSX } from 'react';\n\nimport {\n  ChevronDownIcon,\n  ChevronLeftIcon,\n  ChevronRightIcon,\n  ChevronsLeftIcon,\n  ChevronsRightIcon,\n  ChevronsUpDownIcon,\n  ChevronUpIcon,\n  EyeOffIcon,\n  Settings2Icon,\n} from 'lucide-react';\n\nimport { Button } from '@/components/button';\nimport {\n  DropdownMenu,\n  DropdownMenuCheckboxItem,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuLabel,\n  DropdownMenuSeparator,\n  DropdownMenuTrigger,\n} from '@/components/dropdown-menu';\nimport { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/select';\nimport { cn } from '@/lib/utils';\nimport { buttonVariants } from '@/variants/button.variants';\n\n/* -----------------------------------------------------------------------------\n * Component: DataTableViewOptions\n * -------------------------------------------------------------------------- */\n\ninterface DataTableViewOptionsProps<TData> {\n  table: ReactTable.Table<TData>;\n}\n\nfunction DataTableViewOptions<TData>({ table }: DataTableViewOptionsProps<TData>): JSX.Element {\n  return (\n    <DropdownMenu>\n      <DropdownMenuTrigger className={buttonVariants({ size: 'xs', variant: 'outline' })}>\n        <Settings2Icon className=\"size-4\" />\n        View\n      </DropdownMenuTrigger>\n      <DropdownMenuContent align=\"end\" className=\"w-36\">\n        <DropdownMenuLabel>Toggle columns</DropdownMenuLabel>\n        <DropdownMenuSeparator />\n        {table\n          .getAllColumns()\n          .filter((column) => column.accessorFn !== undefined && column.getCanHide())\n          .map((column) => (\n            <DropdownMenuCheckboxItem\n              key={column.id}\n              checked={column.getIsVisible()}\n              className=\"capitalize\"\n              onCheckedChange={(value) => {\n                column.toggleVisibility(Boolean(value));\n              }}\n            >\n              {column.id}\n            </DropdownMenuCheckboxItem>\n          ))}\n      </DropdownMenuContent>\n    </DropdownMenu>\n  );\n}\n\n/* -----------------------------------------------------------------------------\n * Component: DataTablePagination\n * -------------------------------------------------------------------------- */\n\ninterface DataTablePaginationProps<TData> extends ComponentProps<'div'> {\n  table: ReactTable.Table<TData>;\n}\n\nfunction DataTablePagination<TData>({ className, table, ...props }: DataTablePaginationProps<TData>): JSX.Element {\n  const pageSize = table.getState().pagination.pageSize;\n\n  return (\n    <div className={cn('flex flex-wrap items-center justify-between gap-4 px-2', className)} {...props}>\n      <div className=\"text-muted-foreground min-w-max flex-1 text-sm\">\n        {table.getFilteredSelectedRowModel().rows.length} of {table.getFilteredRowModel().rows.length} row(s) selected.\n      </div>\n\n      <div className=\"flex grow flex-wrap items-center justify-between gap-4 md:justify-end md:gap-x-6 lg:gap-x-8\">\n        <div className=\"flex flex-wrap items-center gap-x-2 gap-y-4\">\n          <p className=\"text-sm font-medium\">Rows per page</p>\n          <Select\n            value={pageSize.toString()}\n            onValueChange={(value) => {\n              table.setPageSize(Number(value));\n            }}\n          >\n            <SelectTrigger className=\"w-18 h-8\">\n              <SelectValue placeholder={pageSize} />\n            </SelectTrigger>\n            <SelectContent side=\"top\">\n              {[10, 20, 30, 40, 50].map((size) => (\n                <SelectItem key={size} value={String(size)}>\n                  {size}\n                </SelectItem>\n              ))}\n            </SelectContent>\n          </Select>\n        </div>\n        <div className=\"flex flex-wrap items-center justify-center text-sm font-medium\">\n          Page {table.getState().pagination.pageIndex + 1} of {table.getPageCount()}\n        </div>\n        <div className=\"flex flex-wrap items-center gap-x-2 gap-y-4\">\n          <Button\n            icon\n            className=\"max-md:hidden\"\n            disabled={!table.getCanPreviousPage()}\n            size=\"xs\"\n            variant=\"outline\"\n            onClick={() => {\n              table.setPageIndex(0);\n            }}\n          >\n            <span className=\"sr-only\">Go to first page</span>\n            <ChevronsLeftIcon className=\"size-4\" />\n          </Button>\n          <Button\n            icon\n            disabled={!table.getCanPreviousPage()}\n            size=\"xs\"\n            variant=\"outline\"\n            onClick={() => {\n              table.previousPage();\n            }}\n          >\n            <span className=\"sr-only\">Go to previous page</span>\n            <ChevronLeftIcon className=\"size-4\" />\n          </Button>\n          <Button\n            icon\n            disabled={!table.getCanNextPage()}\n            size=\"xs\"\n            variant=\"outline\"\n            onClick={() => {\n              table.nextPage();\n            }}\n          >\n            <span className=\"sr-only\">Go to next page</span>\n            <ChevronRightIcon className=\"size-4\" />\n          </Button>\n          <Button\n            icon\n            className=\"max-md:hidden\"\n            disabled={!table.getCanNextPage()}\n            size=\"xs\"\n            variant=\"outline\"\n            onClick={() => {\n              table.setPageIndex(table.getPageCount() - 1);\n            }}\n          >\n            <span className=\"sr-only\">Go to last page</span>\n            <ChevronsRightIcon className=\"size-4\" />\n          </Button>\n        </div>\n      </div>\n    </div>\n  );\n}\n\n/* -----------------------------------------------------------------------------\n * Component: DataTableColumnHeader\n * -------------------------------------------------------------------------- */\n\ninterface DataTableColumnHeaderProps<TData, TValue> {\n  column: ReactTable.Column<TData, TValue>;\n  title: string;\n}\n\nfunction DataTableColumnHeader<TData, TValue>({\n  column,\n  title,\n}: DataTableColumnHeaderProps<TData, TValue>): JSX.Element {\n  if (!column.getCanSort()) {\n    return <>{title}</>;\n  }\n\n  return (\n    <DropdownMenu>\n      <DropdownMenuTrigger asChild>\n        <Button\n          className={cn('hover:not-disabled:bg-initial p-0 text-sm focus-visible:ring-0')}\n          size=\"xs\"\n          suffix={<SortIcon sorted={column.getIsSorted()} />}\n          variant=\"ghost\"\n        >\n          {title}\n        </Button>\n      </DropdownMenuTrigger>\n\n      <DropdownMenuContent align=\"start\">\n        <DropdownMenuItem\n          onClick={() => {\n            column.toggleSorting(false);\n          }}\n        >\n          <ChevronUpIcon className=\"text-muted-foreground group-focus:text-accent-foreground size-4\" />\n          Asc\n        </DropdownMenuItem>\n        <DropdownMenuItem\n          onClick={() => {\n            column.toggleSorting(true);\n          }}\n        >\n          <ChevronDownIcon className=\"text-muted-foreground group-focus:text-accent-foreground size-4\" />\n          Desc\n        </DropdownMenuItem>\n        <DropdownMenuSeparator />\n        <DropdownMenuItem\n          onClick={() => {\n            column.toggleVisibility(false);\n          }}\n        >\n          <EyeOffIcon className=\"text-muted-foreground group-focus:text-accent-foreground size-4\" />\n          Hide\n        </DropdownMenuItem>\n      </DropdownMenuContent>\n    </DropdownMenu>\n  );\n}\n\nfunction SortIcon({ sorted }: { sorted: false | ReactTable.SortDirection }): JSX.Element {\n  switch (sorted) {\n    case 'desc': {\n      return <ChevronDownIcon />;\n    }\n\n    case 'asc': {\n      return <ChevronUpIcon />;\n    }\n\n    default: {\n      return <ChevronsUpDownIcon />;\n    }\n  }\n}\n\n/* -----------------------------------------------------------------------------\n * Exports\n * -------------------------------------------------------------------------- */\n\nexport type { DataTableColumnHeaderProps, DataTablePaginationProps, DataTableViewOptionsProps };\nexport { DataTableColumnHeader, DataTablePagination, DataTableViewOptions };\n"]}