@softpak/components 0.0.0-beta.1
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/README.md +24 -0
- package/esm2022/placeholder.mjs +2 -0
- package/esm2022/public_api.mjs +2 -0
- package/esm2022/softpak-components.mjs +5 -0
- package/esm2022/spx-alert/public-api.mjs +3 -0
- package/esm2022/spx-alert/softpak-components-spx-alert.mjs +5 -0
- package/esm2022/spx-alert/spx-alert.component.mjs +191 -0
- package/esm2022/spx-alert/spx-alert.interface.mjs +3 -0
- package/esm2022/spx-app-configuration/public-api.mjs +8 -0
- package/esm2022/spx-app-configuration/softpak-components-spx-app-configuration.mjs +5 -0
- package/esm2022/spx-app-configuration/spx-app-alert.interface.mjs +2 -0
- package/esm2022/spx-app-configuration/spx-app-bundle-set.interface.mjs +2 -0
- package/esm2022/spx-app-configuration/spx-app-channel-type.enum.mjs +8 -0
- package/esm2022/spx-app-configuration/spx-app-channel.interface.mjs +2 -0
- package/esm2022/spx-app-configuration/spx-app-config.interface.mjs +2 -0
- package/esm2022/spx-app-configuration/spx-app-id.enum.mjs +8 -0
- package/esm2022/spx-app-configuration/spx-app-lang.enum.mjs +6 -0
- package/esm2022/spx-app-configuration/spx-app-release-note.interface.mjs +2 -0
- package/esm2022/spx-button/public-api.mjs +2 -0
- package/esm2022/spx-button/softpak-components-spx-button.mjs +5 -0
- package/esm2022/spx-button/spx-button.component.mjs +129 -0
- package/esm2022/spx-capitalize/public-api.mjs +2 -0
- package/esm2022/spx-capitalize/softpak-components-spx-capitalize.mjs +5 -0
- package/esm2022/spx-capitalize/spx-capitalize.pipe.mjs +20 -0
- package/esm2022/spx-channel-selection/public-api.mjs +5 -0
- package/esm2022/spx-channel-selection/softpak-components-spx-channel-selection.mjs +5 -0
- package/esm2022/spx-channel-selection/src/spx-channel-indicator.component.mjs +45 -0
- package/esm2022/spx-channel-selection/src/spx-channel-selection.component.mjs +40 -0
- package/esm2022/spx-channel-selection/src/spx-company-selection.component.mjs +48 -0
- package/esm2022/spx-channel-selection/src/spx-welcome.component.mjs +43 -0
- package/esm2022/spx-check-digit/public-api.mjs +2 -0
- package/esm2022/spx-check-digit/softpak-components-spx-check-digit.mjs +5 -0
- package/esm2022/spx-check-digit/spx-check-digit.component.mjs +85 -0
- package/esm2022/spx-form-section/public-api.mjs +2 -0
- package/esm2022/spx-form-section/softpak-components-spx-form-section.mjs +5 -0
- package/esm2022/spx-form-section/spx-form-section.component.mjs +37 -0
- package/esm2022/spx-helpers/calc-check-digit.function.mjs +21 -0
- package/esm2022/spx-helpers/public-api.mjs +4 -0
- package/esm2022/spx-helpers/softpak-components-spx-helpers.mjs +5 -0
- package/esm2022/spx-helpers/spx-severity.enum.mjs +8 -0
- package/esm2022/spx-helpers/value-pair-to-value.function.mjs +7 -0
- package/esm2022/spx-inputs/public-api.mjs +5 -0
- package/esm2022/spx-inputs/softpak-components-spx-inputs.mjs +5 -0
- package/esm2022/spx-inputs/spx-input-box.component.mjs +231 -0
- package/esm2022/spx-inputs/spx-input-date.component.mjs +294 -0
- package/esm2022/spx-inputs/spx-input-float.component.mjs +154 -0
- package/esm2022/spx-inputs/spx-input-number.component.mjs +82 -0
- package/esm2022/spx-inputs/spx-input-radio.component.mjs +63 -0
- package/esm2022/spx-inputs/spx-input-text.component.mjs +156 -0
- package/esm2022/spx-inputs/spx-input.component.mjs +380 -0
- package/esm2022/spx-inputs/spx-value-interface.mjs +2 -0
- package/esm2022/spx-navigation/public-api.mjs +5 -0
- package/esm2022/spx-navigation/softpak-components-spx-navigation.mjs +5 -0
- package/esm2022/spx-navigation/spx-home-tile.component.mjs +33 -0
- package/esm2022/spx-navigation/spx-home-tiles.component.mjs +17 -0
- package/esm2022/spx-navigation/spx-navigation-item.interface.mjs +2 -0
- package/esm2022/spx-navigation/spx-navigation.component.mjs +42 -0
- package/esm2022/spx-patch/patch-check.function.mjs +9 -0
- package/esm2022/spx-patch/public-api.mjs +4 -0
- package/esm2022/spx-patch/release-check.function.mjs +11 -0
- package/esm2022/spx-patch/softpak-components-spx-patch.mjs +5 -0
- package/esm2022/spx-patch/spx-patch.component.mjs +46 -0
- package/esm2022/spx-progress-bar/public-api.mjs +2 -0
- package/esm2022/spx-progress-bar/softpak-components-spx-progress-bar.mjs +5 -0
- package/esm2022/spx-progress-bar/spx-progress-bar.component.mjs +29 -0
- package/esm2022/spx-spinner/public-api.mjs +2 -0
- package/esm2022/spx-spinner/softpak-components-spx-spinner.mjs +5 -0
- package/esm2022/spx-spinner/spx-spinner.component.mjs +157 -0
- package/esm2022/spx-storage/public-api.mjs +3 -0
- package/esm2022/spx-storage/softpak-components-spx-storage.mjs +5 -0
- package/esm2022/spx-storage/src/spx-storage-key.enum.mjs +13 -0
- package/esm2022/spx-storage/src/spx-storage.class.mjs +45 -0
- package/esm2022/spx-suggestion/public-api.mjs +2 -0
- package/esm2022/spx-suggestion/softpak-components-spx-suggestion.mjs +5 -0
- package/esm2022/spx-suggestion/spx-suggestion.component.mjs +47 -0
- package/esm2022/spx-toaster/public-api.mjs +4 -0
- package/esm2022/spx-toaster/softpak-components-spx-toaster.mjs +5 -0
- package/esm2022/spx-toaster/src/spx-toaster-autoclose-speed.mjs +23 -0
- package/esm2022/spx-toaster/src/spx-toaster-message.interface.mjs +3 -0
- package/esm2022/spx-toaster/src/spx-toaster.component.mjs +46 -0
- package/esm2022/spx-update/public-api.mjs +3 -0
- package/esm2022/spx-update/softpak-components-spx-update.mjs +5 -0
- package/esm2022/spx-update/src/spx-update-info.component.mjs +88 -0
- package/esm2022/spx-update/src/spx-update-progress.component.mjs +46 -0
- package/esm2022/spx-validation/max.validator.mjs +17 -0
- package/esm2022/spx-validation/maxlength.validator.mjs +20 -0
- package/esm2022/spx-validation/min.validator.mjs +17 -0
- package/esm2022/spx-validation/minlength.validator.mjs +20 -0
- package/esm2022/spx-validation/pattern.validator.mjs +12 -0
- package/esm2022/spx-validation/public-api.mjs +10 -0
- package/esm2022/spx-validation/required.validator.mjs +12 -0
- package/esm2022/spx-validation/softpak-components-spx-validation.mjs +5 -0
- package/esm2022/spx-validation/spx-validate-control.component.mjs +63 -0
- package/esm2022/spx-validation/spx-validation.module.mjs +28 -0
- package/esm2022/spx-validation/year-and-month.validator.mjs +42 -0
- package/fesm2022/softpak-components-spx-alert.mjs +201 -0
- package/fesm2022/softpak-components-spx-alert.mjs.map +1 -0
- package/fesm2022/softpak-components-spx-app-configuration.mjs +28 -0
- package/fesm2022/softpak-components-spx-app-configuration.mjs.map +1 -0
- package/fesm2022/softpak-components-spx-button.mjs +136 -0
- package/fesm2022/softpak-components-spx-button.mjs.map +1 -0
- package/fesm2022/softpak-components-spx-capitalize.mjs +27 -0
- package/fesm2022/softpak-components-spx-capitalize.mjs.map +1 -0
- package/fesm2022/softpak-components-spx-channel-selection.mjs +171 -0
- package/fesm2022/softpak-components-spx-channel-selection.mjs.map +1 -0
- package/fesm2022/softpak-components-spx-check-digit.mjs +92 -0
- package/fesm2022/softpak-components-spx-check-digit.mjs.map +1 -0
- package/fesm2022/softpak-components-spx-form-section.mjs +44 -0
- package/fesm2022/softpak-components-spx-form-section.mjs.map +1 -0
- package/fesm2022/softpak-components-spx-helpers.mjs +42 -0
- package/fesm2022/softpak-components-spx-helpers.mjs.map +1 -0
- package/fesm2022/softpak-components-spx-inputs.mjs +1340 -0
- package/fesm2022/softpak-components-spx-inputs.mjs.map +1 -0
- package/fesm2022/softpak-components-spx-navigation.mjs +93 -0
- package/fesm2022/softpak-components-spx-navigation.mjs.map +1 -0
- package/fesm2022/softpak-components-spx-patch.mjs +72 -0
- package/fesm2022/softpak-components-spx-patch.mjs.map +1 -0
- package/fesm2022/softpak-components-spx-progress-bar.mjs +36 -0
- package/fesm2022/softpak-components-spx-progress-bar.mjs.map +1 -0
- package/fesm2022/softpak-components-spx-spinner.mjs +164 -0
- package/fesm2022/softpak-components-spx-spinner.mjs.map +1 -0
- package/fesm2022/softpak-components-spx-storage.mjs +63 -0
- package/fesm2022/softpak-components-spx-storage.mjs.map +1 -0
- package/fesm2022/softpak-components-spx-suggestion.mjs +54 -0
- package/fesm2022/softpak-components-spx-suggestion.mjs.map +1 -0
- package/fesm2022/softpak-components-spx-toaster.mjs +79 -0
- package/fesm2022/softpak-components-spx-toaster.mjs.map +1 -0
- package/fesm2022/softpak-components-spx-update.mjs +138 -0
- package/fesm2022/softpak-components-spx-update.mjs.map +1 -0
- package/fesm2022/softpak-components-spx-validation.mjs +223 -0
- package/fesm2022/softpak-components-spx-validation.mjs.map +1 -0
- package/fesm2022/softpak-components.mjs +8 -0
- package/fesm2022/softpak-components.mjs.map +1 -0
- package/index.d.ts +5 -0
- package/package.json +135 -0
- package/placeholder.d.ts +1 -0
- package/public_api.d.ts +1 -0
- package/spx-alert/index.d.ts +5 -0
- package/spx-alert/public-api.d.ts +2 -0
- package/spx-alert/spx-alert.component.d.ts +28 -0
- package/spx-alert/spx-alert.interface.d.ts +7 -0
- package/spx-app-configuration/index.d.ts +5 -0
- package/spx-app-configuration/public-api.d.ts +7 -0
- package/spx-app-configuration/spx-app-alert.interface.d.ts +7 -0
- package/spx-app-configuration/spx-app-bundle-set.interface.d.ts +4 -0
- package/spx-app-configuration/spx-app-channel-type.enum.d.ts +6 -0
- package/spx-app-configuration/spx-app-channel.interface.d.ts +10 -0
- package/spx-app-configuration/spx-app-config.interface.d.ts +19 -0
- package/spx-app-configuration/spx-app-id.enum.d.ts +6 -0
- package/spx-app-configuration/spx-app-lang.enum.d.ts +4 -0
- package/spx-app-configuration/spx-app-release-note.interface.d.ts +8 -0
- package/spx-button/index.d.ts +5 -0
- package/spx-button/public-api.d.ts +1 -0
- package/spx-button/spx-button.component.d.ts +23 -0
- package/spx-capitalize/index.d.ts +5 -0
- package/spx-capitalize/public-api.d.ts +1 -0
- package/spx-capitalize/spx-capitalize.pipe.d.ts +8 -0
- package/spx-channel-selection/index.d.ts +5 -0
- package/spx-channel-selection/public-api.d.ts +4 -0
- package/spx-channel-selection/src/spx-channel-indicator.component.d.ts +13 -0
- package/spx-channel-selection/src/spx-channel-selection.component.d.ts +11 -0
- package/spx-channel-selection/src/spx-company-selection.component.d.ts +12 -0
- package/spx-channel-selection/src/spx-welcome.component.d.ts +12 -0
- package/spx-check-digit/index.d.ts +5 -0
- package/spx-check-digit/public-api.d.ts +1 -0
- package/spx-check-digit/spx-check-digit.component.d.ts +19 -0
- package/spx-form-section/index.d.ts +5 -0
- package/spx-form-section/public-api.d.ts +1 -0
- package/spx-form-section/spx-form-section.component.d.ts +9 -0
- package/spx-helpers/calc-check-digit.function.d.ts +1 -0
- package/spx-helpers/index.d.ts +5 -0
- package/spx-helpers/public-api.d.ts +3 -0
- package/spx-helpers/spx-severity.enum.d.ts +6 -0
- package/spx-helpers/value-pair-to-value.function.d.ts +1 -0
- package/spx-inputs/index.d.ts +5 -0
- package/spx-inputs/public-api.d.ts +4 -0
- package/spx-inputs/spx-input-box.component.d.ts +33 -0
- package/spx-inputs/spx-input-date.component.d.ts +50 -0
- package/spx-inputs/spx-input-float.component.d.ts +28 -0
- package/spx-inputs/spx-input-number.component.d.ts +22 -0
- package/spx-inputs/spx-input-radio.component.d.ts +18 -0
- package/spx-inputs/spx-input-text.component.d.ts +29 -0
- package/spx-inputs/spx-input.component.d.ts +58 -0
- package/spx-inputs/spx-value-interface.d.ts +4 -0
- package/spx-navigation/index.d.ts +5 -0
- package/spx-navigation/public-api.d.ts +4 -0
- package/spx-navigation/spx-home-tile.component.d.ts +6 -0
- package/spx-navigation/spx-home-tiles.component.d.ts +5 -0
- package/spx-navigation/spx-navigation-item.interface.d.ts +19 -0
- package/spx-navigation/spx-navigation.component.d.ts +12 -0
- package/spx-patch/index.d.ts +5 -0
- package/spx-patch/patch-check.function.d.ts +4 -0
- package/spx-patch/public-api.d.ts +3 -0
- package/spx-patch/release-check.function.d.ts +1 -0
- package/spx-patch/spx-patch.component.d.ts +10 -0
- package/spx-progress-bar/index.d.ts +5 -0
- package/spx-progress-bar/public-api.d.ts +1 -0
- package/spx-progress-bar/spx-progress-bar.component.d.ts +7 -0
- package/spx-spinner/index.d.ts +5 -0
- package/spx-spinner/public-api.d.ts +1 -0
- package/spx-spinner/spx-spinner.component.d.ts +7 -0
- package/spx-storage/index.d.ts +5 -0
- package/spx-storage/public-api.d.ts +2 -0
- package/spx-storage/src/spx-storage-key.enum.d.ts +10 -0
- package/spx-storage/src/spx-storage.class.d.ts +9 -0
- package/spx-suggestion/index.d.ts +5 -0
- package/spx-suggestion/public-api.d.ts +1 -0
- package/spx-suggestion/spx-suggestion.component.d.ts +7 -0
- package/spx-toaster/index.d.ts +5 -0
- package/spx-toaster/public-api.d.ts +3 -0
- package/spx-toaster/src/spx-toaster-autoclose-speed.d.ts +11 -0
- package/spx-toaster/src/spx-toaster-message.interface.d.ts +9 -0
- package/spx-toaster/src/spx-toaster.component.d.ts +11 -0
- package/spx-update/index.d.ts +5 -0
- package/spx-update/public-api.d.ts +2 -0
- package/spx-update/src/spx-update-info.component.d.ts +18 -0
- package/spx-update/src/spx-update-progress.component.d.ts +14 -0
- package/spx-validation/index.d.ts +5 -0
- package/spx-validation/max.validator.d.ts +7 -0
- package/spx-validation/maxlength.validator.d.ts +7 -0
- package/spx-validation/min.validator.d.ts +7 -0
- package/spx-validation/minlength.validator.d.ts +7 -0
- package/spx-validation/pattern.validator.d.ts +2 -0
- package/spx-validation/public-api.d.ts +9 -0
- package/spx-validation/required.validator.d.ts +2 -0
- package/spx-validation/spx-validate-control.component.d.ts +24 -0
- package/spx-validation/spx-validation.module.d.ts +9 -0
- package/spx-validation/year-and-month.validator.d.ts +2 -0
- package/tailwind.css +1 -0
|
@@ -0,0 +1,201 @@
|
|
|
1
|
+
import * as i1 from '@angular/common';
|
|
2
|
+
import { CommonModule, NgIf } from '@angular/common';
|
|
3
|
+
import * as i0 from '@angular/core';
|
|
4
|
+
import { EventEmitter, Component, Output, Input } from '@angular/core';
|
|
5
|
+
import * as i2 from '@fortawesome/angular-fontawesome';
|
|
6
|
+
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
|
|
7
|
+
import { faCheck, faCircleInfo, faTriangleExclamation, faTimes } from '@fortawesome/free-solid-svg-icons';
|
|
8
|
+
import { SpxSeverityEnum } from '@softpak/components/spx-helpers';
|
|
9
|
+
|
|
10
|
+
class SpxAlertComponent {
|
|
11
|
+
constructor() {
|
|
12
|
+
this.spxClose = new EventEmitter();
|
|
13
|
+
this.spxCloseable = false;
|
|
14
|
+
this.spxHideTitle = false;
|
|
15
|
+
this.spxMarginTop = false;
|
|
16
|
+
this.tick = {};
|
|
17
|
+
this.faCheck = faCheck;
|
|
18
|
+
this.faCircleInfo = faCircleInfo;
|
|
19
|
+
this.faTriangleExclamation = faTriangleExclamation;
|
|
20
|
+
this.faTimes = faTimes;
|
|
21
|
+
}
|
|
22
|
+
get isSeverityError() { return this.spxSeverity === SpxSeverityEnum.error; }
|
|
23
|
+
get isSeverityInfo() { return this.spxSeverity === SpxSeverityEnum.info; }
|
|
24
|
+
get isSeveritySuccess() { return this.spxSeverity === SpxSeverityEnum.success; }
|
|
25
|
+
get isSeverityWarning() { return this.spxSeverity === SpxSeverityEnum.warning; }
|
|
26
|
+
componentDidLoad() {
|
|
27
|
+
if (this.spxAutoclose) {
|
|
28
|
+
this.prepareAutoClose();
|
|
29
|
+
}
|
|
30
|
+
if (!this.spxTitle) {
|
|
31
|
+
this._assignDefaultTitle();
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
prepareAutoClose() {
|
|
35
|
+
this._autoCloseTimeout = setTimeout(() => {
|
|
36
|
+
this.onClose();
|
|
37
|
+
this._autoCloseTimeout = null;
|
|
38
|
+
this.tick = {};
|
|
39
|
+
}, this.spxAutoclose);
|
|
40
|
+
}
|
|
41
|
+
_assignDefaultTitle() {
|
|
42
|
+
switch (this.spxSeverity) {
|
|
43
|
+
case SpxSeverityEnum.error:
|
|
44
|
+
this.spxTitle = 'Error';
|
|
45
|
+
break;
|
|
46
|
+
case SpxSeverityEnum.info:
|
|
47
|
+
this.spxTitle = 'Info';
|
|
48
|
+
break;
|
|
49
|
+
case SpxSeverityEnum.success:
|
|
50
|
+
this.spxTitle = 'Notification';
|
|
51
|
+
break;
|
|
52
|
+
case SpxSeverityEnum.warning:
|
|
53
|
+
this.spxTitle = 'Warning';
|
|
54
|
+
break;
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
onClose() {
|
|
58
|
+
if (this.spxCloseable) {
|
|
59
|
+
this.spxClose.emit();
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: SpxAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
63
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: SpxAlertComponent, isStandalone: true, selector: "spx-alert", inputs: { spxAutoclose: "spxAutoclose", spxCloseable: "spxCloseable", spxHideTitle: "spxHideTitle", spxTitle: "spxTitle", spxMarginTop: "spxMarginTop", spxSeverity: "spxSeverity", tick: "tick" }, outputs: { spxClose: "spxClose" }, ngImport: i0, template: `
|
|
64
|
+
<div class="flex items-center gap-3 border-t-4 rounded px-4 py-3 shadow-md"
|
|
65
|
+
[class.cursor-pointer]="this.spxCloseable"
|
|
66
|
+
[class.bg-red-100]="this.isSeverityError"
|
|
67
|
+
[class.border-red-500]="this.isSeverityError"
|
|
68
|
+
[class.text-red-900]="this.isSeverityError"
|
|
69
|
+
[class.bg-cyan-100]="this.isSeverityInfo"
|
|
70
|
+
[class.border-cyan-500]="this.isSeverityInfo"
|
|
71
|
+
[class.text-cyan-900]="this.isSeverityInfo"
|
|
72
|
+
[class.bg-lime-100]="this.isSeveritySuccess"
|
|
73
|
+
[class.border-lime-500]="this.isSeveritySuccess"
|
|
74
|
+
[class.text-lime-900]="this.isSeveritySuccess"
|
|
75
|
+
[class.bg-amber-100]="this.isSeverityWarning"
|
|
76
|
+
[class.border-amber-500]="this.isSeverityWarning"
|
|
77
|
+
[class.text-amber-900]="this.isSeverityWarning"
|
|
78
|
+
[class.focus:ring-red-600]="this.spxCloseable && this.isSeverityError"
|
|
79
|
+
[class.hover:bg-red-200]="this.spxCloseable && this.isSeverityError"
|
|
80
|
+
[class.over:border-red-600]="this.spxCloseable && this.isSeverityError"
|
|
81
|
+
[class.focus:ring-cyan-600]="this.spxCloseable && this.isSeverityInfo"
|
|
82
|
+
[class.hover:bg-cyan-200]="this.spxCloseable && this.isSeverityInfo"
|
|
83
|
+
[class.over:border-cyan-600]="this.spxCloseable && this.isSeverityInfo"
|
|
84
|
+
[class.focus:ring-lime-600]="this.spxCloseable && this.isSeveritySuccess"
|
|
85
|
+
[class.hover:bg-lime-200]="this.spxCloseable && this.isSeveritySuccess"
|
|
86
|
+
[class.over:border-lime-600]="this.spxCloseable && this.isSeveritySuccess"
|
|
87
|
+
[class.focus:ring-amber-600]="this.spxCloseable && this.isSeverityWarning"
|
|
88
|
+
[class.hover:bg-amber-200]="this.spxCloseable && this.isSeverityWarning"
|
|
89
|
+
[class.over:border-amber-600]="this.spxCloseable && this.isSeverityWarning">
|
|
90
|
+
<fa-icon
|
|
91
|
+
*ngIf="this.isSeverityInfo"
|
|
92
|
+
[icon]="faCircleInfo" class="block text-xl text-cyan-600"></fa-icon>
|
|
93
|
+
<fa-icon
|
|
94
|
+
*ngIf="this.isSeverityError"
|
|
95
|
+
[icon]="faTriangleExclamation" class="block text-xl text-red-600"></fa-icon>
|
|
96
|
+
<fa-icon
|
|
97
|
+
*ngIf="this.isSeveritySuccess"
|
|
98
|
+
[icon]="faCheck" class="block text-xl text-lime-600"></fa-icon>
|
|
99
|
+
<fa-icon
|
|
100
|
+
*ngIf="this.isSeverityWarning"
|
|
101
|
+
[icon]="faTriangleExclamation" class="block text-xl text-amber-600"></fa-icon>
|
|
102
|
+
<div class="grow">
|
|
103
|
+
<p *ngIf="this.spxTitle && !this.spxHideTitle" class="font-bold">{{this.spxTitle}}</p>
|
|
104
|
+
<p class="text-sm">
|
|
105
|
+
<ng-content></ng-content>
|
|
106
|
+
</p>
|
|
107
|
+
</div>
|
|
108
|
+
<fa-icon
|
|
109
|
+
*ngIf="this.spxCloseable"
|
|
110
|
+
[icon]="faTimes" class="block text-xl"></fa-icon>
|
|
111
|
+
</div>
|
|
112
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FontAwesomeModule }, { kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }] }); }
|
|
113
|
+
}
|
|
114
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: SpxAlertComponent, decorators: [{
|
|
115
|
+
type: Component,
|
|
116
|
+
args: [{
|
|
117
|
+
selector: 'spx-alert',
|
|
118
|
+
standalone: true,
|
|
119
|
+
imports: [
|
|
120
|
+
CommonModule,
|
|
121
|
+
FontAwesomeModule,
|
|
122
|
+
NgIf,
|
|
123
|
+
],
|
|
124
|
+
template: `
|
|
125
|
+
<div class="flex items-center gap-3 border-t-4 rounded px-4 py-3 shadow-md"
|
|
126
|
+
[class.cursor-pointer]="this.spxCloseable"
|
|
127
|
+
[class.bg-red-100]="this.isSeverityError"
|
|
128
|
+
[class.border-red-500]="this.isSeverityError"
|
|
129
|
+
[class.text-red-900]="this.isSeverityError"
|
|
130
|
+
[class.bg-cyan-100]="this.isSeverityInfo"
|
|
131
|
+
[class.border-cyan-500]="this.isSeverityInfo"
|
|
132
|
+
[class.text-cyan-900]="this.isSeverityInfo"
|
|
133
|
+
[class.bg-lime-100]="this.isSeveritySuccess"
|
|
134
|
+
[class.border-lime-500]="this.isSeveritySuccess"
|
|
135
|
+
[class.text-lime-900]="this.isSeveritySuccess"
|
|
136
|
+
[class.bg-amber-100]="this.isSeverityWarning"
|
|
137
|
+
[class.border-amber-500]="this.isSeverityWarning"
|
|
138
|
+
[class.text-amber-900]="this.isSeverityWarning"
|
|
139
|
+
[class.focus:ring-red-600]="this.spxCloseable && this.isSeverityError"
|
|
140
|
+
[class.hover:bg-red-200]="this.spxCloseable && this.isSeverityError"
|
|
141
|
+
[class.over:border-red-600]="this.spxCloseable && this.isSeverityError"
|
|
142
|
+
[class.focus:ring-cyan-600]="this.spxCloseable && this.isSeverityInfo"
|
|
143
|
+
[class.hover:bg-cyan-200]="this.spxCloseable && this.isSeverityInfo"
|
|
144
|
+
[class.over:border-cyan-600]="this.spxCloseable && this.isSeverityInfo"
|
|
145
|
+
[class.focus:ring-lime-600]="this.spxCloseable && this.isSeveritySuccess"
|
|
146
|
+
[class.hover:bg-lime-200]="this.spxCloseable && this.isSeveritySuccess"
|
|
147
|
+
[class.over:border-lime-600]="this.spxCloseable && this.isSeveritySuccess"
|
|
148
|
+
[class.focus:ring-amber-600]="this.spxCloseable && this.isSeverityWarning"
|
|
149
|
+
[class.hover:bg-amber-200]="this.spxCloseable && this.isSeverityWarning"
|
|
150
|
+
[class.over:border-amber-600]="this.spxCloseable && this.isSeverityWarning">
|
|
151
|
+
<fa-icon
|
|
152
|
+
*ngIf="this.isSeverityInfo"
|
|
153
|
+
[icon]="faCircleInfo" class="block text-xl text-cyan-600"></fa-icon>
|
|
154
|
+
<fa-icon
|
|
155
|
+
*ngIf="this.isSeverityError"
|
|
156
|
+
[icon]="faTriangleExclamation" class="block text-xl text-red-600"></fa-icon>
|
|
157
|
+
<fa-icon
|
|
158
|
+
*ngIf="this.isSeveritySuccess"
|
|
159
|
+
[icon]="faCheck" class="block text-xl text-lime-600"></fa-icon>
|
|
160
|
+
<fa-icon
|
|
161
|
+
*ngIf="this.isSeverityWarning"
|
|
162
|
+
[icon]="faTriangleExclamation" class="block text-xl text-amber-600"></fa-icon>
|
|
163
|
+
<div class="grow">
|
|
164
|
+
<p *ngIf="this.spxTitle && !this.spxHideTitle" class="font-bold">{{this.spxTitle}}</p>
|
|
165
|
+
<p class="text-sm">
|
|
166
|
+
<ng-content></ng-content>
|
|
167
|
+
</p>
|
|
168
|
+
</div>
|
|
169
|
+
<fa-icon
|
|
170
|
+
*ngIf="this.spxCloseable"
|
|
171
|
+
[icon]="faTimes" class="block text-xl"></fa-icon>
|
|
172
|
+
</div>
|
|
173
|
+
`,
|
|
174
|
+
}]
|
|
175
|
+
}], propDecorators: { spxClose: [{
|
|
176
|
+
type: Output
|
|
177
|
+
}], spxAutoclose: [{
|
|
178
|
+
type: Input
|
|
179
|
+
}], spxCloseable: [{
|
|
180
|
+
type: Input
|
|
181
|
+
}], spxHideTitle: [{
|
|
182
|
+
type: Input
|
|
183
|
+
}], spxTitle: [{
|
|
184
|
+
type: Input
|
|
185
|
+
}], spxMarginTop: [{
|
|
186
|
+
type: Input
|
|
187
|
+
}], spxSeverity: [{
|
|
188
|
+
type: Input
|
|
189
|
+
}], tick: [{
|
|
190
|
+
type: Input
|
|
191
|
+
}] } });
|
|
192
|
+
|
|
193
|
+
class SpxAlertI {
|
|
194
|
+
}
|
|
195
|
+
|
|
196
|
+
/**
|
|
197
|
+
* Generated bundle index. Do not edit.
|
|
198
|
+
*/
|
|
199
|
+
|
|
200
|
+
export { SpxAlertComponent, SpxAlertI };
|
|
201
|
+
//# sourceMappingURL=softpak-components-spx-alert.mjs.map
|
|
@@ -0,0 +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.interface.ts","../../../../projects/softpak/components/spx-alert/softpak-components-spx-alert.ts"],"sourcesContent":["import { CommonModule, NgIf } from '@angular/common';\nimport { Component, EventEmitter, Input, Output } from '@angular/core';\nimport { FontAwesomeModule } from '@fortawesome/angular-fontawesome';\nimport { faCheck, faCircleInfo, faTimes, faTriangleExclamation } from '@fortawesome/free-solid-svg-icons';\nimport { SpxSeverityEnum } from '@softpak/components/spx-helpers';\n\n@Component({\n selector: 'spx-alert',\n standalone: true,\n imports: [\n CommonModule,\n FontAwesomeModule,\n NgIf,\n ],\n template: `\n <div class=\"flex items-center gap-3 border-t-4 rounded px-4 py-3 shadow-md\"\n [class.cursor-pointer]=\"this.spxCloseable\"\n [class.bg-red-100]=\"this.isSeverityError\"\n [class.border-red-500]=\"this.isSeverityError\"\n [class.text-red-900]=\"this.isSeverityError\"\n [class.bg-cyan-100]=\"this.isSeverityInfo\"\n [class.border-cyan-500]=\"this.isSeverityInfo\"\n [class.text-cyan-900]=\"this.isSeverityInfo\"\n [class.bg-lime-100]=\"this.isSeveritySuccess\"\n [class.border-lime-500]=\"this.isSeveritySuccess\"\n [class.text-lime-900]=\"this.isSeveritySuccess\"\n [class.bg-amber-100]=\"this.isSeverityWarning\"\n [class.border-amber-500]=\"this.isSeverityWarning\"\n [class.text-amber-900]=\"this.isSeverityWarning\"\n [class.focus:ring-red-600]=\"this.spxCloseable && this.isSeverityError\"\n [class.hover:bg-red-200]=\"this.spxCloseable && this.isSeverityError\"\n [class.over:border-red-600]=\"this.spxCloseable && this.isSeverityError\"\n [class.focus:ring-cyan-600]=\"this.spxCloseable && this.isSeverityInfo\"\n [class.hover:bg-cyan-200]=\"this.spxCloseable && this.isSeverityInfo\"\n [class.over:border-cyan-600]=\"this.spxCloseable && this.isSeverityInfo\"\n [class.focus:ring-lime-600]=\"this.spxCloseable && this.isSeveritySuccess\"\n [class.hover:bg-lime-200]=\"this.spxCloseable && this.isSeveritySuccess\"\n [class.over:border-lime-600]=\"this.spxCloseable && this.isSeveritySuccess\"\n [class.focus:ring-amber-600]=\"this.spxCloseable && this.isSeverityWarning\"\n [class.hover:bg-amber-200]=\"this.spxCloseable && this.isSeverityWarning\"\n [class.over:border-amber-600]=\"this.spxCloseable && this.isSeverityWarning\">\n <fa-icon\n *ngIf=\"this.isSeverityInfo\"\n [icon]=\"faCircleInfo\" class=\"block text-xl text-cyan-600\"></fa-icon>\n <fa-icon\n *ngIf=\"this.isSeverityError\"\n [icon]=\"faTriangleExclamation\" class=\"block text-xl text-red-600\"></fa-icon>\n <fa-icon\n *ngIf=\"this.isSeveritySuccess\"\n [icon]=\"faCheck\" class=\"block text-xl text-lime-600\"></fa-icon>\n <fa-icon\n *ngIf=\"this.isSeverityWarning\"\n [icon]=\"faTriangleExclamation\" class=\"block text-xl text-amber-600\"></fa-icon>\n <div class=\"grow\">\n <p *ngIf=\"this.spxTitle && !this.spxHideTitle\" class=\"font-bold\">{{this.spxTitle}}</p>\n <p class=\"text-sm\">\n <ng-content></ng-content>\n </p>\n </div>\n <fa-icon\n *ngIf=\"this.spxCloseable\"\n [icon]=\"faTimes\" class=\"block text-xl\"></fa-icon>\n </div>\n `,\n})\nexport class SpxAlertComponent {\n _autoCloseTimeout: any;\n @Output() spxClose: EventEmitter<void> = new EventEmitter<void>();\n @Input() spxAutoclose?: number;\n @Input() spxCloseable? = false;\n @Input() spxHideTitle = false;\n @Input() spxTitle?: string;\n @Input() spxMarginTop = false;\n @Input() spxSeverity?: SpxSeverityEnum;\n @Input() tick = {};\n\n get isSeverityError() { return this.spxSeverity === SpxSeverityEnum.error; }\n get isSeverityInfo() { return this.spxSeverity === SpxSeverityEnum.info; }\n get isSeveritySuccess() { return this.spxSeverity === SpxSeverityEnum.success; }\n get isSeverityWarning() { return this.spxSeverity === SpxSeverityEnum.warning; }\n faCheck = faCheck;\n faCircleInfo = faCircleInfo;\n faTriangleExclamation = faTriangleExclamation;\n faTimes = faTimes;\n\n componentDidLoad() {\n if (this.spxAutoclose) {\n this.prepareAutoClose();\n }\n if (!this.spxTitle) {\n this._assignDefaultTitle();\n }\n }\n\n private prepareAutoClose(): void {\n this._autoCloseTimeout = setTimeout(() => {\n this.onClose();\n this._autoCloseTimeout = null;\n this.tick = {};\n }, this.spxAutoclose);\n }\n\n private _assignDefaultTitle(): void {\n switch (this.spxSeverity) {\n case SpxSeverityEnum.error:\n this.spxTitle = 'Error';\n break;\n case SpxSeverityEnum.info:\n this.spxTitle = 'Info';\n break;\n case SpxSeverityEnum.success:\n this.spxTitle = 'Notification';\n break;\n case SpxSeverityEnum.warning:\n this.spxTitle = 'Warning';\n break;\n }\n }\n\n onClose() {\n if (this.spxCloseable) {\n this.spxClose.emit();\n }\n }\n}\n","import { SpxSeverityEnum } from \"@softpak/components/spx-helpers\";\n\nexport class SpxAlertI {\n closeable?: boolean;\n id?: number;\n message?: string;\n severity?: SpxSeverityEnum;\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
var SpxAppChannelTypeEnum;
|
|
2
|
+
(function (SpxAppChannelTypeEnum) {
|
|
3
|
+
SpxAppChannelTypeEnum["production"] = "Production";
|
|
4
|
+
SpxAppChannelTypeEnum["beta"] = "Beta";
|
|
5
|
+
SpxAppChannelTypeEnum["alpha"] = "Alpha";
|
|
6
|
+
SpxAppChannelTypeEnum["development"] = "Development";
|
|
7
|
+
})(SpxAppChannelTypeEnum || (SpxAppChannelTypeEnum = {}));
|
|
8
|
+
|
|
9
|
+
var SpxAppIdEnum;
|
|
10
|
+
(function (SpxAppIdEnum) {
|
|
11
|
+
SpxAppIdEnum["container"] = "container";
|
|
12
|
+
SpxAppIdEnum["depot"] = "depot";
|
|
13
|
+
SpxAppIdEnum["eucon"] = "eucon";
|
|
14
|
+
SpxAppIdEnum["orders"] = "orders";
|
|
15
|
+
})(SpxAppIdEnum || (SpxAppIdEnum = {}));
|
|
16
|
+
|
|
17
|
+
var SpxAppLangEnum;
|
|
18
|
+
(function (SpxAppLangEnum) {
|
|
19
|
+
SpxAppLangEnum["english"] = "en";
|
|
20
|
+
SpxAppLangEnum["dutch"] = "nl";
|
|
21
|
+
})(SpxAppLangEnum || (SpxAppLangEnum = {}));
|
|
22
|
+
|
|
23
|
+
/**
|
|
24
|
+
* Generated bundle index. Do not edit.
|
|
25
|
+
*/
|
|
26
|
+
|
|
27
|
+
export { SpxAppChannelTypeEnum, SpxAppIdEnum, SpxAppLangEnum };
|
|
28
|
+
//# sourceMappingURL=softpak-components-spx-app-configuration.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"softpak-components-spx-app-configuration.mjs","sources":["../../../../projects/softpak/components/spx-app-configuration/spx-app-channel-type.enum.ts","../../../../projects/softpak/components/spx-app-configuration/spx-app-id.enum.ts","../../../../projects/softpak/components/spx-app-configuration/spx-app-lang.enum.ts","../../../../projects/softpak/components/spx-app-configuration/softpak-components-spx-app-configuration.ts"],"sourcesContent":["export enum SpxAppChannelTypeEnum {\n production = 'Production',\n beta = 'Beta',\n alpha = 'Alpha',\n development = 'Development',\n}\n","export enum SpxAppIdEnum {\n container = 'container',\n depot = 'depot',\n eucon = 'eucon',\n orders = 'orders',\n}\n","export enum SpxAppLangEnum {\n english = 'en',\n dutch = 'nl',\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"IAAY,sBAKX;AALD,CAAA,UAAY,qBAAqB,EAAA;AAC/B,IAAA,qBAAA,CAAA,YAAA,CAAA,GAAA,YAAyB,CAAA;AACzB,IAAA,qBAAA,CAAA,MAAA,CAAA,GAAA,MAAa,CAAA;AACb,IAAA,qBAAA,CAAA,OAAA,CAAA,GAAA,OAAe,CAAA;AACf,IAAA,qBAAA,CAAA,aAAA,CAAA,GAAA,aAA2B,CAAA;AAC7B,CAAC,EALW,qBAAqB,KAArB,qBAAqB,GAKhC,EAAA,CAAA,CAAA;;ICLW,aAKX;AALD,CAAA,UAAY,YAAY,EAAA;AACtB,IAAA,YAAA,CAAA,WAAA,CAAA,GAAA,WAAuB,CAAA;AACvB,IAAA,YAAA,CAAA,OAAA,CAAA,GAAA,OAAe,CAAA;AACf,IAAA,YAAA,CAAA,OAAA,CAAA,GAAA,OAAe,CAAA;AACf,IAAA,YAAA,CAAA,QAAA,CAAA,GAAA,QAAiB,CAAA;AACnB,CAAC,EALW,YAAY,KAAZ,YAAY,GAKvB,EAAA,CAAA,CAAA;;ICLW,eAGX;AAHD,CAAA,UAAY,cAAc,EAAA;AACxB,IAAA,cAAA,CAAA,SAAA,CAAA,GAAA,IAAc,CAAA;AACd,IAAA,cAAA,CAAA,OAAA,CAAA,GAAA,IAAY,CAAA;AACd,CAAC,EAHW,cAAc,KAAd,cAAc,GAGzB,EAAA,CAAA,CAAA;;ACHD;;AAEG;;;;"}
|
|
@@ -0,0 +1,136 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { EventEmitter, Component, HostBinding, Input, Output } from '@angular/core';
|
|
3
|
+
import { SpxSeverityEnum } from '@softpak/components/spx-helpers';
|
|
4
|
+
|
|
5
|
+
class SpxButtonComponent {
|
|
6
|
+
constructor() {
|
|
7
|
+
this.spxDisabled = false;
|
|
8
|
+
this.spxSeverity = SpxSeverityEnum.info;
|
|
9
|
+
this.spxSize = 'lg';
|
|
10
|
+
this.spxType = 'submit';
|
|
11
|
+
this.spxClick = new EventEmitter();
|
|
12
|
+
this.hasShadowDom = (el) => {
|
|
13
|
+
return !!el.shadowRoot && !!el.attachShadow;
|
|
14
|
+
};
|
|
15
|
+
this.handleClick = () => {
|
|
16
|
+
if (!this.spxDisabled) {
|
|
17
|
+
this.spxClick.emit();
|
|
18
|
+
}
|
|
19
|
+
};
|
|
20
|
+
}
|
|
21
|
+
get hostClassBlock() { return this.spxFullWidth; }
|
|
22
|
+
get hostClassHFull() { return this.spxFullHeight; }
|
|
23
|
+
get hostClassWFull() { return this.spxFullWidth; }
|
|
24
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: SpxButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
25
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: SpxButtonComponent, isStandalone: true, selector: "spx-button", inputs: { spxDisabled: "spxDisabled", spxClass: "spxClass", spxClassObject: "spxClassObject", spxForm: "spxForm", spxFullHeight: "spxFullHeight", spxFullWidth: "spxFullWidth", spxSeverity: "spxSeverity", spxSize: "spxSize", spxTabIndex: "spxTabIndex", spxType: "spxType" }, outputs: { spxClick: "spxClick" }, host: { properties: { "class.block": "this.hostClassBlock", "class.h-full": "this.hostClassHFull", "class.w-full": "this.hostClassWFull" } }, ngImport: i0, template: `
|
|
26
|
+
<button
|
|
27
|
+
class="border border-transparent font-medium px-4 py-2 relative rounded text-center text-white focus:outline-none focus:ring-2 focus:ring-offset-2 text-sm"
|
|
28
|
+
[class.h-full]="this.spxFullHeight"
|
|
29
|
+
[class.w-full]="this.spxFullWidth"
|
|
30
|
+
[class.bg-blue-600]="!this.spxSeverity || this.spxSeverity === 'info'"
|
|
31
|
+
[class.focus:ring-blue-500]="!this.spxSeverity || this.spxSeverity === 'info'"
|
|
32
|
+
[class.hover:bg-blue-800]="!this.spxSeverity || this.spxSeverity === 'info'"
|
|
33
|
+
[class.bg-red-600]="!this.spxSeverity || this.spxSeverity === 'error'"
|
|
34
|
+
[class.focus:ring-red-500]="!this.spxSeverity || this.spxSeverity === 'error'"
|
|
35
|
+
[class.hover:bg-red-800]="!this.spxSeverity || this.spxSeverity === 'error'"
|
|
36
|
+
[class.bg-lime-600]="!this.spxSeverity || this.spxSeverity === 'success'"
|
|
37
|
+
[class.focus:ring-lime-500]="!this.spxSeverity || this.spxSeverity === 'success'"
|
|
38
|
+
[class.hover:bg-lime-800]="!this.spxSeverity || this.spxSeverity === 'success'"
|
|
39
|
+
[class.bg-amber-600]="!this.spxSeverity || this.spxSeverity === 'warning'"
|
|
40
|
+
[class.focus:ring-amber-500]="!this.spxSeverity || this.spxSeverity === 'warning'"
|
|
41
|
+
[class.hover:bg-amber-800]="!this.spxSeverity || this.spxSeverity === 'warning'"
|
|
42
|
+
[class.text-xl]="this.spxSize === 'xl'"
|
|
43
|
+
[class.text-lg]="this.spxSize === 'lg'"
|
|
44
|
+
[class.cursor-pointer]="!this.spxDisabled"
|
|
45
|
+
[class.cursor-not-allowed]="this.spxDisabled"
|
|
46
|
+
[class.opacity-50]="this.spxDisabled"
|
|
47
|
+
[class.focus:ring-0]="this.spxDisabled"
|
|
48
|
+
[class.hover:bg-red-600]="this.spxDisabled && this.spxSeverity === 'error'"
|
|
49
|
+
[class.hover:bg-blue-600]="this.spxDisabled && this.spxSeverity === 'info'"
|
|
50
|
+
[class.hover:bg-lime-600]="this.spxDisabled && this.spxSeverity === 'success'"
|
|
51
|
+
[class.hover:bg-amber-600]="this.spxDisabled && this.spxSeverity === 'warning'"
|
|
52
|
+
[attr.disabled]="this.spxDisabled ? this.spxDisabled : undefined"
|
|
53
|
+
[attr.form]="this.spxForm ? this.spxForm : undefined"
|
|
54
|
+
[attr.tabindex]="this.spxTabIndex ? this.spxTabIndex : undefined"
|
|
55
|
+
[attr.type]="this.spxType ? this.spxType : undefined"
|
|
56
|
+
(click)="this.handleClick()"
|
|
57
|
+
part="button"><ng-content></ng-content></button>`, isInline: true }); }
|
|
58
|
+
}
|
|
59
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: SpxButtonComponent, decorators: [{
|
|
60
|
+
type: Component,
|
|
61
|
+
args: [{
|
|
62
|
+
selector: 'spx-button',
|
|
63
|
+
standalone: true,
|
|
64
|
+
template: `
|
|
65
|
+
<button
|
|
66
|
+
class="border border-transparent font-medium px-4 py-2 relative rounded text-center text-white focus:outline-none focus:ring-2 focus:ring-offset-2 text-sm"
|
|
67
|
+
[class.h-full]="this.spxFullHeight"
|
|
68
|
+
[class.w-full]="this.spxFullWidth"
|
|
69
|
+
[class.bg-blue-600]="!this.spxSeverity || this.spxSeverity === 'info'"
|
|
70
|
+
[class.focus:ring-blue-500]="!this.spxSeverity || this.spxSeverity === 'info'"
|
|
71
|
+
[class.hover:bg-blue-800]="!this.spxSeverity || this.spxSeverity === 'info'"
|
|
72
|
+
[class.bg-red-600]="!this.spxSeverity || this.spxSeverity === 'error'"
|
|
73
|
+
[class.focus:ring-red-500]="!this.spxSeverity || this.spxSeverity === 'error'"
|
|
74
|
+
[class.hover:bg-red-800]="!this.spxSeverity || this.spxSeverity === 'error'"
|
|
75
|
+
[class.bg-lime-600]="!this.spxSeverity || this.spxSeverity === 'success'"
|
|
76
|
+
[class.focus:ring-lime-500]="!this.spxSeverity || this.spxSeverity === 'success'"
|
|
77
|
+
[class.hover:bg-lime-800]="!this.spxSeverity || this.spxSeverity === 'success'"
|
|
78
|
+
[class.bg-amber-600]="!this.spxSeverity || this.spxSeverity === 'warning'"
|
|
79
|
+
[class.focus:ring-amber-500]="!this.spxSeverity || this.spxSeverity === 'warning'"
|
|
80
|
+
[class.hover:bg-amber-800]="!this.spxSeverity || this.spxSeverity === 'warning'"
|
|
81
|
+
[class.text-xl]="this.spxSize === 'xl'"
|
|
82
|
+
[class.text-lg]="this.spxSize === 'lg'"
|
|
83
|
+
[class.cursor-pointer]="!this.spxDisabled"
|
|
84
|
+
[class.cursor-not-allowed]="this.spxDisabled"
|
|
85
|
+
[class.opacity-50]="this.spxDisabled"
|
|
86
|
+
[class.focus:ring-0]="this.spxDisabled"
|
|
87
|
+
[class.hover:bg-red-600]="this.spxDisabled && this.spxSeverity === 'error'"
|
|
88
|
+
[class.hover:bg-blue-600]="this.spxDisabled && this.spxSeverity === 'info'"
|
|
89
|
+
[class.hover:bg-lime-600]="this.spxDisabled && this.spxSeverity === 'success'"
|
|
90
|
+
[class.hover:bg-amber-600]="this.spxDisabled && this.spxSeverity === 'warning'"
|
|
91
|
+
[attr.disabled]="this.spxDisabled ? this.spxDisabled : undefined"
|
|
92
|
+
[attr.form]="this.spxForm ? this.spxForm : undefined"
|
|
93
|
+
[attr.tabindex]="this.spxTabIndex ? this.spxTabIndex : undefined"
|
|
94
|
+
[attr.type]="this.spxType ? this.spxType : undefined"
|
|
95
|
+
(click)="this.handleClick()"
|
|
96
|
+
part="button"><ng-content></ng-content></button>`,
|
|
97
|
+
}]
|
|
98
|
+
}], propDecorators: { hostClassBlock: [{
|
|
99
|
+
type: HostBinding,
|
|
100
|
+
args: ['class.block']
|
|
101
|
+
}], hostClassHFull: [{
|
|
102
|
+
type: HostBinding,
|
|
103
|
+
args: ['class.h-full']
|
|
104
|
+
}], hostClassWFull: [{
|
|
105
|
+
type: HostBinding,
|
|
106
|
+
args: ['class.w-full']
|
|
107
|
+
}], spxDisabled: [{
|
|
108
|
+
type: Input
|
|
109
|
+
}], spxClass: [{
|
|
110
|
+
type: Input
|
|
111
|
+
}], spxClassObject: [{
|
|
112
|
+
type: Input
|
|
113
|
+
}], spxForm: [{
|
|
114
|
+
type: Input
|
|
115
|
+
}], spxFullHeight: [{
|
|
116
|
+
type: Input
|
|
117
|
+
}], spxFullWidth: [{
|
|
118
|
+
type: Input
|
|
119
|
+
}], spxSeverity: [{
|
|
120
|
+
type: Input
|
|
121
|
+
}], spxSize: [{
|
|
122
|
+
type: Input
|
|
123
|
+
}], spxTabIndex: [{
|
|
124
|
+
type: Input
|
|
125
|
+
}], spxType: [{
|
|
126
|
+
type: Input
|
|
127
|
+
}], spxClick: [{
|
|
128
|
+
type: Output
|
|
129
|
+
}] } });
|
|
130
|
+
|
|
131
|
+
/**
|
|
132
|
+
* Generated bundle index. Do not edit.
|
|
133
|
+
*/
|
|
134
|
+
|
|
135
|
+
export { SpxButtonComponent };
|
|
136
|
+
//# sourceMappingURL=softpak-components-spx-button.mjs.map
|
|
@@ -0,0 +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/softpak-components-spx-button.ts"],"sourcesContent":["import { Component, EventEmitter, HostBinding, Input, Output } from '@angular/core';\nimport { SpxSeverityEnum } from '@softpak/components/spx-helpers';\n\n@Component({\n selector: 'spx-button',\n standalone: true,\n template: `\n <button\n class=\"border border-transparent font-medium px-4 py-2 relative rounded text-center text-white focus:outline-none focus:ring-2 focus:ring-offset-2 text-sm\"\n [class.h-full]=\"this.spxFullHeight\"\n [class.w-full]=\"this.spxFullWidth\"\n [class.bg-blue-600]=\"!this.spxSeverity || this.spxSeverity === 'info'\"\n [class.focus:ring-blue-500]=\"!this.spxSeverity || this.spxSeverity === 'info'\"\n [class.hover:bg-blue-800]=\"!this.spxSeverity || this.spxSeverity === 'info'\"\n [class.bg-red-600]=\"!this.spxSeverity || this.spxSeverity === 'error'\"\n [class.focus:ring-red-500]=\"!this.spxSeverity || this.spxSeverity === 'error'\"\n [class.hover:bg-red-800]=\"!this.spxSeverity || this.spxSeverity === 'error'\"\n [class.bg-lime-600]=\"!this.spxSeverity || this.spxSeverity === 'success'\"\n [class.focus:ring-lime-500]=\"!this.spxSeverity || this.spxSeverity === 'success'\"\n [class.hover:bg-lime-800]=\"!this.spxSeverity || this.spxSeverity === 'success'\"\n [class.bg-amber-600]=\"!this.spxSeverity || this.spxSeverity === 'warning'\"\n [class.focus:ring-amber-500]=\"!this.spxSeverity || this.spxSeverity === 'warning'\"\n [class.hover:bg-amber-800]=\"!this.spxSeverity || this.spxSeverity === 'warning'\"\n [class.text-xl]=\"this.spxSize === 'xl'\"\n [class.text-lg]=\"this.spxSize === 'lg'\"\n [class.cursor-pointer]=\"!this.spxDisabled\"\n [class.cursor-not-allowed]=\"this.spxDisabled\"\n [class.opacity-50]=\"this.spxDisabled\"\n [class.focus:ring-0]=\"this.spxDisabled\"\n [class.hover:bg-red-600]=\"this.spxDisabled && this.spxSeverity === 'error'\"\n [class.hover:bg-blue-600]=\"this.spxDisabled && this.spxSeverity === 'info'\"\n [class.hover:bg-lime-600]=\"this.spxDisabled && this.spxSeverity === 'success'\"\n [class.hover:bg-amber-600]=\"this.spxDisabled && this.spxSeverity === 'warning'\"\n [attr.disabled]=\"this.spxDisabled ? this.spxDisabled : undefined\"\n [attr.form]=\"this.spxForm ? this.spxForm : undefined\"\n [attr.tabindex]=\"this.spxTabIndex ? this.spxTabIndex : undefined\"\n [attr.type]=\"this.spxType ? this.spxType : undefined\"\n (click)=\"this.handleClick()\"\n part=\"button\"><ng-content></ng-content></button>`,\n})\nexport class SpxButtonComponent {\n @HostBinding('class.block') get hostClassBlock() { return this.spxFullWidth; }\n @HostBinding('class.h-full') get hostClassHFull() { return this.spxFullHeight; }\n @HostBinding('class.w-full') get hostClassWFull() { return this.spxFullWidth; }\n @Input() spxDisabled = false;\n @Input() spxClass?: string;\n @Input() spxClassObject?: object;\n @Input() spxForm?: string;\n @Input() spxFullHeight?: boolean;\n @Input() spxFullWidth?: boolean;\n @Input() spxSeverity: SpxSeverityEnum = SpxSeverityEnum.info;\n @Input() spxSize: 'lg' | 'xl' = 'lg';\n @Input() spxTabIndex?: number;\n @Input() spxType: 'button' | 'submit' = 'submit';\n @Output() spxClick: EventEmitter<void> = new EventEmitter<void>();\n\n hasShadowDom = (el: HTMLElement) => {\n return !!el.shadowRoot && !!(el as any).attachShadow;\n };\n handleClick = () => {\n if (!this.spxDisabled) {\n this.spxClick.emit();\n }\n }\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { Pipe } from '@angular/core';
|
|
3
|
+
|
|
4
|
+
class SpxCapitalizePipe {
|
|
5
|
+
transform(value, ..._args) {
|
|
6
|
+
return value = value ? value.charAt(0).toUpperCase() + value.substr(1).toLowerCase() : '';
|
|
7
|
+
}
|
|
8
|
+
static transform(value, ..._args) {
|
|
9
|
+
return new SpxCapitalizePipe().transform(value, _args);
|
|
10
|
+
}
|
|
11
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: SpxCapitalizePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
12
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.1.2", ngImport: i0, type: SpxCapitalizePipe, isStandalone: true, name: "capitalize" }); }
|
|
13
|
+
}
|
|
14
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: SpxCapitalizePipe, decorators: [{
|
|
15
|
+
type: Pipe,
|
|
16
|
+
args: [{
|
|
17
|
+
name: 'capitalize',
|
|
18
|
+
standalone: true,
|
|
19
|
+
}]
|
|
20
|
+
}] });
|
|
21
|
+
|
|
22
|
+
/**
|
|
23
|
+
* Generated bundle index. Do not edit.
|
|
24
|
+
*/
|
|
25
|
+
|
|
26
|
+
export { SpxCapitalizePipe };
|
|
27
|
+
//# sourceMappingURL=softpak-components-spx-capitalize.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"softpak-components-spx-capitalize.mjs","sources":["../../../../projects/softpak/components/spx-capitalize/spx-capitalize.pipe.ts","../../../../projects/softpak/components/spx-capitalize/softpak-components-spx-capitalize.ts"],"sourcesContent":["import { Pipe, PipeTransform } from '@angular/core';\n\n@Pipe({\n name: 'capitalize',\n standalone: true,\n})\nexport class SpxCapitalizePipe implements PipeTransform {\n\n transform(value: string, ..._args: unknown[]): string {\n return value = value ? value.charAt(0).toUpperCase() + value.substr(1).toLowerCase() : '';\n }\n\n static transform(value: string, ..._args: unknown[]): string {\n return new SpxCapitalizePipe().transform(value, _args);\n }\n\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;MAMa,iBAAiB,CAAA;AAE5B,IAAA,SAAS,CAAC,KAAa,EAAE,GAAG,KAAgB,EAAA;AAC1C,QAAA,OAAO,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,GAAG,EAAE,CAAC;KAC3F;AAED,IAAA,OAAO,SAAS,CAAC,KAAa,EAAE,GAAG,KAAgB,EAAA;QACjD,OAAO,IAAI,iBAAiB,EAAE,CAAC,SAAS,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;KACxD;8GARU,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,IAAA,EAAA,CAAA,CAAA,EAAA;4GAAjB,iBAAiB,EAAA,YAAA,EAAA,IAAA,EAAA,IAAA,EAAA,YAAA,EAAA,CAAA,CAAA,EAAA;;2FAAjB,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAJ7B,IAAI;AAAC,YAAA,IAAA,EAAA,CAAA;AACJ,oBAAA,IAAI,EAAE,YAAY;AAClB,oBAAA,UAAU,EAAE,IAAI;AACjB,iBAAA,CAAA;;;ACLD;;AAEG;;;;"}
|
|
@@ -0,0 +1,171 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { EventEmitter, Component, Input, Output } from '@angular/core';
|
|
3
|
+
import { SpxButtonComponent } from '@softpak/components/spx-button';
|
|
4
|
+
import * as i1$1 from '@angular/common';
|
|
5
|
+
import { CommonModule } from '@angular/common';
|
|
6
|
+
import * as i1 from '@angular/forms';
|
|
7
|
+
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
|
|
8
|
+
import { SpxInputComponent } from '@softpak/components/spx-inputs';
|
|
9
|
+
import { SpxFormSectionComponent } from '@softpak/components/spx-form-section';
|
|
10
|
+
import { SpxAppChannelTypeEnum } from '@softpak/components/spx-app-configuration';
|
|
11
|
+
|
|
12
|
+
class SpxChannelIndicatorComponent {
|
|
13
|
+
constructor() {
|
|
14
|
+
this.spxChange = new EventEmitter();
|
|
15
|
+
}
|
|
16
|
+
onChange() {
|
|
17
|
+
this.spxChange.emit();
|
|
18
|
+
}
|
|
19
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: SpxChannelIndicatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
20
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: SpxChannelIndicatorComponent, isStandalone: true, selector: "spx-channel-indicator", inputs: { channel: "channel", channelType: "channelType", txtChange: "txtChange" }, outputs: { spxChange: "spxChange" }, ngImport: i0, template: `<div class="bg-white p-3 rounded flex gap-3 items-center text-black">
|
|
21
|
+
<div class="grow">
|
|
22
|
+
<div class="text-lg font-bold">{{ channel?.brand }}</div>
|
|
23
|
+
<div class="text-base text-gray-600">{{ channelType }}</div>
|
|
24
|
+
</div>
|
|
25
|
+
<spx-button (click)="onChange()" [spxType]="'button'">{{ txtChange }}</spx-button>
|
|
26
|
+
</div>`, isInline: true, dependencies: [{ kind: "component", type: SpxButtonComponent, selector: "spx-button", inputs: ["spxDisabled", "spxClass", "spxClassObject", "spxForm", "spxFullHeight", "spxFullWidth", "spxSeverity", "spxSize", "spxTabIndex", "spxType"], outputs: ["spxClick"] }] }); }
|
|
27
|
+
}
|
|
28
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: SpxChannelIndicatorComponent, decorators: [{
|
|
29
|
+
type: Component,
|
|
30
|
+
args: [{
|
|
31
|
+
selector: 'spx-channel-indicator',
|
|
32
|
+
template: `<div class="bg-white p-3 rounded flex gap-3 items-center text-black">
|
|
33
|
+
<div class="grow">
|
|
34
|
+
<div class="text-lg font-bold">{{ channel?.brand }}</div>
|
|
35
|
+
<div class="text-base text-gray-600">{{ channelType }}</div>
|
|
36
|
+
</div>
|
|
37
|
+
<spx-button (click)="onChange()" [spxType]="'button'">{{ txtChange }}</spx-button>
|
|
38
|
+
</div>`,
|
|
39
|
+
standalone: true,
|
|
40
|
+
imports: [
|
|
41
|
+
SpxButtonComponent,
|
|
42
|
+
],
|
|
43
|
+
}]
|
|
44
|
+
}], ctorParameters: () => [], propDecorators: { channel: [{
|
|
45
|
+
type: Input
|
|
46
|
+
}], channelType: [{
|
|
47
|
+
type: Input
|
|
48
|
+
}], txtChange: [{
|
|
49
|
+
type: Input
|
|
50
|
+
}], spxChange: [{
|
|
51
|
+
type: Output
|
|
52
|
+
}] } });
|
|
53
|
+
|
|
54
|
+
class SpxChannelSelectionComponent {
|
|
55
|
+
constructor() {
|
|
56
|
+
this.options = [];
|
|
57
|
+
}
|
|
58
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: SpxChannelSelectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
59
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: SpxChannelSelectionComponent, isStandalone: true, selector: "spx-channel-selection", inputs: { control: "control", options: "options", txtChannel: "txtChannel" }, ngImport: i0, template: `
|
|
60
|
+
<spx-input [formControl]="control" [spxLabel]="txtChannel"
|
|
61
|
+
[spxType]="'radio'" [spxSuggestions]="options"></spx-input>
|
|
62
|
+
`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: SpxInputComponent, selector: "spx-input", inputs: ["spxLabel", "spxMax", "spxMin", "spxName", "spxReadonly", "spxAutofocus", "spxInputMode", "spxPattern", "spxRequired", "spxSelectMonth", "spxSelectDay", "spxShowEdit", "spxShowHelp", "spxCompact", "spxShowClear", "spxShowSearch", "spxShowValidationMessages", "spxStep", "spxSuggestions", "spxType", "spxValidators", "value", "spxCapitalize", "spxFocused"], outputs: ["spxBlur", "spxClear", "spxChange", "spxFocus", "spxEdit", "spxHelp", "spxSearch"] }] }); }
|
|
63
|
+
}
|
|
64
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: SpxChannelSelectionComponent, decorators: [{
|
|
65
|
+
type: Component,
|
|
66
|
+
args: [{
|
|
67
|
+
selector: 'spx-channel-selection',
|
|
68
|
+
template: `
|
|
69
|
+
<spx-input [formControl]="control" [spxLabel]="txtChannel"
|
|
70
|
+
[spxType]="'radio'" [spxSuggestions]="options"></spx-input>
|
|
71
|
+
`,
|
|
72
|
+
standalone: true,
|
|
73
|
+
imports: [
|
|
74
|
+
CommonModule,
|
|
75
|
+
FormsModule,
|
|
76
|
+
ReactiveFormsModule,
|
|
77
|
+
SpxInputComponent,
|
|
78
|
+
]
|
|
79
|
+
}]
|
|
80
|
+
}], ctorParameters: () => [], propDecorators: { control: [{
|
|
81
|
+
type: Input
|
|
82
|
+
}], options: [{
|
|
83
|
+
type: Input
|
|
84
|
+
}], txtChannel: [{
|
|
85
|
+
type: Input
|
|
86
|
+
}] } });
|
|
87
|
+
|
|
88
|
+
class SpxCompanySelectionComponent {
|
|
89
|
+
constructor() {
|
|
90
|
+
this.options = [];
|
|
91
|
+
}
|
|
92
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: SpxCompanySelectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
93
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: SpxCompanySelectionComponent, isStandalone: true, selector: "spx-company-selection", inputs: { control: "control", options: "options", txtChannel: "txtChannel", txtCompany: "txtCompany" }, ngImport: i0, template: `<spx-form-section [spxTitle]="txtChannel" [spxIndex]="2">
|
|
94
|
+
<div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-3">
|
|
95
|
+
<spx-input [formControl]="control" [spxLabel]="txtCompany"
|
|
96
|
+
[spxType]="'radio'" [spxSuggestions]="options"></spx-input>
|
|
97
|
+
</div>
|
|
98
|
+
</spx-form-section>`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: SpxInputComponent, selector: "spx-input", inputs: ["spxLabel", "spxMax", "spxMin", "spxName", "spxReadonly", "spxAutofocus", "spxInputMode", "spxPattern", "spxRequired", "spxSelectMonth", "spxSelectDay", "spxShowEdit", "spxShowHelp", "spxCompact", "spxShowClear", "spxShowSearch", "spxShowValidationMessages", "spxStep", "spxSuggestions", "spxType", "spxValidators", "value", "spxCapitalize", "spxFocused"], outputs: ["spxBlur", "spxClear", "spxChange", "spxFocus", "spxEdit", "spxHelp", "spxSearch"] }, { kind: "component", type: SpxFormSectionComponent, selector: "spx-form-section", inputs: ["spxIndex", "spxIndexSecondary", "spxTitle", "spxShowTitle"] }] }); }
|
|
99
|
+
}
|
|
100
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: SpxCompanySelectionComponent, decorators: [{
|
|
101
|
+
type: Component,
|
|
102
|
+
args: [{
|
|
103
|
+
selector: 'spx-company-selection',
|
|
104
|
+
template: `<spx-form-section [spxTitle]="txtChannel" [spxIndex]="2">
|
|
105
|
+
<div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-3">
|
|
106
|
+
<spx-input [formControl]="control" [spxLabel]="txtCompany"
|
|
107
|
+
[spxType]="'radio'" [spxSuggestions]="options"></spx-input>
|
|
108
|
+
</div>
|
|
109
|
+
</spx-form-section>`,
|
|
110
|
+
standalone: true,
|
|
111
|
+
imports: [
|
|
112
|
+
CommonModule,
|
|
113
|
+
FormsModule,
|
|
114
|
+
ReactiveFormsModule,
|
|
115
|
+
SpxInputComponent,
|
|
116
|
+
SpxFormSectionComponent,
|
|
117
|
+
]
|
|
118
|
+
}]
|
|
119
|
+
}], ctorParameters: () => [], propDecorators: { control: [{
|
|
120
|
+
type: Input
|
|
121
|
+
}], options: [{
|
|
122
|
+
type: Input
|
|
123
|
+
}], txtChannel: [{
|
|
124
|
+
type: Input
|
|
125
|
+
}], txtCompany: [{
|
|
126
|
+
type: Input
|
|
127
|
+
}] } });
|
|
128
|
+
|
|
129
|
+
class SpxWelcomeComponent {
|
|
130
|
+
get filteredChannels() { return (this.channels ?? [])?.filter(channel => channel.channelTypes.includes(SpxAppChannelTypeEnum.production)); }
|
|
131
|
+
constructor() {
|
|
132
|
+
this.channels = [];
|
|
133
|
+
this.spxSelected = new EventEmitter();
|
|
134
|
+
}
|
|
135
|
+
onSelectChannel(channel) {
|
|
136
|
+
this.spxSelected.emit(channel);
|
|
137
|
+
}
|
|
138
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: SpxWelcomeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
139
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.2", type: SpxWelcomeComponent, isStandalone: true, selector: "spx-welcome", inputs: { channels: "channels" }, outputs: { spxSelected: "spxSelected" }, ngImport: i0, template: `<div class="flex flex-col gap-3">
|
|
140
|
+
<spx-button [spxFullWidth]="true" *ngFor="let channel of filteredChannels" (click)="onSelectChannel(channel)">
|
|
141
|
+
{{ channel.brand }}
|
|
142
|
+
</spx-button>
|
|
143
|
+
</div>`, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: SpxButtonComponent, selector: "spx-button", inputs: ["spxDisabled", "spxClass", "spxClassObject", "spxForm", "spxFullHeight", "spxFullWidth", "spxSeverity", "spxSize", "spxTabIndex", "spxType"], outputs: ["spxClick"] }] }); }
|
|
144
|
+
}
|
|
145
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.2", ngImport: i0, type: SpxWelcomeComponent, decorators: [{
|
|
146
|
+
type: Component,
|
|
147
|
+
args: [{
|
|
148
|
+
selector: 'spx-welcome',
|
|
149
|
+
template: `<div class="flex flex-col gap-3">
|
|
150
|
+
<spx-button [spxFullWidth]="true" *ngFor="let channel of filteredChannels" (click)="onSelectChannel(channel)">
|
|
151
|
+
{{ channel.brand }}
|
|
152
|
+
</spx-button>
|
|
153
|
+
</div>`,
|
|
154
|
+
standalone: true,
|
|
155
|
+
imports: [
|
|
156
|
+
CommonModule,
|
|
157
|
+
SpxButtonComponent,
|
|
158
|
+
]
|
|
159
|
+
}]
|
|
160
|
+
}], ctorParameters: () => [], propDecorators: { channels: [{
|
|
161
|
+
type: Input
|
|
162
|
+
}], spxSelected: [{
|
|
163
|
+
type: Output
|
|
164
|
+
}] } });
|
|
165
|
+
|
|
166
|
+
/**
|
|
167
|
+
* Generated bundle index. Do not edit.
|
|
168
|
+
*/
|
|
169
|
+
|
|
170
|
+
export { SpxChannelIndicatorComponent, SpxChannelSelectionComponent, SpxCompanySelectionComponent, SpxWelcomeComponent };
|
|
171
|
+
//# sourceMappingURL=softpak-components-spx-channel-selection.mjs.map
|