primefaces / primefaces/primereact

DataTable: PassThrough types does not match actual values

Open
#8,431 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Status: Needs Triage
Dominant language
CSS
Stars
8.3k
Forks
1.2k
PR merge metrics
No merged PRs in 30d

Description

Describe the bug

When styling with Tailwind through theming, it is needed to type the passthrough options like so -> datatablePT: Pick<PrimeReactPTOptions, "datatable">

When trying to access the context for a bodyRow in passthrough options for DataTable the type for context is DataTableContext and not DataTableBodyRowContext.

bodyRow({ context }) -> context is type any
bodyRow(options) => options?.context is type DataTableContext

Reproducer

No response

System Information
System:
    OS: Windows 11 10.0.22631
    CPU: (12) x64 Intel(R) Core(TM) i7-10850H CPU @ 2.70GHz
    Memory: 18.29 GB / 31.85 GB
  Binaries:
    Node: 22.15.1 - C:\Program Files\nodejs\node.EXE
    Yarn: 4.9.2 - C:\Program Files\nodejs\yarn.CMD
    npm: 10.9.2 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: 143.0.7499.41
    Edge: Chromium (140.0.3485.54)
    Firefox: 122.0 - C:\Program Files\Mozilla Firefox\firefox.exe
    Internet Explorer: 11.0.22621.3527
  npmPackages:
    primereact: ^10.9.7 => 10.9.7 
    react: ^19.1.1 => 19.1.1 
    tailwindcss: ^4.1.13 => 4.1.13
Steps to reproduce the behavior
  1. Create a passthrough styling object for the DataTable component, used for theming and not directly on the component.
  2. Add the type for the DataTable component from import type { PrimeReactPTOptions } from "primereact/api"
  3. Type the passthrough styling object like Pick<PrimeReactPTOptions, "datatable">
  4. Create styling for bodyRow bodyRow(options)
  5. Check that the options.context exists and that the type is wrong -> DataTableContext
Expected behavior

I would expect that the type for context in bodyRow is DataTableBodyRowContext and not the parent context type.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start at the DataTable passthrough types exposed through PrimeReactPTOptions and trace the bodyRow(options) entry point. Compare the declared context type with the DataTableBodyRowContext described in the issue, then verify that bodyRow context is typed consistently rather than as DataTableContext or any.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
48/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.