@fuentis/phoenix-ui 0.0.9-alpha.252 → 0.0.9-alpha.253
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.
|
@@ -5322,7 +5322,6 @@ class ReadOnlyInputComponent {
|
|
|
5322
5322
|
? formValue
|
|
5323
5323
|
: timePeriodFromMS(formValue);
|
|
5324
5324
|
this.value = convertedValue;
|
|
5325
|
-
this.value = convertedValue;
|
|
5326
5325
|
break;
|
|
5327
5326
|
case ControlType.TEXT_EDITOR:
|
|
5328
5327
|
const htmlContent = this.metaform.get(this.control.configuration.key)?.value;
|
|
@@ -5346,7 +5345,7 @@ class ReadOnlyInputComponent {
|
|
|
5346
5345
|
}
|
|
5347
5346
|
}
|
|
5348
5347
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ReadOnlyInputComponent, deps: [{ token: i1$5.DomSanitizer }, { token: i2$1.TranslateService }, { token: i0.DestroyRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
5349
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ReadOnlyInputComponent, isStandalone: true, selector: "phoenix-read-only-input", inputs: { control: "control", metaform: "metaform" }, ngImport: i0, template: "<phoenix-meta-label [control]=\"control\"></phoenix-meta-label>\n\n<ng-container [ngSwitch]=\"control.configuration.type\">\n <ng-container *ngSwitchCase=\"ctrlType.TEXT_EDITOR\">\n <p-editor\n [attr.data-cy]=\"'editor-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n [readonly]=\"true\"\n [(ngModel)]=\"value\"\n ></p-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"ctrlType.SWITCH\">\n <p-inputSwitch\n [attr.data-cy]=\"'switch-' + control?.id\"\n *ngIf=\"value?.isBoolean; else fallBack\"\n styleClass=\"mt-2 ml-1 mr-1\"\n [disabled]=\"true\"\n [(ngModel)]=\"value.res\"\n ></p-inputSwitch>\n </ng-container>\n <ng-container *ngSwitchCase=\"ctrlType.DATE\">\n <div\n [attr.data-cy]=\"'date-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n {{ value | date }}\n </div>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"ctrlType.CHECKBOX\">\n <p-checkbox\n [attr.data-cy]=\"'checkbox-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n styleClass=\"mt-3\"\n [(ngModel)]=\"value\"\n [binary]=\"true\"\n inputId=\"binary\"\n [disabled]=\"true\"\n ></p-checkbox>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"ctrlType.LINKS_DATA\">\n <div\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2 overflow-y-auto\"\n [attr.data-cy]=\"'link-' + control?.id\"\n >\n <ng-container *ngFor=\"let item of value\">\n <span class=\"m-2 text-sm font-light\">{{ item?.relationLabel }}</span>\n </ng-container>\n </div>\n </ng-container>\n <ng-container *ngSwitchCase=\"ctrlType.ASSIGN\">\n <div\n *ngIf=\"value?.name; else fallBack\"\n [attr.data-cy]=\"'number-' + control?.id\"\n >\n <div>\n <p-button [rounded]=\"true\" [text]=\"true\" (onClick)=\"op.toggle($event)\">\n <div class=\"person-wrap\">\n <div class=\"person-avatar\">\n {{ value?.name?.toUpperCase().charAt(0) }}\n </div>\n <div>\n <p\n class=\"white-space-nowrap overflow-hidden text-overflow-ellipsis\"\n >\n {{ value?.name }}\n </p>\n <p\n class=\"white-space-nowrap overflow-hidden text-overflow-ellipsis\"\n >\n {{ value?.function }}\n </p>\n </div>\n </div></p-button\n >\n <p-overlayPanel #op>\n <div>\n <span class=\"block mb-2\">\n <i class=\"pi pi-envelope mr-1 text-500\"></i>\n\n {{ value.email ?? \" --\" }}\n </span>\n <p>\n <i class=\"pi pi-phone mr-1 text-500\"></i\n >{{ value.phone ?? \" --\" }}\n </p>\n </div></p-overlayPanel\n >\n </div>\n </div>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"ctrlType.PASSWORD\">\n <div\n [attr.data-cy]=\"'password-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n <p-password\n class=\"ng-invalid ng-dirty\"\n [disabled]=\"true\"\n [(ngModel)]=\"value\"\n [feedback]=\"false\"\n ></p-password>\n </div>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"ctrlType.SS_OPTION_OBJECT_BASED\">\n <div\n [attr.data-cy]=\"'SS-OPTION-OBJECT-BASED-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n {{ value.value }}\n </div>\n </ng-container>\n\n <!-- Remove this if necessary - spaces-overview GENERAL form contol -->\n <ng-container *ngSwitchCase=\"ctrlType.SS_OPTION\">\n <div\n [attr.data-cy]=\"'SS-OPTION-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n {{ value | translate }}\n </div>\n </ng-container>\n\n <ng-container *ngSwitchDefault>\n <div\n [attr.data-cy]=\"'test-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n {{ value | stripHtml }}\n </div>\n </ng-container>\n</ng-container>\n\n<ng-template #fallBack>\n <div\n [attr.data-cy]=\"'test-' + control?.id\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n --\n </div>\n</ng-template>\n", styles: [".person-wrap{display:flex;align-items:center;margin-left:-6px}.person-wrap p{margin:0}.person-wrap .person-avatar{display:flex;justify-content:center;align-items:center;width:28px;height:28px;min-width:28px;min-height:28px;margin-right:5px;background-color:#e94260;color:#fff;border-radius:50%;font-size:1rem}.person-wrap .person-name :first-child{font-size:1rem}.person-details{border-top:1px solid #e0e0e0;padding:5px;margin-left:-6px;width:150px}.person-details p{margin:0;display:flex;align-items:center}.person-details i{color:#d75063;padding-right:5px}.person-details .p-editor-container{padding-left:0!important}:host ::ng-deep .p-password .p-password-input{border:none!important}:host ::ng-deep .p-editor-toolbar{display:none!important}:host ::ng-deep .p-editor-container{background:transparent!important;border:0px!important}:host ::ng-deep .p-editor-content.ql-snow{border:0px!important}:host ::ng-deep .p-editor-container .p-editor-content .ql-editor{background:transparent!important}:host ::ng-deep .ql-editor{padding:0;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "component", type: MetaLabelComponent, selector: "phoenix-meta-label", inputs: ["control"] }, { kind: "ngmodule", type: InputSwitchModule }, { kind: "component", type: i3$8.InputSwitch, selector: "p-inputSwitch, p-inputswitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type:
|
|
5348
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ReadOnlyInputComponent, isStandalone: true, selector: "phoenix-read-only-input", inputs: { control: "control", metaform: "metaform" }, ngImport: i0, template: "<phoenix-meta-label [control]=\"control\"></phoenix-meta-label>\n\n<ng-container [ngSwitch]=\"control.configuration.type\">\n <ng-container *ngSwitchCase=\"ctrlType.TEXT_EDITOR\">\n <p-editor\n [attr.data-cy]=\"'editor-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n [readonly]=\"true\"\n [(ngModel)]=\"value\"\n ></p-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"ctrlType.SWITCH\">\n <p-inputSwitch\n [attr.data-cy]=\"'switch-' + control?.id\"\n *ngIf=\"value?.isBoolean; else fallBack\"\n styleClass=\"mt-2 ml-1 mr-1\"\n [disabled]=\"true\"\n [(ngModel)]=\"value.res\"\n ></p-inputSwitch>\n </ng-container>\n <ng-container *ngSwitchCase=\"ctrlType.DATE\">\n <div\n [attr.data-cy]=\"'date-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n {{ value | date }}\n </div>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"ctrlType.CHECKBOX\">\n <p-checkbox\n [attr.data-cy]=\"'checkbox-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n styleClass=\"mt-3\"\n [(ngModel)]=\"value\"\n [binary]=\"true\"\n inputId=\"binary\"\n [disabled]=\"true\"\n ></p-checkbox>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"ctrlType.LINKS_DATA\">\n <div\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2 overflow-y-auto\"\n [attr.data-cy]=\"'link-' + control?.id\"\n >\n <ng-container *ngFor=\"let item of value\">\n <span class=\"m-2 text-sm font-light\">{{ item?.relationLabel }}</span>\n </ng-container>\n </div>\n </ng-container>\n <ng-container *ngSwitchCase=\"ctrlType.ASSIGN\">\n <div\n *ngIf=\"value?.name; else fallBack\"\n [attr.data-cy]=\"'number-' + control?.id\"\n >\n <div>\n <p-button [rounded]=\"true\" [text]=\"true\" (onClick)=\"op.toggle($event)\">\n <div class=\"person-wrap\">\n <div class=\"person-avatar\">\n {{ value?.name?.toUpperCase().charAt(0) }}\n </div>\n <div>\n <p\n class=\"white-space-nowrap overflow-hidden text-overflow-ellipsis\"\n >\n {{ value?.name }}\n </p>\n <p\n class=\"white-space-nowrap overflow-hidden text-overflow-ellipsis\"\n >\n {{ value?.function }}\n </p>\n </div>\n </div></p-button\n >\n <p-overlayPanel #op>\n <div>\n <span class=\"block mb-2\">\n <i class=\"pi pi-envelope mr-1 text-500\"></i>\n\n {{ value.email ?? \" --\" }}\n </span>\n <p>\n <i class=\"pi pi-phone mr-1 text-500\"></i\n >{{ value.phone ?? \" --\" }}\n </p>\n </div></p-overlayPanel\n >\n </div>\n </div>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"ctrlType.PASSWORD\">\n <div\n [attr.data-cy]=\"'password-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n <p-password\n class=\"ng-invalid ng-dirty\"\n [disabled]=\"true\"\n [(ngModel)]=\"value\"\n [feedback]=\"false\"\n ></p-password>\n </div>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"ctrlType.SS_OPTION_OBJECT_BASED\">\n <div\n [attr.data-cy]=\"'SS-OPTION-OBJECT-BASED-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n {{ value.value }}\n </div>\n </ng-container>\n\n <!-- Remove this if necessary - spaces-overview GENERAL form contol -->\n <ng-container *ngSwitchCase=\"ctrlType.SS_OPTION\">\n <div\n [attr.data-cy]=\"'SS-OPTION-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n {{ value | translate }}\n </div>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"ctrlType.NUMBER\">\n <div\n [attr.data-cy]=\"'number-' + control?.id\"\n *ngIf=\"value != null; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n {{ value }}\n </div>\n </ng-container>\n\n <ng-container *ngSwitchDefault>\n <div\n [attr.data-cy]=\"'test-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n {{ value | stripHtml }}\n </div>\n </ng-container>\n</ng-container>\n\n<ng-template #fallBack>\n <div\n [attr.data-cy]=\"'test-' + control?.id\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n --\n </div>\n</ng-template>\n", styles: [".person-wrap{display:flex;align-items:center;margin-left:-6px}.person-wrap p{margin:0}.person-wrap .person-avatar{display:flex;justify-content:center;align-items:center;width:28px;height:28px;min-width:28px;min-height:28px;margin-right:5px;background-color:#e94260;color:#fff;border-radius:50%;font-size:1rem}.person-wrap .person-name :first-child{font-size:1rem}.person-details{border-top:1px solid #e0e0e0;padding:5px;margin-left:-6px;width:150px}.person-details p{margin:0;display:flex;align-items:center}.person-details i{color:#d75063;padding-right:5px}.person-details .p-editor-container{padding-left:0!important}:host ::ng-deep .p-password .p-password-input{border:none!important}:host ::ng-deep .p-editor-toolbar{display:none!important}:host ::ng-deep .p-editor-container{background:transparent!important;border:0px!important}:host ::ng-deep .p-editor-content.ql-snow{border:0px!important}:host ::ng-deep .p-editor-container .p-editor-content .ql-editor{background:transparent!important}:host ::ng-deep .ql-editor{padding:0;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "component", type: MetaLabelComponent, selector: "phoenix-meta-label", inputs: ["control"] }, { kind: "ngmodule", type: InputSwitchModule }, { kind: "component", type: i3$8.InputSwitch, selector: "p-inputSwitch, p-inputswitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type:
|
|
5350
5349
|
// SerachCardComponent,
|
|
5351
5350
|
CheckboxModule }, { kind: "component", type: i5$1.Checkbox, selector: "p-checkbox, p-checkBox, p-check-box", inputs: ["value", "name", "disabled", "binary", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "inputStyle", "styleClass", "inputClass", "indeterminate", "size", "formControl", "checkboxIcon", "readonly", "required", "autofocus", "trueValue", "falseValue", "variant"], outputs: ["onChange", "onFocus", "onBlur"] }, { kind: "ngmodule", type: PasswordModule }, { kind: "component", type: i3$6.Password, selector: "p-password", inputs: ["ariaLabel", "fluid", "ariaLabelledBy", "label", "disabled", "promptLabel", "mediumRegex", "strongRegex", "weakLabel", "mediumLabel", "maxLength", "strongLabel", "inputId", "feedback", "appendTo", "toggleMask", "size", "inputStyleClass", "styleClass", "style", "inputStyle", "showTransitionOptions", "hideTransitionOptions", "autocomplete", "placeholder", "showClear", "autofocus", "variant", "tabindex"], outputs: ["onFocus", "onBlur", "onClear"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: SelectButtonModule }, { kind: "ngmodule", type: EditorModule }, { kind: "component", type: i2$6.Editor, selector: "p-editor", inputs: ["style", "styleClass", "placeholder", "formats", "modules", "bounds", "scrollingContainer", "debug", "readonly"], outputs: ["onInit", "onTextChange", "onSelectionChange"] }, { kind: "ngmodule", type: OverlayPanelModule }, { kind: "component", type: i9$1.OverlayPanel, selector: "p-overlayPanel, p-overlaypanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: PanelModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "fluid", "buttonProps"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "pipe", type: StripHtmlPipe, name: "stripHtml" }] });
|
|
5352
5351
|
}
|
|
@@ -5367,7 +5366,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
5367
5366
|
PanelModule,
|
|
5368
5367
|
ButtonModule,
|
|
5369
5368
|
StripHtmlPipe
|
|
5370
|
-
], template: "<phoenix-meta-label [control]=\"control\"></phoenix-meta-label>\n\n<ng-container [ngSwitch]=\"control.configuration.type\">\n <ng-container *ngSwitchCase=\"ctrlType.TEXT_EDITOR\">\n <p-editor\n [attr.data-cy]=\"'editor-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n [readonly]=\"true\"\n [(ngModel)]=\"value\"\n ></p-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"ctrlType.SWITCH\">\n <p-inputSwitch\n [attr.data-cy]=\"'switch-' + control?.id\"\n *ngIf=\"value?.isBoolean; else fallBack\"\n styleClass=\"mt-2 ml-1 mr-1\"\n [disabled]=\"true\"\n [(ngModel)]=\"value.res\"\n ></p-inputSwitch>\n </ng-container>\n <ng-container *ngSwitchCase=\"ctrlType.DATE\">\n <div\n [attr.data-cy]=\"'date-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n {{ value | date }}\n </div>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"ctrlType.CHECKBOX\">\n <p-checkbox\n [attr.data-cy]=\"'checkbox-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n styleClass=\"mt-3\"\n [(ngModel)]=\"value\"\n [binary]=\"true\"\n inputId=\"binary\"\n [disabled]=\"true\"\n ></p-checkbox>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"ctrlType.LINKS_DATA\">\n <div\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2 overflow-y-auto\"\n [attr.data-cy]=\"'link-' + control?.id\"\n >\n <ng-container *ngFor=\"let item of value\">\n <span class=\"m-2 text-sm font-light\">{{ item?.relationLabel }}</span>\n </ng-container>\n </div>\n </ng-container>\n <ng-container *ngSwitchCase=\"ctrlType.ASSIGN\">\n <div\n *ngIf=\"value?.name; else fallBack\"\n [attr.data-cy]=\"'number-' + control?.id\"\n >\n <div>\n <p-button [rounded]=\"true\" [text]=\"true\" (onClick)=\"op.toggle($event)\">\n <div class=\"person-wrap\">\n <div class=\"person-avatar\">\n {{ value?.name?.toUpperCase().charAt(0) }}\n </div>\n <div>\n <p\n class=\"white-space-nowrap overflow-hidden text-overflow-ellipsis\"\n >\n {{ value?.name }}\n </p>\n <p\n class=\"white-space-nowrap overflow-hidden text-overflow-ellipsis\"\n >\n {{ value?.function }}\n </p>\n </div>\n </div></p-button\n >\n <p-overlayPanel #op>\n <div>\n <span class=\"block mb-2\">\n <i class=\"pi pi-envelope mr-1 text-500\"></i>\n\n {{ value.email ?? \" --\" }}\n </span>\n <p>\n <i class=\"pi pi-phone mr-1 text-500\"></i\n >{{ value.phone ?? \" --\" }}\n </p>\n </div></p-overlayPanel\n >\n </div>\n </div>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"ctrlType.PASSWORD\">\n <div\n [attr.data-cy]=\"'password-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n <p-password\n class=\"ng-invalid ng-dirty\"\n [disabled]=\"true\"\n [(ngModel)]=\"value\"\n [feedback]=\"false\"\n ></p-password>\n </div>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"ctrlType.SS_OPTION_OBJECT_BASED\">\n <div\n [attr.data-cy]=\"'SS-OPTION-OBJECT-BASED-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n {{ value.value }}\n </div>\n </ng-container>\n\n <!-- Remove this if necessary - spaces-overview GENERAL form contol -->\n <ng-container *ngSwitchCase=\"ctrlType.SS_OPTION\">\n <div\n [attr.data-cy]=\"'SS-OPTION-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n {{ value | translate }}\n </div>\n </ng-container>\n\n <ng-container *ngSwitchDefault>\n <div\n [attr.data-cy]=\"'test-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n {{ value | stripHtml }}\n </div>\n </ng-container>\n</ng-container>\n\n<ng-template #fallBack>\n <div\n [attr.data-cy]=\"'test-' + control?.id\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n --\n </div>\n</ng-template>\n", styles: [".person-wrap{display:flex;align-items:center;margin-left:-6px}.person-wrap p{margin:0}.person-wrap .person-avatar{display:flex;justify-content:center;align-items:center;width:28px;height:28px;min-width:28px;min-height:28px;margin-right:5px;background-color:#e94260;color:#fff;border-radius:50%;font-size:1rem}.person-wrap .person-name :first-child{font-size:1rem}.person-details{border-top:1px solid #e0e0e0;padding:5px;margin-left:-6px;width:150px}.person-details p{margin:0;display:flex;align-items:center}.person-details i{color:#d75063;padding-right:5px}.person-details .p-editor-container{padding-left:0!important}:host ::ng-deep .p-password .p-password-input{border:none!important}:host ::ng-deep .p-editor-toolbar{display:none!important}:host ::ng-deep .p-editor-container{background:transparent!important;border:0px!important}:host ::ng-deep .p-editor-content.ql-snow{border:0px!important}:host ::ng-deep .p-editor-container .p-editor-content .ql-editor{background:transparent!important}:host ::ng-deep .ql-editor{padding:0;height:100%}\n"] }]
|
|
5369
|
+
], template: "<phoenix-meta-label [control]=\"control\"></phoenix-meta-label>\n\n<ng-container [ngSwitch]=\"control.configuration.type\">\n <ng-container *ngSwitchCase=\"ctrlType.TEXT_EDITOR\">\n <p-editor\n [attr.data-cy]=\"'editor-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n [readonly]=\"true\"\n [(ngModel)]=\"value\"\n ></p-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"ctrlType.SWITCH\">\n <p-inputSwitch\n [attr.data-cy]=\"'switch-' + control?.id\"\n *ngIf=\"value?.isBoolean; else fallBack\"\n styleClass=\"mt-2 ml-1 mr-1\"\n [disabled]=\"true\"\n [(ngModel)]=\"value.res\"\n ></p-inputSwitch>\n </ng-container>\n <ng-container *ngSwitchCase=\"ctrlType.DATE\">\n <div\n [attr.data-cy]=\"'date-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n {{ value | date }}\n </div>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"ctrlType.CHECKBOX\">\n <p-checkbox\n [attr.data-cy]=\"'checkbox-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n styleClass=\"mt-3\"\n [(ngModel)]=\"value\"\n [binary]=\"true\"\n inputId=\"binary\"\n [disabled]=\"true\"\n ></p-checkbox>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"ctrlType.LINKS_DATA\">\n <div\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2 overflow-y-auto\"\n [attr.data-cy]=\"'link-' + control?.id\"\n >\n <ng-container *ngFor=\"let item of value\">\n <span class=\"m-2 text-sm font-light\">{{ item?.relationLabel }}</span>\n </ng-container>\n </div>\n </ng-container>\n <ng-container *ngSwitchCase=\"ctrlType.ASSIGN\">\n <div\n *ngIf=\"value?.name; else fallBack\"\n [attr.data-cy]=\"'number-' + control?.id\"\n >\n <div>\n <p-button [rounded]=\"true\" [text]=\"true\" (onClick)=\"op.toggle($event)\">\n <div class=\"person-wrap\">\n <div class=\"person-avatar\">\n {{ value?.name?.toUpperCase().charAt(0) }}\n </div>\n <div>\n <p\n class=\"white-space-nowrap overflow-hidden text-overflow-ellipsis\"\n >\n {{ value?.name }}\n </p>\n <p\n class=\"white-space-nowrap overflow-hidden text-overflow-ellipsis\"\n >\n {{ value?.function }}\n </p>\n </div>\n </div></p-button\n >\n <p-overlayPanel #op>\n <div>\n <span class=\"block mb-2\">\n <i class=\"pi pi-envelope mr-1 text-500\"></i>\n\n {{ value.email ?? \" --\" }}\n </span>\n <p>\n <i class=\"pi pi-phone mr-1 text-500\"></i\n >{{ value.phone ?? \" --\" }}\n </p>\n </div></p-overlayPanel\n >\n </div>\n </div>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"ctrlType.PASSWORD\">\n <div\n [attr.data-cy]=\"'password-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n <p-password\n class=\"ng-invalid ng-dirty\"\n [disabled]=\"true\"\n [(ngModel)]=\"value\"\n [feedback]=\"false\"\n ></p-password>\n </div>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"ctrlType.SS_OPTION_OBJECT_BASED\">\n <div\n [attr.data-cy]=\"'SS-OPTION-OBJECT-BASED-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n {{ value.value }}\n </div>\n </ng-container>\n\n <!-- Remove this if necessary - spaces-overview GENERAL form contol -->\n <ng-container *ngSwitchCase=\"ctrlType.SS_OPTION\">\n <div\n [attr.data-cy]=\"'SS-OPTION-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n {{ value | translate }}\n </div>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"ctrlType.NUMBER\">\n <div\n [attr.data-cy]=\"'number-' + control?.id\"\n *ngIf=\"value != null; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n {{ value }}\n </div>\n </ng-container>\n\n <ng-container *ngSwitchDefault>\n <div\n [attr.data-cy]=\"'test-' + control?.id\"\n *ngIf=\"value; else fallBack\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n {{ value | stripHtml }}\n </div>\n </ng-container>\n</ng-container>\n\n<ng-template #fallBack>\n <div\n [attr.data-cy]=\"'test-' + control?.id\"\n class=\"font-semibold text-500 mt-3 mb-2\"\n >\n --\n </div>\n</ng-template>\n", styles: [".person-wrap{display:flex;align-items:center;margin-left:-6px}.person-wrap p{margin:0}.person-wrap .person-avatar{display:flex;justify-content:center;align-items:center;width:28px;height:28px;min-width:28px;min-height:28px;margin-right:5px;background-color:#e94260;color:#fff;border-radius:50%;font-size:1rem}.person-wrap .person-name :first-child{font-size:1rem}.person-details{border-top:1px solid #e0e0e0;padding:5px;margin-left:-6px;width:150px}.person-details p{margin:0;display:flex;align-items:center}.person-details i{color:#d75063;padding-right:5px}.person-details .p-editor-container{padding-left:0!important}:host ::ng-deep .p-password .p-password-input{border:none!important}:host ::ng-deep .p-editor-toolbar{display:none!important}:host ::ng-deep .p-editor-container{background:transparent!important;border:0px!important}:host ::ng-deep .p-editor-content.ql-snow{border:0px!important}:host ::ng-deep .p-editor-container .p-editor-content .ql-editor{background:transparent!important}:host ::ng-deep .ql-editor{padding:0;height:100%}\n"] }]
|
|
5371
5370
|
}], ctorParameters: () => [{ type: i1$5.DomSanitizer }, { type: i2$1.TranslateService }, { type: i0.DestroyRef }], propDecorators: { control: [{
|
|
5372
5371
|
type: Input
|
|
5373
5372
|
}], metaform: [{
|