@softpak/components 19.15.3 → 19.15.4-beta
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/fesm2022/softpak-components-spx-alert.mjs +7 -6
- package/fesm2022/softpak-components-spx-alert.mjs.map +1 -1
- package/fesm2022/softpak-components-spx-app-expiry.mjs +23 -91
- package/fesm2022/softpak-components-spx-app-expiry.mjs.map +1 -1
- package/fesm2022/softpak-components-spx-button.mjs +8 -22
- package/fesm2022/softpak-components-spx-button.mjs.map +1 -1
- package/fesm2022/softpak-components-spx-card.mjs +17 -88
- package/fesm2022/softpak-components-spx-card.mjs.map +1 -1
- package/fesm2022/softpak-components-spx-change-details.mjs +50 -70
- package/fesm2022/softpak-components-spx-change-details.mjs.map +1 -1
- package/fesm2022/softpak-components-spx-check-digit.mjs +23 -27
- package/fesm2022/softpak-components-spx-check-digit.mjs.map +1 -1
- package/fesm2022/softpak-components-spx-confirm.mjs +15 -10
- package/fesm2022/softpak-components-spx-confirm.mjs.map +1 -1
- package/fesm2022/softpak-components-spx-form-section.mjs +8 -33
- package/fesm2022/softpak-components-spx-form-section.mjs.map +1 -1
- package/fesm2022/softpak-components-spx-form-view.mjs +39 -53
- package/fesm2022/softpak-components-spx-form-view.mjs.map +1 -1
- package/fesm2022/softpak-components-spx-inputs.mjs +2 -0
- package/fesm2022/softpak-components-spx-inputs.mjs.map +1 -1
- package/fesm2022/softpak-components-spx-navigation.mjs +34 -89
- package/fesm2022/softpak-components-spx-navigation.mjs.map +1 -1
- package/fesm2022/softpak-components-spx-number-check.mjs +91 -198
- package/fesm2022/softpak-components-spx-number-check.mjs.map +1 -1
- package/fesm2022/softpak-components-spx-pagination.mjs +12 -21
- package/fesm2022/softpak-components-spx-pagination.mjs.map +1 -1
- package/fesm2022/softpak-components-spx-patch.mjs +8 -39
- package/fesm2022/softpak-components-spx-patch.mjs.map +1 -1
- package/fesm2022/softpak-components-spx-progress-bar.mjs +8 -22
- package/fesm2022/softpak-components-spx-progress-bar.mjs.map +1 -1
- package/fesm2022/softpak-components-spx-spinner.mjs +15 -160
- package/fesm2022/softpak-components-spx-spinner.mjs.map +1 -1
- package/fesm2022/softpak-components-spx-stock-info.mjs +69 -124
- package/fesm2022/softpak-components-spx-stock-info.mjs.map +1 -1
- package/fesm2022/softpak-components-spx-toaster.mjs +36 -155
- package/fesm2022/softpak-components-spx-toaster.mjs.map +1 -1
- package/fesm2022/softpak-components-spx-update.mjs +3 -3
- package/fesm2022/softpak-components-spx-update.mjs.map +1 -1
- package/fesm2022/softpak-components-spx-validation.mjs +68 -54
- package/fesm2022/softpak-components-spx-validation.mjs.map +1 -1
- package/package.json +28 -28
- package/spx-alert/spx-alert.component.d.ts +1 -1
- package/spx-app-expiry/spx-app-expiry.component.d.ts +14 -14
- package/spx-button/spx-button.component.d.ts +0 -3
- package/spx-card/spx-card-item/spx-card-item.component.d.ts +0 -1
- package/spx-card/spx-card.component.d.ts +8 -9
- package/spx-change-details/spx-change-details.component.d.ts +22 -23
- package/spx-check-digit/spx-check-digit.component.d.ts +9 -9
- package/spx-confirm/store/spx-confirm.actions.d.ts +8 -1
- package/spx-confirm/store/spx-confirm.effects.d.ts +1 -1
- package/spx-form-section/spx-form-section.component.d.ts +5 -5
- package/spx-form-view/spx-autocomplete-search.component.d.ts +15 -16
- package/spx-form-view/spx-form-view.component.d.ts +1 -1
- package/spx-navigation/public-api.d.ts +2 -2
- package/spx-navigation/spx-home-tile/spx-home-tile.component.d.ts +11 -0
- package/spx-navigation/{spx-home-tiles.component.d.ts → spx-home-tile/spx-home-tiles.component.d.ts} +2 -2
- package/spx-navigation/spx-navigation.component.d.ts +11 -8
- package/spx-number-check/spx-number-check.component.d.ts +26 -32
- package/spx-pagination/spx-pagination.component.d.ts +9 -10
- package/spx-patch/spx-patch.component.d.ts +4 -4
- package/spx-progress-bar/spx-progress-bar.component.d.ts +3 -3
- package/spx-spinner/spx-spinner.component.d.ts +3 -3
- package/spx-stock-info/spx-stock-info.component.d.ts +45 -46
- package/spx-toaster/src/spx-toaster-message.interface.d.ts +3 -1
- package/spx-toaster/src/spx-toaster.component.d.ts +7 -13
- package/spx-validation/spx-validate-control.component.d.ts +19 -19
- package/tailwind.css +1 -1
- package/spx-navigation/spx-home-tile.component.d.ts +0 -11
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { output, input, model, Component } from '@angular/core';
|
|
2
|
+
import { signal, output, input, model, Component, ChangeDetectionStrategy } from '@angular/core';
|
|
3
3
|
import * as i1 from '@fortawesome/angular-fontawesome';
|
|
4
4
|
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
|
|
5
5
|
import { faCheck, faCircleInfo, faTriangleExclamation, faTimes } from '@fortawesome/free-solid-svg-icons';
|
|
@@ -8,6 +8,7 @@ import { IsSeverityPipe } from '@softpak/components/spx-pipes';
|
|
|
8
8
|
|
|
9
9
|
class SpxAlertComponent {
|
|
10
10
|
constructor() {
|
|
11
|
+
this._autoCloseTimeout = signal(null);
|
|
11
12
|
this.spxClose = output();
|
|
12
13
|
this.spxAutoclose = input();
|
|
13
14
|
this.spxCloseable = input(false);
|
|
@@ -30,10 +31,10 @@ class SpxAlertComponent {
|
|
|
30
31
|
}
|
|
31
32
|
}
|
|
32
33
|
prepareAutoClose() {
|
|
33
|
-
this._autoCloseTimeout
|
|
34
|
+
this._autoCloseTimeout.set(setTimeout(() => {
|
|
34
35
|
this.onClose();
|
|
35
|
-
this._autoCloseTimeout
|
|
36
|
-
}, this.spxAutoclose());
|
|
36
|
+
this._autoCloseTimeout.set(null);
|
|
37
|
+
}, this.spxAutoclose()));
|
|
37
38
|
}
|
|
38
39
|
_assignDefaultTitle() {
|
|
39
40
|
switch (this.spxSeverity()) {
|
|
@@ -57,14 +58,14 @@ class SpxAlertComponent {
|
|
|
57
58
|
}
|
|
58
59
|
}
|
|
59
60
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: SpxAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
60
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: SpxAlertComponent, isStandalone: true, selector: "spx-alert", inputs: { spxAutoclose: { classPropertyName: "spxAutoclose", publicName: "spxAutoclose", isSignal: true, isRequired: false, transformFunction: null }, spxCloseable: { classPropertyName: "spxCloseable", publicName: "spxCloseable", isSignal: true, isRequired: false, transformFunction: null }, spxHideTitle: { classPropertyName: "spxHideTitle", publicName: "spxHideTitle", isSignal: true, isRequired: false, transformFunction: null }, spxTitle: { classPropertyName: "spxTitle", publicName: "spxTitle", isSignal: true, isRequired: false, transformFunction: null }, spxMarginTop: { classPropertyName: "spxMarginTop", publicName: "spxMarginTop", isSignal: true, isRequired: false, transformFunction: null }, spxSeverity: { classPropertyName: "spxSeverity", publicName: "spxSeverity", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { spxClose: "spxClose", spxTitle: "spxTitleChange" }, ngImport: i0, template: "<div class=\"flex items-center gap-3 border-t-4 rounded px-4 py-3 shadow-md\"\r\n [class.cursor-pointer]=\"this.spxCloseable()\"\r\n [class.bg-red-100]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.border-red-500]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.text-red-900]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.bg-cyan-100]=\"this.spxSeverity() | isSeverity: SpxSeverity.info\"\r\n [class.border-cyan-500]=\"this.spxSeverity() | isSeverity: SpxSeverity.info\"\r\n [class.text-cyan-900]=\"this.spxSeverity() | isSeverity: SpxSeverity.info\"\r\n [class.bg-lime-100]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.border-lime-500]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.text-lime-900]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.bg-amber-100]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.border-amber-500]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.text-amber-900]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.focus:ring-red-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.error)\"\r\n [class.hover:bg-red-200]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.error)\"\r\n [class.over:border-red-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.error)\"\r\n [class.focus:ring-cyan-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.hover:bg-cyan-200]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.over:border-cyan-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.focus:ring-lime-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.success)\"\r\n [class.hover:bg-lime-200]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.success)\"\r\n [class.over:border-lime-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.success)\"\r\n [class.focus:ring-amber-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.warning)\"\r\n [class.hover:bg-amber-200]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.warning)\"\r\n [class.over:border-amber-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.warning)\"\r\n (click)=\"onClose()\">\r\n @if ((this.spxSeverity() | isSeverity: SpxSeverity.info)) {\r\n <fa-icon\r\n [icon]=\"faCircleInfo\" class=\"block text-xl text-cyan-600\"></fa-icon>\r\n }\r\n @if (this.spxSeverity() | isSeverity: SpxSeverity.error) {\r\n <fa-icon\r\n [icon]=\"faTriangleExclamation\" class=\"block text-xl text-red-600\"></fa-icon>\r\n }\r\n @if (this.spxSeverity() | isSeverity: SpxSeverity.success) {\r\n <fa-icon\r\n [icon]=\"faCheck\" class=\"block text-xl text-lime-600\"></fa-icon>\r\n }\r\n @if (this.spxSeverity() | isSeverity: SpxSeverity.warning) {\r\n <fa-icon\r\n [icon]=\"faTriangleExclamation\" class=\"block text-xl text-amber-600\"></fa-icon>\r\n }\r\n <div class=\"grow\">\r\n @if (this.spxTitle() && !this.spxHideTitle()) {\r\n <p class=\"font-bold\">{{this.spxTitle()}}</p>\r\n }\r\n <p class=\"text-sm\">\r\n <ng-content></ng-content>\r\n </p>\r\n </div>\r\n @if (this.spxCloseable()) {\r\n <fa-icon\r\n [icon]=\"faTimes\" class=\"block text-xl\"></fa-icon>\r\n }\r\n </div>", dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { kind: "pipe", type: IsSeverityPipe, name: "isSeverity" }] }); }
|
|
61
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: SpxAlertComponent, isStandalone: true, selector: "spx-alert", inputs: { spxAutoclose: { classPropertyName: "spxAutoclose", publicName: "spxAutoclose", isSignal: true, isRequired: false, transformFunction: null }, spxCloseable: { classPropertyName: "spxCloseable", publicName: "spxCloseable", isSignal: true, isRequired: false, transformFunction: null }, spxHideTitle: { classPropertyName: "spxHideTitle", publicName: "spxHideTitle", isSignal: true, isRequired: false, transformFunction: null }, spxTitle: { classPropertyName: "spxTitle", publicName: "spxTitle", isSignal: true, isRequired: false, transformFunction: null }, spxMarginTop: { classPropertyName: "spxMarginTop", publicName: "spxMarginTop", isSignal: true, isRequired: false, transformFunction: null }, spxSeverity: { classPropertyName: "spxSeverity", publicName: "spxSeverity", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { spxClose: "spxClose", spxTitle: "spxTitleChange" }, ngImport: i0, template: "<div class=\"flex items-center gap-3 border-t-4 rounded px-4 py-3 shadow-md\"\r\n [class.cursor-pointer]=\"this.spxCloseable()\"\r\n [class.bg-red-100]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.border-red-500]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.text-red-900]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.bg-cyan-100]=\"this.spxSeverity() | isSeverity: SpxSeverity.info\"\r\n [class.border-cyan-500]=\"this.spxSeverity() | isSeverity: SpxSeverity.info\"\r\n [class.text-cyan-900]=\"this.spxSeverity() | isSeverity: SpxSeverity.info\"\r\n [class.bg-lime-100]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.border-lime-500]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.text-lime-900]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.bg-amber-100]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.border-amber-500]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.text-amber-900]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.focus:ring-red-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.error)\"\r\n [class.hover:bg-red-200]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.error)\"\r\n [class.over:border-red-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.error)\"\r\n [class.focus:ring-cyan-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.hover:bg-cyan-200]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.over:border-cyan-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.focus:ring-lime-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.success)\"\r\n [class.hover:bg-lime-200]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.success)\"\r\n [class.over:border-lime-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.success)\"\r\n [class.focus:ring-amber-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.warning)\"\r\n [class.hover:bg-amber-200]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.warning)\"\r\n [class.over:border-amber-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.warning)\"\r\n (click)=\"onClose()\">\r\n @if ((this.spxSeverity() | isSeverity: SpxSeverity.info)) {\r\n <fa-icon\r\n [icon]=\"faCircleInfo\" class=\"block text-xl text-cyan-600\"></fa-icon>\r\n }\r\n @if (this.spxSeverity() | isSeverity: SpxSeverity.error) {\r\n <fa-icon\r\n [icon]=\"faTriangleExclamation\" class=\"block text-xl text-red-600\"></fa-icon>\r\n }\r\n @if (this.spxSeverity() | isSeverity: SpxSeverity.success) {\r\n <fa-icon\r\n [icon]=\"faCheck\" class=\"block text-xl text-lime-600\"></fa-icon>\r\n }\r\n @if (this.spxSeverity() | isSeverity: SpxSeverity.warning) {\r\n <fa-icon\r\n [icon]=\"faTriangleExclamation\" class=\"block text-xl text-amber-600\"></fa-icon>\r\n }\r\n <div class=\"grow\">\r\n @if (this.spxTitle() && !this.spxHideTitle()) {\r\n <p class=\"font-bold\">{{this.spxTitle()}}</p>\r\n }\r\n <p class=\"text-sm\">\r\n <ng-content></ng-content>\r\n </p>\r\n </div>\r\n @if (this.spxCloseable()) {\r\n <fa-icon\r\n [icon]=\"faTimes\" class=\"block text-xl\"></fa-icon>\r\n }\r\n </div>", dependencies: [{ kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "mask", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "transform", "a11yRole"] }, { kind: "pipe", type: IsSeverityPipe, name: "isSeverity" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
61
62
|
}
|
|
62
63
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: SpxAlertComponent, decorators: [{
|
|
63
64
|
type: Component,
|
|
64
65
|
args: [{ selector: 'spx-alert', imports: [
|
|
65
66
|
FontAwesomeModule,
|
|
66
67
|
IsSeverityPipe
|
|
67
|
-
], template: "<div class=\"flex items-center gap-3 border-t-4 rounded px-4 py-3 shadow-md\"\r\n [class.cursor-pointer]=\"this.spxCloseable()\"\r\n [class.bg-red-100]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.border-red-500]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.text-red-900]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.bg-cyan-100]=\"this.spxSeverity() | isSeverity: SpxSeverity.info\"\r\n [class.border-cyan-500]=\"this.spxSeverity() | isSeverity: SpxSeverity.info\"\r\n [class.text-cyan-900]=\"this.spxSeverity() | isSeverity: SpxSeverity.info\"\r\n [class.bg-lime-100]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.border-lime-500]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.text-lime-900]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.bg-amber-100]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.border-amber-500]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.text-amber-900]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.focus:ring-red-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.error)\"\r\n [class.hover:bg-red-200]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.error)\"\r\n [class.over:border-red-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.error)\"\r\n [class.focus:ring-cyan-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.hover:bg-cyan-200]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.over:border-cyan-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.focus:ring-lime-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.success)\"\r\n [class.hover:bg-lime-200]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.success)\"\r\n [class.over:border-lime-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.success)\"\r\n [class.focus:ring-amber-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.warning)\"\r\n [class.hover:bg-amber-200]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.warning)\"\r\n [class.over:border-amber-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.warning)\"\r\n (click)=\"onClose()\">\r\n @if ((this.spxSeverity() | isSeverity: SpxSeverity.info)) {\r\n <fa-icon\r\n [icon]=\"faCircleInfo\" class=\"block text-xl text-cyan-600\"></fa-icon>\r\n }\r\n @if (this.spxSeverity() | isSeverity: SpxSeverity.error) {\r\n <fa-icon\r\n [icon]=\"faTriangleExclamation\" class=\"block text-xl text-red-600\"></fa-icon>\r\n }\r\n @if (this.spxSeverity() | isSeverity: SpxSeverity.success) {\r\n <fa-icon\r\n [icon]=\"faCheck\" class=\"block text-xl text-lime-600\"></fa-icon>\r\n }\r\n @if (this.spxSeverity() | isSeverity: SpxSeverity.warning) {\r\n <fa-icon\r\n [icon]=\"faTriangleExclamation\" class=\"block text-xl text-amber-600\"></fa-icon>\r\n }\r\n <div class=\"grow\">\r\n @if (this.spxTitle() && !this.spxHideTitle()) {\r\n <p class=\"font-bold\">{{this.spxTitle()}}</p>\r\n }\r\n <p class=\"text-sm\">\r\n <ng-content></ng-content>\r\n </p>\r\n </div>\r\n @if (this.spxCloseable()) {\r\n <fa-icon\r\n [icon]=\"faTimes\" class=\"block text-xl\"></fa-icon>\r\n }\r\n </div>" }]
|
|
68
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"flex items-center gap-3 border-t-4 rounded px-4 py-3 shadow-md\"\r\n [class.cursor-pointer]=\"this.spxCloseable()\"\r\n [class.bg-red-100]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.border-red-500]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.text-red-900]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.bg-cyan-100]=\"this.spxSeverity() | isSeverity: SpxSeverity.info\"\r\n [class.border-cyan-500]=\"this.spxSeverity() | isSeverity: SpxSeverity.info\"\r\n [class.text-cyan-900]=\"this.spxSeverity() | isSeverity: SpxSeverity.info\"\r\n [class.bg-lime-100]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.border-lime-500]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.text-lime-900]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.bg-amber-100]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.border-amber-500]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.text-amber-900]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.focus:ring-red-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.error)\"\r\n [class.hover:bg-red-200]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.error)\"\r\n [class.over:border-red-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.error)\"\r\n [class.focus:ring-cyan-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.hover:bg-cyan-200]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.over:border-cyan-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.focus:ring-lime-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.success)\"\r\n [class.hover:bg-lime-200]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.success)\"\r\n [class.over:border-lime-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.success)\"\r\n [class.focus:ring-amber-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.warning)\"\r\n [class.hover:bg-amber-200]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.warning)\"\r\n [class.over:border-amber-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.warning)\"\r\n (click)=\"onClose()\">\r\n @if ((this.spxSeverity() | isSeverity: SpxSeverity.info)) {\r\n <fa-icon\r\n [icon]=\"faCircleInfo\" class=\"block text-xl text-cyan-600\"></fa-icon>\r\n }\r\n @if (this.spxSeverity() | isSeverity: SpxSeverity.error) {\r\n <fa-icon\r\n [icon]=\"faTriangleExclamation\" class=\"block text-xl text-red-600\"></fa-icon>\r\n }\r\n @if (this.spxSeverity() | isSeverity: SpxSeverity.success) {\r\n <fa-icon\r\n [icon]=\"faCheck\" class=\"block text-xl text-lime-600\"></fa-icon>\r\n }\r\n @if (this.spxSeverity() | isSeverity: SpxSeverity.warning) {\r\n <fa-icon\r\n [icon]=\"faTriangleExclamation\" class=\"block text-xl text-amber-600\"></fa-icon>\r\n }\r\n <div class=\"grow\">\r\n @if (this.spxTitle() && !this.spxHideTitle()) {\r\n <p class=\"font-bold\">{{this.spxTitle()}}</p>\r\n }\r\n <p class=\"text-sm\">\r\n <ng-content></ng-content>\r\n </p>\r\n </div>\r\n @if (this.spxCloseable()) {\r\n <fa-icon\r\n [icon]=\"faTimes\" class=\"block text-xl\"></fa-icon>\r\n }\r\n </div>" }]
|
|
68
69
|
}] });
|
|
69
70
|
|
|
70
71
|
class SpxAlertI {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"softpak-components-spx-alert.mjs","sources":["../../../../projects/softpak/components/spx-alert/spx-alert.component.ts","../../../../projects/softpak/components/spx-alert/spx-alert.component.html","../../../../projects/softpak/components/spx-alert/spx-alert.interface.ts","../../../../projects/softpak/components/spx-alert/softpak-components-spx-alert.ts"],"sourcesContent":["\r\nimport { Component, input, model, output } from '@angular/core';\r\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\r\nimport { faCheck, faCircleInfo, faTimes, faTriangleExclamation } from '@fortawesome/free-solid-svg-icons';\r\nimport { SpxSeverityEnum } from '@softpak/components/spx-helpers';\r\nimport { IsSeverityPipe } from \"@softpak/components/spx-pipes\";\r\n\r\n@Component({\r\n selector: 'spx-alert',\r\n imports: [\r\n FontAwesomeModule,\r\n IsSeverityPipe\r\n],\r\n templateUrl: './spx-alert.component.html'\r\n})\r\nexport class SpxAlertComponent {\r\n _autoCloseTimeout
|
|
1
|
+
{"version":3,"file":"softpak-components-spx-alert.mjs","sources":["../../../../projects/softpak/components/spx-alert/spx-alert.component.ts","../../../../projects/softpak/components/spx-alert/spx-alert.component.html","../../../../projects/softpak/components/spx-alert/spx-alert.interface.ts","../../../../projects/softpak/components/spx-alert/softpak-components-spx-alert.ts"],"sourcesContent":["\r\nimport { ChangeDetectionStrategy, Component, input, model, output, signal } from '@angular/core';\r\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\r\nimport { faCheck, faCircleInfo, faTimes, faTriangleExclamation } from '@fortawesome/free-solid-svg-icons';\r\nimport { SpxSeverityEnum } from '@softpak/components/spx-helpers';\r\nimport { IsSeverityPipe } from \"@softpak/components/spx-pipes\";\r\n\r\n@Component({\r\n selector: 'spx-alert',\r\n imports: [\r\n FontAwesomeModule,\r\n IsSeverityPipe\r\n],\r\n templateUrl: './spx-alert.component.html',\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n standalone: true,\r\n})\r\nexport class SpxAlertComponent {\r\n _autoCloseTimeout = signal<NodeJS.Timeout | null>(null);\r\n spxClose = output();\r\n readonly spxAutoclose = input<number>();\r\n readonly spxCloseable = input<boolean | undefined>(false);\r\n readonly spxHideTitle = input(false);\r\n readonly spxTitle = model<string>();\r\n readonly spxMarginTop = input(false);\r\n readonly spxSeverity = input<SpxSeverityEnum>();\r\n SpxSeverity = SpxSeverityEnum;\r\n faCheck = faCheck;\r\n faCircleInfo = faCircleInfo;\r\n faTriangleExclamation = faTriangleExclamation;\r\n faTimes = faTimes;\r\n\r\n componentDidLoad() {\r\n if (this.spxAutoclose()) {\r\n this.prepareAutoClose();\r\n }\r\n if (!this.spxTitle()) {\r\n this._assignDefaultTitle();\r\n }\r\n }\r\n\r\n private prepareAutoClose(): void {\r\n this._autoCloseTimeout.set(setTimeout(() => {\r\n this.onClose();\r\n this._autoCloseTimeout.set(null);\r\n }, this.spxAutoclose()));\r\n }\r\n\r\n private _assignDefaultTitle(): void {\r\n switch (this.spxSeverity()) {\r\n case SpxSeverityEnum.error:\r\n this.spxTitle.set('Error');\r\n break;\r\n case SpxSeverityEnum.info:\r\n this.spxTitle.set('Info');\r\n break;\r\n case SpxSeverityEnum.success:\r\n this.spxTitle.set('Notification');\r\n break;\r\n case SpxSeverityEnum.warning:\r\n this.spxTitle.set('Warning');\r\n break;\r\n }\r\n }\r\n\r\n onClose() {\r\n if (this.spxCloseable()) {\r\n this.spxClose.emit();\r\n }\r\n }\r\n}\r\n","<div class=\"flex items-center gap-3 border-t-4 rounded px-4 py-3 shadow-md\"\r\n [class.cursor-pointer]=\"this.spxCloseable()\"\r\n [class.bg-red-100]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.border-red-500]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.text-red-900]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.bg-cyan-100]=\"this.spxSeverity() | isSeverity: SpxSeverity.info\"\r\n [class.border-cyan-500]=\"this.spxSeverity() | isSeverity: SpxSeverity.info\"\r\n [class.text-cyan-900]=\"this.spxSeverity() | isSeverity: SpxSeverity.info\"\r\n [class.bg-lime-100]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.border-lime-500]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.text-lime-900]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.bg-amber-100]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.border-amber-500]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.text-amber-900]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.focus:ring-red-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.error)\"\r\n [class.hover:bg-red-200]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.error)\"\r\n [class.over:border-red-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.error)\"\r\n [class.focus:ring-cyan-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.hover:bg-cyan-200]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.over:border-cyan-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.focus:ring-lime-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.success)\"\r\n [class.hover:bg-lime-200]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.success)\"\r\n [class.over:border-lime-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.success)\"\r\n [class.focus:ring-amber-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.warning)\"\r\n [class.hover:bg-amber-200]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.warning)\"\r\n [class.over:border-amber-600]=\"this.spxCloseable() && (this.spxSeverity() | isSeverity: SpxSeverity.warning)\"\r\n (click)=\"onClose()\">\r\n @if ((this.spxSeverity() | isSeverity: SpxSeverity.info)) {\r\n <fa-icon\r\n [icon]=\"faCircleInfo\" class=\"block text-xl text-cyan-600\"></fa-icon>\r\n }\r\n @if (this.spxSeverity() | isSeverity: SpxSeverity.error) {\r\n <fa-icon\r\n [icon]=\"faTriangleExclamation\" class=\"block text-xl text-red-600\"></fa-icon>\r\n }\r\n @if (this.spxSeverity() | isSeverity: SpxSeverity.success) {\r\n <fa-icon\r\n [icon]=\"faCheck\" class=\"block text-xl text-lime-600\"></fa-icon>\r\n }\r\n @if (this.spxSeverity() | isSeverity: SpxSeverity.warning) {\r\n <fa-icon\r\n [icon]=\"faTriangleExclamation\" class=\"block text-xl text-amber-600\"></fa-icon>\r\n }\r\n <div class=\"grow\">\r\n @if (this.spxTitle() && !this.spxHideTitle()) {\r\n <p class=\"font-bold\">{{this.spxTitle()}}</p>\r\n }\r\n <p class=\"text-sm\">\r\n <ng-content></ng-content>\r\n </p>\r\n </div>\r\n @if (this.spxCloseable()) {\r\n <fa-icon\r\n [icon]=\"faTimes\" class=\"block text-xl\"></fa-icon>\r\n }\r\n </div>","import { SpxSeverityEnum } from \"@softpak/components/spx-helpers\";\r\n\r\nexport class SpxAlertI {\r\n closeable?: boolean;\r\n id?: number;\r\n message?: string;\r\n severity?: SpxSeverityEnum;\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Component,
|
|
2
|
+
import { input, signal, Component, ChangeDetectionStrategy } from '@angular/core';
|
|
3
3
|
import { DateTime } from 'luxon';
|
|
4
4
|
|
|
5
5
|
const spxCheckExpiryWarning = (appStoreVersion, spxAppExpiry) => {
|
|
@@ -16,104 +16,36 @@ const spxCheckExpiryHappened = (appStoreVersion, spxAppExpiry) => {
|
|
|
16
16
|
|
|
17
17
|
class SpxAppExpiryComponent {
|
|
18
18
|
constructor() {
|
|
19
|
-
this.
|
|
20
|
-
this.
|
|
21
|
-
this.
|
|
19
|
+
this.txtContactHelpdeskOrSoftpak = input.required();
|
|
20
|
+
this.txtExpired = input.required();
|
|
21
|
+
this.txtLastReminder = input.required();
|
|
22
|
+
this.txtPleaseOpenTheAppStore = input.required();
|
|
23
|
+
this.txtPleaseUpdate = input.required();
|
|
24
|
+
this.txtThisVersionWillExpireSoon = input.required();
|
|
25
|
+
this.txtUpdateAvailable = input.required();
|
|
26
|
+
this.txtUpdateTheAppToTheLatestVersion = input.required();
|
|
27
|
+
this.spxExpiry = input.required();
|
|
28
|
+
this.spxVersion = input.required();
|
|
29
|
+
this.warning = signal(false);
|
|
30
|
+
this.finalWarning = signal(false);
|
|
31
|
+
this.expired = signal(false);
|
|
22
32
|
}
|
|
23
33
|
ngOnChanges() {
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
this.
|
|
34
|
+
const spxExpiry = this.spxExpiry();
|
|
35
|
+
const spxVersion = this.spxVersion();
|
|
36
|
+
if (spxExpiry && spxVersion) {
|
|
37
|
+
this.expired.set(spxCheckExpiryHappened(spxVersion, spxExpiry));
|
|
38
|
+
this.finalWarning.set(spxCheckExpiryFinalWarning(spxVersion, spxExpiry) && !this.expired());
|
|
39
|
+
this.warning.set(spxCheckExpiryWarning(spxVersion, spxExpiry) && !this.finalWarning && !this.expired());
|
|
28
40
|
}
|
|
29
41
|
}
|
|
30
42
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: SpxAppExpiryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
31
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: SpxAppExpiryComponent, isStandalone: true, selector: "spx-app-expiry", inputs: { txtContactHelpdeskOrSoftpak: "txtContactHelpdeskOrSoftpak", txtExpired: "txtExpired", txtLastReminder: "txtLastReminder", txtPleaseOpenTheAppStore: "txtPleaseOpenTheAppStore", txtPleaseUpdate: "txtPleaseUpdate", txtThisVersionWillExpireSoon: "txtThisVersionWillExpireSoon", txtUpdateAvailable: "txtUpdateAvailable", txtUpdateTheAppToTheLatestVersion: "txtUpdateTheAppToTheLatestVersion", spxExpiry: "spxExpiry", spxVersion: "spxVersion" }, usesOnChanges: true, ngImport: i0, template:
|
|
32
|
-
@if (warning || finalWarning || expired) {
|
|
33
|
-
<div class="m-3">
|
|
34
|
-
<div
|
|
35
|
-
class="p-3 font-bold text-white rounded-t text-xl"
|
|
36
|
-
[class.bg-lime-600]="warning"
|
|
37
|
-
[class.bg-red-600]="expired"
|
|
38
|
-
[class.bg-amber-600]="finalWarning">
|
|
39
|
-
@if (warning) {
|
|
40
|
-
{{ txtUpdateAvailable }}
|
|
41
|
-
}
|
|
42
|
-
@if (finalWarning) {
|
|
43
|
-
{{ txtLastReminder }}
|
|
44
|
-
}
|
|
45
|
-
@if (expired) {
|
|
46
|
-
{{ txtExpired }}
|
|
47
|
-
}
|
|
48
|
-
</div>
|
|
49
|
-
<div
|
|
50
|
-
class="bg-amber-50 p-3 text-black rounded-b mb-3">
|
|
51
|
-
<div>{{ txtPleaseOpenTheAppStore }}.</div>
|
|
52
|
-
<div>{{ txtUpdateTheAppToTheLatestVersion }}.</div>
|
|
53
|
-
<div>{{ txtContactHelpdeskOrSoftpak }}.</div>
|
|
54
|
-
@if (finalWarning) {
|
|
55
|
-
<div>{{ txtThisVersionWillExpireSoon }}.</div>
|
|
56
|
-
}
|
|
57
|
-
</div>
|
|
58
|
-
</div>
|
|
59
|
-
}`, isInline: true }); }
|
|
43
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: SpxAppExpiryComponent, isStandalone: true, selector: "spx-app-expiry", inputs: { txtContactHelpdeskOrSoftpak: { classPropertyName: "txtContactHelpdeskOrSoftpak", publicName: "txtContactHelpdeskOrSoftpak", isSignal: true, isRequired: true, transformFunction: null }, txtExpired: { classPropertyName: "txtExpired", publicName: "txtExpired", isSignal: true, isRequired: true, transformFunction: null }, txtLastReminder: { classPropertyName: "txtLastReminder", publicName: "txtLastReminder", isSignal: true, isRequired: true, transformFunction: null }, txtPleaseOpenTheAppStore: { classPropertyName: "txtPleaseOpenTheAppStore", publicName: "txtPleaseOpenTheAppStore", isSignal: true, isRequired: true, transformFunction: null }, txtPleaseUpdate: { classPropertyName: "txtPleaseUpdate", publicName: "txtPleaseUpdate", isSignal: true, isRequired: true, transformFunction: null }, txtThisVersionWillExpireSoon: { classPropertyName: "txtThisVersionWillExpireSoon", publicName: "txtThisVersionWillExpireSoon", isSignal: true, isRequired: true, transformFunction: null }, txtUpdateAvailable: { classPropertyName: "txtUpdateAvailable", publicName: "txtUpdateAvailable", isSignal: true, isRequired: true, transformFunction: null }, txtUpdateTheAppToTheLatestVersion: { classPropertyName: "txtUpdateTheAppToTheLatestVersion", publicName: "txtUpdateTheAppToTheLatestVersion", isSignal: true, isRequired: true, transformFunction: null }, spxExpiry: { classPropertyName: "spxExpiry", publicName: "spxExpiry", isSignal: true, isRequired: true, transformFunction: null }, spxVersion: { classPropertyName: "spxVersion", publicName: "spxVersion", isSignal: true, isRequired: true, transformFunction: null } }, usesOnChanges: true, ngImport: i0, template: "@if (warning() || finalWarning() || expired()) {\r\n <div class=\"m-3\">\r\n <div\r\n class=\"p-3 font-bold text-white rounded-t text-xl\"\r\n [class.bg-lime-600]=\"warning()\"\r\n [class.bg-red-600]=\"expired()\"\r\n [class.bg-amber-600]=\"finalWarning()\">\r\n @if (warning()) {\r\n {{ txtUpdateAvailable() }}\r\n }\r\n @if (finalWarning()) {\r\n {{ txtLastReminder() }}\r\n }\r\n @if (expired()) {\r\n {{ txtExpired() }}\r\n }\r\n </div>\r\n <div\r\n class=\"bg-amber-50 p-3 text-black rounded-b mb-3\">\r\n <div>{{ txtPleaseOpenTheAppStore() }}.</div>\r\n <div>{{ txtUpdateTheAppToTheLatestVersion() }}.</div>\r\n <div>{{ txtContactHelpdeskOrSoftpak() }}.</div>\r\n @if (finalWarning()) {\r\n <div>{{ txtThisVersionWillExpireSoon() }}.</div>\r\n }\r\n </div>\r\n </div>\r\n}", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
60
44
|
}
|
|
61
45
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: SpxAppExpiryComponent, decorators: [{
|
|
62
46
|
type: Component,
|
|
63
|
-
args: [{
|
|
64
|
-
|
|
65
|
-
imports: [],
|
|
66
|
-
template: `
|
|
67
|
-
@if (warning || finalWarning || expired) {
|
|
68
|
-
<div class="m-3">
|
|
69
|
-
<div
|
|
70
|
-
class="p-3 font-bold text-white rounded-t text-xl"
|
|
71
|
-
[class.bg-lime-600]="warning"
|
|
72
|
-
[class.bg-red-600]="expired"
|
|
73
|
-
[class.bg-amber-600]="finalWarning">
|
|
74
|
-
@if (warning) {
|
|
75
|
-
{{ txtUpdateAvailable }}
|
|
76
|
-
}
|
|
77
|
-
@if (finalWarning) {
|
|
78
|
-
{{ txtLastReminder }}
|
|
79
|
-
}
|
|
80
|
-
@if (expired) {
|
|
81
|
-
{{ txtExpired }}
|
|
82
|
-
}
|
|
83
|
-
</div>
|
|
84
|
-
<div
|
|
85
|
-
class="bg-amber-50 p-3 text-black rounded-b mb-3">
|
|
86
|
-
<div>{{ txtPleaseOpenTheAppStore }}.</div>
|
|
87
|
-
<div>{{ txtUpdateTheAppToTheLatestVersion }}.</div>
|
|
88
|
-
<div>{{ txtContactHelpdeskOrSoftpak }}.</div>
|
|
89
|
-
@if (finalWarning) {
|
|
90
|
-
<div>{{ txtThisVersionWillExpireSoon }}.</div>
|
|
91
|
-
}
|
|
92
|
-
</div>
|
|
93
|
-
</div>
|
|
94
|
-
}`
|
|
95
|
-
}]
|
|
96
|
-
}], propDecorators: { txtContactHelpdeskOrSoftpak: [{
|
|
97
|
-
type: Input
|
|
98
|
-
}], txtExpired: [{
|
|
99
|
-
type: Input
|
|
100
|
-
}], txtLastReminder: [{
|
|
101
|
-
type: Input
|
|
102
|
-
}], txtPleaseOpenTheAppStore: [{
|
|
103
|
-
type: Input
|
|
104
|
-
}], txtPleaseUpdate: [{
|
|
105
|
-
type: Input
|
|
106
|
-
}], txtThisVersionWillExpireSoon: [{
|
|
107
|
-
type: Input
|
|
108
|
-
}], txtUpdateAvailable: [{
|
|
109
|
-
type: Input
|
|
110
|
-
}], txtUpdateTheAppToTheLatestVersion: [{
|
|
111
|
-
type: Input
|
|
112
|
-
}], spxExpiry: [{
|
|
113
|
-
type: Input
|
|
114
|
-
}], spxVersion: [{
|
|
115
|
-
type: Input
|
|
116
|
-
}] } });
|
|
47
|
+
args: [{ selector: 'spx-app-expiry', imports: [], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "@if (warning() || finalWarning() || expired()) {\r\n <div class=\"m-3\">\r\n <div\r\n class=\"p-3 font-bold text-white rounded-t text-xl\"\r\n [class.bg-lime-600]=\"warning()\"\r\n [class.bg-red-600]=\"expired()\"\r\n [class.bg-amber-600]=\"finalWarning()\">\r\n @if (warning()) {\r\n {{ txtUpdateAvailable() }}\r\n }\r\n @if (finalWarning()) {\r\n {{ txtLastReminder() }}\r\n }\r\n @if (expired()) {\r\n {{ txtExpired() }}\r\n }\r\n </div>\r\n <div\r\n class=\"bg-amber-50 p-3 text-black rounded-b mb-3\">\r\n <div>{{ txtPleaseOpenTheAppStore() }}.</div>\r\n <div>{{ txtUpdateTheAppToTheLatestVersion() }}.</div>\r\n <div>{{ txtContactHelpdeskOrSoftpak() }}.</div>\r\n @if (finalWarning()) {\r\n <div>{{ txtThisVersionWillExpireSoon() }}.</div>\r\n }\r\n </div>\r\n </div>\r\n}" }]
|
|
48
|
+
}] });
|
|
117
49
|
|
|
118
50
|
/**
|
|
119
51
|
* Generated bundle index. Do not edit.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"softpak-components-spx-app-expiry.mjs","sources":["../../../../projects/softpak/components/spx-app-expiry/spx-check-expiry-warning.interface.ts","../../../../projects/softpak/components/spx-app-expiry/spx-check-expiry-final-warning.interface.ts","../../../../projects/softpak/components/spx-app-expiry/spx-check-expiry-happened.interface.ts","../../../../projects/softpak/components/spx-app-expiry/spx-app-expiry.component.ts","../../../../projects/softpak/components/spx-app-expiry/softpak-components-spx-app-expiry.ts"],"sourcesContent":["import { DateTime } from \"luxon\";\r\nimport { SpxAppExpiryI } from \"./spx-app-expiry.interface\";\r\n\r\nexport const spxCheckExpiryWarning = (appStoreVersion: string, spxAppExpiry?: SpxAppExpiryI): boolean => {\r\n return spxAppExpiry !== undefined && appStoreVersion.substring(0,3) !== spxAppExpiry.requiredVersion.substring(0,3) && DateTime.now() > spxAppExpiry.warning;\r\n}","import { DateTime } from \"luxon\";\r\nimport { SpxAppExpiryI } from \"./spx-app-expiry.interface\";\r\n\r\nexport const spxCheckExpiryFinalWarning = (appStoreVersion: string, spxAppExpiry?: SpxAppExpiryI) => {\r\n return spxAppExpiry !== undefined && appStoreVersion.substring(0,3) !== spxAppExpiry.requiredVersion.substring(0,3) && DateTime.now() > spxAppExpiry.finalWarning;\r\n}","import { DateTime } from \"luxon\";\r\nimport { SpxAppExpiryI } from \"./spx-app-expiry.interface\";\r\n\r\nexport const spxCheckExpiryHappened = (appStoreVersion: string, spxAppExpiry: SpxAppExpiryI): boolean => {\r\n return spxAppExpiry !== undefined && appStoreVersion.substring(0,3) !== spxAppExpiry.requiredVersion.substring(0,3) && DateTime.now() > spxAppExpiry.expiry;\r\n}","\r\nimport {
|
|
1
|
+
{"version":3,"file":"softpak-components-spx-app-expiry.mjs","sources":["../../../../projects/softpak/components/spx-app-expiry/spx-check-expiry-warning.interface.ts","../../../../projects/softpak/components/spx-app-expiry/spx-check-expiry-final-warning.interface.ts","../../../../projects/softpak/components/spx-app-expiry/spx-check-expiry-happened.interface.ts","../../../../projects/softpak/components/spx-app-expiry/spx-app-expiry.component.ts","../../../../projects/softpak/components/spx-app-expiry/spx-app-expiry.component.html","../../../../projects/softpak/components/spx-app-expiry/softpak-components-spx-app-expiry.ts"],"sourcesContent":["import { DateTime } from \"luxon\";\r\nimport { SpxAppExpiryI } from \"./spx-app-expiry.interface\";\r\n\r\nexport const spxCheckExpiryWarning = (appStoreVersion: string, spxAppExpiry?: SpxAppExpiryI): boolean => {\r\n return spxAppExpiry !== undefined && appStoreVersion.substring(0,3) !== spxAppExpiry.requiredVersion.substring(0,3) && DateTime.now() > spxAppExpiry.warning;\r\n}","import { DateTime } from \"luxon\";\r\nimport { SpxAppExpiryI } from \"./spx-app-expiry.interface\";\r\n\r\nexport const spxCheckExpiryFinalWarning = (appStoreVersion: string, spxAppExpiry?: SpxAppExpiryI) => {\r\n return spxAppExpiry !== undefined && appStoreVersion.substring(0,3) !== spxAppExpiry.requiredVersion.substring(0,3) && DateTime.now() > spxAppExpiry.finalWarning;\r\n}","import { DateTime } from \"luxon\";\r\nimport { SpxAppExpiryI } from \"./spx-app-expiry.interface\";\r\n\r\nexport const spxCheckExpiryHappened = (appStoreVersion: string, spxAppExpiry: SpxAppExpiryI): boolean => {\r\n return spxAppExpiry !== undefined && appStoreVersion.substring(0,3) !== spxAppExpiry.requiredVersion.substring(0,3) && DateTime.now() > spxAppExpiry.expiry;\r\n}","\r\nimport { ChangeDetectionStrategy, Component, OnChanges, input, signal } from '@angular/core';\r\nimport { SpxAppExpiryI } from './spx-app-expiry.interface';\r\nimport { spxCheckExpiryWarning } from './spx-check-expiry-warning.interface';\r\nimport { spxCheckExpiryFinalWarning } from './spx-check-expiry-final-warning.interface';\r\nimport { spxCheckExpiryHappened } from './spx-check-expiry-happened.interface';\r\n\r\n@Component({\r\n selector: 'spx-app-expiry',\r\n imports: [],\r\n templateUrl: './spx-app-expiry.component.html',\r\n changeDetection: ChangeDetectionStrategy.OnPush, \r\n standalone: true,\r\n})\r\nexport class SpxAppExpiryComponent implements OnChanges {\r\n readonly txtContactHelpdeskOrSoftpak = input.required<string>();\r\n readonly txtExpired = input.required<string>();\r\n readonly txtLastReminder = input.required<string>();\r\n readonly txtPleaseOpenTheAppStore = input.required<string>();\r\n readonly txtPleaseUpdate = input.required<string>();\r\n readonly txtThisVersionWillExpireSoon = input.required<string>();\r\n readonly txtUpdateAvailable = input.required<string>();\r\n readonly txtUpdateTheAppToTheLatestVersion = input.required<string>();\r\n readonly spxExpiry = input.required<SpxAppExpiryI>();\r\n readonly spxVersion = input.required<string>();\r\n warning = signal<boolean>(false);\r\n finalWarning = signal<boolean>(false);\r\n expired = signal<boolean>(false);\r\n ngOnChanges(): void {\r\n const spxExpiry = this.spxExpiry();\r\n const spxVersion = this.spxVersion();\r\n if (spxExpiry && spxVersion) {\r\n this.expired.set(spxCheckExpiryHappened(spxVersion, spxExpiry));\r\n this.finalWarning.set(spxCheckExpiryFinalWarning(spxVersion, spxExpiry) && !this.expired());\r\n this.warning.set(spxCheckExpiryWarning(spxVersion, spxExpiry) && !this.finalWarning && !this.expired());\r\n }\r\n }\r\n}\r\n","@if (warning() || finalWarning() || expired()) {\r\n <div class=\"m-3\">\r\n <div\r\n class=\"p-3 font-bold text-white rounded-t text-xl\"\r\n [class.bg-lime-600]=\"warning()\"\r\n [class.bg-red-600]=\"expired()\"\r\n [class.bg-amber-600]=\"finalWarning()\">\r\n @if (warning()) {\r\n {{ txtUpdateAvailable() }}\r\n }\r\n @if (finalWarning()) {\r\n {{ txtLastReminder() }}\r\n }\r\n @if (expired()) {\r\n {{ txtExpired() }}\r\n }\r\n </div>\r\n <div\r\n class=\"bg-amber-50 p-3 text-black rounded-b mb-3\">\r\n <div>{{ txtPleaseOpenTheAppStore() }}.</div>\r\n <div>{{ txtUpdateTheAppToTheLatestVersion() }}.</div>\r\n <div>{{ txtContactHelpdeskOrSoftpak() }}.</div>\r\n @if (finalWarning()) {\r\n <div>{{ txtThisVersionWillExpireSoon() }}.</div>\r\n }\r\n </div>\r\n </div>\r\n}","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { NgClass } from '@angular/common';
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
|
-
import { input, output, viewChild, Component, ChangeDetectionStrategy
|
|
3
|
+
import { input, output, viewChild, Component, ChangeDetectionStrategy } from '@angular/core';
|
|
4
4
|
import { SpxSeverityEnum } from '@softpak/components/spx-helpers';
|
|
5
5
|
import { IsSeverityPipe } from '@softpak/components/spx-pipes';
|
|
6
6
|
|
|
@@ -28,34 +28,20 @@ class SpxButtonComponent {
|
|
|
28
28
|
}
|
|
29
29
|
};
|
|
30
30
|
}
|
|
31
|
-
get hostClassBlock() {
|
|
32
|
-
return this.spxFullWidth();
|
|
33
|
-
}
|
|
34
|
-
get hostClassHFull() {
|
|
35
|
-
return this.spxFullHeight();
|
|
36
|
-
}
|
|
37
|
-
get hostClassWFull() {
|
|
38
|
-
return this.spxFullWidth();
|
|
39
|
-
}
|
|
40
31
|
spxSetFocus() {
|
|
41
32
|
this.buttonRef()?.nativeElement?.focus();
|
|
42
33
|
}
|
|
43
34
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: SpxButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
44
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.0.5", type: SpxButtonComponent, isStandalone: true, selector: "spx-button", inputs: { spxDisabled: { classPropertyName: "spxDisabled", publicName: "spxDisabled", isSignal: true, isRequired: false, transformFunction: null }, spxClass: { classPropertyName: "spxClass", publicName: "spxClass", isSignal: true, isRequired: false, transformFunction: null }, spxClassObject: { classPropertyName: "spxClassObject", publicName: "spxClassObject", isSignal: true, isRequired: false, transformFunction: null }, spxForm: { classPropertyName: "spxForm", publicName: "spxForm", isSignal: true, isRequired: false, transformFunction: null }, spxFullHeight: { classPropertyName: "spxFullHeight", publicName: "spxFullHeight", isSignal: true, isRequired: false, transformFunction: null }, spxFullWidth: { classPropertyName: "spxFullWidth", publicName: "spxFullWidth", isSignal: true, isRequired: false, transformFunction: null }, spxSeverity: { classPropertyName: "spxSeverity", publicName: "spxSeverity", isSignal: true, isRequired: false, transformFunction: null }, spxSize: { classPropertyName: "spxSize", publicName: "spxSize", isSignal: true, isRequired: false, transformFunction: null }, spxTabIndex: { classPropertyName: "spxTabIndex", publicName: "spxTabIndex", isSignal: true, isRequired: false, transformFunction: null }, spxType: { classPropertyName: "spxType", publicName: "spxType", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { spxClick: "spxClick" }, host: { properties: { "class.block": "
|
|
35
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "19.0.5", type: SpxButtonComponent, isStandalone: true, selector: "spx-button", inputs: { spxDisabled: { classPropertyName: "spxDisabled", publicName: "spxDisabled", isSignal: true, isRequired: false, transformFunction: null }, spxClass: { classPropertyName: "spxClass", publicName: "spxClass", isSignal: true, isRequired: false, transformFunction: null }, spxClassObject: { classPropertyName: "spxClassObject", publicName: "spxClassObject", isSignal: true, isRequired: false, transformFunction: null }, spxForm: { classPropertyName: "spxForm", publicName: "spxForm", isSignal: true, isRequired: false, transformFunction: null }, spxFullHeight: { classPropertyName: "spxFullHeight", publicName: "spxFullHeight", isSignal: true, isRequired: false, transformFunction: null }, spxFullWidth: { classPropertyName: "spxFullWidth", publicName: "spxFullWidth", isSignal: true, isRequired: false, transformFunction: null }, spxSeverity: { classPropertyName: "spxSeverity", publicName: "spxSeverity", isSignal: true, isRequired: false, transformFunction: null }, spxSize: { classPropertyName: "spxSize", publicName: "spxSize", isSignal: true, isRequired: false, transformFunction: null }, spxTabIndex: { classPropertyName: "spxTabIndex", publicName: "spxTabIndex", isSignal: true, isRequired: false, transformFunction: null }, spxType: { classPropertyName: "spxType", publicName: "spxType", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { spxClick: "spxClick" }, host: { properties: { "class.block": "spxFullWidth()", "class.h-full": "spxFullHeight()", "class.w-full": "spxFullWidth()" } }, viewQueries: [{ propertyName: "buttonRef", first: true, predicate: ["buttonRef"], descendants: true, isSignal: true }], ngImport: i0, template: "<button\r\n #buttonRef\r\n class=\"border border-transparent font-bold px-4 relative rounded text-center text-white focus:outline-none focus:ring-2 focus:ring-offset-2 bg-gradient-to-r\"\r\n [class.h-full]=\"this.spxFullHeight()\"\r\n [class.w-full]=\"this.spxFullWidth()\"\r\n [class.bg-blue-600]=\"!this.spxSeverity() || (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.focus:ring-blue-600]=\"!this.spxSeverity() || (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.from-red-400]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.to-red-600]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.focus:ring-red-600]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.from-lime-400]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.to-lime-600]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.focus:ring-lime-600]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.from-amber-400]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.to-amber-600]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.focus:ring-amber-600]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.py-2]=\"!this.spxSize() || this.spxSize() === 'lg'\"\r\n [class.py-4]=\"!this.spxSize() || this.spxSize() === 'xl'\"\r\n [class.text-xl]=\"this.spxSize() === 'xl'\"\r\n [class.text-lg]=\"this.spxSize() === 'lg'\"\r\n [class.cursor-pointer]=\"!this.spxDisabled()\"\r\n [class.cursor-not-allowed]=\"this.spxDisabled()\"\r\n [class.opacity-50]=\"this.spxDisabled()\"\r\n [class.focus:ring-0]=\"this.spxDisabled()\"\r\n [ngClass]=\"this.spxClass() ? this.spxClass() : undefined\"\r\n [attr.disabled]=\"this.spxDisabled() ? this.spxDisabled() : undefined\"\r\n [attr.form]=\"this.spxForm() ? this.spxForm() : undefined\"\r\n [attr.tabindex]=\"this.spxTabIndex() ? this.spxTabIndex() : undefined\"\r\n [attr.type]=\"this.spxType() ? this.spxType() : undefined\"\r\n (click)=\"this.handleClick()\"\r\n part=\"button\">\r\n <ng-content></ng-content>\r\n </button>", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: IsSeverityPipe, name: "isSeverity" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
45
36
|
}
|
|
46
37
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: SpxButtonComponent, decorators: [{
|
|
47
38
|
type: Component,
|
|
48
|
-
args: [{ selector: 'spx-button', imports: [NgClass, IsSeverityPipe], changeDetection: ChangeDetectionStrategy.OnPush,
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
args: ['class.h-full']
|
|
55
|
-
}], hostClassWFull: [{
|
|
56
|
-
type: HostBinding,
|
|
57
|
-
args: ['class.w-full']
|
|
58
|
-
}] } });
|
|
39
|
+
args: [{ selector: 'spx-button', imports: [NgClass, IsSeverityPipe], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
40
|
+
'[class.block]': 'spxFullWidth()',
|
|
41
|
+
'[class.h-full]': 'spxFullHeight()',
|
|
42
|
+
'[class.w-full]': 'spxFullWidth()',
|
|
43
|
+
}, standalone: true, template: "<button\r\n #buttonRef\r\n class=\"border border-transparent font-bold px-4 relative rounded text-center text-white focus:outline-none focus:ring-2 focus:ring-offset-2 bg-gradient-to-r\"\r\n [class.h-full]=\"this.spxFullHeight()\"\r\n [class.w-full]=\"this.spxFullWidth()\"\r\n [class.bg-blue-600]=\"!this.spxSeverity() || (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.focus:ring-blue-600]=\"!this.spxSeverity() || (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.from-red-400]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.to-red-600]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.focus:ring-red-600]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.from-lime-400]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.to-lime-600]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.focus:ring-lime-600]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.from-amber-400]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.to-amber-600]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.focus:ring-amber-600]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.py-2]=\"!this.spxSize() || this.spxSize() === 'lg'\"\r\n [class.py-4]=\"!this.spxSize() || this.spxSize() === 'xl'\"\r\n [class.text-xl]=\"this.spxSize() === 'xl'\"\r\n [class.text-lg]=\"this.spxSize() === 'lg'\"\r\n [class.cursor-pointer]=\"!this.spxDisabled()\"\r\n [class.cursor-not-allowed]=\"this.spxDisabled()\"\r\n [class.opacity-50]=\"this.spxDisabled()\"\r\n [class.focus:ring-0]=\"this.spxDisabled()\"\r\n [ngClass]=\"this.spxClass() ? this.spxClass() : undefined\"\r\n [attr.disabled]=\"this.spxDisabled() ? this.spxDisabled() : undefined\"\r\n [attr.form]=\"this.spxForm() ? this.spxForm() : undefined\"\r\n [attr.tabindex]=\"this.spxTabIndex() ? this.spxTabIndex() : undefined\"\r\n [attr.type]=\"this.spxType() ? this.spxType() : undefined\"\r\n (click)=\"this.handleClick()\"\r\n part=\"button\">\r\n <ng-content></ng-content>\r\n </button>" }]
|
|
44
|
+
}] });
|
|
59
45
|
|
|
60
46
|
/**
|
|
61
47
|
* Generated bundle index. Do not edit.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"softpak-components-spx-button.mjs","sources":["../../../../projects/softpak/components/spx-button/spx-button.component.ts","../../../../projects/softpak/components/spx-button/spx-button.component.html","../../../../projects/softpak/components/spx-button/softpak-components-spx-button.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\r\nimport {\r\n ChangeDetectionStrategy,\r\n Component,\r\n ElementRef,\r\n
|
|
1
|
+
{"version":3,"file":"softpak-components-spx-button.mjs","sources":["../../../../projects/softpak/components/spx-button/spx-button.component.ts","../../../../projects/softpak/components/spx-button/spx-button.component.html","../../../../projects/softpak/components/spx-button/softpak-components-spx-button.ts"],"sourcesContent":["import { NgClass } from '@angular/common';\r\nimport {\r\n ChangeDetectionStrategy,\r\n Component,\r\n ElementRef,\r\n input,\r\n output,\r\n viewChild,\r\n} from '@angular/core';\r\nimport { SpxSeverityEnum } from '@softpak/components/spx-helpers';\r\nimport { IsSeverityPipe } from '@softpak/components/spx-pipes';\r\n\r\n@Component({\r\n selector: 'spx-button',\r\n imports: [NgClass, IsSeverityPipe],\r\n templateUrl: './spx-button.component.html',\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n host: {\r\n '[class.block]': 'spxFullWidth()',\r\n '[class.h-full]': 'spxFullHeight()',\r\n '[class.w-full]': 'spxFullWidth()',\r\n },\r\n standalone: true,\r\n})\r\nexport class SpxButtonComponent {\r\n readonly spxDisabled = input(false);\r\n readonly spxClass = input<string>();\r\n readonly spxClassObject = input<object>();\r\n readonly spxForm = input<string>();\r\n readonly spxFullHeight = input<boolean>();\r\n readonly spxFullWidth = input<boolean>();\r\n readonly spxSeverity = input<SpxSeverityEnum | undefined>(\r\n SpxSeverityEnum.info\r\n );\r\n readonly spxSize = input<'lg' | 'xl'>('lg');\r\n readonly spxTabIndex = input<number>();\r\n readonly spxType = input<'button' | 'submit'>('submit');\r\n spxClick = output();\r\n buttonRef = viewChild<ElementRef<HTMLInputElement>>('buttonRef');\r\n SpxSeverity = SpxSeverityEnum;\r\n\r\n hasShadowDom = (el: HTMLElement) => {\r\n return !!el.shadowRoot && !!(el as any).attachShadow;\r\n };\r\n handleClick = () => {\r\n if (!this.spxDisabled()) {\r\n this.spxClick.emit();\r\n }\r\n };\r\n\r\n spxSetFocus(): void {\r\n this.buttonRef()?.nativeElement?.focus();\r\n }\r\n}\r\n","<button\r\n #buttonRef\r\n class=\"border border-transparent font-bold px-4 relative rounded text-center text-white focus:outline-none focus:ring-2 focus:ring-offset-2 bg-gradient-to-r\"\r\n [class.h-full]=\"this.spxFullHeight()\"\r\n [class.w-full]=\"this.spxFullWidth()\"\r\n [class.bg-blue-600]=\"!this.spxSeverity() || (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.focus:ring-blue-600]=\"!this.spxSeverity() || (this.spxSeverity() | isSeverity: SpxSeverity.info)\"\r\n [class.from-red-400]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.to-red-600]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.focus:ring-red-600]=\"this.spxSeverity() | isSeverity: SpxSeverity.error\"\r\n [class.from-lime-400]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.to-lime-600]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.focus:ring-lime-600]=\"this.spxSeverity() | isSeverity: SpxSeverity.success\"\r\n [class.from-amber-400]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.to-amber-600]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.focus:ring-amber-600]=\"this.spxSeverity() | isSeverity: SpxSeverity.warning\"\r\n [class.py-2]=\"!this.spxSize() || this.spxSize() === 'lg'\"\r\n [class.py-4]=\"!this.spxSize() || this.spxSize() === 'xl'\"\r\n [class.text-xl]=\"this.spxSize() === 'xl'\"\r\n [class.text-lg]=\"this.spxSize() === 'lg'\"\r\n [class.cursor-pointer]=\"!this.spxDisabled()\"\r\n [class.cursor-not-allowed]=\"this.spxDisabled()\"\r\n [class.opacity-50]=\"this.spxDisabled()\"\r\n [class.focus:ring-0]=\"this.spxDisabled()\"\r\n [ngClass]=\"this.spxClass() ? this.spxClass() : undefined\"\r\n [attr.disabled]=\"this.spxDisabled() ? this.spxDisabled() : undefined\"\r\n [attr.form]=\"this.spxForm() ? this.spxForm() : undefined\"\r\n [attr.tabindex]=\"this.spxTabIndex() ? this.spxTabIndex() : undefined\"\r\n [attr.type]=\"this.spxType() ? this.spxType() : undefined\"\r\n (click)=\"this.handleClick()\"\r\n part=\"button\">\r\n <ng-content></ng-content>\r\n </button>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;MAwBa,kBAAkB,CAAA;AAZ/B,IAAA,WAAA,GAAA;AAaW,QAAA,IAAA,CAAA,WAAW,GAAG,KAAK,CAAC,KAAK,CAAC;QAC1B,IAAQ,CAAA,QAAA,GAAG,KAAK,EAAU;QAC1B,IAAc,CAAA,cAAA,GAAG,KAAK,EAAU;QAChC,IAAO,CAAA,OAAA,GAAG,KAAK,EAAU;QACzB,IAAa,CAAA,aAAA,GAAG,KAAK,EAAW;QAChC,IAAY,CAAA,YAAA,GAAG,KAAK,EAAW;AAC/B,QAAA,IAAA,CAAA,WAAW,GAAG,KAAK,CAC1B,eAAe,CAAC,IAAI,CACrB;AACQ,QAAA,IAAA,CAAA,OAAO,GAAG,KAAK,CAAc,IAAI,CAAC;QAClC,IAAW,CAAA,WAAA,GAAG,KAAK,EAAU;AAC7B,QAAA,IAAA,CAAA,OAAO,GAAG,KAAK,CAAsB,QAAQ,CAAC;QACvD,IAAQ,CAAA,QAAA,GAAG,MAAM,EAAE;AACnB,QAAA,IAAA,CAAA,SAAS,GAAG,SAAS,CAA+B,WAAW,CAAC;QAChE,IAAW,CAAA,WAAA,GAAG,eAAe;AAE7B,QAAA,IAAA,CAAA,YAAY,GAAG,CAAC,EAAe,KAAI;YACjC,OAAO,CAAC,CAAC,EAAE,CAAC,UAAU,IAAI,CAAC,CAAE,EAAU,CAAC,YAAY;AACtD,SAAC;QACD,IAAW,CAAA,WAAA,GAAG,MAAK;AACjB,YAAA,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,EAAE;AACvB,gBAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE;;AAExB,SAAC;AAKF;IAHC,WAAW,GAAA;QACT,IAAI,CAAC,SAAS,EAAE,EAAE,aAAa,EAAE,KAAK,EAAE;;8GA3B/B,kBAAkB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAlB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,kBAAkB,ECxB/B,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,cAAA,EAAA,EAAA,iBAAA,EAAA,gBAAA,EAAA,UAAA,EAAA,gBAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,aAAA,EAAA,EAAA,iBAAA,EAAA,eAAA,EAAA,UAAA,EAAA,eAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,YAAA,EAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,UAAA,EAAA,cAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,QAAA,EAAA,UAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,aAAA,EAAA,gBAAA,EAAA,cAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,EAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,WAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,WAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAAA,2pEAgCW,EDlBC,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,OAAO,+EAAE,cAAc,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,CAAA,CAAA;;2FAUtB,kBAAkB,EAAA,UAAA,EAAA,CAAA;kBAZ9B,SAAS;+BACE,YAAY,EAAA,OAAA,EACb,CAAC,OAAO,EAAE,cAAc,CAAC,EAEjB,eAAA,EAAA,uBAAuB,CAAC,MAAM,EACzC,IAAA,EAAA;AACJ,wBAAA,eAAe,EAAE,gBAAgB;AACjC,wBAAA,gBAAgB,EAAE,iBAAiB;AACnC,wBAAA,gBAAgB,EAAE,gBAAgB;AACnC,qBAAA,EAAA,UAAA,EACW,IAAI,EAAA,QAAA,EAAA,2pEAAA,EAAA;;;AEtBlB;;AAEG;;;;"}
|