fix: [DX-2051] Fix OptimusTab title overflow (#666)

MewsSystems · Sep 5, 2024 · a249be3 · a249be3
1 parent 26e5541
commit a249be3
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 3 deletions.
diff --git a/optimus/lib/src/tabs.dart b/optimus/lib/src/tabs.dart
@@ -36,7 +36,7 @@ class OptimusTab extends StatelessWidget {
 
     return Container(
       padding: EdgeInsets.symmetric(horizontal: tokens.spacing150),
-      height: 48,
+      height: tokens.sizing600,
       constraints: BoxConstraints(maxWidth: maxWidth ?? double.infinity),
       child: Row(
         mainAxisSize: MainAxisSize.min,
@@ -46,7 +46,7 @@ class OptimusTab extends StatelessWidget {
               padding: EdgeInsets.only(right: tokens.spacing50),
               child: Icon(icon, size: tokens.sizing200),
             ),
-          Text(label, overflow: TextOverflow.ellipsis),
+          Flexible(child: Text(label, overflow: TextOverflow.ellipsis)),
           if (badge case final badge?)
             Padding(
               padding: EdgeInsets.only(left: tokens.spacing50),

diff --git a/storybook/lib/stories/tab/tabs.dart b/storybook/lib/stories/tab/tabs.dart
@@ -22,7 +22,7 @@ final Story tabsStory = Story(
         tabs: _items
             .map(
               (i) => OptimusTab(
-                label: 'Tab ${i + 1}',
+                label: i.isEven ? 'Tab with long name' : 'Tab ${i + 1}',
                 icon: i.isOdd ? icon : null,
                 badge: i.isOdd ? badge : null,
                 maxWidth: _tabBarWidth / _items.length,