TabPanel: Get rid min-width from dx-tabpanel-tab in Fluent

packages/devextreme/scss/widgets/fluent/tabPanel/_index.scss

@@ -11,7 +11,6 @@
 
 .dx-tabpanel {
   .dx-tabpanel-tab {
-    min-width: 72px;
     flex-grow: 0;
   }
 

packages/devextreme/testing/testcafe/tests/navigation/tabPanel/common.ts

@@ -511,3 +511,38 @@ test('TabPanel borders without scrolling', async (t) => {
     });
   });
 });
+
+test('TabPanel tabs min-width', async (t) => {
+  const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+
+  await testScreenshot(t, takeScreenshot, 'TabPanel tabs min-width.png', { element: '#container' });
+
+  await t
+    .expect(compareResults.isValid())
+    .ok(compareResults.errorMessages());
+}).before(async () => {
+  await ClientFunction(() => {
+    (window as any).DevExpress.ui.dxTabs.defaultOptions({
+      options: {
+        useInkRipple: false,
+      },
+    });
+  })();
+
+  const dataSource = [
+    { text: 'ok', title: 'ok' },
+    { icon: 'comment' },
+    { icon: 'user' },
+    { icon: 'money' },
+    { text: 'ok', title: 'ok', icon: 'search' },
+    { text: 'alignright', title: 'alignright', icon: 'alignright' },
+  ] as Item[];
+
+  const tabPanelOptions = {
+    dataSource,
+    height: 250,
+    width: 900,
+  };
+
+  return createWidget('dxTabPanel', tabPanelOptions);
+});

packages/devextreme/testing/testcafe/tests/navigation/tabs/common.ts

@@ -37,6 +37,30 @@ fixture.disablePageReloads`Tabs_common`
   });
 });
 
+test('Tabs with width: auto in flex container', async (t) => {
+  const { takeScreenshot, compareResults } = createScreenshotsComparer(t);
+
+  await testScreenshot(t, takeScreenshot, 'Tabs with width auto.png', { element: '#tabs' });
+
+  await t
+    .expect(compareResults.isValid())
+    .ok(compareResults.errorMessages());
+}).before(async () => {
+  await appendElementTo('#container', 'div', 'tabs');
+  await setAttribute('#container', 'style', 'display: flex; width: 800px;');
+
+  const dataSource = [
+    { text: 'ok' },
+    { icon: 'comment' },
+    { icon: 'user' },
+    { icon: 'money' },
+    { text: 'ok', icon: 'search' },
+    { text: 'alignright', icon: 'alignright' },
+  ] as Item[];
+
+  return createWidget('dxTabs', { dataSource, width: 'auto' }, '#tabs');
+});
+
 [true, false].forEach((rtlEnabled) => {
   ['primary', 'secondary'].forEach((stylingMode) => {
     test('Tabs icon position', async (t) => {