import {
  Input,
  Inject,
  NgZone,
  Output,
  Component,
  Renderer2,
  ElementRef,
  Injectable,
  EventEmitter,
  ChangeDetectorRef,
} from '@angular/core';
import {
  XStandardType,
  XOneOrManyType,
  XColorIdentifier,
  XResourceIdentifier,
} from 'x-framework-core';
import {
  XBaseContainer,
  IXBaseContainer,
  XBaseContainerComponent,
} from './i-x-base.container';
import {
  XCardActionModel,
  XComponentCardContainer,
  IXComponentCardContainer,
} from '../x-card/x-card.typings';
import {
  XEmptyContainer,
  XEmptyActionModel,
  IXComponentEmptyContainer,
} from '../x-empty/x-empty.typings';
import {
  XActionBarItem,
  XActionBarActionModel,
  XActionBarActionFiredModel,
  XComponentActionBarContainer,
  IXComponentActionBarContainer,
} from '../x-action-bar/x-action-bar.typings';
import {
  XSearchBarActionModel,
  XSearchBarTypeIdentifier,
  XSearchBarEventIdentifier,
  XComponentSearchBarContainer,
  IXComponentSearchBarContainer,
} from '../x-search-bar/x-search-bar.typings';
import { concatMap, map } from 'rxjs/operators';
import { Observable, Subject, forkJoin } from 'rxjs';
import { ViewportRuler } from '@angular/cdk/overlay';
import { XManagerService } from 'x-framework-services';
import { XIconIdentifier } from '../x-icon/x-icon.typings';
import { X_FRAMEWORK_COMPONENTS_CONFIG } from '../tokens/x-injectable-tokens';
import { XFrameworkComponentsConfig } from '../config/x-framework-components.config';

//
//#region XCardEmptyContainer ...
//
type TXCardEmptyContainer = IXComponentCardContainer &
  IXComponentEmptyContainer;
export interface IXCardEmptyContainer extends TXCardEmptyContainer { }

//
@Injectable({
  providedIn: 'root',
})
export class XCardEmptyContainer
  extends XBaseContainer
  implements IXCardEmptyContainer {
  //
  //#region XComponentCard ...
  readonly isInPage: XStandardType<boolean> =
    this.cardPropertyProvider.isInPage;
  readonly wrapWithCard: XStandardType<boolean> =
    this.cardPropertyProvider.wrapWithCard;
  readonly cardShowFooter: XStandardType<boolean> =
    this.cardPropertyProvider.cardShowFooter;
  readonly cardShowActions: XStandardType<boolean> =
    this.cardPropertyProvider.cardShowActions;
  readonly cardColor: XStandardType<XColorIdentifier> =
    this.cardPropertyProvider.cardColor;
  readonly cardForegroundColor: XStandardType<boolean> =
    this.cardPropertyProvider.cardForegroundColor;
  readonly cardTitle: XStandardType<XResourceIdentifier> =
    this.cardPropertyProvider.cardTitle;
  readonly cardActionProvider: Subject<XCardActionModel> =
    this.cardPropertyProvider.cardActionProvider;
  readonly cardSubTitle: XStandardType<XResourceIdentifier> =
    this.cardPropertyProvider.cardSubTitle;
  readonly cardCssClass: XStandardType<XOneOrManyType<string>> =
    this.cardPropertyProvider.cardCssClass;
  //#endregion

  //
  //#region XComponentEmpty ...
  //
  readonly showEmpty: XStandardType<boolean> = true;
  readonly emptyHasRefresh: XStandardType<boolean> =
    this.emptyPropertyProvider.hasRefresh;

  //
  readonly emptyActionProvider: Subject<XEmptyActionModel> =
    this.emptyPropertyProvider.actionProvider;
  readonly emptyCssClass: XStandardType<XOneOrManyType<string>> =
    this.emptyPropertyProvider.cssClass;
  readonly emptyColor: XStandardType<XColorIdentifier> =
    this.emptyPropertyProvider.color;
  readonly emptyForegroundColor: XStandardType<boolean> =
    this.emptyPropertyProvider.foregroundColor;
  readonly emptyMessageColor: XStandardType<XColorIdentifier> =
    this.emptyPropertyProvider.messageColor;
  readonly emptyForegroundMessageColor: XStandardType<boolean> =
    this.emptyPropertyProvider.foregroundMessageColor;
  readonly emptyRefreshButtonColor: XStandardType<XColorIdentifier> =
    this.emptyPropertyProvider.refreshButtonColor;
  readonly emptyForegroundRefreshButtonColor: XStandardType<boolean> =
    this.emptyPropertyProvider.foregroundRefreshButtonColor;
  readonly emptyMessage: XStandardType<XResourceIdentifier> =
    this.emptyPropertyProvider.message;
  readonly emptyRefreshIcon: XStandardType<XIconIdentifier> =
    this.emptyPropertyProvider.refreshIcon;
  readonly emptyRefresh: EventEmitter<void> =
    this.emptyPropertyProvider.refresh;
  //#endregion

  //
  //#region Constructor ...
  constructor(
    protected cardPropertyProvider: XComponentCardContainer,
    protected emptyPropertyProvider: XEmptyContainer
  ) {
    super();
  }
  //#endregion
}

