PLASMA-7360: add dividerAlign for Tabs - #2992
Open
TitanKuzmich wants to merge 4 commits into
Open
Conversation
📝 WalkthroughWalkthroughThe change centralizes Tabs Storybook generation across packages, adds reusable fixtures and metadata/story factories, introduces right-aligned dividers for vertical Tabs in plasma-new-hope, adds component coverage, and documents the new ChangesTabs modernization
Estimated code review effort: 4 (Complex) | ~60 minutes Suggested labels: Suggested reviewers: Sequence Diagram(s)sequenceDiagram
participant Storybook
participant getTabsStories
participant Tabs
participant VerticalTabs
participant CSS
Storybook->>getTabsStories: build shared metadata and stories
getTabsStories->>Tabs: render generated Default or HeaderTabs
Tabs->>VerticalTabs: pass vertical props
VerticalTabs->>CSS: apply dividerAlignRight styling
CSS-->>Storybook: render selected divider on the right
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Contributor
|
Theme Builder app deployed! https://plasma.sberdevices.ru/pr/plasma-theme-builder-pr-2992/ |
Contributor
Irinkv
approved these changes
Jul 27, 2026
TitanKuzmich
marked this pull request as ready for review
July 28, 2026 06:42
TitanKuzmich
requested review from
Yakutoc,
Yeti-or,
neretin-trike and
shuga2704
as code owners
July 28, 2026 06:42
github-actions
Bot
removed request for
Yakutoc,
Yeti-or,
neretin-trike and
shuga2704
July 28, 2026 06:48
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 4
🧹 Nitpick comments (2)
utils/plasma-sb-utils/src/components/Tabs/meta.ts (1)
36-43: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value
regularSizes[0]can beundefined.If a theme's horizontal config exposes only header sizes, the default
sizearg and thesizeselect options are empty, silently rendering the component without a size. A fallback (or explicit assertion) would make the failure obvious.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@utils/plasma-sb-utils/src/components/Tabs/meta.ts` around lines 36 - 43, Update the meta configuration around regularSizes and the default size argument so an empty regularSizes result cannot silently produce an undefined size; provide an explicit fallback or assertion, and ensure the size select options use the same validated value source.utils/plasma-sb-utils/src/components/Tabs/Tabs.tsx (1)
9-21: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value
componentConfig.verticalis required but never consumed.
createMetaand the story factories only usecomponentConfig.horizontal. Either makeverticaloptional or use it (e.g. to derive vertical size options), otherwise every wrapper imports a config for nothing.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@utils/plasma-sb-utils/src/components/Tabs/Tabs.tsx` around lines 9 - 21, Update CreateTabsStoriesProps and the related createMeta/story-factory usage so componentConfig.vertical is not required when it is never consumed. Prefer making vertical optional and preserve the existing horizontal configuration behavior unless the implementation is intentionally extended to use vertical.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@packages/plasma-new-hope/src/components/Tabs/Tabs.component-test.tsx`:
- Around line 82-104: Extend the visual test around the existing horizontal and
vertical divider Tabs to mount a vertical TabItem configuration with
dividerAlign="right" and include an IconTabItem using the right-aligned divider
styling. Keep the existing default left-aligned coverage and snapshot assertion
intact.
In `@utils/plasma-sb-utils/src/components/Tabs/stories.tsx`:
- Around line 125-129: Update the story render guard around showStandardTabs so
the standard tab block remains visible when no IconTabItem component is
supplied, even if dividerAlign is 'right'. Preserve the existing right-alignment
behavior when IconTabItem is available, and keep the icon block’s current
conditional rendering unchanged.
- Around line 193-209: The icon-tabs dropdown updates the wrong selection state
and omits the required orientation. In the Dropdown within the icon-tab story,
change onItemSelect to use setIconIndex and add the same orientation prop used
by the standard ShowAll IconTabItem, preserving the existing vertical-tabs
behavior.
In `@utils/plasma-sb-utils/src/components/Tabs/Tabs.tsx`:
- Around line 46-54: Update the Tabs story factory return shape around Default
and HeaderTabs so it always includes the HeaderTabs key, including when
headerSizes is empty. Preserve the early-return behavior while returning
HeaderTabs as undefined with a stable type, or otherwise ensure all consumers
can safely destructure and re-export it without a union-type error.
---
Nitpick comments:
In `@utils/plasma-sb-utils/src/components/Tabs/meta.ts`:
- Around line 36-43: Update the meta configuration around regularSizes and the
default size argument so an empty regularSizes result cannot silently produce an
undefined size; provide an explicit fallback or assertion, and ensure the size
select options use the same validated value source.
In `@utils/plasma-sb-utils/src/components/Tabs/Tabs.tsx`:
- Around line 9-21: Update CreateTabsStoriesProps and the related
createMeta/story-factory usage so componentConfig.vertical is not required when
it is never consumed. Prefer making vertical optional and preserve the existing
horizontal configuration behavior unless the implementation is intentionally
extended to use vertical.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro Plus
Run ID: 39d92d59-876b-4c6d-8fcb-aa7e5e739376
⛔ Files ignored due to path filters (321)
cypress/snapshots/b2c/chromium/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-b2c Tabs -- Handle tab focus autoFocus.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-b2c Tabs -- Handle tab focus default.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-b2c Tabs -- Handle tab focus pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-b2c Tabs -- Handle tab focus.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-b2c Tabs -- [PLASMA-T1655] Tabs size=l, with divider, orientation=horizontal.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-b2c Tabs -- [PLASMA-T1656] Tabs size=m, without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-b2c Tabs -- [PLASMA-T1657] Tabs size=s, clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-b2c Tabs -- [PLASMA-T1658] Tabs size=xs.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-b2c Tabs -- [PLASMA-T1659] Tabs vertical.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-b2c Tabs -- [PLASMA-T799] Tabs disabled.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-b2c Tabs -- [PLASMA-T803] Tabs clicking on arrows scrolls to previous or next.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-b2c Tabs -- [PLASMA-T819] Tabs size=h3.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-b2c Tabs -- _actionContent.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-b2c Tabs -- _outsideScroll.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-b2c Tabs -- _pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-b2c Tabs -- _size.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-b2c Tabs -- simple.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-b2c Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-core Tabs -- _disabled.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-core Tabs -- _stretch.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-core Tabs -- autoscroll.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-core Tabs -- controller.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-core Tabs -- scrollable.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-core Tabs -- simple.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/chromium/Tabs/plasma-core Tabs -- with icon.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-b2c Tabs -- Handle tab focus autoFocus.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-b2c Tabs -- Handle tab focus default.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-b2c Tabs -- Handle tab focus pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-b2c Tabs -- [PLASMA-T1655] Tabs size=l, with divider, orientation=horizontal.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-b2c Tabs -- [PLASMA-T1656] Tabs size=m, without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-b2c Tabs -- [PLASMA-T1657] Tabs size=s, clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-b2c Tabs -- [PLASMA-T1658] Tabs size=xs.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-b2c Tabs -- [PLASMA-T1659] Tabs vertical.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-b2c Tabs -- [PLASMA-T799] Tabs disabled.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-b2c Tabs -- [PLASMA-T803] Tabs clicking on arrows scrolls to previous or next.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-b2c Tabs -- [PLASMA-T819] Tabs size=h3.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-b2c Tabs -- _actionContent.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-b2c Tabs -- _pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-b2c Tabs -- _size.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-b2c Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-core Tabs -- _disabled.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-core Tabs -- _stretch.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-core Tabs -- autoscroll.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-core Tabs -- controller.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-core Tabs -- simple.snap.pngis excluded by!**/*.pngcypress/snapshots/b2c/webkit/Tabs/plasma-core Tabs -- with icon.snap.pngis excluded by!**/*.pngcypress/snapshots/bizcom/chromium/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/bizcom/chromium/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/bizcom/chromium/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/bizcom/chromium/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/bizcom/chromium/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/bizcom/chromium/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/bizcom/chromium/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/bizcom/chromium/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/bizcom/webkit/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/bizcom/webkit/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/bizcom/webkit/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/bizcom/webkit/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/bizcom/webkit/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/bizcom/webkit/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/bizcom/webkit/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/bizcom/webkit/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/chromium/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/chromium/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/chromium/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/chromium/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/chromium/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/chromium/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/chromium/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/chromium/Tabs/sdds-cs Tabs -- [PLASMA-T1655] Tabs with divider, orientation=horizontal.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/chromium/Tabs/sdds-cs Tabs -- [PLASMA-T1656] Tabs without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/chromium/Tabs/sdds-cs Tabs -- [PLASMA-T1657] Tabs size=s, clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/chromium/Tabs/sdds-cs Tabs -- [PLASMA-T1659] Tabs vertical.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/chromium/Tabs/sdds-cs Tabs -- [PLASMA-T799] Tabs disabled.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/chromium/Tabs/sdds-cs Tabs -- [PLASMA-T803] Tabs clicking on arrows scrolls to previous or next.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/webkit/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/webkit/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/webkit/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/webkit/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/webkit/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/webkit/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/webkit/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/webkit/Tabs/sdds-cs Tabs -- [PLASMA-T1655] Tabs with divider, orientation=horizontal.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/webkit/Tabs/sdds-cs Tabs -- [PLASMA-T1656] Tabs without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/webkit/Tabs/sdds-cs Tabs -- [PLASMA-T1657] Tabs size=s, clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/webkit/Tabs/sdds-cs Tabs -- [PLASMA-T1659] Tabs vertical.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/webkit/Tabs/sdds-cs Tabs -- [PLASMA-T799] Tabs disabled.snap.pngis excluded by!**/*.pngcypress/snapshots/cs/webkit/Tabs/sdds-cs Tabs -- [PLASMA-T803] Tabs clicking on arrows scrolls to previous or next.snap.pngis excluded by!**/*.pngcypress/snapshots/dfa/chromium/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/dfa/chromium/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/dfa/chromium/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/dfa/chromium/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/dfa/chromium/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/dfa/chromium/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/dfa/chromium/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/dfa/chromium/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/dfa/webkit/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/dfa/webkit/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/dfa/webkit/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/dfa/webkit/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/dfa/webkit/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/dfa/webkit/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/dfa/webkit/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/dfa/webkit/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/finai/chromium/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/finai/chromium/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/finai/chromium/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/finai/chromium/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/finai/chromium/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/finai/chromium/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/finai/chromium/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/finai/chromium/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/finai/webkit/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/finai/webkit/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/finai/webkit/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/finai/webkit/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/finai/webkit/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/finai/webkit/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/finai/webkit/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/finai/webkit/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/chromium/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/chromium/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/chromium/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/chromium/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/chromium/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/chromium/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/chromium/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/chromium/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/chromium/Tabs/plasma-giga Tabs -- [PLASMA-T1655] Tabs size=l, with divider, orientation=horizontal.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/chromium/Tabs/plasma-giga Tabs -- [PLASMA-T1656] Tabs size=m, without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/chromium/Tabs/plasma-giga Tabs -- [PLASMA-T1657] Tabs size=s, clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/chromium/Tabs/plasma-giga Tabs -- [PLASMA-T1658] Tabs size=xs.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/chromium/Tabs/plasma-giga Tabs -- [PLASMA-T1659] Tabs vertical.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/chromium/Tabs/plasma-giga Tabs -- [PLASMA-T799] Tabs disabled.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/chromium/Tabs/plasma-giga Tabs -- [PLASMA-T803] Tabs clicking on arrows scrolls to previous or next.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/chromium/Tabs/plasma-giga Tabs -- [PLASMA-T819] Tabs size=h3.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/webkit/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/webkit/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/webkit/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/webkit/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/webkit/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/webkit/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/webkit/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/webkit/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/webkit/Tabs/plasma-giga Tabs -- [PLASMA-T1657] Tabs size=s, clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/webkit/Tabs/plasma-giga Tabs -- [PLASMA-T799] Tabs disabled.snap.pngis excluded by!**/*.pngcypress/snapshots/giga/webkit/Tabs/plasma-giga Tabs -- [PLASMA-T803] Tabs clicking on arrows scrolls to previous or next.snap.pngis excluded by!**/*.pngcypress/snapshots/homeds/chromium/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/homeds/chromium/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/homeds/chromium/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/homeds/chromium/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/homeds/chromium/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/homeds/chromium/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/homeds/chromium/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/homeds/chromium/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/homeds/webkit/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/homeds/webkit/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/homeds/webkit/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/homeds/webkit/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/homeds/webkit/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/homeds/webkit/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/homeds/webkit/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/homeds/webkit/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/chromium/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/chromium/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/chromium/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/chromium/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/chromium/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/chromium/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/chromium/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/chromium/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/chromium/Tabs/sdds-insol Tabs -- [PLASMA-T1655] Tabs size=l, with divider, orientation=horizontal.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/chromium/Tabs/sdds-insol Tabs -- [PLASMA-T1656] Tabs size=m, without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/chromium/Tabs/sdds-insol Tabs -- [PLASMA-T1657] Tabs size=s, clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/chromium/Tabs/sdds-insol Tabs -- [PLASMA-T1658] Tabs size=xs.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/chromium/Tabs/sdds-insol Tabs -- [PLASMA-T1659] Tabs vertical.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/chromium/Tabs/sdds-insol Tabs -- [PLASMA-T799] Tabs disabled.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/chromium/Tabs/sdds-insol Tabs -- [PLASMA-T803] Tabs clicking on arrows scrolls to previous or next.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/chromium/Tabs/sdds-insol Tabs -- [PLASMA-T819] Tabs size=h3.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/webkit/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/webkit/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/webkit/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/webkit/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/webkit/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/webkit/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/webkit/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/webkit/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/webkit/Tabs/sdds-insol Tabs -- [PLASMA-T1657] Tabs size=s, clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/webkit/Tabs/sdds-insol Tabs -- [PLASMA-T799] Tabs disabled.snap.pngis excluded by!**/*.pngcypress/snapshots/insol/webkit/Tabs/sdds-insol Tabs -- [PLASMA-T803] Tabs clicking on arrows scrolls to previous or next.snap.pngis excluded by!**/*.pngcypress/snapshots/netology/chromium/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/netology/chromium/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/netology/chromium/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/netology/chromium/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/netology/chromium/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/netology/chromium/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/netology/chromium/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/netology/chromium/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/netology/webkit/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/netology/webkit/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/netology/webkit/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/netology/webkit/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/netology/webkit/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/netology/webkit/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/netology/webkit/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/netology/webkit/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/os/chromium/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/os/chromium/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/os/chromium/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/os/chromium/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/os/chromium/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/os/chromium/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/os/chromium/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/os/webkit/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/os/webkit/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/os/webkit/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/os/webkit/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/os/webkit/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/os/webkit/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/os/webkit/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/platform-ai/chromium/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/platform-ai/chromium/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/platform-ai/chromium/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/platform-ai/chromium/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/platform-ai/chromium/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/platform-ai/chromium/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/platform-ai/chromium/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/platform-ai/chromium/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/platform-ai/webkit/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/platform-ai/webkit/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/platform-ai/webkit/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/platform-ai/webkit/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/platform-ai/webkit/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/platform-ai/webkit/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/platform-ai/webkit/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/platform-ai/webkit/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/scan/chromium/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/scan/chromium/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/scan/chromium/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/scan/chromium/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/scan/chromium/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/scan/chromium/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/scan/chromium/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/scan/chromium/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/scan/webkit/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/scan/webkit/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/scan/webkit/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/scan/webkit/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/scan/webkit/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/scan/webkit/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/scan/webkit/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/scan/webkit/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/serv/chromium/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/serv/chromium/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/serv/chromium/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/serv/chromium/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/serv/chromium/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/serv/chromium/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/serv/chromium/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/serv/chromium/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/serv/webkit/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/serv/webkit/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/serv/webkit/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/serv/webkit/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/serv/webkit/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/serv/webkit/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/serv/webkit/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/serv/webkit/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/web/chromium/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/web/chromium/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/web/chromium/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/web/chromium/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/web/chromium/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/web/chromium/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/web/chromium/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/web/chromium/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/web/chromium/Tabs/plasma-core Tabs -- _disabled.snap.pngis excluded by!**/*.pngcypress/snapshots/web/chromium/Tabs/plasma-core Tabs -- _stretch.snap.pngis excluded by!**/*.pngcypress/snapshots/web/chromium/Tabs/plasma-core Tabs -- autoscroll.snap.pngis excluded by!**/*.pngcypress/snapshots/web/chromium/Tabs/plasma-core Tabs -- controller.snap.pngis excluded by!**/*.pngcypress/snapshots/web/chromium/Tabs/plasma-core Tabs -- scrollable.snap.pngis excluded by!**/*.pngcypress/snapshots/web/chromium/Tabs/plasma-core Tabs -- simple.snap.pngis excluded by!**/*.pngcypress/snapshots/web/chromium/Tabs/plasma-core Tabs -- with icon.snap.pngis excluded by!**/*.pngcypress/snapshots/web/chromium/Tabs/plasma-web Tabs -- _actionContent.snap.pngis excluded by!**/*.pngcypress/snapshots/web/chromium/Tabs/plasma-web Tabs -- _orientation.snap.pngis excluded by!**/*.pngcypress/snapshots/web/chromium/Tabs/plasma-web Tabs -- item autoFocus.snap.pngis excluded by!**/*.pngcypress/snapshots/web/chromium/Tabs/plasma-web Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/web/webkit/Tabs/Tabs -- action content.snap.pngis excluded by!**/*.pngcypress/snapshots/web/webkit/Tabs/Tabs -- clip=scroll, contentRight as icon.snap.pngis excluded by!**/*.pngcypress/snapshots/web/webkit/Tabs/Tabs -- focus and click change the selected tab.snap.pngis excluded by!**/*.pngcypress/snapshots/web/webkit/Tabs/Tabs -- header size=h5, view=clear.snap.pngis excluded by!**/*.pngcypress/snapshots/web/webkit/Tabs/Tabs -- orientation horizontal vs vertical, with divider.snap.pngis excluded by!**/*.pngcypress/snapshots/web/webkit/Tabs/Tabs -- pilled.snap.pngis excluded by!**/*.pngcypress/snapshots/web/webkit/Tabs/Tabs -- truncate.snap.pngis excluded by!**/*.pngcypress/snapshots/web/webkit/Tabs/Tabs -- without divider, stretch, contentLeft, contentRight as counter.snap.pngis excluded by!**/*.pngcypress/snapshots/web/webkit/Tabs/plasma-core Tabs -- _disabled.snap.pngis excluded by!**/*.pngcypress/snapshots/web/webkit/Tabs/plasma-core Tabs -- _stretch.snap.pngis excluded by!**/*.pngcypress/snapshots/web/webkit/Tabs/plasma-core Tabs -- autoscroll.snap.pngis excluded by!**/*.pngcypress/snapshots/web/webkit/Tabs/plasma-core Tabs -- controller.snap.pngis excluded by!**/*.pngcypress/snapshots/web/webkit/Tabs/plasma-core Tabs -- simple.snap.pngis excluded by!**/*.pngcypress/snapshots/web/webkit/Tabs/plasma-core Tabs -- with icon.snap.pngis excluded by!**/*.pngcypress/snapshots/web/webkit/Tabs/plasma-web Tabs -- _actionContent.snap.pngis excluded by!**/*.pngcypress/snapshots/web/webkit/Tabs/plasma-web Tabs -- _orientation.snap.pngis excluded by!**/*.pngcypress/snapshots/web/webkit/Tabs/plasma-web Tabs -- item autoFocus.snap.pngis excluded by!**/*.pngcypress/snapshots/web/webkit/Tabs/plasma-web Tabs -- truncate.snap.pngis excluded by!**/*.png
📒 Files selected for processing (52)
packages/plasma-b2c/src/components/Tabs/Tabs.Base.component-test.tsxpackages/plasma-b2c/src/components/Tabs/Tabs.component-test.tsxpackages/plasma-b2c/src/components/Tabs/Tabs.stories.tsxpackages/plasma-b2c/src/components/Tabs/Tabs.update-test.component-test.tsxpackages/plasma-giga/src/components/Tabs/Tabs.stories.tsxpackages/plasma-giga/src/components/Tabs/Tabs.update-test.component-test.tsxpackages/plasma-homeds/src/components/Tabs/Tabs.stories.tsxpackages/plasma-new-hope/src/components/Tabs/Tabs.component-test.tsxpackages/plasma-new-hope/src/components/Tabs/Tabs.template-doc.mdxpackages/plasma-new-hope/src/components/Tabs/Tabs.types.tspackages/plasma-new-hope/src/components/Tabs/tokens.tspackages/plasma-new-hope/src/components/Tabs/ui/vertical/VerticalIconTabItem/VerticalIconTabItem.tsxpackages/plasma-new-hope/src/components/Tabs/ui/vertical/VerticalIconTabItem/variations/_view/base.tspackages/plasma-new-hope/src/components/Tabs/ui/vertical/VerticalTabItem/variations/_view/base.tspackages/plasma-new-hope/src/components/Tabs/ui/vertical/VerticalTabs/VerticalTabs.tsxpackages/plasma-new-hope/src/components/Tabs/ui/vertical/VerticalTabs/variations/_view/base.tspackages/plasma-new-hope/src/examples/components/Tabs/Tabs.config.tspackages/plasma-new-hope/src/examples/components/Tabs/Tabs.stories.tsxpackages/plasma-web/src/components/Tabs/Tabs.Base.component-test.tsxpackages/plasma-web/src/components/Tabs/Tabs.component-test.tsxpackages/plasma-web/src/components/Tabs/Tabs.stories.tsxpackages/sdds-bizcom/src/components/Tabs/Tabs.stories.tsxpackages/sdds-cs/src/components/Tabs/Tabs.update-test.component-test.tsxpackages/sdds-dfa/src/components/Tabs/Tabs.stories.tsxpackages/sdds-finai/src/components/Tabs/Tabs.stories.tsxpackages/sdds-insol/src/components/Tabs/Tabs.stories.tsxpackages/sdds-insol/src/components/Tabs/Tabs.update-test.component-test.tsxpackages/sdds-netology/src/components/Tabs/Tabs.stories.tsxpackages/sdds-os/src/components/Tabs/Tabs.stories.tsxpackages/sdds-platform-ai/src/components/Tabs/Tabs.stories.tsxpackages/sdds-sbcom/src/components/Tabs/Tabs.stories.tsxpackages/sdds-scan/src/components/Tabs/Tabs.stories.tsxpackages/sdds-serv/src/components/Tabs/Tabs.stories.tsxutils/plasma-sb-utils/src/components/Tabs/Tabs.tsxutils/plasma-sb-utils/src/components/Tabs/fixtures.tsutils/plasma-sb-utils/src/components/Tabs/index.tsutils/plasma-sb-utils/src/components/Tabs/meta.tsutils/plasma-sb-utils/src/components/Tabs/stories.tsxutils/plasma-sb-utils/src/components/index.tswebsite/plasma-b2c-docs/docs/components/Tabs.mdxwebsite/plasma-giga-docs/docs/components/Tabs.mdxwebsite/plasma-homeds-docs/docs/components/Tabs.mdxwebsite/plasma-web-docs/docs/components/Tabs.mdxwebsite/sdds-bizcom-docs/docs/components/Tabs.mdxwebsite/sdds-dfa-docs/docs/components/Tabs.mdxwebsite/sdds-finai-docs/docs/components/Tabs.mdxwebsite/sdds-insol-docs/docs/components/Tabs.mdxwebsite/sdds-netology-docs/docs/components/Tabs.mdxwebsite/sdds-platform-ai-docs/docs/components/Tabs.mdxwebsite/sdds-sbcom-docs/docs/components/Tabs.mdxwebsite/sdds-scan-docs/docs/components/Tabs.mdxwebsite/sdds-serv-docs/docs/components/Tabs.mdx
💤 Files with no reviewable changes (8)
- packages/plasma-b2c/src/components/Tabs/Tabs.update-test.component-test.tsx
- packages/sdds-insol/src/components/Tabs/Tabs.update-test.component-test.tsx
- packages/plasma-giga/src/components/Tabs/Tabs.update-test.component-test.tsx
- packages/plasma-b2c/src/components/Tabs/Tabs.component-test.tsx
- packages/plasma-web/src/components/Tabs/Tabs.Base.component-test.tsx
- packages/sdds-cs/src/components/Tabs/Tabs.update-test.component-test.tsx
- packages/plasma-b2c/src/components/Tabs/Tabs.Base.component-test.tsx
- packages/plasma-web/src/components/Tabs/Tabs.component-test.tsx
Comment on lines
+82
to
+104
| it('orientation: horizontal vs vertical, with divider', () => { | ||
| mount( | ||
| <> | ||
| <Tabs view="divider"> | ||
| {items.map((item, i) => ( | ||
| <TabItem view="divider" key={i} selected={i === 1}> | ||
| {item.label} | ||
| </TabItem> | ||
| ))} | ||
| </Tabs> | ||
| <PadMe /> | ||
| <Tabs orientation="vertical" view="divider"> | ||
| {items.map((item, i) => ( | ||
| <TabItem orientation="vertical" view="divider" key={i} selected={i === 1}> | ||
| {item.label} | ||
| </TabItem> | ||
| ))} | ||
| </Tabs> | ||
| </>, | ||
| ); | ||
|
|
||
| cy.matchImageSnapshot(); | ||
| }); |
There was a problem hiding this comment.
🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win
Cover dividerAlign="right" in the visual test.
This snapshot exercises only the default left-aligned vertical TabItem; it does not mount the new right-aligned path or IconTabItem styling.
Suggested coverage
<Tabs orientation="vertical" view="divider">
{items.map((item, i) => (
<TabItem orientation="vertical" view="divider" key={i} selected={i === 1}>
{item.label}
</TabItem>
))}
</Tabs>
+ <PadMe />
+ <Tabs orientation="vertical" view="divider" dividerAlign="right">
+ {items.map((_, i) => (
+ <IconTabItem orientation="vertical" view="divider" key={i} selected={i === 1}>
+ <IconPlasma color="inherit" size="s" />
+ </IconTabItem>
+ ))}
+ </Tabs>📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
Suggested change
| it('orientation: horizontal vs vertical, with divider', () => { | |
| mount( | |
| <> | |
| <Tabs view="divider"> | |
| {items.map((item, i) => ( | |
| <TabItem view="divider" key={i} selected={i === 1}> | |
| {item.label} | |
| </TabItem> | |
| ))} | |
| </Tabs> | |
| <PadMe /> | |
| <Tabs orientation="vertical" view="divider"> | |
| {items.map((item, i) => ( | |
| <TabItem orientation="vertical" view="divider" key={i} selected={i === 1}> | |
| {item.label} | |
| </TabItem> | |
| ))} | |
| </Tabs> | |
| </>, | |
| ); | |
| cy.matchImageSnapshot(); | |
| }); | |
| it('orientation: horizontal vs vertical, with divider', () => { | |
| mount( | |
| <> | |
| <Tabs view="divider"> | |
| {items.map((item, i) => ( | |
| <TabItem view="divider" key={i} selected={i === 1}> | |
| {item.label} | |
| </TabItem> | |
| ))} | |
| </Tabs> | |
| <PadMe /> | |
| <Tabs orientation="vertical" view="divider"> | |
| {items.map((item, i) => ( | |
| <TabItem orientation="vertical" view="divider" key={i} selected={i === 1}> | |
| {item.label} | |
| </TabItem> | |
| ))} | |
| </Tabs> | |
| <PadMe /> | |
| <Tabs orientation="vertical" view="divider" dividerAlign="right"> | |
| {items.map((_, i) => ( | |
| <IconTabItem orientation="vertical" view="divider" key={i} selected={i === 1}> | |
| <IconPlasma color="inherit" size="s" /> | |
| </IconTabItem> | |
| ))} | |
| </Tabs> | |
| </>, | |
| ); | |
| cy.matchImageSnapshot(); | |
| }); |
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@packages/plasma-new-hope/src/components/Tabs/Tabs.component-test.tsx` around
lines 82 - 104, Extend the visual test around the existing horizontal and
vertical divider Tabs to mount a vertical TabItem configuration with
dividerAlign="right" and include an IconTabItem using the right-aligned divider
styling. Keep the existing default left-aligned coverage and snapshot assertion
intact.
Comment on lines
+125
to
+129
| const showStandardTabs = !hasDividerAlign || dividerAlign !== 'right'; | ||
|
|
||
| return ( | ||
| <div style={{ display: 'flex', gap: '3rem', flexDirection: orientation === 'vertical' ? 'row' : 'column' }}> | ||
| {showStandardTabs && ( |
There was a problem hiding this comment.
🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win
dividerAlign: 'right' can render an empty story.
Standard tabs are hidden whenever dividerAlign === 'right', and the icon block only renders if IconTabItem was supplied. For a package without iconTabItemComponent, selecting right alignment yields a blank canvas. Consider gating on IconTabItem presence too.
🩹 Suggested guard
- const showStandardTabs = !hasDividerAlign || dividerAlign !== 'right';
+ const showStandardTabs = !hasDividerAlign || dividerAlign !== 'right' || !IconTabItem;📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
Suggested change
| const showStandardTabs = !hasDividerAlign || dividerAlign !== 'right'; | |
| return ( | |
| <div style={{ display: 'flex', gap: '3rem', flexDirection: orientation === 'vertical' ? 'row' : 'column' }}> | |
| {showStandardTabs && ( | |
| const showStandardTabs = !hasDividerAlign || dividerAlign !== 'right' || !IconTabItem; | |
| return ( | |
| <div style={{ display: 'flex', gap: '3rem', flexDirection: orientation === 'vertical' ? 'row' : 'column' }}> | |
| {showStandardTabs && ( |
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@utils/plasma-sb-utils/src/components/Tabs/stories.tsx` around lines 125 -
129, Update the story render guard around showStandardTabs so the standard tab
block remains visible when no IconTabItem component is supplied, even if
dividerAlign is 'right'. Preserve the existing right-alignment behavior when
IconTabItem is available, and keep the icon block’s current conditional
rendering unchanged.
Comment on lines
+193
to
+209
| {dropdownItems.length > 0 && ( | ||
| <Dropdown | ||
| size={size} | ||
| items={dropdownItems} | ||
| onItemSelect={(item: { value: number }) => setIndex(item.value)} | ||
| > | ||
| <IconTabItem | ||
| key="item:ShowAll" | ||
| view="divider" | ||
| tabIndex={!disabled ? 0 : -1} | ||
| disabled={disabled} | ||
| size={size} | ||
| > | ||
| {getIconContent(size, IconDotsHorizontalOutline)} | ||
| </IconTabItem> | ||
| </Dropdown> | ||
| )} |
There was a problem hiding this comment.
🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win
Icon-tabs dropdown updates the wrong selection state.
onItemSelect here calls setIndex, which drives the standard tabs list; it should be setIconIndex. Also, unlike the standard ShowAll item (Line 166), this IconTabItem omits orientation, so it renders the horizontal variant inside vertical Tabs.
🐛 Proposed fix
<Dropdown
size={size}
items={dropdownItems}
- onItemSelect={(item: { value: number }) => setIndex(item.value)}
+ onItemSelect={(item: { value: number }) => setIconIndex(item.value)}
>
<IconTabItem
key="item:ShowAll"
view="divider"
tabIndex={!disabled ? 0 : -1}
disabled={disabled}
size={size}
+ orientation={orientation}
>📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
Suggested change
| {dropdownItems.length > 0 && ( | |
| <Dropdown | |
| size={size} | |
| items={dropdownItems} | |
| onItemSelect={(item: { value: number }) => setIndex(item.value)} | |
| > | |
| <IconTabItem | |
| key="item:ShowAll" | |
| view="divider" | |
| tabIndex={!disabled ? 0 : -1} | |
| disabled={disabled} | |
| size={size} | |
| > | |
| {getIconContent(size, IconDotsHorizontalOutline)} | |
| </IconTabItem> | |
| </Dropdown> | |
| )} | |
| {dropdownItems.length > 0 && ( | |
| <Dropdown | |
| size={size} | |
| items={dropdownItems} | |
| onItemSelect={(item: { value: number }) => setIconIndex(item.value)} | |
| > | |
| <IconTabItem | |
| key="item:ShowAll" | |
| view="divider" | |
| tabIndex={!disabled ? 0 : -1} | |
| disabled={disabled} | |
| size={size} | |
| orientation={orientation} | |
| > | |
| {getIconContent(size, IconDotsHorizontalOutline)} | |
| </IconTabItem> | |
| </Dropdown> | |
| )} |
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@utils/plasma-sb-utils/src/components/Tabs/stories.tsx` around lines 193 -
209, The icon-tabs dropdown updates the wrong selection state and omits the
required orientation. In the Dropdown within the icon-tab story, change
onItemSelect to use setIconIndex and add the same orientation prop used by the
standard ShowAll IconTabItem, preserving the existing vertical-tabs behavior.
TitanKuzmich
force-pushed
the
PLASMA-7360
branch
from
July 28, 2026 07:23
89bca50 to
845d5c6
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Core
Tabs
dividerAlignWhat/why changed
dividerAlign📦 Published PR as canary version:
Canary Versions✨ Test out this PR locally via:
npm install @salutejs/plasma-asdk@0.385.0-canary.2992.30338232328.0 npm install @salutejs/plasma-b2c@1.627.0-canary.2992.30338232328.0 npm install @salutejs/plasma-core@1.234.0-canary.2992.30338232328.0 npm install @salutejs/plasma-giga@0.354.0-canary.2992.30338232328.0 npm install @salutejs/plasma-homeds@0.354.0-canary.2992.30338232328.0 npm install @salutejs/plasma-hope@1.381.0-canary.2992.30338232328.0 npm install @salutejs/plasma-icons@1.244.0-canary.2992.30338232328.0 npm install @salutejs/plasma-new-hope@0.371.0-canary.2992.30338232328.0 npm install @salutejs/plasma-tokens@1.146.0-canary.2992.30338232328.0 npm install @salutejs/plasma-tokens-b2b@1.60.0-canary.2992.30338232328.0 npm install @salutejs/plasma-tokens-b2c@0.71.0-canary.2992.30338232328.0 npm install @salutejs/plasma-tokens-web@1.75.0-canary.2992.30338232328.0 npm install @salutejs/plasma-typo@0.48.0-canary.2992.30338232328.0 npm install @salutejs/plasma-web@1.629.0-canary.2992.30338232328.0 npm install @salutejs/sdds-bizcom@0.359.0-canary.2992.30338232328.0 npm install @salutejs/sdds-cs@0.363.0-canary.2992.30338232328.0 npm install @salutejs/sdds-dfa@0.357.0-canary.2992.30338232328.0 npm install @salutejs/sdds-finai@0.350.0-canary.2992.30338232328.0 npm install @salutejs/sdds-insol@0.354.0-canary.2992.30338232328.0 npm install @salutejs/sdds-netology@0.358.0-canary.2992.30338232328.0 npm install @salutejs/sdds-os@0.29.0-canary.2992.30338232328.0 npm install @salutejs/sdds-platform-ai@0.358.0-canary.2992.30338232328.0 npm install @salutejs/sdds-sbcom@0.359.0-canary.2992.30338232328.0 npm install @salutejs/sdds-scan@0.357.0-canary.2992.30338232328.0 npm install @salutejs/sdds-serv@0.358.0-canary.2992.30338232328.0 npm install @salutejs/core-themes@0.36.0-canary.2992.30338232328.0 npm install @salutejs/plasma-themes@0.58.0-canary.2992.30338232328.0 npm install @salutejs/sdds-themes@0.72.0-canary.2992.30338232328.0 npm install @salutejs/sdds-api-tests@0.16.0-canary.2992.30338232328.0 npm install @salutejs/plasma-cy-utils@0.164.0-canary.2992.30338232328.0 npm install @salutejs/plasma-sb-utils@0.235.0-canary.2992.30338232328.0 npm install @salutejs/plasma-tokens-utils@0.56.0-canary.2992.30338232328.0 # or yarn add @salutejs/plasma-asdk@0.385.0-canary.2992.30338232328.0 yarn add @salutejs/plasma-b2c@1.627.0-canary.2992.30338232328.0 yarn add @salutejs/plasma-core@1.234.0-canary.2992.30338232328.0 yarn add @salutejs/plasma-giga@0.354.0-canary.2992.30338232328.0 yarn add @salutejs/plasma-homeds@0.354.0-canary.2992.30338232328.0 yarn add @salutejs/plasma-hope@1.381.0-canary.2992.30338232328.0 yarn add @salutejs/plasma-icons@1.244.0-canary.2992.30338232328.0 yarn add @salutejs/plasma-new-hope@0.371.0-canary.2992.30338232328.0 yarn add @salutejs/plasma-tokens@1.146.0-canary.2992.30338232328.0 yarn add @salutejs/plasma-tokens-b2b@1.60.0-canary.2992.30338232328.0 yarn add @salutejs/plasma-tokens-b2c@0.71.0-canary.2992.30338232328.0 yarn add @salutejs/plasma-tokens-web@1.75.0-canary.2992.30338232328.0 yarn add @salutejs/plasma-typo@0.48.0-canary.2992.30338232328.0 yarn add @salutejs/plasma-web@1.629.0-canary.2992.30338232328.0 yarn add @salutejs/sdds-bizcom@0.359.0-canary.2992.30338232328.0 yarn add @salutejs/sdds-cs@0.363.0-canary.2992.30338232328.0 yarn add @salutejs/sdds-dfa@0.357.0-canary.2992.30338232328.0 yarn add @salutejs/sdds-finai@0.350.0-canary.2992.30338232328.0 yarn add @salutejs/sdds-insol@0.354.0-canary.2992.30338232328.0 yarn add @salutejs/sdds-netology@0.358.0-canary.2992.30338232328.0 yarn add @salutejs/sdds-os@0.29.0-canary.2992.30338232328.0 yarn add @salutejs/sdds-platform-ai@0.358.0-canary.2992.30338232328.0 yarn add @salutejs/sdds-sbcom@0.359.0-canary.2992.30338232328.0 yarn add @salutejs/sdds-scan@0.357.0-canary.2992.30338232328.0 yarn add @salutejs/sdds-serv@0.358.0-canary.2992.30338232328.0 yarn add @salutejs/core-themes@0.36.0-canary.2992.30338232328.0 yarn add @salutejs/plasma-themes@0.58.0-canary.2992.30338232328.0 yarn add @salutejs/sdds-themes@0.72.0-canary.2992.30338232328.0 yarn add @salutejs/sdds-api-tests@0.16.0-canary.2992.30338232328.0 yarn add @salutejs/plasma-cy-utils@0.164.0-canary.2992.30338232328.0 yarn add @salutejs/plasma-sb-utils@0.235.0-canary.2992.30338232328.0 yarn add @salutejs/plasma-tokens-utils@0.56.0-canary.2992.30338232328.0Summary by CodeRabbit
New Features
dividerAlignsupport for vertical tabs, allowing the divider to appear on the left or right.Documentation
Tests