Table

A responsive table with a surface style, wrapping or compact cells, sticky headers, pinned columns and scroll hints.

Installation

terminal

pnpm dlx layro-cli add @preetsuthar17/table

npx layro-cli add @preetsuthar17/table

npx layro-cli add @preetsuthar17/table

bunx layro-cli add @preetsuthar17/table

New project? Start with init. Writes third-party code and installs packages with scripts off.

Code

Demo

"use client"

import * as React from "react"
import { cva, type VariantProps } from "class-variance-authority"
import { cn } from "cn"

function mergeRefs<T>(
  ...refs: (React.Ref<T> | ((node: T | null) => void) | undefined)[]
) {
  return (node: T | null) => {
    for (const ref of refs) {
      if (typeof ref === "function") {
        ref(node)
      } else if (ref) {