themesberg / themesberg/flowbite-react

Cannot use Table.HeadCell outside Table.Head

Open
#1,277 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
2.1k
Forks
506
PR merge metrics
No merged PRs in 30d

Description

  • I have searched the Issues to see if this bug has already been reported
  • I have tested the latest version

Steps to reproduce

  1. Try to call Table.HeadCell outside Table.Head
    -> You get an error "useTableHeadContext should be used within the TableHeadContext provider!"

Current behavior

Requiring that HeadCell can only be used within Table.Head means that we cannot use the Table components to create tables where we have the first column acting as a table header - such as the tables outlined in the examples here: W3Schools - HTML Table Headers.

Expected behavior

No errors when calling Table.HeadCell outside Table.Head so that we can create tables with the first column acting as the tables head.

Fix?

The HeaderContext seems to be doing only theme related stuff. Can we move the context into TableContext instead?

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 by reproducing the error when calling Table.HeadCell outside Table.Head, then inspect the Table context and HeaderContext behavior described in the issue. Done means HeadCell renders without the context error and supports a first-column table header as in the linked HTML table examples.

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
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.