Merge pull request #2574 from epam/improvement/3251_update_gt_config

3251 Update GT configuration

.github/workflows/e2e.yml

@@ -14,7 +14,7 @@ concurrency:
 jobs:
     e2e-tests:
         timeout-minutes: 60
-        runs-on: ubuntu-latest
+        runs-on: ubuntu-22.04
         if: github.event.pull_request.draft == false
         steps:
             - uses: actions/checkout@v4

.github/workflows/prod.yml

@@ -30,4 +30,4 @@ jobs:
       values-file: values.prod.yaml
       # TODO: After migrating prod environment we can use the same image name for prod and non-prod
       image-name: ui
-      git-version-mode: '/overrideconfig mode=Mainline'
+      git-version-mode: ''

app/src/demo/tables/masterDetailedTable/MasterDetailedTable.tsx

@@ -41,7 +41,7 @@ export function MasterDetailedTable() {
     );
 
     const pin = useCallback(
-        ({ value: { __typename } }: DataRowProps<PersonTableRecord, PersonTableRecordId[]>) => 
+        ({ value: { __typename } }: DataRowProps<PersonTableRecord, PersonTableRecordId[]>) =>
             __typename !== 'Person',
         [],
     );

app/src/demo/tables/masterDetailedTable/filters.ts

@@ -50,6 +50,7 @@ export const getFilters = <TFilter extends Record<string, any>>(): TableFiltersC
             columnKey: 'birthDate',
             title: 'Birth Date',
             type: 'rangeDatePicker',
+            format: 'YYYY-MM-DD',
         },
     ];
 };

app/src/docs/RichTextEditor.doc.tsx

@@ -1,16 +1,14 @@
 import * as React from 'react';
-import cx from 'classnames';
 import { BaseDocsBlock, DocExample } from '../common';
-import css from './styles.module.scss';
 
 export class RichTextEditorDoc extends BaseDocsBlock {
     title = 'Rich Text Editor';
     renderContent() {
         return (
-            <span className={ cx(css.wrapper) }>
+            <>
                 <DocExample path="./_examples/richTextEditor/Basic.example.tsx" />
                 <DocExample title="Inner scroll behavior" path="./_examples/richTextEditor/WithInnerScroll.example.tsx" />
-            </span>
+            </>
         );
     }
 }

app/src/docs/RichTextEditorSerializers.doc.tsx

@@ -1,16 +1,14 @@
 import * as React from 'react';
-import cx from 'classnames';
 import { BaseDocsBlock, DocExample } from '../common';
-import css from './styles.module.scss';
 
 export class RichTextEditorSerializersDoc extends BaseDocsBlock {
     title = 'Rich Text Editor Serializers';
     renderContent() {
         return (
-            <span className={ cx(css.wrapper) }>
+            <>
                 <DocExample title="MD format" path="./_examples/richTextEditor/MdSerialization.example.tsx" />
                 <DocExample title="HTML format" path="./_examples/richTextEditor/HtmlSerialization.example.tsx" />
-            </span>
+            </>
         );
     }
 }

app/src/docs/SliderRating.doc.tsx

@@ -3,8 +3,6 @@ import * as loveship from '@epam/loveship';
 import * as uui from '@epam/uui';
 import { DocBuilder, TDocConfig, TDocContext, TSkin } from '@epam/uui-docs';
 import { BaseDocsBlock, DocExample, EditableDocContent } from '../common';
