@adaptabletools/adaptable-cjs 23.0.0-canary.1 → 23.0.0-canary.2

package/index.css

@@ -6975,93 +6975,43 @@
   .ab-Datepicker-Overlay .rdp-focusable {
     cursor: pointer;
   }
-  .ab-Datepicker-Overlay {
-    @keyframes rdp-slide_in_left {
-      0% {
-        transform: translateX(-100%);
-      }
-      100% {
-        transform: translateX(0);
-      }
-    }
-    @keyframes rdp-slide_in_right {
-      0% {
-        transform: translateX(100%);
-      }
-      100% {
-        transform: translateX(0);
-      }
-    }
-    @keyframes rdp-slide_out_left {
-      0% {
-        transform: translateX(0);
-      }
-      100% {
-        transform: translateX(-100%);
-      }
-    }
-    @keyframes rdp-slide_out_right {
-      0% {
-        transform: translateX(0);
-      }
-      100% {
-        transform: translateX(100%);
-      }
-    }
-  }
+  .ab-Datepicker-Overlay {}
   .ab-Datepicker-Overlay .rdp-weeks_before_enter {
-    animation: rdp-slide_in_left var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
+    animation: ab-rdp-slide_in_left var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
   }
   .ab-Datepicker-Overlay .rdp-weeks_before_exit {
-    animation: rdp-slide_out_left var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
+    animation: ab-rdp-slide_out_left var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
   }
   .ab-Datepicker-Overlay .rdp-weeks_after_enter {
-    animation: rdp-slide_in_right var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
+    animation: ab-rdp-slide_in_right var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
   }
   .ab-Datepicker-Overlay .rdp-weeks_after_exit {
-    animation: rdp-slide_out_right var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
+    animation: ab-rdp-slide_out_right var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
   }
   .ab-Datepicker-Overlay .rdp-root[dir="rtl"] .rdp-weeks_after_enter {
-    animation: rdp-slide_in_left var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
+    animation: ab-rdp-slide_in_left var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
   }
   .ab-Datepicker-Overlay .rdp-root[dir="rtl"] .rdp-weeks_before_exit {
-    animation: rdp-slide_out_right var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
+    animation: ab-rdp-slide_out_right var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
   }
   .ab-Datepicker-Overlay .rdp-root[dir="rtl"] .rdp-weeks_before_enter {
-    animation: rdp-slide_in_right var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
+    animation: ab-rdp-slide_in_right var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
   }
   .ab-Datepicker-Overlay .rdp-root[dir="rtl"] .rdp-weeks_after_exit {
-    animation: rdp-slide_out_left var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
-  }
-  .ab-Datepicker-Overlay {
-    @keyframes rdp-fade_in {
-      from {
-        opacity: 0;
-      }
-      to {
-        opacity: 1;
-      }
-    }
-    @keyframes rdp-fade_out {
-      from {
-        opacity: 1;
-      }
-      to {
-        opacity: 0;
-      }
-    }
+    animation: ab-rdp-slide_out_left var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
   }
+  .ab-Datepicker-Overlay {}
   .ab-Datepicker-Overlay .rdp-caption_after_enter {
-    animation: rdp-fade_in var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
+    animation: ab-rdp-fade_in var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
   }
   .ab-Datepicker-Overlay .rdp-caption_after_exit {
-    animation: rdp-fade_out var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
+    animation: ab-rdp-fade_out var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
   }
   .ab-Datepicker-Overlay .rdp-caption_before_enter {
-    animation: rdp-fade_in var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
+    animation: ab-rdp-fade_in var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
   }
   .ab-Datepicker-Overlay .rdp-caption_before_exit {
-    animation: rdp-fade_out var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
+    animation: ab-rdp-fade_out var(--rdp-animation_duration) var(--rdp-animation_timing) forwards;
   }
   .ab-Datepicker-Overlay {
     border: var(--ab-cmp-datepicker__border);
@@ -8701,3 +8651,51 @@
     }
   }
 }
