Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 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 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 | 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 185x 2360x 2360x 185x 185x 205x 205x 205x 205x 185x 185x 185x 185x 185x 185x 185x 185x 1x 1x 185x 185x 1x 1x 1180x 1180x 1x 1x 1180x 239x 941x 941x 236x 144x 92x 705x 705x 1180x 1180x 1180x 1x 1x 390x 205x 205x 390x 390x 1x | /*******************************************************************************
* Copyright bei
* Entwicklungs- und Pflegeverbund für das gemeinsame Fachverfahren gefa
*
*******************************************************************************/
import {
AfterViewInit,
Component,
ElementRef,
EventEmitter,
Input,
Output,
ViewChild,
} from '@angular/core';
import { WidgetKeySet } from '../../../utils/util.types';
import { createWidgetKeySet } from '../../../utils/utilities';
import { TooltipComponent } from '../../tooltip/tooltip.component';
/**
*
*/
@Component({
selector: 'gc-wizard-stepper-button',
templateUrl: './wizard-stepper-button.component.html',
styleUrls: [
'./../../../utils/styles/reset-button.css',
'./wizard-stepper-button.component.css',
],
host: {
// button with `role="tab"` must be a direct child of the tablist in Firefox, otherwise posinset/setsize are not detected properly,
// the host element interferes with this -> ensure the host is not part of the a11y tree
role: 'presentation',
},
})
export class WizardStepperButtonComponent implements AfterViewInit {
@Input()
public label = '';
@Input()
public number = 1;
@Input()
public variant: 'first' | 'middle' | 'last' = 'first';
@Input()
public disabled = false;
@Input()
public selected = false;
@Input()
public validated = false;
@Input()
public lastActiveStep = false;
@Input()
public controlledId = '';
@Output()
public readonly onAction: EventEmitter<void> = new EventEmitter<void>();
@ViewChild('button')
public button!: ElementRef<HTMLButtonElement>;
@ViewChild('tooltip')
private tooltip?: TooltipComponent;
get contentDisplay(): 'icon-only' | 'text-right' {
return this._contentDisplay;
}
@Input()
set contentDisplay(value: 'icon-only' | 'text-right') {
this._contentDisplay = value;
this.setTooltipOwner();
}
public readonly _widgetKeys: WidgetKeySet = createWidgetKeySet(
'gc-wizard-stepper-button',
);
public _hasFocus = false;
private _contentDisplay: 'icon-only' | 'text-right' = 'text-right';
ngAfterViewInit(): void {
this.setTooltipOwner();
}
public _getAriaLabel(): string {
return `${this.number.toFixed(0)} ${this.label} ${this.getAriaStatusMessage()}`;
}
private getAriaStatusMessage(): string {
if (this.disabled) {
return 'Gesperrt';
} else {
if (this.selected) {
return this.validated
? 'Ausgewählt, abgeschlossen'
: 'Ausgewählt, nicht abgeschlossen';
} else {
return this.validated ? 'Abgeschlossen' : 'Nicht abgeschlossen';
}
}
}
private setTooltipOwner(): void {
if (this.tooltip) {
this.tooltip.tooltipOwner =
this._contentDisplay === 'icon-only' ? this.button : undefined;
}
}
}
|