@fuentis/phoenix-ui 0.0.9-alpha.557 → 0.0.9-alpha.558
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.
|
@@ -8274,7 +8274,7 @@ class ReadOnlyInputV2Component {
|
|
|
8274
8274
|
return String(v);
|
|
8275
8275
|
}, ...(ngDevMode ? [{ debugName: "displayText" }] : []));
|
|
8276
8276
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ReadOnlyInputV2Component, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
8277
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: ReadOnlyInputV2Component, isStandalone: true, selector: "phoenix-read-only-input-v2", inputs: { field: "field", form: "form" }, ngImport: i0, template: "@switch (type) {\n\n @case ('TEXT_EDITOR') {\n @if (displayText()) {\n <div class=\"read-only-editor-content\" [innerHTML]=\"displayText()\"></div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('TEXT_AREA') {\n @if (displayText()) {\n <div class=\"w-full mt-2 mb-2 font-semibold text-500 whitespace-pre-line\">\n {{ displayText() | stripHtmlSafe }}\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n
|
|
8277
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: ReadOnlyInputV2Component, isStandalone: true, selector: "phoenix-read-only-input-v2", inputs: { field: "field", form: "form" }, ngImport: i0, template: "@switch (type) {\n\n @case ('TEXT_EDITOR') {\n @if (displayText()) {\n <div class=\"read-only-editor-content\" [innerHTML]=\"displayText()\"></div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('TEXT_AREA') {\n @if (displayText()) {\n <div class=\"w-full mt-2 mb-2 font-semibold text-500 whitespace-pre-line\">\n {{ displayText() | stripHtmlSafe }}\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('SWITCH') {\n @if (bool() !== null) {\n <div class=\"mt-2 mb-2 font-semibold text-500\">\n {{ bool() ? ('Yes' | translate) : ('No' | translate) }}\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('CHECKBOX') {\n @if (bool() !== null) {\n <div class=\"mt-2 mb-2 font-semibold text-500\">\n {{ bool() ? ('Yes' | translate) : ('No' | translate) }}\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('DATE') {\n @if (dateValue()) {\n <div class=\"font-semibold text-500 mt-2 mb-2\">\n {{ dateValue() | date }}\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('START_DUE_DATE') {\n @if (startDue()) {\n <div class=\"flex font-semibold text-500 mt-2 mb-2\">\n <span style=\"padding-top: 3px\">{{ startDue()?.startDate | date }}</span>\n <div class=\"flex align-items-center p-2\">\n <i class=\"pi pi-arrow-right text-sm\"></i>\n </div>\n <span style=\"padding-top: 3px\">{{ startDue()?.endDate | date }}</span>\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('ASSIGN') {\n @if (assign()?.name) {\n <div>\n <p-button [rounded]=\"true\" [text]=\"true\" (onClick)=\"op.toggle($event)\">\n <div class=\"person-wrap\">\n <div class=\"person-avatar\">\n {{ (assign()?.name ?? '')!.toUpperCase().charAt(0) }}\n </div>\n <div>\n <p class=\"white-space-nowrap overflow-hidden text-overflow-ellipsis\">\n {{ assign()?.name }}\n </p>\n <p class=\"white-space-nowrap overflow-hidden text-overflow-ellipsis\">\n {{ assign()?.function ?? '--' }}\n </p>\n </div>\n </div>\n </p-button>\n\n <p-popover #op [dismissable]=\"true\">\n <div>\n <span class=\"block mb-2\">\n <i class=\"pi pi-envelope mr-1 text-500\"></i>\n {{ assign()?.email ?? '--' }}\n </span>\n <p>\n <i class=\"pi pi-phone mr-1 text-500\"></i>\n {{ assign()?.phone ?? '--' }}\n </p>\n </div>\n </p-popover>\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('UPLOAD') {\n @if (upload()?.fileName) {\n <div class=\"font-semibold text-500 mt-2 mb-2\">\n {{ upload()?.fileName }}\n @if (upload()?.size) {\n <span class=\"text-600 font-normal\"> \u2022 {{ upload()?.size | fileSize }}</span>\n }\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('UPLOAD_DRAG_DROP') {\n @if (upload()?.fileName) {\n <div class=\"font-semibold text-500 mt-2 mb-2\">\n {{ upload()?.fileName }}\n @if (upload()?.size) {\n <span class=\"text-600 font-normal\"> \u2022 {{ upload()?.size | fileSize }}</span>\n }\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('SS_OPTION') {\n @if (ssLabel()) {\n <div class=\"font-semibold text-500 mt-2 mb-2\">\n {{ ssLabel() | translate }}\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('SS_OPTION_OBJECT_BASED') {\n @if (ssLabel()) {\n <div class=\"font-semibold text-500 mt-2 mb-2\">\n {{ ssLabel() | translate }}\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('MS_OPTION') {\n @if (msLabel()) {\n <div class=\"font-semibold text-500 mt-2 mb-2 white-space-nowrap overflow-hidden\">\n {{ msLabel() }}\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n @case ('PASSWORD') {\n @if (displayText()) {\n <input\n pInputText\n type=\"password\"\n class=\"w-full p-inputtext\"\n [disabled]=\"true\"\n [value]=\"displayText() ?? ''\"\n autocomplete=\"off\"\n aria-label=\"password\"\n />\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @default {\n @if (displayText()) {\n <div class=\"font-semibold text-500 mt-2 mb-2\">\n {{ displayText() | stripHtmlSafe }}\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n}\n\n<ng-template #fallBack>\n <div class=\"font-semibold text-500 mt-2 mb-2\">--</div>\n</ng-template>", 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 .read-only-editor-content{margin-top:.75rem;margin-bottom:.5rem;font-weight:600;color:var(--text-color-secondary)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "component", type: i2$1.Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "component", type: i2$2.Popover, selector: "p-popover", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: StripHtmlSafePipe, name: "stripHtmlSafe" }, { kind: "pipe", type: FileSizePipe, name: "fileSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
8278
8278
|
}
|
|
8279
8279
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: ReadOnlyInputV2Component, decorators: [{
|
|
8280
8280
|
type: Component,
|
|
@@ -8286,7 +8286,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
|
|
|
8286
8286
|
PopoverModule,
|
|
8287
8287
|
StripHtmlSafePipe,
|
|
8288
8288
|
FileSizePipe,
|
|
8289
|
-
], template: "@switch (type) {\n\n @case ('TEXT_EDITOR') {\n @if (displayText()) {\n <div class=\"read-only-editor-content\" [innerHTML]=\"displayText()\"></div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('TEXT_AREA') {\n @if (displayText()) {\n <div class=\"w-full mt-2 mb-2 font-semibold text-500 whitespace-pre-line\">\n {{ displayText() | stripHtmlSafe }}\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n
|
|
8289
|
+
], template: "@switch (type) {\n\n @case ('TEXT_EDITOR') {\n @if (displayText()) {\n <div class=\"read-only-editor-content\" [innerHTML]=\"displayText()\"></div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('TEXT_AREA') {\n @if (displayText()) {\n <div class=\"w-full mt-2 mb-2 font-semibold text-500 whitespace-pre-line\">\n {{ displayText() | stripHtmlSafe }}\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('SWITCH') {\n @if (bool() !== null) {\n <div class=\"mt-2 mb-2 font-semibold text-500\">\n {{ bool() ? ('Yes' | translate) : ('No' | translate) }}\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('CHECKBOX') {\n @if (bool() !== null) {\n <div class=\"mt-2 mb-2 font-semibold text-500\">\n {{ bool() ? ('Yes' | translate) : ('No' | translate) }}\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('DATE') {\n @if (dateValue()) {\n <div class=\"font-semibold text-500 mt-2 mb-2\">\n {{ dateValue() | date }}\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('START_DUE_DATE') {\n @if (startDue()) {\n <div class=\"flex font-semibold text-500 mt-2 mb-2\">\n <span style=\"padding-top: 3px\">{{ startDue()?.startDate | date }}</span>\n <div class=\"flex align-items-center p-2\">\n <i class=\"pi pi-arrow-right text-sm\"></i>\n </div>\n <span style=\"padding-top: 3px\">{{ startDue()?.endDate | date }}</span>\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('ASSIGN') {\n @if (assign()?.name) {\n <div>\n <p-button [rounded]=\"true\" [text]=\"true\" (onClick)=\"op.toggle($event)\">\n <div class=\"person-wrap\">\n <div class=\"person-avatar\">\n {{ (assign()?.name ?? '')!.toUpperCase().charAt(0) }}\n </div>\n <div>\n <p class=\"white-space-nowrap overflow-hidden text-overflow-ellipsis\">\n {{ assign()?.name }}\n </p>\n <p class=\"white-space-nowrap overflow-hidden text-overflow-ellipsis\">\n {{ assign()?.function ?? '--' }}\n </p>\n </div>\n </div>\n </p-button>\n\n <p-popover #op [dismissable]=\"true\">\n <div>\n <span class=\"block mb-2\">\n <i class=\"pi pi-envelope mr-1 text-500\"></i>\n {{ assign()?.email ?? '--' }}\n </span>\n <p>\n <i class=\"pi pi-phone mr-1 text-500\"></i>\n {{ assign()?.phone ?? '--' }}\n </p>\n </div>\n </p-popover>\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('UPLOAD') {\n @if (upload()?.fileName) {\n <div class=\"font-semibold text-500 mt-2 mb-2\">\n {{ upload()?.fileName }}\n @if (upload()?.size) {\n <span class=\"text-600 font-normal\"> \u2022 {{ upload()?.size | fileSize }}</span>\n }\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('UPLOAD_DRAG_DROP') {\n @if (upload()?.fileName) {\n <div class=\"font-semibold text-500 mt-2 mb-2\">\n {{ upload()?.fileName }}\n @if (upload()?.size) {\n <span class=\"text-600 font-normal\"> \u2022 {{ upload()?.size | fileSize }}</span>\n }\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('SS_OPTION') {\n @if (ssLabel()) {\n <div class=\"font-semibold text-500 mt-2 mb-2\">\n {{ ssLabel() | translate }}\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('SS_OPTION_OBJECT_BASED') {\n @if (ssLabel()) {\n <div class=\"font-semibold text-500 mt-2 mb-2\">\n {{ ssLabel() | translate }}\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @case ('MS_OPTION') {\n @if (msLabel()) {\n <div class=\"font-semibold text-500 mt-2 mb-2 white-space-nowrap overflow-hidden\">\n {{ msLabel() }}\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n @case ('PASSWORD') {\n @if (displayText()) {\n <input\n pInputText\n type=\"password\"\n class=\"w-full p-inputtext\"\n [disabled]=\"true\"\n [value]=\"displayText() ?? ''\"\n autocomplete=\"off\"\n aria-label=\"password\"\n />\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n\n @default {\n @if (displayText()) {\n <div class=\"font-semibold text-500 mt-2 mb-2\">\n {{ displayText() | stripHtmlSafe }}\n </div>\n } @else {\n <ng-container [ngTemplateOutlet]=\"fallBack\"></ng-container>\n }\n }\n}\n\n<ng-template #fallBack>\n <div class=\"font-semibold text-500 mt-2 mb-2\">--</div>\n</ng-template>", 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 .read-only-editor-content{margin-top:.75rem;margin-bottom:.5rem;font-weight:600;color:var(--text-color-secondary)}\n"] }]
|
|
8290
8290
|
}], propDecorators: { field: [{
|
|
8291
8291
|
type: Input,
|
|
8292
8292
|
args: [{ required: true }]
|