//
@Injectable()
@Component({
  template: ``,
})
export class XCardEmptyContainerComponent
  extends XBaseContainerComponent
  implements IXCardEmptyContainer {
  //
  //#region Props ...
  //
  //#region XComponentCard ...
  @Input()
  isInPage: XStandardType<boolean> = this.propertyProvider.isInPage;

  @Input()
  wrapWithCard: XStandardType<boolean> = this.propertyProvider.wrapWithCard;

  @Input()
  cardShowFooter: XStandardType<boolean> = this.propertyProvider.cardShowFooter;

  @Input()
  cardShowActions: XStandardType<boolean> =
    this.propertyProvider.cardShowActions;

  @Input()
  cardColor: XStandardType<XColorIdentifier> = this.propertyProvider.cardColor;

  @Input()
  cardForegroundColor: XStandardType<boolean> =
    this.propertyProvider.cardForegroundColor;

  @Input()
  cardTitle: XStandardType<XResourceIdentifier> =
    this.propertyProvider.cardTitle;

  @Input()
  cardActionProvider: Subject<XCardActionModel> =
    this.propertyProvider.cardActionProvider;

  @Input()
  cardSubTitle: XStandardType<XResourceIdentifier> =
    this.propertyProvider.cardSubTitle;

  @Input()
  cardCssClass: XStandardType<XOneOrManyType<string>> =
    this.propertyProvider.cardCssClass;
  //#endregion

  //
  //#region XComponentEmpty ...
  //
  @Input()
  showEmpty: XStandardType<boolean> = this.propertyProvider.showEmpty;

  @Input()
  emptyHasRefresh: XStandardType<boolean> =
    this.propertyProvider.emptyHasRefresh;

  @Input()
  emptyActionProvider: Subject<XEmptyActionModel> =
    this.propertyProvider.emptyActionProvider;

  @Input()
  emptyCssClass: XStandardType<XOneOrManyType<string>> =
    this.propertyProvider.emptyCssClass;

  @Input()
  emptyColor: XStandardType<XColorIdentifier> =
    this.propertyProvider.emptyColor;

  @Input()
  emptyForegroundColor: XStandardType<boolean> =
    this.propertyProvider.emptyForegroundColor;

  @Input()
  emptyMessageColor: XStandardType<XColorIdentifier> =
    this.propertyProvider.emptyMessageColor;

  @Input()
  emptyForegroundMessageColor: XStandardType<boolean> =
    this.propertyProvider.emptyForegroundMessageColor;

  @Input()
  emptyRefreshButtonColor: XStandardType<XColorIdentifier> =
    this.propertyProvider.emptyRefreshButtonColor;

  @Input()
  emptyForegroundRefreshButtonColor: XStandardType<boolean> =
    this.propertyProvider.emptyForegroundRefreshButtonColor;

  @Input()
  emptyMessage: XStandardType<XResourceIdentifier> =
    this.propertyProvider.emptyMessage;

  @Input()
  emptyRefreshIcon: XStandardType<XIconIdentifier> =
    this.propertyProvider.emptyRefreshIcon;

  @Output()
  emptyRefresh: EventEmitter<void> = new EventEmitter();
  //#endregion
  //#endregion

  //
  //#region Constructor ...
  constructor(
    @Inject(X_FRAMEWORK_COMPONENTS_CONFIG)
    public config: XFrameworkComponentsConfig,
    public managerService: XManagerService,
    public element: ElementRef,
    public renderer: Renderer2,
    public ruler: ViewportRuler,
    public zone: NgZone,
    public changeDetector: ChangeDetectorRef,
    protected propertyProvider: XCardEmptyContainer
  ) {
    super(
      config,
      managerService,
      element,
      renderer,
      ruler,
      zone,
      changeDetector
    );
  }
  //#endregion

  //
  //#region Abstract ...
  public extractProps(
    container?: IXCardEmptyContainer
  ): Observable<IXCardEmptyContainer> {
    return forkJoin({
      //
      //#region XComponentCard ...
      cardCssClass: this.getArrayValue(
        container ? container.cardCssClass : this.cardCssClass
      ),
      isInPage: this.getValue(container ? container.isInPage : this.isInPage),
      wrapWithCard: this.getValue(
        container ? container.wrapWithCard : this.wrapWithCard
      ),
      cardShowFooter: this.getValue(
        container ? container.cardShowFooter : this.cardShowFooter
      ),
      cardShowActions: this.getValue(
        container ? container.cardShowActions : this.cardShowActions
      ),
      cardColor: this.getValue(
        container ? container.cardColor : this.cardColor
      ),
      cardForegroundColor: this.getValue(
        container ? container.cardForegroundColor : this.cardForegroundColor
      ),
      cardTitle: this.getValue(
        container ? container.cardTitle : this.cardTitle
      ),
      cardSubTitle: this.getValue(
        container ? container.cardSubTitle : this.cardSubTitle
      ),
      //#endregion

      //
      //#region XComponentEmpty ...
      //
      showEmpty: this.getValue(
        container ? container.showEmpty : this.showEmpty
      ),
      emptyHasRefresh: this.getValue(
        container ? container.emptyHasRefresh : this.emptyHasRefresh
      ),

      //
      emptyCssClass: this.getValue(
        container ? container.emptyCssClass : this.emptyCssClass
      ),
      emptyColor: this.getValue(
        container ? container.emptyColor : this.emptyColor
      ),
      emptyForegroundColor: this.getValue(
        container ? container.emptyForegroundColor : this.emptyForegroundColor
      ),
      emptyMessageColor: this.getValue(
        container ? container.emptyMessageColor : this.emptyMessageColor
      ),
      emptyForegroundMessageColor: this.getValue(
        container
          ? container.emptyForegroundMessageColor
          : this.emptyForegroundMessageColor
      ),
      emptyRefreshButtonColor: this.getValue(
        container
          ? container.emptyRefreshButtonColor
          : this.emptyRefreshButtonColor
      ),
      emptyForegroundRefreshButtonColor: this.getValue(
        container
          ? container.emptyForegroundRefreshButtonColor
          : this.emptyForegroundRefreshButtonColor
      ),
      emptyMessage: this.getValue(
        container ? container.emptyMessage : this.emptyMessage
      ),
      emptyRefreshIcon: this.getValue(
        container ? container.emptyRefreshIcon : this.emptyRefreshIcon
      ),
      //#endregion
    }).pipe(
      map((data) => {
        return {
          //
          ...data,

          //
          cardActionProvider: container
            ? container.cardActionProvider
            : this.cardActionProvider,

          //
          emptyActionProvider: container
            ? container.emptyActionProvider
            : this.emptyActionProvider,

          //
          emptyRefresh: this.emptyRefresh,
        };
      })
    );
  }
  //#endregion
}
//#endregion