-import cx from 'classnames';
-import css from './styles.module.scss';
 
 export class SliderRatingDoc extends BaseDocsBlock {
     title = 'SliderRating';
@@ -37,11 +35,11 @@ export class SliderRatingDoc extends BaseDocsBlock {
 
     renderContent() {
         return (
-            <span className={ cx(css.wrapper) }>
+            <>
                 <EditableDocContent fileName="sliderRating-descriptions" />
                 {this.renderSectionTitle('Examples')}
                 <DocExample title="Basic" path="./_examples/sliderRating/Basic.example.tsx" />
-            </span>
+            </>
         );
     }
 }

app/src/docs/Tag.doc.tsx

@@ -57,7 +57,7 @@ export class TagDoc extends BaseDocsBlock {
                     isDropdown: { examples: '*' },
                     onClear: { examples: ['callback', undefined] },
                 },
-                cellSize: '180-60',
+                cellSize: '195-60',
             });
             docPreview.add({
                 id: TTagPreview['Color Variants'],

app/src/docs/styles.module.scss

@@ -1,13 +1,3 @@
-@use '~@epam/assets/theme/theme_promo' as *;
-
-.wrapper {
-    &.uui-theme-promo {
-        :global {
-            @include theme-promo();
-        }
-    }
-}
-
 .app-bg {
     --uui-docs-bg: var(--uui-app-bg);
 }

app/src/sandbox/RTE/rteDemo.module.scss

@@ -1,14 +1,6 @@
-@use '~@epam/assets/theme/theme_promo' as *;
-
 .wrapper {
     flex-grow: 1;
     margin: 24px;
-
-    &.uui-theme-promo {
-        :global {
-            @include theme-promo();
-        }
-    }
 }
 
 .icon-wrapper {

app/src/sandbox/SandboxPage.tsx

@@ -8,7 +8,6 @@ import { PersonsTableDemo } from './tables/PersonsTableDemo';
 import { DemoTablePaged } from './tablePaged';
 import { DraftRTEDemo } from './draft-rte/DraftRTEDemo';
 import { ScrollSpyDemo } from './scroll-spy/ScrollSpyDemo';
-import { Responsive } from './responsive/Responsive';
 import { ThemeDemo } from './theme/ThemeDemo';
 import { ThemeElectricDemo } from './theme-electric-test/ThemeDemo';
 import { ProductsTableDemo } from './productsTable/ProductsTableDemo';
@@ -19,7 +18,6 @@ import { Skills } from './skills';
 import TableCellsStylesSandbox from './tableCellStyles/TableCellsStylesSandbox';
 import { ProjectTasksDemo } from './tasks/ProjectTasksDemo';
 import { RichTextEditorDemo } from './RTE/rteDemo';
-import { TableColumnConfigModalTest } from './tableColConfigModal/TableColumnConfigModalTest';
 import { PalettePage } from './tokens/palette/palettePage';
 import { ReactQueryLocationsTable } from './reactQueryLocationsTable';
 import { ProjectTableDemo } from './editableTable';
@@ -37,15 +35,13 @@ export function SandboxPage() {
             { id: 'reactQueryLocationsTableDemo', name: 'React-query Loactions Demo', component: ReactQueryLocationsTable },
             { id: 'Draft', name: 'DRAFT RTE demo', component: DraftRTEDemo },
             { id: 'scrollSpy', name: 'Scroll Spy', component: ScrollSpyDemo },
-            { id: 'responsive', name: 'Responsive', component: Responsive },
             { id: 'uui_theming', name: 'UUI Theming', component: ThemeDemo },
             { id: 'theme_electric', name: 'Theme Electric', component: ThemeElectricDemo },
             { id: 'DemoTablePaged', name: 'Table with paging', component: DemoTablePaged },
             { id: 'SkillsBatteryPopover', name: 'Skills', component: Skills },
             { id: 'TableCellsStylesSandbox', name: 'Table Cells/Rows styles', component: TableCellsStylesSandbox },
             { id: 'AdaptivePanel', name: 'Adaptive panel', component: AdaptivePanelDemo },
             { id: 'RTEDemo', name: 'RTE Demo', component: RichTextEditorDemo },
-            { id: 'TableColumnsConfigurationModal', name: 'Table ColumnsConfigModal', component: TableColumnConfigModalTest },
             { id: 'tokens', name: 'Tokens' },
             { parentId: 'tokens', id: 'tokensPalette', name: 'Palette', component: PalettePage },
             { id: 'rtl-example', name: 'Rtl-example', component: RtlExample },

app/src/sandbox/db/DbDemo.module.scss

@@ -1,14 +1,6 @@
-@use '~@epam/assets/theme/theme_promo' as *;
-
 .container {
     display: flex;
     flex-direction: column;
     flex: 1 1 0;
     height: calc(100vh - 60px);
-
-    &.uui-theme-promo {
-        :global {
-            @include theme-promo();
-        }
-    }
 }

app/src/sandbox/draft-rte/DraftRTEDemo.module.scss

@@ -1,15 +1,7 @@
-@use '~@epam/assets/theme/theme_loveship' as *;
-
 .demo-wrapper {
     display: flex;
     width: 100%;
     height: calc(100vh - 60px);
-
-    &.uui-theme-loveship {
-        :global {
-            @include theme-loveship();
-        }
-    }
 }
 
 .DraftRTEDemo {

app/src/sandbox/productsTable/ProductsTableDemo.module.scss

@@ -1,12 +1,5 @@
-@use '~@epam/assets/theme/theme_loveship' as *;
 
 .container {
     width: 100%;
     height: calc(100vh - 60px);
-
-    &.uui-theme-loveship {
-        :global {
-            @include theme-loveship();
-        }
-    }
 }

app/src/sandbox/scroll-spy/ScrollSpyDemo.module.scss

@@ -1,12 +1,4 @@
-@use '~@epam/assets/theme/theme_promo' as *;
-
 .panel {
     display: flex;
     width: 100%;
-
-    &.uui-theme-promo {
-        :global {
-            @include theme-promo();
-        }
-    }
 }

app/src/sandbox/skills/SkillsBatteryPopover.module.scss

@@ -1,13 +1,5 @@
-@use '~@epam/assets/theme/theme_promo' as *;
-
 .wrapper {
     padding: 3rem 1rem 0;
-
-    &.uui-theme-promo {
-        :global {
-            @include theme-promo();
-        }
-    }
 }
 
 .target-body-container {
@@ -27,12 +19,6 @@
 .drop-container {
     width: 334px;
 
-    &.uui-theme-promo {
-        :global {
-            @include theme-promo();
-        }
-    }
-
     &:global(.uui-dropdown-body) {
         min-width: 300px;
         background-color: var(--gray5);

app/src/sandbox/tableCellStyles/TableCellsStylesSandbox.tsx

@@ -17,7 +17,6 @@ import * as loveship from '@epam/loveship';
 import * as uui from '@epam/uui';
 import { DatePickerProps } from '@epam/uui';
 import { PickerInputBaseProps } from '@epam/uui-components';
-import css from './TableCellsStylesSandbox.module.scss';
 
 // Defined interface describe data for each row
 interface Item {
@@ -304,7 +303,7 @@ export default function TableCellsStylesSandbox() {
 
     // Render the table, passing the prepared data to it in form of getRows callback, list props (e.g. items counts)
     return (
-        <skin.Panel key={ skinName } cx={ [css.wrapper, skinName !== 'uui' && css[`uui-theme-${skinName}`]] }>
+        <skin.Panel key={ skinName }>
             <skin.FlexRow>
                 <skin.FlexCell width="auto">
                     <skin.MultiSwitch