@festo-ui/angular 3.1.0-pre-20220307.3 → 3.1.0-pre-20220310.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/components/modals/alert/alert.component.mjs +3 -3
- package/esm2020/lib/components/popovers/tooltip/tooltip.directive.mjs +12 -6
- package/esm2020/lib/components/tabs/tabs.component.mjs +1 -3
- package/fesm2015/festo-ui-angular.mjs +10 -7
- package/fesm2015/festo-ui-angular.mjs.map +1 -1
- package/fesm2020/festo-ui-angular.mjs +10 -7
- package/fesm2020/festo-ui-angular.mjs.map +1 -1
- package/lib/components/popovers/tooltip/tooltip.directive.d.ts +5 -3
- package/package.json +1 -1
|
@@ -704,8 +704,8 @@ class TooltipDirective {
|
|
|
704
704
|
this.elmenetRef = elmenetRef;
|
|
705
705
|
this.popoverService = popoverService;
|
|
706
706
|
this.text = '';
|
|
707
|
-
// eslint-disable-next-line @angular-eslint/no-input-rename
|
|
708
707
|
this.isVisible = false;
|
|
708
|
+
this.positions = [];
|
|
709
709
|
this.options = {
|
|
710
710
|
maxWidth: 400,
|
|
711
711
|
delay: 0
|
|
@@ -752,7 +752,9 @@ class TooltipDirective {
|
|
|
752
752
|
origin: this.origin,
|
|
753
753
|
options: {
|
|
754
754
|
type: PopoverTypes.Tooltip,
|
|
755
|
-
maxWidth: this.options.maxWidth
|
|
755
|
+
maxWidth: this.options.maxWidth,
|
|
756
|
+
// using a set here removes duplicate positions and ensures that at least the bottom position will be used
|
|
757
|
+
positions: [...new Set([...this.positions, PopoverPosition.Bottom])]
|
|
756
758
|
}
|
|
757
759
|
});
|
|
758
760
|
this.innerIsVisible = true;
|
|
@@ -766,7 +768,7 @@ class TooltipDirective {
|
|
|
766
768
|
}
|
|
767
769
|
}
|
|
768
770
|
TooltipDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: TooltipDirective, deps: [{ token: i0.ElementRef }, { token: PopoverService }], target: i0.ɵɵFactoryTarget.Directive });
|
|
769
|
-
TooltipDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: TooltipDirective, selector: "[fngTooltip]", inputs: { text: ["fngTooltip", "text"], isVisible: ["fngTooltipVisible", "isVisible"], options: "options" }, host: { listeners: { "mouseenter": "show()", "mouseleave": "hide()" } }, usesOnChanges: true, ngImport: i0 });
|
|
771
|
+
TooltipDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.1", type: TooltipDirective, selector: "[fngTooltip]", inputs: { text: ["fngTooltip", "text"], isVisible: ["fngTooltipVisible", "isVisible"], positions: ["fngTooltipPositions", "positions"], options: "options" }, host: { listeners: { "mouseenter": "show()", "mouseleave": "hide()" } }, usesOnChanges: true, ngImport: i0 });
|
|
770
772
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: TooltipDirective, decorators: [{
|
|
771
773
|
type: Directive,
|
|
772
774
|
args: [{
|
|
@@ -778,6 +780,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
|
|
|
778
780
|
}], isVisible: [{
|
|
779
781
|
type: Input,
|
|
780
782
|
args: ['fngTooltipVisible']
|
|
783
|
+
}], positions: [{
|
|
784
|
+
type: Input,
|
|
785
|
+
args: ['fngTooltipPositions']
|
|
781
786
|
}], options: [{
|
|
782
787
|
type: Input
|
|
783
788
|
}], show: [{
|
|
@@ -1015,9 +1020,7 @@ class TabsComponent {
|
|
|
1015
1020
|
this.document = document;
|
|
1016
1021
|
this.renderer = renderer;
|
|
1017
1022
|
this.cd = cd;
|
|
1018
|
-
// eslint-disable-next-line @angular-eslint/no-input-rename
|
|
1019
1023
|
this.viewType = 'responsive';
|
|
1020
|
-
// eslint-disable-next-line @angular-eslint/no-input-rename
|
|
1021
1024
|
this.showDivider = false;
|
|
1022
1025
|
this.config = null;
|
|
1023
1026
|
this.fngTabChange = new EventEmitter();
|
|
@@ -5096,10 +5099,10 @@ class AlertComponent {
|
|
|
5096
5099
|
}
|
|
5097
5100
|
}
|
|
5098
5101
|
AlertComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5099
|
-
AlertComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: AlertComponent, selector: "fng-alert", inputs: { data: "data" }, outputs: { close: "close", cancel: "cancel", ok: "ok" }, host: { listeners: { "window:keyup": "onKeyUp($event)" } }, viewQueries: [{ propertyName: "closeBtn", first: true, predicate: ["closeBtn"], descendants: true }], ngImport: i0, template: "<div\n class=\"fwe-modal\"\n [ngClass]=\"{\n 'fwe-modal--with-indicator-bar': data?.strong === true,\n 'fwe-modal--warning': data?.alertType === 'warning',\n 'fwe-modal--error': data?.alertType === 'error',\n 'fwe-modal--info': data?.alertType === 'info'\n }\"\n>\n <div class=\"fwe-modal-close\">\n <button type=\"button\" aria-label=\"Close\" #closeBtn class=\"fwe-btn fwe-btn-link fwe-dark\" (click)=\"onClose()\">\n <i aria-hidden=\"true\" class=\"fwe-icon fwe-icon-close-small\"></i>\n <span class=\"fwe-sr-only\">Close</span>\n </button>\n </div>\n <div class=\"fwe-modal-header\">\n <h2 *ngIf=\"data?.subtitle\" class=\"fwe-modal-h2\">\n <i\n [ngClass]=\"{\n 'fwe-icon': true,\n 'fwe-icon-status-warning': data?.alertType === 'warning',\n 'fwe-icon-status-failure': data?.alertType === 'error',\n 'fwe-icon-status-check-status': data?.alertType === 'info'\n }\"\n ></i\n >{{ data?.subtitle }}\n </h2>\n <h1 class=\"fwe-modal-h1\">\n <i\n [ngClass]=\"{\n 'fwe-icon': true,\n 'fwe-icon-status-warning': data?.alertType === 'warning',\n 'fwe-icon-status-failure': data?.alertType === 'error',\n 'fwe-icon-status-check-status': data?.alertType === 'info'\n }\"\n ></i\n >{{ data?.title }}\n </h1>\n </div>\n <div class=\"fwe-modal-body\">\n <p>{{ data?.body }}</p>\n </div>\n <div class=\"fwe-modal-footer\" *ngIf=\"data?.cancel || data?.ok\">\n <div class=\"fwe-modal-buttons fwe-modal-buttons--full-width\">\n <button\n *ngIf=\"data?.cancel\"\n type=\"button\"\n aria-label=\"Cancel\"\n class=\"fwe-btn fwe-btn-lg\"\n [
|
|
5102
|
+
AlertComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: AlertComponent, selector: "fng-alert", inputs: { data: "data" }, outputs: { close: "close", cancel: "cancel", ok: "ok" }, host: { listeners: { "window:keyup": "onKeyUp($event)" } }, viewQueries: [{ propertyName: "closeBtn", first: true, predicate: ["closeBtn"], descendants: true }], ngImport: i0, template: "<div\n class=\"fwe-modal\"\n [ngClass]=\"{\n 'fwe-modal--with-indicator-bar': data?.strong === true,\n 'fwe-modal--warning': data?.alertType === 'warning',\n 'fwe-modal--error': data?.alertType === 'error',\n 'fwe-modal--info': data?.alertType === 'info'\n }\"\n>\n <div class=\"fwe-modal-close\">\n <button type=\"button\" aria-label=\"Close\" #closeBtn class=\"fwe-btn fwe-btn-link fwe-dark\" (click)=\"onClose()\">\n <i aria-hidden=\"true\" class=\"fwe-icon fwe-icon-close-small\"></i>\n <span class=\"fwe-sr-only\">Close</span>\n </button>\n </div>\n <div class=\"fwe-modal-header\">\n <h2 *ngIf=\"data?.subtitle\" class=\"fwe-modal-h2\">\n <i\n [ngClass]=\"{\n 'fwe-icon': true,\n 'fwe-icon-status-warning': data?.alertType === 'warning',\n 'fwe-icon-status-failure': data?.alertType === 'error',\n 'fwe-icon-status-check-status': data?.alertType === 'info'\n }\"\n ></i\n >{{ data?.subtitle }}\n </h2>\n <h1 class=\"fwe-modal-h1\">\n <i\n [ngClass]=\"{\n 'fwe-icon': true,\n 'fwe-icon-status-warning': data?.alertType === 'warning',\n 'fwe-icon-status-failure': data?.alertType === 'error',\n 'fwe-icon-status-check-status': data?.alertType === 'info'\n }\"\n ></i\n >{{ data?.title }}\n </h1>\n </div>\n <div class=\"fwe-modal-body\">\n <p>{{ data?.body }}</p>\n </div>\n <div class=\"fwe-modal-footer\" *ngIf=\"data?.cancel || data?.ok\">\n <div class=\"fwe-modal-buttons fwe-modal-buttons--full-width\">\n <button\n *ngIf=\"data?.cancel\"\n type=\"button\"\n aria-label=\"Cancel\"\n class=\"fwe-btn fwe-btn-lg\"\n [class.fwe-btn-link]=\"data?.strong\"\n (click)=\"onCancel()\"\n >\n {{ data?.cancel }}\n </button>\n <button\n *ngIf=\"data?.ok\"\n type=\"button\"\n aria-label=\"Ok\"\n class=\"fwe-btn fwe-btn-lg\"\n [class.fwe-btn-hero]=\"!data?.strong\"\n (click)=\"onOk()\"\n >\n {{ data?.ok }}\n </button>\n </div>\n </div>\n</div>\n", styles: [""], directives: [{ type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
5100
5103
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: AlertComponent, decorators: [{
|
|
5101
5104
|
type: Component,
|
|
5102
|
-
args: [{ selector: 'fng-alert', encapsulation: ViewEncapsulation.None, template: "<div\n class=\"fwe-modal\"\n [ngClass]=\"{\n 'fwe-modal--with-indicator-bar': data?.strong === true,\n 'fwe-modal--warning': data?.alertType === 'warning',\n 'fwe-modal--error': data?.alertType === 'error',\n 'fwe-modal--info': data?.alertType === 'info'\n }\"\n>\n <div class=\"fwe-modal-close\">\n <button type=\"button\" aria-label=\"Close\" #closeBtn class=\"fwe-btn fwe-btn-link fwe-dark\" (click)=\"onClose()\">\n <i aria-hidden=\"true\" class=\"fwe-icon fwe-icon-close-small\"></i>\n <span class=\"fwe-sr-only\">Close</span>\n </button>\n </div>\n <div class=\"fwe-modal-header\">\n <h2 *ngIf=\"data?.subtitle\" class=\"fwe-modal-h2\">\n <i\n [ngClass]=\"{\n 'fwe-icon': true,\n 'fwe-icon-status-warning': data?.alertType === 'warning',\n 'fwe-icon-status-failure': data?.alertType === 'error',\n 'fwe-icon-status-check-status': data?.alertType === 'info'\n }\"\n ></i\n >{{ data?.subtitle }}\n </h2>\n <h1 class=\"fwe-modal-h1\">\n <i\n [ngClass]=\"{\n 'fwe-icon': true,\n 'fwe-icon-status-warning': data?.alertType === 'warning',\n 'fwe-icon-status-failure': data?.alertType === 'error',\n 'fwe-icon-status-check-status': data?.alertType === 'info'\n }\"\n ></i\n >{{ data?.title }}\n </h1>\n </div>\n <div class=\"fwe-modal-body\">\n <p>{{ data?.body }}</p>\n </div>\n <div class=\"fwe-modal-footer\" *ngIf=\"data?.cancel || data?.ok\">\n <div class=\"fwe-modal-buttons fwe-modal-buttons--full-width\">\n <button\n *ngIf=\"data?.cancel\"\n type=\"button\"\n aria-label=\"Cancel\"\n class=\"fwe-btn fwe-btn-lg\"\n [
|
|
5105
|
+
args: [{ selector: 'fng-alert', encapsulation: ViewEncapsulation.None, template: "<div\n class=\"fwe-modal\"\n [ngClass]=\"{\n 'fwe-modal--with-indicator-bar': data?.strong === true,\n 'fwe-modal--warning': data?.alertType === 'warning',\n 'fwe-modal--error': data?.alertType === 'error',\n 'fwe-modal--info': data?.alertType === 'info'\n }\"\n>\n <div class=\"fwe-modal-close\">\n <button type=\"button\" aria-label=\"Close\" #closeBtn class=\"fwe-btn fwe-btn-link fwe-dark\" (click)=\"onClose()\">\n <i aria-hidden=\"true\" class=\"fwe-icon fwe-icon-close-small\"></i>\n <span class=\"fwe-sr-only\">Close</span>\n </button>\n </div>\n <div class=\"fwe-modal-header\">\n <h2 *ngIf=\"data?.subtitle\" class=\"fwe-modal-h2\">\n <i\n [ngClass]=\"{\n 'fwe-icon': true,\n 'fwe-icon-status-warning': data?.alertType === 'warning',\n 'fwe-icon-status-failure': data?.alertType === 'error',\n 'fwe-icon-status-check-status': data?.alertType === 'info'\n }\"\n ></i\n >{{ data?.subtitle }}\n </h2>\n <h1 class=\"fwe-modal-h1\">\n <i\n [ngClass]=\"{\n 'fwe-icon': true,\n 'fwe-icon-status-warning': data?.alertType === 'warning',\n 'fwe-icon-status-failure': data?.alertType === 'error',\n 'fwe-icon-status-check-status': data?.alertType === 'info'\n }\"\n ></i\n >{{ data?.title }}\n </h1>\n </div>\n <div class=\"fwe-modal-body\">\n <p>{{ data?.body }}</p>\n </div>\n <div class=\"fwe-modal-footer\" *ngIf=\"data?.cancel || data?.ok\">\n <div class=\"fwe-modal-buttons fwe-modal-buttons--full-width\">\n <button\n *ngIf=\"data?.cancel\"\n type=\"button\"\n aria-label=\"Cancel\"\n class=\"fwe-btn fwe-btn-lg\"\n [class.fwe-btn-link]=\"data?.strong\"\n (click)=\"onCancel()\"\n >\n {{ data?.cancel }}\n </button>\n <button\n *ngIf=\"data?.ok\"\n type=\"button\"\n aria-label=\"Ok\"\n class=\"fwe-btn fwe-btn-lg\"\n [class.fwe-btn-hero]=\"!data?.strong\"\n (click)=\"onOk()\"\n >\n {{ data?.ok }}\n </button>\n </div>\n </div>\n</div>\n", styles: [""] }]
|
|
5103
5106
|
}], propDecorators: { data: [{
|
|
5104
5107
|
type: Input
|
|
5105
5108
|
}], close: [{
|