//
//#region XCardActionBarContainer ...
type TXCardActionBarContainer = IXComponentCardContainer & IXComponentActionBarContainer;
export interface IXCardActionBarContainer extends TXCardActionBarContainer { }

@Injectable({
  providedIn: 'root',
})
export class XCardActionBarContainer extends XBaseContainer implements IXCardActionBarContainer {
  //
  //#region Props ...
  //
  //#region ComponentCard Props ...
  readonly isInPage: XStandardType<boolean> =
    this.cardPropertyProvider.isInPage;
  readonly wrapWithCard: XStandardType<boolean> =
    this.cardPropertyProvider.wrapWithCard;
  readonly cardActionProvider: Subject<XCardActionModel> =
    this.cardPropertyProvider.cardActionProvider;
  readonly cardCssClass: XStandardType<XOneOrManyType<string>> =
    this.cardPropertyProvider.cardCssClass;
  readonly cardColor: XStandardType<XColorIdentifier> =
    this.cardPropertyProvider.cardColor;
  readonly cardForegroundColor: XStandardType<boolean> =
    this.cardPropertyProvider.cardForegroundColor;
  readonly cardTitle: XStandardType<XResourceIdentifier> =
    this.cardPropertyProvider.cardTitle;
  readonly cardSubTitle: XStandardType<XResourceIdentifier> =
    this.cardPropertyProvider.cardSubTitle;
  readonly cardShowFooter: XStandardType<boolean> =
    this.cardPropertyProvider.cardShowFooter;
  readonly cardShowActions: XStandardType<boolean> =
    this.cardPropertyProvider.cardShowActions;
  //#endregion

