apply card component changes side affects ...

2026-08-28 03:36:54 +03:30
parent 6c669f8ce2
commit e1b8ebe882
17 changed files with 3081 additions and 855 deletions
@@ -32,6 +32,7 @@ import { map } from 'rxjs/operators';
 import { Observable, forkJoin, Subject } from 'rxjs';
 import { ViewportRuler } from '@angular/cdk/overlay';
 import { XManagerService } from 'x-framework-services';
+import { XIconIdentifier } from '../x-icon/x-icon.typings';
 import { IXButtonContainer, XButtonType } from '../x-button/x-button.typings';
 import { X_FRAMEWORK_COMPONENTS_CONFIG } from '../tokens/x-injectable-tokens';
 import { XSlotNameIdentifier, XSlotName } from '../x-slotter/x-slotter.typings';
@@ -274,7 +275,7 @@ export abstract class XNextPrevResetHostContainerComponent
    public ruler: ViewportRuler,
    public zone: NgZone,
    public changeDetector: ChangeDetectorRef,
-    protected propertyProvider: XNextPrevResetHostContainer
+    protected propertyProvider: XNextPrevResetHostContainer,
  ) {
    super(
      config,
@@ -283,7 +284,7 @@ export abstract class XNextPrevResetHostContainerComponent
      renderer,
      ruler,
      zone,
-      changeDetector
+      changeDetector,
    );
  }
  //#endregion
@@ -291,7 +292,7 @@ export abstract class XNextPrevResetHostContainerComponent
  //
  //#region Abstract ...
  public extractProps(
-    container?: IXNextPrevResetHostContainer
+    container?: IXNextPrevResetHostContainer,
  ): Observable<IXNextPrevResetHostContainer> {
    return forkJoin({
      //
@@ -309,7 +310,7 @@ export abstract class XNextPrevResetHostContainerComponent
          onPrev: this.onPrev,
          onReset: this.onReset,
        };
-      })
+      }),
    );
  }
  //#endregion
@@ -321,8 +322,7 @@ export abstract class XNextPrevResetHostContainerComponent
 //
 type TXCardEmptyContainer = IXComponentCardContainer &
  IXNextPrevResetHostContainer;
-export interface IXCardNextPrevResetHostContainer
-  extends TXCardEmptyContainer {}
+export interface IXCardNextPrevResetHostContainer extends TXCardEmptyContainer {}

 //
