@engie-group/fluid-design-system-angular/src/components/accordion-actions/directive/accordion-action.directive.ts

Fluid Design System Angular

import {Directive, inject, Input} from '@angular/core';
import {AccordionComponent} from '../../accordion/accordion.component';

@Directive({
  selector: '[njAccordionAction]',
  standalone: true,
  host: {
    'class': 'njAccordionAction',
    '[attr.data-accordion-expand]': "type === 'expand'",
    '[attr.data-accordion-collapse]': "type === 'collapse'",
    '(click)': 'handleClicked()'
  }
})
export class AccordionActionDirective {
  @Input('njAccordionAction') type?: 'expand' | 'collapse';

  private accordion? = inject(AccordionComponent);

  protected handleClicked() {
    if (this.type === 'expand') {
    this.accordion?.expandAllItems();
    }
    if(this.type === 'collapse') {
      this.accordion?.collapseAllItems();
    }
  }
}