  //
  //#region ComponentActionBar Props ...
  readonly showActionBar: XStandardType<boolean> =
    this.actionBarPropertyProvider.showActionBar;
  readonly actionBarActionProvider: Subject<XActionBarActionModel> =
    this.actionBarPropertyProvider.actionBarActionProvider;
  readonly actionBarCssClass: XStandardType<XOneOrManyType<string>> =
    this.actionBarPropertyProvider.actionBarCssClass;
  readonly actionBarColor: XStandardType<XColorIdentifier> =
    this.actionBarPropertyProvider.actionBarColor;
  readonly actionBarForegroundColor: XStandardType<boolean> =
    this.actionBarPropertyProvider.actionBarForegroundColor;
  readonly actionBarActions: XStandardType<XOneOrManyType<XActionBarItem>> =
    this.actionBarPropertyProvider.actionBarActions;
  readonly actionBarActionFired: EventEmitter<XActionBarActionFiredModel> =
    this.actionBarPropertyProvider.actionBarActionFired;
  //#endregion
  //#endregion

  //
  //#region Constructor ...
  constructor(
    protected cardPropertyProvider: XComponentCardContainer,
    protected actionBarPropertyProvider: XComponentActionBarContainer
  ) {
    super();
  }
  //#endregion
}

@Injectable()
@Component({
  template: ``,
})
export class XCardActionBarContainerComponent
  extends XBaseContainerComponent
  implements IXCardActionBarContainer {
  //
  //#region Props ...
  //
  //#region ComponentCard Props ...
  @Input()
  isInPage: XStandardType<boolean> = this.propertyProvider.isInPage;

  @Input()
  wrapWithCard: XStandardType<boolean> = this.propertyProvider.wrapWithCard;

  @Input()
  cardCssClass: XStandardType<XOneOrManyType<string>> =
    this.propertyProvider.cardCssClass;

  @Input()
  cardColor: XStandardType<XColorIdentifier> = this.propertyProvider.cardColor;

  @Input()
  cardForegroundColor: XStandardType<boolean> =
    this.propertyProvider.cardForegroundColor;

  @Input()
  cardTitle: XStandardType<XResourceIdentifier> =
    this.propertyProvider.cardTitle;

  @Input()
  cardSubTitle: XStandardType<XResourceIdentifier> =
    this.propertyProvider.cardSubTitle;

  @Input()
  cardShowFooter: XStandardType<boolean> = this.propertyProvider.cardShowFooter;

  @Input()
  cardShowActions: XStandardType<boolean> =
    this.propertyProvider.cardShowActions;

  @Input()
  cardActionProvider: Subject<XCardActionModel> =
    this.propertyProvider.cardActionProvider;
  //#endregion

  //
  //#region ComponentActionBar Props ...
  @Input()
  showActionBar: XStandardType<boolean> = this.propertyProvider.showActionBar;

  @Input()
  actionBarCssClass: XStandardType<XOneOrManyType<string>> =
    this.propertyProvider.actionBarCssClass;

  @Input()
  actionBarColor: XStandardType<XColorIdentifier> =
    this.propertyProvider.actionBarColor;

  @Input()
  actionBarForegroundColor: XStandardType<boolean> =
    this.propertyProvider.actionBarForegroundColor;

  @Input()
  actionBarActionProvider: Subject<XActionBarActionModel> =
    this.propertyProvider.actionBarActionProvider;

  @Output()
  actionBarActionFired: EventEmitter<XActionBarActionFiredModel> =
    this.propertyProvider.actionBarActionFired;

  actionBarActions: XStandardType<XOneOrManyType<XActionBarItem>> =
    this.propertyProvider.actionBarActions;
  //#endregion
  //#endregion

  //
  //#region Constructor ...
  constructor(
    @Inject(X_FRAMEWORK_COMPONENTS_CONFIG)
    public config: XFrameworkComponentsConfig,
    public managerService: XManagerService,
    public element: ElementRef,
    public renderer: Renderer2,
    public ruler: ViewportRuler,
    public zone: NgZone,
    public changeDetector: ChangeDetectorRef,
    protected propertyProvider: XCardActionBarContainer,
  ) {
    super(
      config,
      managerService,
      element,
      renderer,
      ruler,
      zone,
      changeDetector
    );
  }
  //#endregion

  //
  //#region Abstracts ...
  public extractProps(container?: IXCardActionBarContainer): Observable<IXCardActionBarContainer> {
    return forkJoin({
      //
      //#region XComponentCard ...
      cardCssClass: this.getArrayValue(
        container ? container.cardCssClass : this.cardCssClass
      ),
      isInPage: this.getValue(container ? container.isInPage : this.isInPage),
      wrapWithCard: this.getValue(
        container ? container.wrapWithCard : this.wrapWithCard
      ),
      cardShowFooter: this.getValue(
        container ? container.cardShowFooter : this.cardShowFooter
      ),
      cardShowActions: this.getValue(
        container ? container.cardShowActions : this.cardShowActions
      ),
      cardColor: this.getValue(
        container ? container.cardColor : this.cardColor
      ),
      cardForegroundColor: this.getValue(
        container ? container.cardForegroundColor : this.cardForegroundColor
      ),
      cardTitle: this.getValue(
        container ? container.cardTitle : this.cardTitle
      ),
      cardSubTitle: this.getValue(
        container ? container.cardSubTitle : this.cardSubTitle
      ),
      //#endregion

      //
      //#region XComponentActionBar ...
      showActionBar: this.getValue(
        container ? container.showActionBar : this.showActionBar
      ),
      actionBarCssClass: this.getValue(
        container ? container.actionBarCssClass : this.actionBarCssClass
      ),
      actionBarColor: this.getValue(
        container ? container.actionBarColor : this.actionBarColor
      ),
      actionBarForegroundColor: this.getValue(
        container
          ? container.actionBarForegroundColor
          : this.actionBarForegroundColor
      ),
      actionBarActions: this.getValue(
        container ? container.actionBarActions : this.actionBarActions
      ),
      //#endregion
    }).pipe(
      map((data) => {
        return {
          //
          ...data,

          //
          cardActionProvider: container
            ? container.cardActionProvider
            : this.cardActionProvider,

          //
          actionBarActionProvider: container
            ? container.actionBarActionProvider
            : this.actionBarActionProvider,

          //
          actionBarActionFired: this.actionBarActionFired,
        };
      })
    );
  }
  //#endregion
}
//#endregion