@Injectable({
@@ -356,6 +356,16 @@ export class XCardNextPrevResetHostContainer
    this.cardPropertyProvider.cardSubTitle;
  readonly cardCssClass: XStandardType<XOneOrManyType<string>> =
    this.cardPropertyProvider.cardCssClass;
+  readonly cardShowFullScreenButton: XStandardType<boolean> =
+    this.cardPropertyProvider.cardShowFullScreenButton;
+  readonly cardEnterFullScreenButtonIcon: XStandardType<XIconIdentifier> =
+    this.cardPropertyProvider.cardEnterFullScreenButtonIcon;
+  readonly cardEnterFullScreenButtonColor: XStandardType<XColorIdentifier> =
+    this.cardPropertyProvider.cardEnterFullScreenButtonColor;
+  readonly cardExitFullScreenButtonIcon: XStandardType<XIconIdentifier> =
+    this.cardPropertyProvider.cardExitFullScreenButtonIcon;
+  readonly cardExitFullScreenButtonColor: XStandardType<XColorIdentifier> =
+    this.cardPropertyProvider.cardExitFullScreenButtonColor;
  //#endregion

  //
@@ -390,7 +400,7 @@ export class XCardNextPrevResetHostContainer
  //#region Constructor ...
  constructor(
    protected cardPropertyProvider: XComponentCardContainer,
-    protected nextPrevResetHostPropertyProvider: XNextPrevResetHostContainer
+    protected nextPrevResetHostPropertyProvider: XNextPrevResetHostContainer,
  ) {
    super();
  }
@@ -445,6 +455,26 @@ export class XCardNextPrevResetHostContainerComponent
  @Input()
  cardCssClass: XStandardType<XOneOrManyType<string>> =
    this.propertyProvider.cardCssClass;
+
+  @Input()
+  cardShowFullScreenButton: XStandardType<boolean> =
+    this.propertyProvider.cardShowFullScreenButton;
+
+  @Input()
+  cardEnterFullScreenButtonIcon: XStandardType<XIconIdentifier> =
+    this.propertyProvider.cardEnterFullScreenButtonIcon;
+
+  @Input()
+  cardEnterFullScreenButtonColor: XStandardType<XColorIdentifier> =
+    this.propertyProvider.cardEnterFullScreenButtonColor;
+
+  @Input()
+  cardExitFullScreenButtonIcon: XStandardType<XIconIdentifier> =
+    this.propertyProvider.cardExitFullScreenButtonIcon;
+
+  @Input()
+  cardExitFullScreenButtonColor: XStandardType<XColorIdentifier> =
+    this.propertyProvider.cardExitFullScreenButtonColor;
  //#endregion

  //
@@ -489,7 +519,7 @@ export class XCardNextPrevResetHostContainerComponent
    public ruler: ViewportRuler,
    public zone: NgZone,
    public changeDetector: ChangeDetectorRef,
-    protected propertyProvider: XCardNextPrevResetHostContainer
+    protected propertyProvider: XCardNextPrevResetHostContainer,
  ) {
    super(
      config,
@@ -498,7 +528,7 @@ export class XCardNextPrevResetHostContainerComponent
      renderer,
      ruler,
      zone,
-      changeDetector
+      changeDetector,
    );
  }
  //#endregion
@@ -506,35 +536,60 @@ export class XCardNextPrevResetHostContainerComponent
  //
  //#region Abstract ...
  public extractProps(
-    container?: IXCardNextPrevResetHostContainer
+    container?: IXCardNextPrevResetHostContainer,
  ): Observable<IXCardNextPrevResetHostContainer> {
    return forkJoin({
      //
      //#region XComponentCard ...
      cardCssClass: this.getArrayValue(
-        container ? container.cardCssClass : this.cardCssClass
+        container ? container.cardCssClass : this.cardCssClass,
      ),
      isInPage: this.getValue(container ? container.isInPage : this.isInPage),
      wrapWithCard: this.getValue(
-        container ? container.wrapWithCard : this.wrapWithCard
+        container ? container.wrapWithCard : this.wrapWithCard,
      ),
      cardShowFooter: this.getValue(
-        container ? container.cardShowFooter : this.cardShowFooter
+        container ? container.cardShowFooter : this.cardShowFooter,
      ),
      cardShowActions: this.getValue(
-        container ? container.cardShowActions : this.cardShowActions
+        container ? container.cardShowActions : this.cardShowActions,
      ),
      cardColor: this.getValue(
-        container ? container.cardColor : this.cardColor
+        container ? container.cardColor : this.cardColor,
      ),
      cardForegroundColor: this.getValue(
-        container ? container.cardForegroundColor : this.cardForegroundColor
+        container ? container.cardForegroundColor : this.cardForegroundColor,
      ),
      cardTitle: this.getValue(
-        container ? container.cardTitle : this.cardTitle
+        container ? container.cardTitle : this.cardTitle,
      ),
      cardSubTitle: this.getValue(
-        container ? container.cardSubTitle : this.cardSubTitle
+        container ? container.cardSubTitle : this.cardSubTitle,
+      ),
+      cardShowFullScreenButton: this.getValue(
+        container
+          ? container.cardShowFullScreenButton
+          : this.cardShowFullScreenButton,
+      ),
+      cardEnterFullScreenButtonIcon: this.getValue(
+        container
+          ? container.cardEnterFullScreenButtonIcon
+          : this.cardEnterFullScreenButtonIcon,
+      ),
+      cardEnterFullScreenButtonColor: this.getValue(
+        container
+          ? container.cardEnterFullScreenButtonColor
+          : this.cardEnterFullScreenButtonColor,
+      ),
+      cardExitFullScreenButtonIcon: this.getValue(
+        container
+          ? container.cardExitFullScreenButtonIcon
+          : this.cardExitFullScreenButtonIcon,
+      ),
+      cardExitFullScreenButtonColor: this.getValue(
+        container
+          ? container.cardExitFullScreenButtonColor
+          : this.cardExitFullScreenButtonColor,
      ),
      //#endregion

@@ -561,7 +616,7 @@ export class XCardNextPrevResetHostContainerComponent
          onPrev: this.onPrev,
          onReset: this.onReset,
        };
-      })
+      }),
    );
  }
  //#endregion
@@ -576,8 +631,7 @@ type TXNextPrevResetContainer = IXNextContainer &
  IXResetContainer;
 // tslint:disable-next-line:no-empty-interface
 export interface IXNextPrevResetContainer
-  extends IXBaseContainer,
-    TXNextPrevResetContainer {}
+  extends IXBaseContainer, TXNextPrevResetContainer {}

