[pull] master from jbetancur:master

.github/FUNDING.yml

@@ -4,7 +4,7 @@ github: [jbetancur]
 # patreon: # Replace with a single Patreon username
 open_collective: react-data-table-component
 # ko_fi: # Replace with a single Ko-fi username
-# tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel
+tidelift: npm/react-data-table-component
 # community_bridge: # Replace with a single Community Bridge project-name e.g., cloud-foundry
 # liberapay: # Replace with a single Liberapay username
 # issuehunt: # Replace with a single IssueHunt username

CLAUDE.md

@@ -95,6 +95,33 @@ Rules:
 
 ---
 
+## Sponsors and backers
+
+Tier definitions must stay in sync across three places:
+
+1. `README.md` tier table (canonical wording for perks and pricing).
+2. `apps/docs/src/pages/support.astro` tier cards, including the `ocSlug` Open Collective checkout links.
+3. The GitHub Sponsors and Open Collective dashboards. These are manual and John-only: never assume they changed, and remind John to update them whenever tiers change.
+
+Open Collective slugs survive tier renames, so they may not match the tier name (Supporter uses `backer-14044`, Backer uses `sponsor-14045`). Verify live tiers by fetching `https://opencollective.com/react-data-table-component`.
+
+**Adding a backer (Backer tier, $20/mo recurring, and above):**
+
+- Add to the `backers` array at the top of `support.astro` and to the `## Backers` list in `README.md`.
+- Recurring sponsors only. One-time donors never go in these lists, regardless of amount.
+- Link only their Open Collective or GitHub profile, verified against the collective's contributor list. Never guess personal sites or emails.
+
+**Adding a logo sponsor:**
+
+- Bronze ($100): small logo in the docs footer (`apps/docs/src/layouts/Layout.astro`) + small logo in README.
+- Silver ($200): medium logo in the docs sidebar (`apps/docs/src/layouts/DocsLayout.astro`) + logo in README.
+- Gold ($500): homepage sponsors section (`apps/docs/src/pages/index.astro`, replace the "Be the first to sponsor" placeholder) + top placement in README. Limited to 3.
+- Logos are curated by hand: get the asset and target URL from John, never source logos yourself.
+
+The contact email is `sponsors@reactdatatable.com` (Cloudflare Email Routing alias). It must never appear in static HTML; on the site it is assembled client-side from `data-user`/`data-domain` attributes (see the contact block in `support.astro`).
+
+---
+
 ## Release process
 
 Releases are triggered manually via the **Release** GitHub Actions workflow (`workflow_dispatch`). Before triggering:

README.md

@@ -51,14 +51,22 @@ Sponsoring puts your company logo in front of ~215k developers a week: in the RE
 | Tier | Price/month | Perk |
 | --- | --- | --- |
 | ☕ Supporter | $5 | Your name in the README supporters list |
-| 🎗 Backer | $20 | Name + link in README |
+| 🎗 Backer | $20 | Name + link in README + listed in the Backers section on reactdatatable.com |
 | 🥉 Bronze | $100 | Priority issue triage + small logo in README + docs site footer |
 | 🥈 Silver | $200 | Priority issue triage + medium logo in README + docs site sidebar |