//
//#region XCardEmptyActionSearchBarContainer ...
//
type TXCardEmptyActionSearchBarContainer = IXCardEmptyContainer &
  IXComponentActionBarContainer &
  IXComponentSearchBarContainer;
export interface IXCardEmptyActionSearchBarContainer
  extends IXBaseContainer,
  TXCardEmptyActionSearchBarContainer { }

//
@Injectable({
  providedIn: 'root',
})
export class XCardEmptyActionSearchBarContainer
  extends XCardEmptyContainer
  implements IXCardEmptyActionSearchBarContainer {
  //
  //#region Props ...
  //
  //#region ActionBar ...
  //
  readonly showActionBar: XStandardType<boolean> =
    this.actionBarPropertyProvider.showActionBar;

  //
  readonly actionBarActionProvider: Subject<XActionBarActionModel> =
    this.actionBarPropertyProvider.actionBarActionProvider;
  readonly actionBarCssClass: XStandardType<XOneOrManyType<string>> =
    this.actionBarPropertyProvider.actionBarCssClass;

  //
  readonly actionBarColor: XStandardType<XColorIdentifier> =
    this.actionBarPropertyProvider.actionBarColor;
  readonly actionBarForegroundColor: XStandardType<boolean> =
    this.actionBarPropertyProvider.actionBarForegroundColor;

  //
  readonly actionBarActions: XStandardType<XOneOrManyType<XActionBarItem>> =
    this.actionBarPropertyProvider.actionBarActions;

  //
  readonly actionBarActionFired: EventEmitter<XActionBarActionFiredModel> =
    this.actionBarPropertyProvider.actionBarActionFired;
  //#endregion

  //
  //#region SearchBar ...
  //
  readonly showSearchBar: XStandardType<boolean> =
    this.searchBarPropertyProvider.showSearchBar;

  //
  readonly searchBarActionProvider: Subject<XSearchBarActionModel> =
    this.searchBarPropertyProvider.searchBarActionProvider;
  readonly searchBarCssClass: XStandardType<XOneOrManyType<string>> =
    this.searchBarPropertyProvider.searchBarCssClass;

  //
  readonly searchBarColor: XStandardType<XColorIdentifier> =
    this.searchBarPropertyProvider.searchBarColor;
  readonly searchBarForegroundColor: XStandardType<boolean> =
    this.searchBarPropertyProvider.searchBarForegroundColor;

  //
  readonly searchBarSearchInputColor: XStandardType<XColorIdentifier> =
    this.searchBarPropertyProvider.searchBarSearchInputColor;
  readonly searchBarForegroundSearchInputColor: XStandardType<boolean> =
    this.searchBarPropertyProvider.searchBarForegroundSearchInputColor;

  //
  readonly searchBarType: XStandardType<XSearchBarTypeIdentifier> =
    this.searchBarPropertyProvider.searchBarType;
  readonly searchBarTitle: XStandardType<XResourceIdentifier> =
    this.searchBarPropertyProvider.searchBarTitle;
  readonly searchBarValue: XStandardType<string> =
    this.searchBarPropertyProvider.searchBarValue;
  readonly searchBarEnterKeyHint: XStandardType<string> =
    this.searchBarPropertyProvider.searchBarEnterKeyHint;
  readonly searchBarKeyboardType: XStandardType<XSearchBarTypeIdentifier> =
    this.searchBarPropertyProvider.searchBarKeyboardType;
  readonly searchBarSpellcheck: XStandardType<boolean> =
    this.searchBarPropertyProvider.searchBarSpellcheck;
  readonly searchBarDebounce: XStandardType<number> =
    this.searchBarPropertyProvider.searchBarDebounce;

  //
  readonly searchBarShowCancelButton: XStandardType<string> =
    this.searchBarPropertyProvider.searchBarShowCancelButton;
  readonly searchBarCancelButtonIcon: XStandardType<XIconIdentifier> =
    this.searchBarPropertyProvider.searchBarCancelButtonIcon;
  readonly searchBarCancelButtonTitle: XStandardType<XResourceIdentifier> =
    this.searchBarPropertyProvider.searchBarCancelButtonTitle;
  readonly searchBarCancelButtonIconColor: XStandardType<XColorIdentifier> =
    this.searchBarPropertyProvider.searchBarCancelButtonIconColor;

  //
  readonly searchBarShowClearButton: XStandardType<string> =
    this.searchBarPropertyProvider.searchBarShowClearButton;
  readonly searchBarClearButtonIcon: XStandardType<XIconIdentifier> =
    this.searchBarPropertyProvider.searchBarClearButtonIcon;
  readonly searchBarClearButtonIconColor: XStandardType<XColorIdentifier> =
    this.searchBarPropertyProvider.searchBarClearButtonIconColor;

  //
  readonly searchBarSearchButtonIcon: XStandardType<XIconIdentifier> =
    this.searchBarPropertyProvider.searchBarSearchButtonIcon;
  readonly searchBarSearchButtonIconColor: XStandardType<XColorIdentifier> =
    this.searchBarPropertyProvider.searchBarSearchButtonIconColor;

  //
  readonly searchBarQueryChange: EventEmitter<string> =
    this.searchBarPropertyProvider.searchBarQueryChange;
  readonly searchBarOnEvent: EventEmitter<XSearchBarEventIdentifier> =
    this.searchBarPropertyProvider.searchBarOnEvent;
  //#endregion
  //#endregion

  //
  //#region Constructor ...
  constructor(
    protected cardPropertyProvider: XComponentCardContainer,
    protected emptyPropertyProvider: XEmptyContainer,
    protected actionBarPropertyProvider: XComponentActionBarContainer,
    protected searchBarPropertyProvider: XComponentSearchBarContainer
  ) {
    super(cardPropertyProvider, emptyPropertyProvider);
  }
  //#endregion
}

