Skip to content

feat: Tabs variants and trailingIcon#1210

Merged
mariush2 merged 4 commits into
mainfrom
feat/tab-validation-states
Jan 22, 2026
Merged

feat: Tabs variants and trailingIcon#1210
mariush2 merged 4 commits into
mainfrom
feat/tab-validation-states

Conversation

@mariush2
Copy link
Copy Markdown
Contributor

@mariush2 mariush2 commented Jan 21, 2026

Azure DevOps links

User story


  • Needs to be tested locally by reviewer

Description

  • Updating text hover color for inactive tabs
  • Added 'variant' prop to Tabs.options
  • Added 'trailingIcon' prop to Tabs.options

Copilot AI review requested due to automatic review settings January 21, 2026 11:53
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull request overview

This PR adds variant (error/warning) and trailingIcon support to the Tabs component, along with improved hover styling for inactive tabs.

Changes:

  • Added variant and trailingIcon properties to the Tab interface
  • Implemented variant icon rendering with precedence over leadingIcon
  • Updated hover state styling to change text color for inactive tabs
  • Added Storybook stories with play functions to demonstrate new features

Reviewed changes

Copilot reviewed 4 out of 5 changed files in this pull request and generated 5 comments.

Show a summary per file
File Description
src/molecules/Tabs/Tabs.types.ts Adds variant and trailingIcon properties to the Tab interface
src/molecules/Tabs/Tab.tsx Implements variant icon logic, trailingIcon rendering, and variant-specific icon colors
src/molecules/Tabs/Tab.styles.ts Updates hover styling to change label color for inactive tabs
src/molecules/Tabs/Tabs.stories.tsx Adds new stories for WithTrailingIcon and Variants features with test coverage
.gitignore Consolidates Webstorm settings and adds vcs.xml to ignore list

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread src/molecules/Tabs/Tabs.stories.tsx
Comment thread src/molecules/Tabs/Tabs.types.ts
Comment thread src/molecules/Tabs/Tab.tsx
Comment thread src/molecules/Tabs/Tab.styles.ts
Comment thread src/molecules/Tabs/Tab.tsx
@github-actions
Copy link
Copy Markdown

github-actions Bot commented Jan 21, 2026

Coverage Report

Status Category Percentage Covered / Total
🔵 Lines 100% (🎯 100%) 17211 / 17211
🔵 Statements 100% (🎯 100%) 17211 / 17211
🔵 Functions 100% (🎯 100%) 1244 / 1244
🔵 Branches 100% (🎯 100%) 4327 / 4327
File Coverage
File Stmts Branches Functions Lines Uncovered Lines
Changed Files
src/molecules/Tabs/Tab.styles.ts 100% 100% 100% 100%
src/molecules/Tabs/Tab.tsx 100% 100% 100% 100%
Generated in workflow #2082 for commit c5369b4 by the Vitest Coverage Report Action

@mariush2 mariush2 marked this pull request as ready for review January 22, 2026 12:36
@mariush2 mariush2 requested a review from a team as a code owner January 22, 2026 12:36
@mariush2 mariush2 requested review from aslakihle and Copilot January 22, 2026 12:36
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull request overview

Copilot reviewed 4 out of 5 changed files in this pull request and generated 2 comments.


💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread src/molecules/Tabs/Tab.tsx
Comment thread src/molecules/Tabs/Tab.tsx
Copy link
Copy Markdown
Contributor

@aslakihle aslakihle left a comment

Choose a reason for hiding this comment

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

😎

@mariush2 mariush2 merged commit f93793a into main Jan 22, 2026
11 checks passed
@mariush2 mariush2 deleted the feat/tab-validation-states branch January 22, 2026 12:56
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.

3 participants