-| 🥇 Gold | $500 | Priority issue triage + large logo in README + hero spot on reactdatatable.com. Limited to 3. |
+| 🥇 Gold | $500 | Priority issue triage + direct maintainer line + large logo in README + hero spot on reactdatatable.com. Limited to 3. |
 
 [![Sponsor on GitHub Sponsors](https://img.shields.io/badge/Sponsor-GitHub%20Sponsors-ea4aaa?logo=github)](https://github.com/sponsors/jbetancur)
 [![Sponsor on OpenCollective](https://img.shields.io/badge/Sponsor-OpenCollective-blue?logo=opencollective)](https://opencollective.com/react-data-table-component)
 
+## Enterprise support
+
+Available as part of the Tidelift Subscription.
+
+The maintainer of react-data-table-component and thousands of other packages are working with Tidelift to deliver commercial support and maintenance for the open source dependencies you use to build your applications. Save time, reduce risk, and improve code health, while paying the maintainers of the exact dependencies you use. [Learn more.](https://tidelift.com/subscription/pkg/npm-react-data-table-component?utm_source=npm-react-data-table-component&utm_medium=referral&utm_campaign=readme)
+
+<!-- TODO: replace the Tidelift link above with the exact referral URL from the dashboard's "Promote the Tidelift Subscription" marketing task. -->
+
 ## Need help?
 
 Open a [GitHub issue](https://github.com/jbetancur/react-data-table-component/issues). Priority support is available for teams that [sponsor the project](https://github.com/sponsors/jbetancur).

SECURITY.md

@@ -0,0 +1,23 @@
+# Security Policy
+
+## Supported versions
+
+| Version | Supported |
+| ------- | --------- |
+| 8.x     | Yes       |
+| < 8.0   | No        |
+
+## Reporting a vulnerability
+
+Please do not open a public issue for security reports.
+
+Report vulnerabilities privately using one of:
+
+1. **GitHub private vulnerability reporting** (preferred): use the [Report a vulnerability](https://github.com/jbetancur/react-data-table-component/security/advisories/new) form on this repository.
+2. **Email**: <security@reactdatatable.com>
+
+You will receive an acknowledgment within 5 business days. Once the report is validated, a fix will be prioritized and released as a patch to the current major version, followed by a coordinated disclosure through a GitHub Security Advisory crediting the reporter.
+
+## Scope
+
+react-data-table-component is a client-side UI library. Reports most likely to qualify: XSS via table data or props, prototype pollution, and supply-chain issues in the published npm package. The library has zero runtime dependencies, which keeps the supply-chain surface small.

apps/docs/public/llms.txt

@@ -0,0 +1,85 @@
+# react-data-table-component
+
+> A fast, accessible React data table component with sorting, pagination, row selection, expandable rows, column filtering, and theming built in. Zero runtime dependencies, Apache-2.0 licensed, free with no paid tier. A working table takes about 10 lines of code.
+
+Install: `npm install react-data-table-component`
+
+Minimal usage:
+
+```tsx
+import DataTable from 'react-data-table-component';
+
+const columns = [
+  { name: 'Name', selector: row => row.name, sortable: true },
+  { name: 'Role', selector: row => row.role },
+];
+
+<DataTable columns={columns} data={data} pagination />
+```
+
+## Getting started
+
+- [Getting Started](https://reactdatatable.com/docs/getting-started): install and render a first table
+- [Installation](https://reactdatatable.com/docs/installation): package managers, CSS import, framework setup
+- [API Reference](https://reactdatatable.com/docs/api): all props and types
+- [Migration Guide](https://reactdatatable.com/docs/migration): upgrading from v7 to v8
+
+## Columns
+
+- [Columns Overview](https://reactdatatable.com/docs/columns): defining columns, selectors, formatting
+- [Cell Rendering](https://reactdatatable.com/docs/cells): custom cell components
+- [Column Groups](https://reactdatatable.com/docs/column-groups): spanning headers across columns
+- [Column Visibility](https://reactdatatable.com/docs/column-visibility): show and hide columns
+- [Column Reordering](https://reactdatatable.com/docs/column-reorder): drag to reorder
+- [Column Resizing](https://reactdatatable.com/docs/resizable): drag column edges, persist widths
+- [Column Pinning](https://reactdatatable.com/docs/column-pinning): pin columns left or right
+- [Column Filtering](https://reactdatatable.com/docs/filtering): per-column text, number, and select filters
+- [Sorting](https://reactdatatable.com/docs/sorting): client-side and server-side sorting
+
+## Rows
+
+- [Row Selection](https://reactdatatable.com/docs/selection): checkbox multi-select, select all, controlled selection
+- [Expandable Rows](https://reactdatatable.com/docs/expandable): detail panels with any component
+- [Row Interactions](https://reactdatatable.com/docs/row-interactions): click, double-click, hover handlers
+- [Row Pinning](https://reactdatatable.com/docs/row-pinning): pin rows to top
+- [Pagination](https://reactdatatable.com/docs/pagination): built-in and custom pagination, server-side
+- [Conditional Styles](https://reactdatatable.com/docs/conditional-styles): style rows and cells by data
+- [Fixed Header](https://reactdatatable.com/docs/fixed-header): sticky header with scrollable body
+- [Footer](https://reactdatatable.com/docs/footer): summary and pagination footers
+- [Loading State](https://reactdatatable.com/docs/loading): progress and skeleton states
+- [Inline Editing](https://reactdatatable.com/docs/inline-editing): edit cells in place
+
+## Styling
+
+- [Themes](https://reactdatatable.com/docs/themes): 5 built-in themes with dark mode, createTheme()
+- [Custom Styles](https://reactdatatable.com/docs/custom-styles): style every table region
+
+## Advanced
+
+- [TypeScript](https://reactdatatable.com/docs/typescript): generic column and row typing
+- [SSR](https://reactdatatable.com/docs/ssr): Next.js App Router, Remix, Astro
+- [Performance](https://reactdatatable.com/docs/performance): large datasets, memoization
+- [Headless Hooks](https://reactdatatable.com/docs/headless): use the logic without the UI
+- [Accessibility](https://reactdatatable.com/docs/accessibility): keyboard and screen reader support
+- [Localization](https://reactdatatable.com/docs/localization): translated labels and locales
+- [RTL Support](https://reactdatatable.com/docs/rtl): right-to-left layouts
+- [Mobile](https://reactdatatable.com/docs/mobile): responsive columns and layouts
+- [Export](https://reactdatatable.com/docs/export): CSV and JSON export
+- [Animations](https://reactdatatable.com/docs/animations): row animations
+
+## Recipes
+
+- [Server-side sort & filter](https://reactdatatable.com/docs/recipes/server-side)
+- [Approval workflow with bulk actions](https://reactdatatable.com/docs/recipes/bulk-action-toolbar)
+- [URL-synced table state](https://reactdatatable.com/docs/recipes/editable-grid)
+- [Dashboard drill-down](https://reactdatatable.com/docs/recipes/master-detail)
+- [Audit log viewer](https://reactdatatable.com/docs/recipes/sticky-footer)
+- [Persist column widths](https://reactdatatable.com/docs/recipes/persist-column-widths)
+- [Inline row actions](https://reactdatatable.com/docs/recipes/row-grouping)
+
+## Optional
+
+- [Changelog](https://reactdatatable.com/docs/changelog): release history
+- [Support & Sponsorship](https://reactdatatable.com/support): sponsor tiers, enterprise support via Tidelift
+- [GitHub repository](https://github.com/jbetancur/react-data-table-component)
+- [npm package](https://www.npmjs.com/package/react-data-table-component)

apps/docs/src/layouts/DocsLayout.astro

@@ -16,6 +16,7 @@ const nav = [
     links: [
       { label: 'Getting Started', href: '/docs/getting-started' },
       { label: 'Installation', href: '/docs/installation' },
+      { label: 'Comparisons', href: '/docs/comparisons' },
       { label: 'Changelog', href: '/docs/changelog' },
     ],
   },
@@ -135,9 +136,7 @@ const nextLink = currentIndex < allLinks.length - 1 ? allLinks[currentIndex + 1]
           </select>
         </div>
         <a
-          href="https://github.com/sponsors/jbetancur"
-          target="_blank"
-          rel="noopener noreferrer"
+          href="/support"
           class="block rounded-lg border border-pink-100 bg-pink-50 px-3 py-2.5 hover:border-pink-200 hover:bg-pink-100 transition-colors"
         >
           <div class="flex items-center gap-1.5 text-xs font-semibold text-pink-600">

apps/docs/src/layouts/Layout.astro

@@ -10,6 +10,24 @@ const {
   title = 'react-data-table-component',
   description = 'A fast, feature-rich React data table. Working table in 10 lines.',
 } = Astro.props;
+
+const jsonLd = JSON.stringify({
+  '@context': 'https://schema.org',
+  '@type': 'SoftwareApplication',
+  name: 'react-data-table-component',
+  description:
+    'A fast, accessible React data table component with sorting, pagination, row selection, expandable rows, column filtering, and theming built in. Zero runtime dependencies.',
+  url: 'https://reactdatatable.com',
+  applicationCategory: 'DeveloperApplication',
+  operatingSystem: 'Any',
+  license: 'https://www.apache.org/licenses/LICENSE-2.0',
+  offers: { '@type': 'Offer', price: '0', priceCurrency: 'USD' },
+  softwareHelp: { '@type': 'CreativeWork', url: 'https://reactdatatable.com/docs' },
+  downloadUrl: 'https://www.npmjs.com/package/react-data-table-component',
+  codeRepository: 'https://github.com/jbetancur/react-data-table-component',
+  programmingLanguage: 'TypeScript',
+  author: { '@type': 'Person', name: 'John Betancur', url: 'https://github.com/jbetancur' },
+});
 ---
 
 <!doctype html>
@@ -30,6 +48,7 @@ const {
     <meta name="twitter:image" content={new URL('/og-image.png', Astro.url).href} />
     <link rel="canonical" href={Astro.url.href} />
     <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <script is:inline type="application/ld+json" set:html={jsonLd} />
     <title>{title}</title>
   </head>
   <body class="min-h-screen flex flex-col bg-white text-gray-900">
@@ -61,9 +80,7 @@ const {
             GitHub
           </a>
           <a
-            href="https://github.com/sponsors/jbetancur"
-            target="_blank"
-            rel="noopener noreferrer"
+            href="/support"
             class="flex items-center gap-1 hover:text-pink-500 transition-colors"
             aria-label="Sponsor this project"
           >
@@ -124,7 +141,7 @@ const {
         <a href="/docs/api" class="block px-2 py-2 rounded-md text-gray-700 hover:bg-gray-50 hover:text-gray-900">API</a>
         <a href="/support" class="block px-2 py-2 rounded-md text-gray-700 hover:bg-gray-50 hover:text-gray-900">Support</a>
         <a href="https://github.com/jbetancur/react-data-table-component" target="_blank" rel="noopener noreferrer" class="block px-2 py-2 rounded-md text-gray-700 hover:bg-gray-50 hover:text-gray-900">GitHub ↗</a>
-        <a href="https://github.com/sponsors/jbetancur" target="_blank" rel="noopener noreferrer" class="block px-2 py-2 rounded-md text-pink-500 hover:bg-pink-50">♥ Sponsor</a>
+        <a href="/support" class="block px-2 py-2 rounded-md text-pink-500 hover:bg-pink-50">♥ Sponsor</a>
         <div class="pt-2">
           <a href="/docs/getting-started" class="block w-full text-center bg-brand-600 text-white px-4 py-2 rounded-md hover:bg-brand-700 font-medium">Get started →</a>
         </div>

apps/docs/src/pages/docs/comparisons.md

@@ -0,0 +1,88 @@
+---
+layout: '../../layouts/DocsLayout.astro'
+title: 'Comparisons: TanStack Table, AG Grid, MUI X | react-data-table-component'
+description: 'How react-data-table-component compares to TanStack Table, AG Grid Community, and MUI X Data Grid: setup effort, bundle size, features, and pricing.'
+---
+
+# How react-data-table-component compares
+
+All four libraries on this page are solid, actively maintained choices. They differ in how much you assemble yourself, what ships free, and what ecosystem they assume. This page gives you the honest picture so you can pick the right tool, even if it is not this one.
+
+The short version: react-data-table-component is a **full component**. You pass `columns` and `data` and get a styled, sortable, paginated table with selection, expandable rows, and theming. Nothing is gated behind a paid tier.
+
+---
+
+## react-data-table-component vs TanStack Table
+
+TanStack Table is **headless**: it manages table state (sorting, pagination, selection, expansion) and you write every piece of markup and CSS yourself. That is its superpower, total render control, and its cost, you build the UI.
+
+Choose **TanStack Table** when:
+
+- You need pixel-level control over markup and styling
+- Your design system dictates exactly how tables must render
+- Bundle size is critical (~15 KB min+gzip)
+
+Choose **react-data-table-component** when:
+
+- You want a working, styled table without building the UI layer
+- Sorting, pagination, and selection should come with their controls included
+- You want built-in themes and dark mode instead of writing CSS
+
+## react-data-table-component vs AG Grid
+
+AG Grid Community is a full-featured data grid with sorting, pagination, selection, and built-in themes included free. It is the heavyweight option: ~338 KB min+gzip, with advanced features such as master/detail (expandable rows), pivoting, and the server-side row model reserved for the commercial AG Grid Enterprise license.
+
+Choose **AG Grid** when:
+
+- You need enterprise grid features: pivoting, row grouping, Excel export, master/detail
+- You are rendering very large datasets and need built-in row virtualization
+- An Enterprise license is within budget for gated features
+
+Choose **react-data-table-component** when:
+
+- You need a table, not a spreadsheet engine
+- Expandable rows should be free, not part of a paid tier
+- A ~35 KB footprint fits your app better than ~338 KB
+
+## react-data-table-component vs MUI X Data Grid
+
+MUI X Data Grid is the natural choice inside a Material UI application. The Community version includes sorting, pagination, and selection, and it inherits your MUI theme. It requires the MUI ecosystem (`@mui/material`, `@mui/system`, Emotion) as peer dependencies, and features such as master/detail panels are part of the paid Pro tier.
+
+Choose **MUI X Data Grid** when:
+
+- Your app is already built on Material UI
+- You want the grid to inherit your existing MUI theme automatically
+- Pro or Premium features fit your budget when you need them
+
+Choose **react-data-table-component** when:
+
+- You are not using Material UI and do not want to adopt it for one component
+- You want zero runtime dependencies
+- Expandable rows and theming should work out of the box, free
+
+---
+
+## Feature comparison
+
+| | TanStack Table | AG Grid Community | MUI X Data Grid | react-data-table-component |
+| --- | --- | --- | --- | --- |
+| Approach | Headless | Full data grid | Full data grid | Full component |
+| Styled table out of the box | You build the UI | ✓ | ✓ | ✓ |
+| Sorting, pagination & selection UI | State only | ✓ | ✓ | ✓ |
+| Expandable row panels | State only | Enterprise tier | Pro tier | ✓ |
+| Dark mode & themes | Bring your own | ✓ built-in | Via MUI theme | 5 built-in |
+| Requires a UI framework | No | No | @mui/material + Emotion | No |
+| Row virtualization | Via TanStack Virtual | ✓ built-in | ✓ built-in | ✗ (paginate instead) |
+| Size (min+gzip) | ~15 KB | ~338 KB | ~117 KB + MUI | ~35 KB |
+| Paid tiers | None | Enterprise | Pro & Premium | None |
+
+Sizes measured via Bundlephobia, July 2026 (TanStack v8.21, AG Grid v36, MUI X v9.8).
+
+## Which should you choose?
+
+- **Full render control, smallest bundle:** TanStack Table
+- **Spreadsheet-grade features and virtualized big data:** AG Grid
+- **Already on Material UI:** MUI X Data Grid
+- **A styled, working table in about 10 lines, with nothing to configure and no tier to upgrade to:** react-data-table-component
+
+See [Getting Started](/docs/getting-started) to try it, or the [live demo](/) on the homepage.