///
/// Copyright 2015-2026 Micro Focus or one of its affiliates.
///
/// Licensed under the Apache License, Version 2.0 (the "License");
/// you may not use this file except in compliance with the License.
/// You may obtain a copy of the License at
///
///      http://www.apache.org/licenses/LICENSE-2.0
///
/// Unless required by applicable law or agreed to in writing, software
/// distributed under the License is distributed on an "AS IS" BASIS,
/// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
/// See the License for the specific language governing permissions and
/// limitations under the License.
///

import {
  Component,
  ContentChild,
  Directive,
  ElementRef,
  EventEmitter,
  Input,
  OnInit,
  Output,
  ViewChild,
} from '@angular/core';
import { distinctUntilChanged, takeUntil } from 'rxjs/operators';
import { FocusIndicatorDirective } from '../../directives/accessibility/focus-indicator/focus-indicator.directive';
import { FocusIfDirective } from '../../directives/focus-if/focus-if.directive';
import { IconComponent } from '../icon/icon.component';
import { sidePanelStateAnimation } from '../side-panel/side-panel-animations';
import { SidePanelComponent } from '../side-panel/side-panel.component';
import { SidePanelService } from '../side-panel/side-panel.service';

@Directive({ selector: '[uxItemDisplayPanelContent]' })
export class ItemDisplayPanelContentDirective {}

@Directive({ selector: '[uxItemDisplayPanelFooter]' })
export class ItemDisplayPanelFooterDirective {}

@Component({
  selector: 'ux-item-display-panel',
  templateUrl: './item-display-panel.component.html',
  providers: [SidePanelService],
  animations: [sidePanelStateAnimation],
  host: {
    class: 'ux-side-panel ux-item-display-panel',
  },
  imports: [FocusIfDirective, FocusIndicatorDirective, IconComponent],
})
export class ItemDisplayPanelComponent extends SidePanelComponent implements OnInit {
  @Input() header: string;

  @Input() boxShadow: boolean = true;

  @Input() closeVisible: boolean = true;

  get preventClose(): boolean {
    return !this.closeOnExternalClick;
  }

  @Input()
  set preventClose(value: boolean) {
    this.closeOnExternalClick = !value;
  }

  /** Defines the aria-label for the close button */
  @Input() closeAriaLabel: string = 'Close';

  @Input() shadow: boolean = false;

  @Output() visibleChange: EventEmitter<boolean> = new EventEmitter<boolean>();

  @ContentChild(ItemDisplayPanelFooterDirective, { static: false })
  footer: ItemDisplayPanelFooterDirective;

  @ViewChild('panel', { static: true }) panel: ElementRef;

  @Input()
  set visible(visible: boolean) {
    this.open = visible;
  }

  get visible() {
    return this.open;
  }

  constructor() {
    super();

    this.animate = false;
    this.closeOnExternalClick = true;
  }

  ngOnInit() {
    super.ngOnInit();
    this.service.open$
      .pipe(distinctUntilChanged(), takeUntil(this._onDestroy))
      .subscribe(isVisible => this.visibleChange.emit(isVisible));
  }

  focus(): void {
    if (this.panel) {
      this.panel.nativeElement.focus();
    }
  }
}