//
@Injectable()
@Component({
  template: ``,
})
export class XCardEmptyActionSearchBarContainerComponent
  extends XCardEmptyContainerComponent
  implements IXCardEmptyActionSearchBarContainer {
  //
  //#region Props ...
  //
  //#region ActionBar ...
  //
  @Input()
  showActionBar: XStandardType<boolean> = this.propertyProvider.showActionBar;

  //
  @Input()
  actionBarActionProvider: Subject<XActionBarActionModel> =
    this.propertyProvider.actionBarActionProvider;

  @Input()
  actionBarCssClass: XStandardType<XOneOrManyType<string>> =
    this.propertyProvider.actionBarCssClass;

  //
  @Input()
  actionBarColor: XStandardType<XColorIdentifier> =
    this.propertyProvider.actionBarColor;

  @Input()
  actionBarForegroundColor: XStandardType<boolean> =
    this.propertyProvider.actionBarForegroundColor;

  //
  @Input()
  actionBarActions: XStandardType<XOneOrManyType<XActionBarItem>> =
    this.propertyProvider.actionBarActions;

  //
  @Output()
  actionBarActionFired: EventEmitter<XActionBarActionFiredModel> = new EventEmitter<XActionBarActionFiredModel>();
  //#endregion

  //
  //#region SearchBar ...
  //
  @Input()
  showSearchBar: XStandardType<boolean> = this.propertyProvider.showSearchBar;

  //
  @Input()
  searchBarActionProvider: Subject<XSearchBarActionModel> =
    this.propertyProvider.searchBarActionProvider;

  @Input()
  searchBarCssClass: XStandardType<XOneOrManyType<string>> =
    this.propertyProvider.searchBarCssClass;

  //
  @Input()
  searchBarColor: XStandardType<XColorIdentifier> =
    this.propertyProvider.searchBarColor;

  @Input()
  searchBarForegroundColor: XStandardType<boolean> =
    this.propertyProvider.searchBarForegroundColor;

  //
  @Input()
  searchBarSearchInputColor: XStandardType<XColorIdentifier> =
    this.propertyProvider.searchBarSearchInputColor;

  @Input()
  searchBarForegroundSearchInputColor: XStandardType<boolean> =
    this.propertyProvider.searchBarForegroundSearchInputColor;

  //
  @Input()
  searchBarType: XStandardType<XSearchBarTypeIdentifier> =
    this.propertyProvider.searchBarType;

  @Input()
  searchBarTitle: XStandardType<XResourceIdentifier> =
    this.propertyProvider.searchBarTitle;

  @Input()
  searchBarValue: XStandardType<string> = this.propertyProvider.searchBarValue;

  @Input()
  searchBarEnterKeyHint: XStandardType<string> =
    this.propertyProvider.searchBarEnterKeyHint;

  @Input()
  searchBarKeyboardType: XStandardType<XSearchBarTypeIdentifier> =
    this.propertyProvider.searchBarKeyboardType;

  @Input()
  searchBarSpellcheck: XStandardType<boolean> =
    this.propertyProvider.searchBarSpellcheck;

  @Input()
  searchBarDebounce: XStandardType<number> =
    this.propertyProvider.searchBarDebounce;

  //
  @Input()
  searchBarShowCancelButton: XStandardType<string> =
    this.propertyProvider.searchBarShowCancelButton;

  @Input()
  searchBarCancelButtonIcon: XStandardType<XIconIdentifier> =
    this.propertyProvider.searchBarCancelButtonIcon;

  @Input()
  searchBarCancelButtonTitle: XStandardType<XResourceIdentifier> =
    this.propertyProvider.searchBarCancelButtonTitle;

  @Input()
  searchBarCancelButtonIconColor: XStandardType<XColorIdentifier> =
    this.propertyProvider.searchBarCancelButtonIconColor;

  //
  @Input()
  searchBarClearButtonIcon: XStandardType<XIconIdentifier> =
    this.propertyProvider.searchBarClearButtonIcon;

  @Input()
  searchBarClearButtonIconColor: XStandardType<XColorIdentifier> =
    this.propertyProvider.searchBarClearButtonIconColor;

  //
  @Input()
  searchBarShowClearButton: XStandardType<string> =
    this.propertyProvider.searchBarShowClearButton;

  @Input()
  searchBarSearchButtonIcon: XStandardType<XIconIdentifier> =
    this.propertyProvider.searchBarSearchButtonIcon;

  @Input()
  searchBarSearchButtonIconColor: XStandardType<XColorIdentifier> =
    this.propertyProvider.searchBarSearchButtonIconColor;

  //
  @Output()
  searchBarQueryChange: EventEmitter<string> = new EventEmitter();

  @Output()
  searchBarOnEvent: EventEmitter<XSearchBarEventIdentifier> = new EventEmitter();
  //#endregion
  //#endregion

  //
  //#region Constructor ...
  constructor(
    @Inject(X_FRAMEWORK_COMPONENTS_CONFIG)
    public config: XFrameworkComponentsConfig,
    public managerService: XManagerService,
    public element: ElementRef,
    public renderer: Renderer2,
    public ruler: ViewportRuler,
    public zone: NgZone,
    public changeDetector: ChangeDetectorRef,
    protected propertyProvider: XCardEmptyActionSearchBarContainer
  ) {
    super(
      config,
      managerService,
      element,
      renderer,
      ruler,
      zone,
      changeDetector,
      propertyProvider
    );
  }
  //#endregion

  //
  //#region Abstract ...
  public extractProps(
    container?: IXCardEmptyActionSearchBarContainer
  ): Observable<IXCardEmptyActionSearchBarContainer> {
    return super
      .extractProps(container ? container : this)
      .pipe(
        concatMap((superData) => {
          return forkJoin({
            //
            //
            //#region ActionBar ...
            //
            showActionBar: this.getValue(
              container ? container.showActionBar : this.showActionBar
            ),
            actionBarCssClass: this.getValue(
              container ? container.actionBarCssClass : this.actionBarCssClass
            ),
            actionBarColor: this.getValue(
              container ? container.actionBarColor : this.actionBarColor
            ),
            actionBarForegroundColor: this.getValue(
              container
                ? container.actionBarForegroundColor
                : this.actionBarForegroundColor
            ),
            actionBarActions: this.getValue(
              container ? container.actionBarActions : this.actionBarActions
            ),
            //#endregion

            //
            //#region SearchBar ...
            //
            showSearchBar: this.getValue(
              container ? container.showSearchBar : this.showSearchBar
            ),
            searchBarCssClass: this.getValue(
              container ? container.searchBarCssClass : this.searchBarCssClass
            ),
            searchBarColor: this.getValue(
              container ? container.searchBarColor : this.searchBarColor
            ),
            searchBarForegroundColor: this.getValue(
              container
                ? container.searchBarForegroundColor
                : this.searchBarForegroundColor
            ),
            searchBarSearchInputColor: this.getValue(
              container
                ? container.searchBarSearchInputColor
                : this.searchBarSearchInputColor
            ),
            searchBarForegroundSearchInputColor: this.getValue(
              container
                ? container.searchBarForegroundSearchInputColor
                : this.searchBarForegroundSearchInputColor
            ),

            //
            searchBarType: this.getValue(
              container ? container.searchBarType : this.searchBarType
            ),
            searchBarTitle: this.getValue(
              container ? container.searchBarTitle : this.searchBarTitle
            ),
            searchBarValue: this.getValue(
              container ? container.searchBarValue : this.searchBarValue
            ),
            searchBarEnterKeyHint: this.getValue(
              container
                ? container.searchBarEnterKeyHint
                : this.searchBarEnterKeyHint
            ),
            searchBarKeyboardType: this.getValue(
              container
                ? container.searchBarKeyboardType
                : this.searchBarKeyboardType
            ),
            searchBarSpellcheck: this.getValue(
              container
                ? container.searchBarSpellcheck
                : this.searchBarSpellcheck
            ),
            searchBarDebounce: this.getValue(
              container ? container.searchBarDebounce : this.searchBarDebounce
            ),

            //
            searchBarShowCancelButton: this.getValue(
              container
                ? container.searchBarShowCancelButton
                : this.searchBarShowCancelButton
            ),
            searchBarCancelButtonIcon: this.getValue(
              container
                ? container.searchBarCancelButtonIcon
                : this.searchBarCancelButtonIcon
            ),
            searchBarCancelButtonTitle: this.getValue(
              container
                ? container.searchBarCancelButtonTitle
                : this.searchBarCancelButtonTitle
            ),
            searchBarCancelButtonIconColor: this.getValue(
              container
                ? container.searchBarCancelButtonIconColor
                : this.searchBarCancelButtonIconColor
            ),

            //
            searchBarShowClearButton: this.getValue(
              container
                ? container.searchBarShowClearButton
                : this.searchBarShowClearButton
            ),
            searchBarClearButtonIcon: this.getValue(
              container
                ? container.searchBarClearButtonIcon
                : this.searchBarClearButtonIcon
            ),
            searchBarClearButtonIconColor: this.getValue(
              container
                ? container.searchBarClearButtonIconColor
                : this.searchBarClearButtonIconColor
            ),

            //
            searchBarSearchButtonIcon: this.getValue(
              container
                ? container.searchBarSearchButtonIcon
                : this.searchBarSearchButtonIcon
            ),
            searchBarSearchButtonIconColor: this.getValue(
              container
                ? container.searchBarSearchButtonIconColor
                : this.searchBarSearchButtonIconColor
            ),
            //#endregion
          }).pipe(
            map((data) => {
              return {
                superData,
                data,
              };
            })
          );
        })
      )
      .pipe(
        map((info) => {
          return {
            //
            ...info.superData,

            //
            ...info.data,

            //
            actionBarActionProvider: container
              ? container.actionBarActionProvider
              : this.actionBarActionProvider,
            actionBarActionFired: this.actionBarActionFired,

            //
            searchBarActionProvider: container
              ? container.searchBarActionProvider
              : this.searchBarActionProvider,

            //
            searchBarQueryChange: this.searchBarQueryChange,
            searchBarOnEvent: this.searchBarOnEvent,
          };
        })
      );
  }
  //#endregion
}
//#endregion