Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

TabMenu: Does not show selected tab when using templates in MenuItem #4739

Open
VentuzVictorPerez opened this issue Aug 4, 2023 · 3 comments
Open

TabMenu: Does not show selected tab when using templates in MenuItem #4739

VentuzVictorPerez opened this issue Aug 4, 2023 · 3 comments
Labels
Resolution: Workaround Issue or pull request contains a workaround. It needs to be reviewed further by Core Team

Comments

@VentuzVictorPerez
Copy link

Describe the bug

As the Title says, when using menu items with templates, the TabMenu does not show which tab is selected.

Reproducer

https://codesandbox.io/s/primereact-demo-forked-c5sy5g

PrimeReact version

9.6.0

React version

18.x

Language

TypeScript

Build / Runtime

Create React App (CRA)

Browser(s)

No response

Steps to reproduce the behavior

Just click the MenuItem with template "Amy Elsner" or the one with the split button.

TabMenu does not show those tabs selected, also the layout seems to be strange.

Expected behavior

TabMenu must show selected tabs even if MenuItems use templates.
@VentuzVictorPerez VentuzVictorPerez added the Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible label Aug 4, 2023
@VentuzVictorPerez VentuzVictorPerez changed the title TabMenu does not show selected tab when using templates in MenuItem TabMenu: Does not show selected tab when using templates in MenuItem Aug 4, 2023
@melloware
Copy link
Member

Fixed this one as well. Once again its your custom rendering you need to look how the other tabs are rendered: https://codesandbox.io/s/primereact-demo-forked-mkpcl5?file=/src/App.js

@melloware melloware added Resolution: Workaround Issue or pull request contains a workaround. It needs to be reviewed further by Core Team and removed Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible labels Aug 4, 2023
@VentuzVictorPerez
Copy link
Author

VentuzVictorPerez commented Aug 7, 2023 •
edited
Loading

Contrary to #4738 (comment), in this case the unexpected layout behavior is encountered in both Lara Indigo White and Arya Orange, so here, I don't know if is something that has to be fixed or one should deal with css workaround to fix it as you mentioned.

@melloware
Copy link
Member

I have a feeling this is theme related like the other fix I just made. Looks like there is something missing in all the themes?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
Resolution: Workaround Issue or pull request contains a workaround. It needs to be reviewed further by Core Team
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@melloware @VentuzVictorPerez