diff --git a/.changeset/many-eggs-chew.md b/.changeset/many-eggs-chew.md new file mode 100644 index 00000000000..3fdab74fc70 --- /dev/null +++ b/.changeset/many-eggs-chew.md @@ -0,0 +1,5 @@ +--- +'@itwin/itwinui-react': patch +--- + +Fixed an issue in `Tabs` where it wasn't recalculating the active stripe position when a new tab was asynchronously added to the tablist. diff --git a/packages/itwinui-react/src/core/Tabs/Tabs.tsx b/packages/itwinui-react/src/core/Tabs/Tabs.tsx index bda48f7b07b..b58e61a91ae 100644 --- a/packages/itwinui-react/src/core/Tabs/Tabs.tsx +++ b/packages/itwinui-react/src/core/Tabs/Tabs.tsx @@ -286,6 +286,7 @@ const Tab = React.forwardRef((props, forwardedRef) => { tabsWidth, // to fix visual artifact on initial render setStripeProperties, tablistRef, + value, // since Tab with a different value might be later added to the same position ]); const onKeyDown = (event: React.KeyboardEvent) => {