+@keyframes ab-rdp-slide_in_left {
+  0% {
+    transform: translateX(-100%);
+  }
+  100% {
+    transform: translateX(0);
+  }
+}
+@keyframes ab-rdp-slide_in_right {
+  0% {
+    transform: translateX(100%);
+  }
+  100% {
+    transform: translateX(0);
+  }
+}
+@keyframes ab-rdp-slide_out_left {
+  0% {
+    transform: translateX(0);
+  }
+  100% {
+    transform: translateX(-100%);
+  }
+}
+@keyframes ab-rdp-slide_out_right {
+  0% {
+    transform: translateX(0);
+  }
+  100% {
+    transform: translateX(100%);
+  }
+}
+@keyframes ab-rdp-fade_in {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+@keyframes ab-rdp-fade_out {
+  from {
+    opacity: 1;
+  }
+  to {
+    opacity: 0;
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adaptabletools/adaptable-cjs",
-  "version": "23.0.0-canary.1",
+  "version": "23.0.0-canary.2",
   "description": "Powerful data-agnostic HTML5 AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements",
   "keywords": [
     "web-components",

package/src/AdaptableState/LayoutState.d.ts

@@ -44,6 +44,10 @@ export interface LayoutState extends BaseState {
 /**
  * Base object for both Table and Pivot Layouts
  */
+/**
+ * How row groups are displayed in a Layout (maps to AG Grid `groupDisplayType`).
+ */
+export type RowGroupDisplayType = 'single' | 'multi' | 'groupRows';
 export interface LayoutBase extends AdaptableObject {
     /**
      * Name of the Layout as it appears in the Layout toolbar and tool panel
@@ -101,10 +105,7 @@ export interface LayoutBase extends AdaptableObject {
      * Position of the Grand Total Row in the Layout
      */
     GrandTotalRow?: 'top' | 'bottom' | 'pinnedTop' | 'pinnedBottom' | boolean;
-    /**
-     * Display Row Grouped Columns as 'single' or 'multi' column
-     */
-    RowGroupDisplayType?: 'single' | 'multi';
+    RowGroupDisplayType?: RowGroupDisplayType;
 }
 /**
  * Defines a Table-based Layout

package/src/AdaptableState/StyledColumnState.d.ts

@@ -1,6 +1,6 @@
 import { BaseState } from './BaseState';
 import { AdaptablePredicate, AdaptableBooleanQuery, AdaptableIcon } from '../types';
-import { CellBoxStyle, CellFontStyle } from './Common/AdaptableStyle';
+import { AdaptableStyle, CellBoxStyle, CellFontStyle } from './Common/AdaptableStyle';
 import { TypeHint } from './Common/Types';
 import { RowScope } from './Common/RowScope';
 import { AgSparklineOptions } from 'ag-charts-types';
@@ -367,23 +367,14 @@ export type SystemBadgeStylePredicateIds = SystemBadgeStylePredicateId[];
 export interface BadgeStylePredicate extends AdaptablePredicate {
     PredicateId: TypeHint<string, SystemBadgeStylePredicateId>;
 }
+/** Keys copied from legacy `BadgeStyleDefinition.Style` (`AdaptableStyle`) into `PillStyle`. */
+export declare const BADGE_PILL_STYLE_KEYS: readonly ["BackColor", "ForeColor", "BorderColor", "FontWeight", "FontStyle", "TextDecoration"];
 /**
- * Visual styling applied to a single Badge "pill" (subset of `AdaptableStyle`)
+ * Visual styling applied to a single Badge pill — an explicit subset of
+ * {@link AdaptableStyle}. Not used: `BorderRadius` ({@link BadgeShape}),
+ * `Alignment` / `FontSize` / `ClassName` (column-level or unsupported).
  */
-export interface BadgePillStyle {
-    /** Pill background colour. */
-    BackColor?: string;
-    /** Pill text/icon colour. */
-    ForeColor?: string;
-    /** Pill border colour (a subtle 1px border is drawn when set). */
-    BorderColor?: string;
-    /** Whether the pill text is bold. */
-    FontWeight?: 'Normal' | 'Bold';
-    /** Whether the pill text is italic. */
-    FontStyle?: 'Normal' | 'Italic';
-    /** Optional decoration (underline / line-through / overline). */
-    TextDecoration?: 'None' | 'Underline' | 'Overline' | 'LineThrough';
-}
+export type BadgePillStyle = Pick<AdaptableStyle, (typeof BADGE_PILL_STYLE_KEYS)[number]>;
 /**
  * Visual shape of a Badge; convenience shorthand that resolves to a border radius without having to pick a pixel value
  */

package/src/AdaptableState/StyledColumnState.js

@@ -1,2 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.BADGE_PILL_STYLE_KEYS = void 0;
+/** Keys copied from legacy `BadgeStyleDefinition.Style` (`AdaptableStyle`) into `PillStyle`. */
+exports.BADGE_PILL_STYLE_KEYS = [
+    'BackColor',
+    'ForeColor',
+    'BorderColor',
+    'FontWeight',
+    'FontStyle',
+    'TextDecoration',
+];

package/src/View/Layout/Wizard/sections/ColumnsSection.js

@@ -194,7 +194,7 @@ const ColumnsSection = (props) => {
         if (layout.RowGroupDisplayType === 'single') {
             allColumns.unshift((0, ColumnApiImpl_1.generateAutoRowGroupSingleColumn)());
         }
-        else {
+        else if (layout.RowGroupDisplayType === 'multi') {
             [...layout.RowGroupedColumns].reverse().forEach((col) => {
                 const groupCol = (0, ColumnApiImpl_1.generateAutoRowGroupColumnForColumn)(adaptable.api.columnApi.getColumnWithColumnId(col));
                 allColumns.unshift(groupCol);

package/src/View/Layout/Wizard/sections/RowGroupingSection.js

@@ -79,10 +79,14 @@ const RowGroupingSection = (props) => {
                                     if (RowGroupDisplayType === 'single') {
                                         newLayout.TableColumns = (newLayout.TableColumns || []).filter((colId) => !adaptable.api.columnApi.isAutoRowGroupColumnForMulti(colId));
                                     }
-                                    else {
+                                    else if (RowGroupDisplayType === 'multi') {
                                         newLayout.TableColumns = (newLayout.TableColumns || []).filter((colId) => !adaptable.api.columnApi.isAutoRowGroupColumnForSingle(colId));
                                     }
+                                    else {
+                                        newLayout.TableColumns = (newLayout.TableColumns || []).filter((colId) => !adaptable.api.columnApi.isAutoRowGroupColumnForSingle(colId) &&
+                                            !adaptable.api.columnApi.isAutoRowGroupColumnForMulti(colId));
+                                    }
                                     onChange(newLayout);
-                                }, children: [(0, jsx_runtime_1.jsx)(TypeRadio_1.TypeRadio, { value: "single", text: "Single Column", description: "All Row Grouped Columns display in one hierarchical Column" }), (0, jsx_runtime_1.jsx)(TypeRadio_1.TypeRadio, { value: "multi", text: "Multiple Columns", description: "Each Row Grouped Column displays in its own, separate, Column" })] }) }) })] }), (0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { className: "twa:mt-2", children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { children: "Row Grouped Columns" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { children: rowGroupsText }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { children: (0, jsx_runtime_1.jsx)(ValueSelector_1.ValueSelector, { showFilterInput: true, filter: Utilities_1.columnFilter, toIdentifier: (option) => `${option.columnId}`, toLabel: (option) => option.friendlyName ?? option.columnId, toListLabel: (option) => ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { alignItems: "center", children: [option.friendlyName ?? option.columnId, (0, jsx_runtime_1.jsx)(ColumnGroupTag_1.ColumnGroupTag, { column: option })] })), options: sortedGroupableColumns, value: layout.RowGroupedColumns ?? [], allowReorder: true, onChange: handleColumnsChange }) }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { children: (0, jsx_runtime_1.jsx)(exports.RowGroupBehaviorSection, { layout: layout, onChange: onChange }) })] })] }));
+                                }, children: [(0, jsx_runtime_1.jsx)(TypeRadio_1.TypeRadio, { value: "single", text: "Single Column", description: "All Row Grouped Columns display in one hierarchical Column" }), (0, jsx_runtime_1.jsx)(TypeRadio_1.TypeRadio, { value: "multi", text: "Multiple Columns", description: "Each Row Grouped Column displays in its own, separate, Column" }), (0, jsx_runtime_1.jsx)(TypeRadio_1.TypeRadio, { value: "groupRows", text: "Full Width Group Rows", description: "Row groups display as full-width rows (no group column and no aggregations)" })] }) }) })] }), (0, jsx_runtime_1.jsxs)(Tabs_1.Tabs, { className: "twa:mt-2", children: [(0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { children: "Row Grouped Columns" }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Tab, { children: rowGroupsText }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { children: (0, jsx_runtime_1.jsx)(ValueSelector_1.ValueSelector, { showFilterInput: true, filter: Utilities_1.columnFilter, toIdentifier: (option) => `${option.columnId}`, toLabel: (option) => option.friendlyName ?? option.columnId, toListLabel: (option) => ((0, jsx_runtime_1.jsxs)(Flex_1.Flex, { alignItems: "center", children: [option.friendlyName ?? option.columnId, (0, jsx_runtime_1.jsx)(ColumnGroupTag_1.ColumnGroupTag, { column: option })] })), options: sortedGroupableColumns, value: layout.RowGroupedColumns ?? [], allowReorder: true, onChange: handleColumnsChange }) }), (0, jsx_runtime_1.jsx)(Tabs_1.Tabs.Content, { children: (0, jsx_runtime_1.jsx)(exports.RowGroupBehaviorSection, { layout: layout, onChange: onChange }) })] })] }));
 };
 exports.RowGroupingSection = RowGroupingSection;