@Injectable({
  providedIn: 'root',
@@ -637,7 +691,7 @@ export class XNextPrevResetContainer
  constructor(
    protected prevPropertyProvider: XPrevContainer,
    protected nextPropertyProvider: XNextContainer,
-    protected resetpropertyProvider: XResetContainer
+    protected resetpropertyProvider: XResetContainer,
  ) {
    super();
  }
@@ -741,7 +795,7 @@ export abstract class XNextPrevResetContainerComponent
    public ruler: ViewportRuler,
    public zone: NgZone,
    public changeDetector: ChangeDetectorRef,
-    protected propertyProvider: XNextPrevResetContainer
+    protected propertyProvider: XNextPrevResetContainer,
  ) {
    super(
      config,
@@ -750,7 +804,7 @@ export abstract class XNextPrevResetContainerComponent
      renderer,
      ruler,
      zone,
-      changeDetector
+      changeDetector,
    );
  }
  //#endregion
@@ -758,57 +812,57 @@ export abstract class XNextPrevResetContainerComponent
  //
  //#region Abstract ...
  public extractProps(
-    container?: IXNextPrevResetContainer
+    container?: IXNextPrevResetContainer,
  ): Observable<IXNextPrevResetContainer> {
    return forkJoin({
      //
      hasNext: this.getValue(container ? container.hasNext : this.hasNext),
      disableNext: this.getValue(
-        container ? container.disableNext : this.disableNext
+        container ? container.disableNext : this.disableNext,
      ),
      nextConfirmer: this.getValue(
-        container ? container.nextConfirmer : this.nextConfirmer
+        container ? container.nextConfirmer : this.nextConfirmer,
      ),
      nextPosition: this.getValue(
-        container ? container.nextPosition : this.nextPosition
+        container ? container.nextPosition : this.nextPosition,
      ),
      nextCssClass: this.getValue(
-        container ? container.nextCssClass : this.nextCssClass
+        container ? container.nextCssClass : this.nextCssClass,
      ),
      nextButton: this.getValue(
-        container ? container.nextButton : this.nextButton
+        container ? container.nextButton : this.nextButton,
      ),
      hasPrev: this.getValue(container ? container.hasPrev : this.hasPrev),
      disablePrev: this.getValue(
-        container ? container.disablePrev : this.disablePrev
+        container ? container.disablePrev : this.disablePrev,
      ),
      prevConfirmer: this.getValue(
-        container ? container.prevConfirmer : this.prevConfirmer
+        container ? container.prevConfirmer : this.prevConfirmer,
      ),
      prevPosition: this.getValue(
-        container ? container.prevPosition : this.prevPosition
+        container ? container.prevPosition : this.prevPosition,
      ),
      prevCssClass: this.getValue(
-        container ? container.prevCssClass : this.prevCssClass
+        container ? container.prevCssClass : this.prevCssClass,
      ),
      prevButton: this.getValue(
-        container ? container.prevButton : this.prevButton
+        container ? container.prevButton : this.prevButton,
      ),
      hasReset: this.getValue(container ? container.hasReset : this.hasReset),
      disableReset: this.getValue(
-        container ? container.disableReset : this.disableReset
+        container ? container.disableReset : this.disableReset,
      ),
      resetConfirmer: this.getValue(
-        container ? container.resetConfirmer : this.resetConfirmer
+        container ? container.resetConfirmer : this.resetConfirmer,
      ),
      resetPosition: this.getValue(
-        container ? container.resetPosition : this.resetPosition
+        container ? container.resetPosition : this.resetPosition,
      ),
      resetCssClass: this.getValue(
-        container ? container.resetCssClass : this.resetCssClass
+        container ? container.resetCssClass : this.resetCssClass,
      ),
      resetButton: this.getValue(
-        container ? container.resetButton : this.resetButton
+        container ? container.resetButton : this.resetButton,
      ),
    }).pipe(
      map((data) => {
@@ -818,7 +872,7 @@ export abstract class XNextPrevResetContainerComponent

          //
        };
-      })
+      }),
    );
  }
  //#endregion
@@ -830,8 +884,7 @@ export abstract class XNextPrevResetContainerComponent
 type TXNextPrevResetAndHostContainer = IXNextPrevResetContainer &
  IXCardNextPrevResetHostContainer;
 export interface IXNextPrevResetAndHostContainer
-  extends IXBaseContainer,
-    TXNextPrevResetAndHostContainer {}
+  extends IXBaseContainer, TXNextPrevResetAndHostContainer {}

