tanstack-shadcn-table
Version:
A powerful, feature-rich React table component built on top of TanStack Table v8 with shadcn/ui styling. Optimized bundle size with 55% reduction through peer dependencies.
2 lines (1 loc) • 5.53 kB
JavaScript
import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{c as o}from"./utils-9ed1a6bd.js";import{Slot as s}from"@radix-ui/react-slot";import{cva as r}from"class-variance-authority";import*as n from"@radix-ui/react-dropdown-menu";import{ChevronRight as i,Check as d,Circle as l}from"lucide-react";const c=a.forwardRef(({className:t,type:a,...s},r)=>e("input",{type:a,className:o("flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",t),ref:r,...s}));c.displayName="Input";const m=r("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",{variants:{variant:{default:"bg-primary text-primary-foreground shadow hover:bg-primary/90",destructive:"bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",outline:"border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",secondary:"bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",ghost:"hover:bg-accent hover:text-accent-foreground",link:"text-primary underline-offset-4 hover:underline"},size:{default:"h-9 px-4 py-2",sm:"h-8 rounded-md px-3 text-xs",lg:"h-10 rounded-md px-8",icon:"h-9 w-9"}},defaultVariants:{variant:"default",size:"default"}}),f=a.forwardRef(({className:t,variant:a,size:r,asChild:n=!1,...i},d)=>e(n?s:"button",{className:o(m({variant:a,size:r,className:t})),ref:d,...i}));f.displayName="Button";const u=n.Root,p=n.Trigger;a.forwardRef(({className:a,inset:s,children:r,...d},l)=>t(n.SubTrigger,{ref:l,className:o("flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",s&&"pl-8",a),...d,children:[r,e(i,{className:"ml-auto"})]})).displayName=n.SubTrigger.displayName,a.forwardRef(({className:t,...a},s)=>e(n.SubContent,{ref:s,className:o("z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-dropdown-menu-content-transform-origin]",t),...a})).displayName=n.SubContent.displayName;const g=a.forwardRef(({className:t,sideOffset:a=4,...s},r)=>e(n.Portal,{children:e(n.Content,{ref:r,sideOffset:a,className:o("z-50 max-h-[var(--radix-dropdown-menu-content-available-height)] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md","data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-dropdown-menu-content-transform-origin]",t),...s})}));g.displayName=n.Content.displayName,a.forwardRef(({className:t,inset:a,...s},r)=>e(n.Item,{ref:r,className:o("relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0",a&&"pl-8",t),...s})).displayName=n.Item.displayName;const b=a.forwardRef(({className:a,children:s,checked:r,...i},l)=>t(n.CheckboxItem,{ref:l,className:o("relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",a),checked:r,...i,children:[e("span",{className:"absolute left-2 flex h-3.5 w-3.5 items-center justify-center",children:e(n.ItemIndicator,{children:e(d,{className:"h-4 w-4"})})}),s]}));b.displayName=n.CheckboxItem.displayName,a.forwardRef(({className:a,children:s,...r},i)=>t(n.RadioItem,{ref:i,className:o("relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",a),...r,children:[e("span",{className:"absolute left-2 flex h-3.5 w-3.5 items-center justify-center",children:e(n.ItemIndicator,{children:e(l,{className:"h-2 w-2 fill-current"})})}),s]})).displayName=n.RadioItem.displayName,a.forwardRef(({className:t,inset:a,...s},r)=>e(n.Label,{ref:r,className:o("px-2 py-1.5 text-sm font-semibold",a&&"pl-8",t),...s})).displayName=n.Label.displayName,a.forwardRef(({className:t,...a},s)=>e(n.Separator,{ref:s,className:o("-mx-1 my-1 h-px bg-muted",t),...a})).displayName=n.Separator.displayName;export{f as B,u as D,c as I,p as a,g as b,b as c};