primefaces / primefaces/primereact
Steps: Component error with Tailwind
Open
Nobody has claimed this yet.
Component: Tailwind
Component: Unstyled
- Dominant language
- CSS
- Stars
- 8.3k
- Forks
- 1.2k
- PR merge metrics
- No merged PRs in 30d
Description
Describe the bug
Implementation
import { Steps, StepsSelectEvent } from "primereact/steps";
import { MenuItem } from "primereact/menuitem";
const items: MenuItem[] = [
{ label: "Step 1", icon: "pi pi-user" },
{ label: "Step 2", icon: "pi pi-user" },
{ label: "Step 3", icon: "pi pi-user" },
];
<div className="card">
<Steps
unstyled
pt={{}}
readOnly
model={items}
activeIndex={0}
onSelect={(event: StepsSelectEvent) => console.log(event)}
/>
</div>
Reproducer
No response
System Information
System:
OS: macOS 15.4.1
CPU: (8) arm64 Apple M1
Memory: 143.19 MB / 8.00 GB
Shell: 5.9 - /bin/zsh
Binaries:
Node: 22.13.1 - ~/.nvm/versions/node/v22.13.1/bin/node
Yarn: 1.22.22 - ~/.yarn/bin/yarn
npm: 11.4.0 - ~/.nvm/versions/node/v22.13.1/bin/npm
pnpm: 10.5.2 - ~/.nvm/versions/node/v22.13.1/bin/pnpm
Watchman: 2024.08.05.00 - /opt/homebrew/bin/watchman
Browsers:
Chrome: 137.0.7151.55
Safari: 18.4
npmPackages:
primereact: ^10.9.5 => 10.9.5
react: 19.1.0 => 19.1.0
tailwindcss: ^3.3.2 => 3.3.2
Steps to reproduce the behavior
Simply using Steps
Expected behavior
No response
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 by reproducing the supplied Steps component example with unstyled, an empty pt prop, and the listed React, PrimeReact, and Tailwind versions. Identify the error shown in the attached image and determine whether the unstyled Steps configuration triggers it; done means the example renders without that error.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, tailwindcss, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 35/100