@Injectable({
  providedIn: 'root',
@@ -940,6 +993,16 @@ export class XNextPrevResetAndHostContainer
    this.cardNextPrevResetPropertyProvider.cardSubTitle;
  readonly cardCssClass: XStandardType<XOneOrManyType<string>> =
    this.cardNextPrevResetPropertyProvider.cardCssClass;
+  readonly cardShowFullScreenButton: XStandardType<boolean> =
+    this.cardNextPrevResetPropertyProvider.cardShowFullScreenButton;
+  readonly cardEnterFullScreenButtonIcon: XStandardType<XIconIdentifier> =
+    this.cardNextPrevResetPropertyProvider.cardEnterFullScreenButtonIcon;
+  readonly cardEnterFullScreenButtonColor: XStandardType<XColorIdentifier> =
+    this.cardNextPrevResetPropertyProvider.cardEnterFullScreenButtonColor;
+  readonly cardExitFullScreenButtonIcon: XStandardType<XIconIdentifier> =
+    this.cardNextPrevResetPropertyProvider.cardExitFullScreenButtonIcon;
+  readonly cardExitFullScreenButtonColor: XStandardType<XColorIdentifier> =
+    this.cardNextPrevResetPropertyProvider.cardExitFullScreenButtonColor;
  //#endregion
  //#endregion

@@ -947,7 +1010,7 @@ export class XNextPrevResetAndHostContainer
  //#region Constructor ...
  constructor(
    protected nextPrevResetPropertyProvider: XNextPrevResetContainer,
-    protected cardNextPrevResetPropertyProvider: XCardNextPrevResetHostContainer
+    protected cardNextPrevResetPropertyProvider: XCardNextPrevResetHostContainer,
  ) {
    super();
  }
@@ -1001,6 +1064,26 @@ export class XNextPrevResetAndHostContainerComponent
  @Input()
  cardCssClass: XStandardType<XOneOrManyType<string>> =
    this.propertyProvider.cardCssClass;
+
+  @Input()
+  cardShowFullScreenButton: XStandardType<boolean> =
+    this.propertyProvider.cardShowFullScreenButton;
+
+  @Input()
+  cardEnterFullScreenButtonIcon: XStandardType<XIconIdentifier> =
+    this.propertyProvider.cardEnterFullScreenButtonIcon;
+
+  @Input()
+  cardEnterFullScreenButtonColor: XStandardType<XColorIdentifier> =
+    this.propertyProvider.cardEnterFullScreenButtonColor;
+
+  @Input()
+  cardExitFullScreenButtonIcon: XStandardType<XIconIdentifier> =
+    this.propertyProvider.cardExitFullScreenButtonIcon;
+
+  @Input()
+  cardExitFullScreenButtonColor: XStandardType<XColorIdentifier> =
+    this.propertyProvider.cardExitFullScreenButtonColor;
  //#endregion

  //
@@ -1123,7 +1206,7 @@ export class XNextPrevResetAndHostContainerComponent
    public ruler: ViewportRuler,
    public zone: NgZone,
    public changeDetector: ChangeDetectorRef,
-    protected propertyProvider: XNextPrevResetAndHostContainer
+    protected propertyProvider: XNextPrevResetAndHostContainer,
  ) {
    super(
      config,
@@ -1132,7 +1215,7 @@ export class XNextPrevResetAndHostContainerComponent
      renderer,
      ruler,
      zone,
-      changeDetector
+      changeDetector,
    );
  }
  //#endregion
@@ -1140,35 +1223,60 @@ export class XNextPrevResetAndHostContainerComponent
  //
  //#region Abstract ...
  public extractProps(
-    container?: IXNextPrevResetAndHostContainer
+    container?: IXNextPrevResetAndHostContainer,
  ): Observable<IXNextPrevResetAndHostContainer> {
    return forkJoin({
      //
      //#region XComponentCard ...
      cardCssClass: this.getArrayValue(
-        container ? container.cardCssClass : this.cardCssClass
+        container ? container.cardCssClass : this.cardCssClass,
      ),
      isInPage: this.getValue(container ? container.isInPage : this.isInPage),
      wrapWithCard: this.getValue(
-        container ? container.wrapWithCard : this.wrapWithCard
+        container ? container.wrapWithCard : this.wrapWithCard,
      ),
      cardShowFooter: this.getValue(
-        container ? container.cardShowFooter : this.cardShowFooter
+        container ? container.cardShowFooter : this.cardShowFooter,
      ),
      cardShowActions: this.getValue(
-        container ? container.cardShowActions : this.cardShowActions
+        container ? container.cardShowActions : this.cardShowActions,
      ),
      cardColor: this.getValue(
-        container ? container.cardColor : this.cardColor
+        container ? container.cardColor : this.cardColor,
      ),
      cardForegroundColor: this.getValue(
-        container ? container.cardForegroundColor : this.cardForegroundColor
+        container ? container.cardForegroundColor : this.cardForegroundColor,
      ),
      cardTitle: this.getValue(
-        container ? container.cardTitle : this.cardTitle
+        container ? container.cardTitle : this.cardTitle,
      ),
      cardSubTitle: this.getValue(
-        container ? container.cardSubTitle : this.cardSubTitle
+        container ? container.cardSubTitle : this.cardSubTitle,
+      ),
+      cardShowFullScreenButton: this.getValue(
+        container
+          ? container.cardShowFullScreenButton
+          : this.cardShowFullScreenButton,
+      ),
+      cardEnterFullScreenButtonIcon: this.getValue(
+        container
+          ? container.cardEnterFullScreenButtonIcon
+          : this.cardEnterFullScreenButtonIcon,
+      ),
+      cardEnterFullScreenButtonColor: this.getValue(
+        container
+          ? container.cardEnterFullScreenButtonColor
+          : this.cardEnterFullScreenButtonColor,
+      ),
+      cardExitFullScreenButtonIcon: this.getValue(
+        container
+          ? container.cardExitFullScreenButtonIcon
+          : this.cardExitFullScreenButtonIcon,
+      ),
+      cardExitFullScreenButtonColor: this.getValue(
+        container
+          ? container.cardExitFullScreenButtonColor
+          : this.cardExitFullScreenButtonColor,
      ),
      //#endregion

@@ -1185,51 +1293,51 @@ export class XNextPrevResetAndHostContainerComponent
      //
      hasNext: this.getValue(container ? container.hasNext : this.hasNext),
      disableNext: this.getValue(
-        container ? container.disableNext : this.disableNext
+        container ? container.disableNext : this.disableNext,
      ),
      nextConfirmer: this.getValue(
-        container ? container.nextConfirmer : this.nextConfirmer
+        container ? container.nextConfirmer : this.nextConfirmer,
      ),
      nextPosition: this.getValue(
-        container ? container.nextPosition : this.nextPosition
+        container ? container.nextPosition : this.nextPosition,
      ),
      nextCssClass: this.getValue(
-        container ? container.nextCssClass : this.nextCssClass
+        container ? container.nextCssClass : this.nextCssClass,
      ),
      nextButton: this.getValue(
-        container ? container.nextButton : this.nextButton
+        container ? container.nextButton : this.nextButton,
      ),
      hasPrev: this.getValue(container ? container.hasPrev : this.hasPrev),
      disablePrev: this.getValue(
-        container ? container.disablePrev : this.disablePrev
+        container ? container.disablePrev : this.disablePrev,
      ),
      prevConfirmer: this.getValue(
-        container ? container.prevConfirmer : this.prevConfirmer
+        container ? container.prevConfirmer : this.prevConfirmer,
      ),
      prevPosition: this.getValue(
-        container ? container.prevPosition : this.prevPosition
+        container ? container.prevPosition : this.prevPosition,
      ),
      prevCssClass: this.getValue(
-        container ? container.prevCssClass : this.prevCssClass
+        container ? container.prevCssClass : this.prevCssClass,
      ),
      prevButton: this.getValue(
-        container ? container.prevButton : this.prevButton
+        container ? container.prevButton : this.prevButton,
      ),
      hasReset: this.getValue(container ? container.hasReset : this.hasReset),
      disableReset: this.getValue(
-        container ? container.disableReset : this.disableReset
+        container ? container.disableReset : this.disableReset,
      ),
      resetConfirmer: this.getValue(
-        container ? container.resetConfirmer : this.resetConfirmer
+        container ? container.resetConfirmer : this.resetConfirmer,
      ),
      resetPosition: this.getValue(
-        container ? container.resetPosition : this.resetPosition
+        container ? container.resetPosition : this.resetPosition,
      ),
      resetCssClass: this.getValue(
-        container ? container.resetCssClass : this.resetCssClass
+        container ? container.resetCssClass : this.resetCssClass,
      ),
      resetButton: this.getValue(
-        container ? container.resetButton : this.resetButton
+        container ? container.resetButton : this.resetButton,
      ),
      //#endregion
    }).pipe(
@@ -1248,7 +1356,7 @@ export class XNextPrevResetAndHostContainerComponent
          onPrev: this.onPrev,
          onReset: this.onReset,
        };
-      })
+      }),
    );
  }
  //#endregion