primefaces / primefaces/primereact
[v11] Tabs: First tab isn't shown by default on page load
Nobody has claimed this yet.
- Dominant language
- CSS
- Stars
- 8.3k
- Forks
- 1.2k
- PR merge metrics
- No merged PRs in 30d
Description
Describe the bug
The Tabs component doesn't show the contents of the first tab (or any tab) until you click a tab. I'm seeing this when coping the first example from https://v11.primereact.org/docs/components/tabs into the nextjs starter project (linked to form here https://v11.primereact.org/docs/installation/nextjs) which has been updated to the latest version of react prime v11 (alpha 7) and the latest version of nextjs (16). So might be nextjs specific, not sure.
Reproducer
https://stackblitz.com/edit/stackblitz-starters-ea8ewjrb
System Information
System:
OS: macOS 15.6.1
CPU: (10) arm64 Apple M2 Pro
Memory: 1.03 GB / 32.00 GB
Shell: 4.0.2 - /opt/homebrew/bin/fish
Binaries:
Node: 20.19.4 - /opt/homebrew/bin/node
Yarn: 1.22.22 - /opt/homebrew/bin/yarn
npm: 10.8.2 - /opt/homebrew/bin/npm
Deno: 2.4.5 - /opt/homebrew/bin/deno
Browsers:
Chrome: 142.0.7444.135
Edge: 142.0.3595.65
Firefox: 145.0
Safari: 26.1
npmPackages:
primereact: ^11.0.0-alpha.7 => 11.0.0-alpha.7
react: 19.2.0 => 19.2.0
tailwindcss: ^4 => 4.1.17
Steps to reproduce the behavior
-
Download and run the stackblitz project. I couldn't get it to actually run in stackbliz in the browser due to issues with next.js's turbopack and wasm but if you download the project and run it locally it should work.
-
Observe the use of the Tabs component on the home page and how loading the home page shows no tabs content until you actually click a tab:
Expected behavior
The contents of the first tab to be shown by default as seen in the examples in the docs.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the Tabs component and compare the first example in the v11 documentation with the downloaded Next.js starter project from the StackBlitz reproducer. Check the initial page-load behavior before any tab is clicked, then verify that the first tab's contents render by default while preserving tab switching.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- nextjs, react
- Domain
- frontend, web-dev
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100