All files / src/app/shared/components/common/modal-dialog-link modal-dialog-link.component.ts

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
9x
9x
 
9x
9x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
9x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
2x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
import { ChangeDetectionStrategy, Component, ContentChild, Input, ViewChild } from '@angular/core';
import { BehaviorSubject } from 'rxjs';
 
import { LazyLoadingContentDirective } from 'ish-core/directives/lazy-loading-content.directive';
import { ModalDialogComponent, ModalOptions } from 'ish-shared/components/common/modal-dialog/modal-dialog.component';
 
/**
 * The Modal Dialog Link Component
 *
 * Displays a link (see parameter linkText). If the user clicks the link a modal dialog opens displaying some information ( dynamic input content ).
 * The component is not designed or intended to contain any logic, but only to display text.
 *
 * The dynamic input content could be loaded on initialization (default) or on demand with lazy loading.
 * If the content should be loaded on demand, then the input content must apply the structural directive LazyLoadingContentDirective.
 * The component has now access to the template reference and can lazy load the input content, when the modal is opened.
 *
 * @example
 *<ish-modal-dialog-link
    linkText="checkout.tac.link"
    [options]="{ titleText: 'checkout.termsandconditions.details.title' | translate, size: 'lg' }"
  >
    <ish-content-include includeId="include.dialog.privacyPolicy.pagelet2-Include" *ishLazyLoadingContent></ish-content-include>
  </ish-modal-dialog-link>
 */
@Component({
  selector: 'ish-modal-dialog-link',
  templateUrl: './modal-dialog-link.component.html',
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class ModalDialogLinkComponent {
  /**
   * Link Text (translation key).
   */
  @Input({ required: true }) linkText: string;
 
  /**
   * Modal dialog options (see also @ModalDialogComponent).
   */
  @Input() options: ModalOptions;
 
  @ViewChild('modalDialog') modal: ModalDialogComponent<unknown>;
 
  @ContentChild(LazyLoadingContentDirective) lazyContent: LazyLoadingContentDirective;
 
  shown$ = new BehaviorSubject(false);
 
  /** enable parent components to close the modal */
  // not-dead-code
  hide() {
    this.modal.hide();
  }
 
  shown(): void {
    this.shown$.next(true);
  }
 
  closed(): void {
    this.shown$.next(false);
  }
}