package/src/agGrid/AdaptableAgGrid.js

@@ -100,6 +100,7 @@ const FlashingCellService_1 = require("../Utilities/Services/FlashingCellService
 const AgGridExportAdapter_1 = require("./AgGridExportAdapter");
 const LayoutHelpers_1 = require("../Api/Implementation/LayoutHelpers");
 const src_1 = require("../layout-manager/src");
+const rowGroupDisplayType_1 = require("../layout-manager/src/rowGroupDisplayType");
 const isPivotLayoutModel_1 = require("../layout-manager/src/isPivotLayoutModel");
 const AdaptableColumn_1 = require("../AdaptableState/Common/AdaptableColumn");
 const agGridDataTypeDefinitions_1 = require("./agGridDataTypeDefinitions");
@@ -465,8 +466,7 @@ class AdaptableAgGrid {
             if ((0, isPivotLayoutModel_1.isPivotLayoutModel)(layoutModel)) {
                 gridOptions.pivotDefaultExpanded = layoutModel.PivotExpandLevel;
             }
-            gridOptions.groupDisplayType =
-                layoutModel.RowGroupDisplayType === 'multi' ? 'multipleColumns' : 'singleColumn';
+            gridOptions.groupDisplayType = (0, rowGroupDisplayType_1.rowGroupDisplayTypeToGridOption)(layoutModel.RowGroupDisplayType);
             // fixes issue #3053
             gridOptions.suppressAggFuncInHeader = !!layoutModel.SuppressAggFuncInHeader;
             if (!(0, isPivotLayoutModel_1.isPivotLayoutModel)(layoutModel) &&

package/src/components/ui/calendar.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { DayPicker } from 'react-day-picker';
-import { Button } from "./button";
+import { Button } from './button';
 declare function Calendar({ className, classNames, showOutsideDays, captionLayout, buttonVariant, locale, formatters, components, ...props }: React.ComponentProps<typeof DayPicker> & {
     buttonVariant?: React.ComponentProps<typeof Button>['variant'];
 }): React.JSX.Element;

package/src/components/ui/input-group.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { type VariantProps } from 'class-variance-authority';
-import { Button } from "./button";
+import { Button } from './button';
 declare function InputGroup({ className, ...props }: React.ComponentProps<'div'>): React.JSX.Element;
 declare const inputGroupAddonVariants: (props?: {
     align?: "inline-end" | "inline-start" | "block-end" | "block-start";

package/src/env.js

@@ -2,6 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = {
     NEXT_PUBLIC_INFINITE_TABLE_LICENSE_KEY: "StartDate=2021-06-29|EndDate=2030-01-01|Owner=Adaptable|Type=distribution|TS=1624971462479|C=137829811,1004007071,2756196225,1839832928,3994409405,636616862" || '',
-    PUBLISH_TIMESTAMP: 1780401819925 || Date.now(),
-    VERSION: "23.0.0-canary.1" || '--current-version--',
+    PUBLISH_TIMESTAMP: 1780405607097 || Date.now(),
+    VERSION: "23.0.0-canary.2" || '--current-version--',
 };

package/src/layout-manager/src/LayoutManagerModel.d.ts

@@ -1,4 +1,4 @@
-import { ColumnSizingMap, LayoutRowSelection } from '../../AdaptableState/LayoutState';
+import { ColumnSizingMap, LayoutRowSelection, RowGroupDisplayType } from '../../AdaptableState/LayoutState';
 import { XOR } from '../../Utilities/Extensions/TypeExtensions';
 /**
  * Defines how a Column is sorted
@@ -17,7 +17,7 @@ export interface BaseLayoutModel {
     /**
      * @defaultValue 'single'
      */
-    RowGroupDisplayType?: 'single' | 'multi';
+    RowGroupDisplayType?: RowGroupDisplayType;
     /**
      * Those are not actually used by the LayoutManager,
      * but we need to keep them here so we can give the layout

package/src/layout-manager/src/index.js

@@ -5,6 +5,7 @@ const infinite_react_1 = require("@infinite-table/infinite-react");
 const isPivotLayoutModel_1 = require("./isPivotLayoutModel");
 const LMEmitter_1 = require("./LMEmitter");
 const normalizeLayoutModel_1 = require("./normalizeLayoutModel");
+const rowGroupDisplayType_1 = require("./rowGroupDisplayType");
 const isLayoutEqual_1 = require("./isLayoutEqual");
 const simplifyLayoutModel_1 = require("./simplifyLayoutModel");
 const sortColumnIdsByOrder_1 = require("./sortColumnIdsByOrder");
@@ -555,7 +556,7 @@ class LayoutManager extends LMEmitter_1.LMEmitter {
                 if (groupDisplayType === 'singleColumn') {
                     colsInLayout.add(normalizeLayoutModel_1.AUTO_GROUP_COLUMN_ID__SINGLE);
                 }
-                else {
+                else if (groupDisplayType === 'multipleColumns') {
                     this.currentLayout.RowGroupedColumns.forEach((colId) => {
                         colsInLayout.add(`${normalizeLayoutModel_1.AUTO_GROUP_COLUMN_ID__MULTI_PREFIX}${colId}`);
                     });
@@ -763,7 +764,7 @@ class LayoutManager extends LMEmitter_1.LMEmitter {
             ColumnGroupValues,
             GrandTotalRow: this.gridApi.getGridOption('grandTotalRow'),
             SuppressAggFuncInHeader: this.gridApi.getGridOption('suppressAggFuncInHeader'),
-            RowGroupDisplayType: this.gridApi.getGridOption('groupDisplayType') === 'multipleColumns' ? 'multi' : 'single',
+            RowGroupDisplayType: (0, rowGroupDisplayType_1.gridOptionToRowGroupDisplayType)(this.gridApi.getGridOption('groupDisplayType')),
             RowSelection: this.getRowSelectionFromGrid(),
         });
         return layout;
@@ -1317,7 +1318,7 @@ class LayoutManager extends LMEmitter_1.LMEmitter {
             // this.gridApi.applyColumnState(state);
             const hasGroupedColumns = layout.RowGroupedColumns && layout.RowGroupedColumns.length;
             if (hasGroupedColumns) {
-                const displayTypeFromLayout = layout.RowGroupDisplayType === 'multi' ? 'multipleColumns' : 'singleColumn';
+                const displayTypeFromLayout = (0, rowGroupDisplayType_1.rowGroupDisplayTypeToGridOption)(layout.RowGroupDisplayType);
                 const groupDisplayType = this.gridApi.getGridOption('groupDisplayType');
                 if (groupDisplayType !== displayTypeFromLayout) {
                     this.gridApi.setGridOption('groupDisplayType', displayTypeFromLayout);
@@ -1680,7 +1681,7 @@ class LayoutManager extends LMEmitter_1.LMEmitter {
             this.applyPivotTotals(layout);
             const hasGroupedColumns = layout.PivotGroupedColumns && !!layout.PivotGroupedColumns.length;
             if (hasGroupedColumns) {
-                const displayTypeFromLayout = layout.RowGroupDisplayType === 'multi' ? 'multipleColumns' : 'singleColumn';
+                const displayTypeFromLayout = (0, rowGroupDisplayType_1.rowGroupDisplayTypeToGridOption)(layout.RowGroupDisplayType);
                 const groupDisplayType = this.gridApi.getGridOption('groupDisplayType');
                 if (groupDisplayType !== displayTypeFromLayout) {
                     this.gridApi.setGridOption('groupDisplayType', displayTypeFromLayout);

package/src/layout-manager/src/normalizeLayoutModel.js

@@ -5,6 +5,7 @@ exports.normalizeTableLayoutModel = normalizeTableLayoutModel;
 exports.normalizePivotLayoutModel = normalizePivotLayoutModel;
 exports.normalizeLayoutModel = normalizeLayoutModel;
 const isPivotLayoutModel_1 = require("./isPivotLayoutModel");
+const rowGroupDisplayType_1 = require("./rowGroupDisplayType");
 exports.AUTO_GROUP_COLUMN_ID__SINGLE = 'ag-Grid-AutoColumn';
 exports.AUTO_GROUP_COLUMN_ID__MULTI_PREFIX = 'ag-Grid-AutoColumn-';
 function normalizeTableLayoutModel(layout, options) {
@@ -66,7 +67,10 @@ function normalizeTableLayoutModel(layout, options) {
             displayType = displayType || 'single';
             layout.RowGroupDisplayType = displayType;
         }
-        if (displayType === 'single') {
+        if (displayType === 'groupRows') {
+            layout.TableColumns = layout.TableColumns.filter((colId) => !(0, rowGroupDisplayType_1.isRowGroupAutoColumnId)(colId));
+        }
+        else if (displayType === 'single') {
             if (!ColumnOrderSet.has(exports.AUTO_GROUP_COLUMN_ID__SINGLE)) {
                 layout.TableColumns = [exports.AUTO_GROUP_COLUMN_ID__SINGLE, ...layout.TableColumns];
             }

package/src/layout-manager/src/rowGroupDisplayType.d.ts

@@ -0,0 +1,6 @@
+import { GridOptions } from 'ag-grid-enterprise';
+import { RowGroupDisplayType } from '../../AdaptableState/LayoutState';
+export type { RowGroupDisplayType };
+export declare function rowGroupDisplayTypeToGridOption(displayType: RowGroupDisplayType | undefined): GridOptions['groupDisplayType'];
+export declare function gridOptionToRowGroupDisplayType(groupDisplayType: GridOptions['groupDisplayType'] | undefined): RowGroupDisplayType;
+export declare function isRowGroupAutoColumnId(colId: string): boolean;

package/src/layout-manager/src/rowGroupDisplayType.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.rowGroupDisplayTypeToGridOption = rowGroupDisplayTypeToGridOption;
+exports.gridOptionToRowGroupDisplayType = gridOptionToRowGroupDisplayType;
+exports.isRowGroupAutoColumnId = isRowGroupAutoColumnId;
+const normalizeLayoutModel_1 = require("./normalizeLayoutModel");
+function rowGroupDisplayTypeToGridOption(displayType) {
+    switch (displayType ?? 'single') {
+        case 'multi':
+            return 'multipleColumns';
+        case 'groupRows':
+            return 'groupRows';
+        case 'single':
+        default:
+            return 'singleColumn';
+    }
+}
+function gridOptionToRowGroupDisplayType(groupDisplayType) {
+    if (groupDisplayType === 'multipleColumns') {
+        return 'multi';
+    }
+    if (groupDisplayType === 'groupRows') {
+        return 'groupRows';
+    }
+    return 'single';
+}
+function isRowGroupAutoColumnId(colId) {
+    return colId === normalizeLayoutModel_1.AUTO_GROUP_COLUMN_ID__SINGLE || colId.startsWith(normalizeLayoutModel_1.AUTO_GROUP_COLUMN_ID__MULTI_PREFIX);
+}

package/src/metamodel/adaptable.metamodel.d.ts

@@ -1138,11 +1138,6 @@ export declare const ADAPTABLE_METAMODEL: {
     };
     BadgePillStyle: {
         k: string;
-        p: {
-            n: string;
-            k: string;
-            o: boolean;
-        }[];
     };
     BadgeShape: {
         k: string;
@@ -3552,25 +3547,6 @@ export declare const ADAPTABLE_METAMODEL: {
     LayoutArray: {
         k: string;
     };
-    LayoutBase: {
-        k: string;
-        p: ({
-            n: string;
-            k: string;
-            o: boolean;
-            r?: undefined;
-        } | {
-            n: string;
-            k: string;
-            o: boolean;
-            r: string;
-        } | {
-            n: string;
-            k: string;
-            o?: undefined;
-            r?: undefined;
-        })[];
-    };
     LayoutChangedAction: {
         k: string;
     };