///
/// 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,
  ElementRef,
  EventEmitter,
  HostBinding,
  inject,
  Input,
  OnDestroy,
  Output,
} from '@angular/core';
import { FocusIndicator, FocusIndicatorService } from '../../../../directives/accessibility/index';
import { IconComponent } from '../../../icon/icon.component';

@Component({
  selector: 'ux-facet-header',
  templateUrl: './facet-header.component.html',
  host: {
    role: 'button',
    tabindex: '0',
    '(click)': 'toggleExpand()',
    '(keyup.enter)': 'toggleExpand()',
    '[attr.aria-expanded]': 'expanded',
    '[attr.aria-label]': "header + ' Facet: Activate to ' + (expanded ? 'collapse' : 'expand')",
  },
  imports: [IconComponent],
})
export class FacetHeaderComponent implements OnDestroy {
  readonly focusIndicatorService = inject(FocusIndicatorService);
  readonly elementRef = inject(ElementRef);

  /** Defines the text to display in the header. */
  @Input() header: string;

  /** Defines whether or not clicking on the header will toggle the expanded state. */
  @Input() canExpand: boolean = true;

  /** Can be used to set the initial expanded state. */
  @Input() @HostBinding('class.expanded') expanded: boolean = true;

  /** If two-way binding is used it will be updated when the expanded state changes. */
  @Output() expandedChange: EventEmitter<boolean> = new EventEmitter<boolean>();

  /** Store Focus Indicator instance */
  private readonly _focusIndicator: FocusIndicator;

  constructor() {
    this._focusIndicator = this.focusIndicatorService.monitor(this.elementRef.nativeElement);
  }

  ngOnDestroy(): void {
    this._focusIndicator.destroy();
  }

  toggleExpand(): void {
    // if not expandable then do nothing
    if (this.canExpand) {
      this.expanded = !this.expanded;
      this.expandedChange.emit(this.expanded);
    }
  }
}