Skip to content

Comments

feat(tabs): allow custom toolbar in tabs#1558

Open
spliffone wants to merge 1 commit intomainfrom
feat/tabs-toolbar
Open

feat(tabs): allow custom toolbar in tabs#1558
spliffone wants to merge 1 commit intomainfrom
feat/tabs-toolbar

Conversation

@spliffone
Copy link
Member

@spliffone spliffone commented Feb 20, 2026

Describe in detail what your merge request does and why. Add relevant
screenshots and reference related issues via Closes #XY or Related to #XY.


@spliffone spliffone requested review from a team as code owners February 20, 2026 09:23
Copy link
Contributor

@gemini-code-assist gemini-code-assist bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

This pull request introduces a valuable feature by allowing a custom toolbar within the si-tabset component. The implementation is clean, particularly the use of :empty to hide the toolbar when it's not in use. However, the new example code has a couple of issues that should be addressed, and the new functionality lacks test coverage. I've provided specific comments on the example file to correct the tab selection logic and to add visual content to the toolbar buttons. Additionally, I recommend adding automated tests to si-tabset.component.spec.ts to ensure the toolbar's content projection works as expected and to prevent future regressions.

@github-actions
Copy link

<si-icon class="icon m-0" [icon]="icons.elementOptions" />
</button>
}
<div class="tab-toolbar">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@spliffone are there alternatives that make it work like this:

<div class="tab-toolbar">
  <si-tabset >... </si-tabset>
  <div class="toolbar">
     <button class="..."></button>
   </div>
</div>

I don't like having them as a content projection. It looks super weird to have non tabs in a tabset.
This also prevents us to do potential clean up in the DOM which results in us moving the the tablist role to root element, to allow custom labels etc.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I disagree here, the tab order should ensure that actions are focusable before the actual content. Following your proposal means the content is before the actions. Can you further explain what do we plan to clean up, I am uncertain what you mean?

@spliffone spliffone force-pushed the feat/tabs-toolbar branch 2 times, most recently from 1234c2f to 3aa7ed3 Compare February 20, 2026 13:22
@github-actions
Copy link

Code Coverage

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants