@syncfusion/ej2-angular-ribbon 23.2.5 → 23.2.7-ngcc

package/schematics/utils/lib-details.ts

@@ -0,0 +1,4 @@
+export const pkgName = '@syncfusion/ej2-angular-ribbon';
+export const pkgVer = '^23.2.7';
+export const moduleName = 'RibbonModule';
+export const themeVer = '~23.2.7';

package/src/ribbon/collections.directive.d.ts

@@ -1,6 +1,5 @@
 import { ViewContainerRef } from '@angular/core';
 import { ComplexBase, ArrayBase } from '@syncfusion/ej2-angular-base';
-import * as i0 from "@angular/core";
 /**
  * `e-ribbon-collection` directive represent a collection in the Angular Ribbon.
  * ```html
@@ -43,8 +42,6 @@ export declare class RibbonCollectionDirective extends ComplexBase<RibbonCollect
      */
     items: any;
     constructor(viewContainerRef: ViewContainerRef);
-    static ɵfac: i0.ɵɵFactoryDeclaration<RibbonCollectionDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<RibbonCollectionDirective, "e-ribbon-collection", never, { "cssClass": "cssClass"; "id": "id"; "items": "items"; }, {}, ["childItems"]>;
 }
 /**
  * RibbonCollection Array Directive
@@ -52,6 +49,4 @@ export declare class RibbonCollectionDirective extends ComplexBase<RibbonCollect
  */
 export declare class RibbonCollectionsDirective extends ArrayBase<RibbonCollectionsDirective> {
     constructor();
-    static ɵfac: i0.ɵɵFactoryDeclaration<RibbonCollectionsDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<RibbonCollectionsDirective, "e-ribbon-collections", never, {}, {}, ["children"]>;
 }

package/src/ribbon/groups.directive.d.ts

@@ -1,6 +1,5 @@
 import { ViewContainerRef } from '@angular/core';
 import { ComplexBase, ArrayBase } from '@syncfusion/ej2-angular-base';
-import * as i0 from "@angular/core";
 /**
  * `e-ribbon-group` directive represent a group in the Angular Ribbon.
  * ```html
@@ -84,8 +83,6 @@ export declare class RibbonGroupDirective extends ComplexBase<RibbonGroupDirecti
      */
     showLauncherIcon: any;
     constructor(viewContainerRef: ViewContainerRef);
-    static ɵfac: i0.ɵɵFactoryDeclaration<RibbonGroupDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<RibbonGroupDirective, "e-ribbon-group", never, { "collections": "collections"; "cssClass": "cssClass"; "enableGroupOverflow": "enableGroupOverflow"; "groupIconCss": "groupIconCss"; "header": "header"; "id": "id"; "isCollapsed": "isCollapsed"; "isCollapsible": "isCollapsible"; "orientation": "orientation"; "priority": "priority"; "showLauncherIcon": "showLauncherIcon"; }, {}, ["childCollections"]>;
 }
 /**
  * RibbonGroup Array Directive
@@ -93,6 +90,4 @@ export declare class RibbonGroupDirective extends ComplexBase<RibbonGroupDirecti
  */
 export declare class RibbonGroupsDirective extends ArrayBase<RibbonGroupsDirective> {
     constructor();
-    static ɵfac: i0.ɵɵFactoryDeclaration<RibbonGroupsDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<RibbonGroupsDirective, "e-ribbon-groups", never, {}, {}, ["children"]>;
 }

package/src/ribbon/items.directive.d.ts

@@ -1,6 +1,5 @@
 import { ViewContainerRef } from '@angular/core';
 import { ComplexBase, ArrayBase } from '@syncfusion/ej2-angular-base';
-import * as i0 from "@angular/core";
 /**
  * `e-ribbon-item` directive represent a item in the Angular Ribbon.
  * ```html
@@ -119,8 +118,6 @@ export declare class RibbonItemDirective extends ComplexBase<RibbonItemDirective
      */
     itemTemplate: any;
     constructor(viewContainerRef: ViewContainerRef);
-    static ɵfac: i0.ɵɵFactoryDeclaration<RibbonItemDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<RibbonItemDirective, "e-ribbon-item", never, { "activeSize": "activeSize"; "allowedSizes": "allowedSizes"; "buttonSettings": "buttonSettings"; "checkBoxSettings": "checkBoxSettings"; "colorPickerSettings": "colorPickerSettings"; "comboBoxSettings": "comboBoxSettings"; "cssClass": "cssClass"; "disabled": "disabled"; "displayOptions": "displayOptions"; "dropDownSettings": "dropDownSettings"; "groupButtonSettings": "groupButtonSettings"; "id": "id"; "itemTemplate": "itemTemplate"; "ribbonTooltipSettings": "ribbonTooltipSettings"; "splitButtonSettings": "splitButtonSettings"; "type": "type"; }, {}, ["itemTemplate"]>;
 }
 /**
  * RibbonItem Array Directive
@@ -128,6 +125,4 @@ export declare class RibbonItemDirective extends ComplexBase<RibbonItemDirective
  */
 export declare class RibbonItemsDirective extends ArrayBase<RibbonItemsDirective> {
     constructor();
-    static ɵfac: i0.ɵɵFactoryDeclaration<RibbonItemsDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<RibbonItemsDirective, "e-ribbon-items", never, {}, {}, ["children"]>;
 }

package/src/ribbon/ribbon-all.module.d.ts

@@ -1,7 +1,4 @@
 import { ValueProvider } from '@angular/core';
-import * as i0 from "@angular/core";
-import * as i1 from "@angular/common";
-import * as i2 from "./ribbon.module";
 export declare const RibbonButtonService: ValueProvider;
 export declare const RibbonDropDownService: ValueProvider;
 export declare const RibbonSplitButtonService: ValueProvider;
@@ -15,7 +12,4 @@ export declare const RibbonBackstageService: ValueProvider;
  * NgModule definition for the Ribbon component with providers.
  */
 export declare class RibbonAllModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<RibbonAllModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<RibbonAllModule, never, [typeof i1.CommonModule, typeof i2.RibbonModule], [typeof i2.RibbonModule]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<RibbonAllModule>;
 }

package/src/ribbon/ribbon.component.d.ts

@@ -2,7 +2,6 @@ import { ElementRef, ViewContainerRef, Renderer2, Injector, QueryList } from '@a
 import { IComponentBase } from '@syncfusion/ej2-angular-base';
 import { Ribbon } from '@syncfusion/ej2-ribbon';
 import { RibbonTabsDirective } from './tabs.directive';
-import * as i0 from "@angular/core";
 export declare const inputs: string[];
 export declare const outputs: string[];
 export declare const twoWays: string[];
@@ -21,6 +20,8 @@ export declare class RibbonComponent extends Ribbon implements IComponentBase {
     tagObjects: any;
     created: any;
     launcherIconClick: any;
+    overflowPopupClose: any;
+    overflowPopupOpen: any;
     ribbonCollapsing: any;
     ribbonExpanding: any;
     tabSelected: any;
@@ -44,6 +45,4 @@ export declare class RibbonComponent extends Ribbon implements IComponentBase {
     ngAfterContentChecked(): void;
     registerEvents: (eventList: string[]) => void;
     addTwoWay: (propList: string[]) => void;
-    static ɵfac: i0.ɵɵFactoryDeclaration<RibbonComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<RibbonComponent, "ejs-ribbon", never, { "activeLayout": "activeLayout"; "backStageMenu": "backStageMenu"; "cssClass": "cssClass"; "enablePersistence": "enablePersistence"; "enableRtl": "enableRtl"; "fileMenu": "fileMenu"; "helpPaneTemplate": "helpPaneTemplate"; "hideLayoutSwitcher": "hideLayoutSwitcher"; "isMinimized": "isMinimized"; "launcherIconCss": "launcherIconCss"; "locale": "locale"; "selectedTab": "selectedTab"; "tabAnimation": "tabAnimation"; "tabs": "tabs"; "width": "width"; }, { "created": "created"; "launcherIconClick": "launcherIconClick"; "ribbonCollapsing": "ribbonCollapsing"; "ribbonExpanding": "ribbonExpanding"; "tabSelected": "tabSelected"; "tabSelecting": "tabSelecting"; }, ["helpPaneTemplate", "childTabs"], ["div"]>;
 }

package/src/ribbon/ribbon.module.d.ts

@@ -1,15 +1,5 @@
-import * as i0 from "@angular/core";
-import * as i1 from "./ribbon.component";
-import * as i2 from "./items.directive";
-import * as i3 from "./collections.directive";
-import * as i4 from "./groups.directive";
-import * as i5 from "./tabs.directive";
-import * as i6 from "@angular/common";
 /**
  * NgModule definition for the Ribbon component.
  */
 export declare class RibbonModule {
-    static ɵfac: i0.ɵɵFactoryDeclaration<RibbonModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<RibbonModule, [typeof i1.RibbonComponent, typeof i2.RibbonItemDirective, typeof i2.RibbonItemsDirective, typeof i3.RibbonCollectionDirective, typeof i3.RibbonCollectionsDirective, typeof i4.RibbonGroupDirective, typeof i4.RibbonGroupsDirective, typeof i5.RibbonTabDirective, typeof i5.RibbonTabsDirective], [typeof i6.CommonModule], [typeof i1.RibbonComponent, typeof i2.RibbonItemDirective, typeof i2.RibbonItemsDirective, typeof i3.RibbonCollectionDirective, typeof i3.RibbonCollectionsDirective, typeof i4.RibbonGroupDirective, typeof i4.RibbonGroupsDirective, typeof i5.RibbonTabDirective, typeof i5.RibbonTabsDirective]>;
-    static ɵinj: i0.ɵɵInjectorDeclaration<RibbonModule>;
 }

package/src/ribbon/tabs.directive.d.ts

@@ -1,6 +1,5 @@
 import { ViewContainerRef } from '@angular/core';
 import { ComplexBase, ArrayBase } from '@syncfusion/ej2-angular-base';
-import * as i0 from "@angular/core";
 /**
  * `e-ribbon-tab` directive represent a tab of the Angular Ribbon.
  * It must be contained in a Ribbon component(`ejs-ribbon`).
@@ -40,8 +39,6 @@ export declare class RibbonTabDirective extends ComplexBase<RibbonTabDirective>
      */
     id: any;
     constructor(viewContainerRef: ViewContainerRef);
-    static ɵfac: i0.ɵɵFactoryDeclaration<RibbonTabDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<RibbonTabDirective, "e-ribbon-tab", never, { "cssClass": "cssClass"; "groups": "groups"; "header": "header"; "id": "id"; }, {}, ["childGroups"]>;
 }
 /**
  * RibbonTab Array Directive
@@ -49,6 +46,4 @@ export declare class RibbonTabDirective extends ComplexBase<RibbonTabDirective>
  */
 export declare class RibbonTabsDirective extends ArrayBase<RibbonTabsDirective> {
     constructor();
-    static ɵfac: i0.ɵɵFactoryDeclaration<RibbonTabsDirective, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<RibbonTabsDirective, "e-ribbon-tabs", never, {}, {}, ["children"]>;
 }

package/styles/bootstrap-dark.css

@@ -298,6 +298,10 @@
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn:focus {
   outline: none;
 }
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-hidden,
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn.e-hidden {
+  display: none;
+}
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn {
   bottom: 4px;
   position: absolute;
@@ -349,7 +353,7 @@
   padding-top: 6px;
   height: 140px;
 }
-.e-ribbon.e-rbn .e-ribbon-group.e-hidden {
+.e-ribbon.e-rbn .e-ribbon-group.e-hidden, .e-ribbon.e-rbn .e-ribbon-group.e-hide-group {
   display: none;
 }
 .e-ribbon.e-rbn .e-ribbon-group.e-disabled {
@@ -850,13 +854,13 @@
 .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
   display: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-disabled {
   pointer-events: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-disabled {

package/styles/bootstrap.css

@@ -303,6 +303,10 @@
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn:focus {
   outline: none;
 }
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-hidden,
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn.e-hidden {
+  display: none;
+}
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn {
   bottom: 4px;
   position: absolute;
@@ -354,7 +358,7 @@
   padding-top: 6px;
   height: 140px;
 }
-.e-ribbon.e-rbn .e-ribbon-group.e-hidden {
+.e-ribbon.e-rbn .e-ribbon-group.e-hidden, .e-ribbon.e-rbn .e-ribbon-group.e-hide-group {
   display: none;
 }
 .e-ribbon.e-rbn .e-ribbon-group.e-disabled {
@@ -855,13 +859,13 @@
 .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
   display: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-disabled {
   pointer-events: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-disabled {

package/styles/bootstrap4.css

@@ -364,6 +364,10 @@
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn:focus {
   outline: none;
 }
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-hidden,
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn.e-hidden {
+  display: none;
+}
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn {
   bottom: 4px;
   position: absolute;
@@ -415,7 +419,7 @@
   padding-top: 6px;
   height: 134px;
 }
-.e-ribbon.e-rbn .e-ribbon-group.e-hidden {
+.e-ribbon.e-rbn .e-ribbon-group.e-hidden, .e-ribbon.e-rbn .e-ribbon-group.e-hide-group {
   display: none;
 }
 .e-ribbon.e-rbn .e-ribbon-group.e-disabled {
@@ -916,13 +920,13 @@
 .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
   display: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-disabled {
   pointer-events: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-disabled {

package/styles/bootstrap5-dark.css

@@ -382,6 +382,10 @@
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn:focus {
   outline: none;
 }
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-hidden,
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn.e-hidden {
+  display: none;
+}
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn {
   bottom: 3px;
   position: absolute;
@@ -433,7 +437,7 @@
   padding-top: 6px;
   height: 120px;
 }
-.e-ribbon.e-rbn .e-ribbon-group.e-hidden {
+.e-ribbon.e-rbn .e-ribbon-group.e-hidden, .e-ribbon.e-rbn .e-ribbon-group.e-hide-group {
   display: none;
 }
 .e-ribbon.e-rbn .e-ribbon-group.e-disabled {
@@ -934,13 +938,13 @@
 .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
   display: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-disabled {
   pointer-events: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-disabled {

package/styles/bootstrap5.css

@@ -382,6 +382,10 @@
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn:focus {
   outline: none;
 }
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-hidden,
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn.e-hidden {
+  display: none;
+}
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn {
   bottom: 3px;
   position: absolute;
@@ -433,7 +437,7 @@
   padding-top: 6px;
   height: 120px;
 }
-.e-ribbon.e-rbn .e-ribbon-group.e-hidden {
+.e-ribbon.e-rbn .e-ribbon-group.e-hidden, .e-ribbon.e-rbn .e-ribbon-group.e-hide-group {
   display: none;
 }
 .e-ribbon.e-rbn .e-ribbon-group.e-disabled {
@@ -934,13 +938,13 @@
 .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
   display: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-disabled {
   pointer-events: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-disabled {

package/styles/fabric-dark.css

@@ -274,6 +274,10 @@
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn:focus {
   outline: none;
 }
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-hidden,
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn.e-hidden {
+  display: none;
+}
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn {
   bottom: 0;
   position: absolute;
@@ -325,7 +329,7 @@
   padding-top: 6px;
   height: 135px;
 }
-.e-ribbon.e-rbn .e-ribbon-group.e-hidden {
+.e-ribbon.e-rbn .e-ribbon-group.e-hidden, .e-ribbon.e-rbn .e-ribbon-group.e-hide-group {
   display: none;
 }
 .e-ribbon.e-rbn .e-ribbon-group.e-disabled {
@@ -826,13 +830,13 @@
 .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
   display: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-disabled {
   pointer-events: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-disabled {

package/styles/fabric.css

@@ -272,6 +272,10 @@
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn:focus {
   outline: none;
 }
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-hidden,
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn.e-hidden {
+  display: none;
+}
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn {
   bottom: 0;
   position: absolute;
@@ -323,7 +327,7 @@
   padding-top: 4px;
   height: 133px;
 }
-.e-ribbon.e-rbn .e-ribbon-group.e-hidden {
+.e-ribbon.e-rbn .e-ribbon-group.e-hidden, .e-ribbon.e-rbn .e-ribbon-group.e-hide-group {
   display: none;
 }
 .e-ribbon.e-rbn .e-ribbon-group.e-disabled {
@@ -824,13 +828,13 @@
 .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
   display: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-disabled {
   pointer-events: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-disabled {

package/styles/fluent-dark.css

@@ -358,6 +358,10 @@
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn:focus {
   outline: none;
 }
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-hidden,
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn.e-hidden {
+  display: none;
+}
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn {
   bottom: 3px;
   position: absolute;
@@ -409,7 +413,7 @@
   padding-top: 6px;
   height: 120px;
 }
-.e-ribbon.e-rbn .e-ribbon-group.e-hidden {
+.e-ribbon.e-rbn .e-ribbon-group.e-hidden, .e-ribbon.e-rbn .e-ribbon-group.e-hide-group {
   display: none;
 }
 .e-ribbon.e-rbn .e-ribbon-group.e-disabled {
@@ -910,13 +914,13 @@
 .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
   display: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-disabled {
   pointer-events: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-disabled {

package/styles/fluent.css

@@ -358,6 +358,10 @@
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn:focus {
   outline: none;
 }
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-hidden,
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn.e-hidden {
+  display: none;
+}
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn {
   bottom: 3px;
   position: absolute;
@@ -409,7 +413,7 @@
   padding-top: 6px;
   height: 120px;
 }
-.e-ribbon.e-rbn .e-ribbon-group.e-hidden {
+.e-ribbon.e-rbn .e-ribbon-group.e-hidden, .e-ribbon.e-rbn .e-ribbon-group.e-hide-group {
   display: none;
 }
 .e-ribbon.e-rbn .e-ribbon-group.e-disabled {
@@ -910,13 +914,13 @@
 .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
   display: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-disabled {
   pointer-events: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-disabled {

package/styles/highcontrast-light.css

@@ -281,6 +281,10 @@
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn:focus {
   outline: none;
 }
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-hidden,
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn.e-hidden {
+  display: none;
+}
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn {
   bottom: 0;
   position: absolute;
@@ -332,7 +336,7 @@
   padding-top: 6px;
   height: 147px;
 }
-.e-ribbon.e-rbn .e-ribbon-group.e-hidden {
+.e-ribbon.e-rbn .e-ribbon-group.e-hidden, .e-ribbon.e-rbn .e-ribbon-group.e-hide-group {
   display: none;
 }
 .e-ribbon.e-rbn .e-ribbon-group.e-disabled {
@@ -833,13 +837,13 @@
 .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
   display: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-disabled {
   pointer-events: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-disabled {

package/styles/highcontrast.css

@@ -290,6 +290,10 @@
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn:focus {
   outline: none;
 }
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-hidden,
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn.e-hidden {
+  display: none;
+}
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn {
   bottom: 0;
   position: absolute;
@@ -341,7 +345,7 @@
   padding-top: 6px;
   height: 147px;
 }
-.e-ribbon.e-rbn .e-ribbon-group.e-hidden {
+.e-ribbon.e-rbn .e-ribbon-group.e-hidden, .e-ribbon.e-rbn .e-ribbon-group.e-hide-group {
   display: none;
 }
 .e-ribbon.e-rbn .e-ribbon-group.e-disabled {
@@ -842,13 +846,13 @@
 .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
   display: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-disabled {
   pointer-events: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-disabled {

package/styles/material-dark.css

@@ -343,6 +343,10 @@
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn:focus {
   outline: none;
 }
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-hidden,
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn.e-hidden {
+  display: none;
+}
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn {
   bottom: 5px;
   position: absolute;
@@ -394,7 +398,7 @@
   padding-top: 6px;
   height: 140px;
 }
-.e-ribbon.e-rbn .e-ribbon-group.e-hidden {
+.e-ribbon.e-rbn .e-ribbon-group.e-hidden, .e-ribbon.e-rbn .e-ribbon-group.e-hide-group {
   display: none;
 }
 .e-ribbon.e-rbn .e-ribbon-group.e-disabled {
@@ -895,13 +899,13 @@
 .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
   display: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-disabled {
   pointer-events: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-disabled {

package/styles/material.css

@@ -376,6 +376,10 @@
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn:focus {
   outline: none;
 }
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-group-of-btn.e-hidden,
+.e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn.e-hidden {
+  display: none;
+}
 .e-ribbon.e-rbn.e-ribbon-overflow .e-ribbon-overall-of-btn {
   bottom: 5px;
   position: absolute;
@@ -427,7 +431,7 @@
   padding-top: 6px;
   height: 140px;
 }
-.e-ribbon.e-rbn .e-ribbon-group.e-hidden {
+.e-ribbon.e-rbn .e-ribbon-group.e-hidden, .e-ribbon.e-rbn .e-ribbon-group.e-hide-group {
   display: none;
 }
 .e-ribbon.e-rbn .e-ribbon-group.e-disabled {
@@ -928,13 +932,13 @@
 .e-ribbon-group-overflow-ddb .e-ribbon-of-tab:not(.e-ribbon-active) {
   display: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target.e-disabled {
   pointer-events: none;
 }
-.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden {
+.e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hidden, .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-hide-group {
   display: none;
 }
 .e-ribbon-group-overflow-ddb .e-ribbon-overflow-target .e-ribbon-of-tab .e-ribbon-of-group-container.e-disabled {