@vendure/admin-ui 2.1.4 → 2.1.5
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/core/common/utilities/custom-field-default-value.d.ts +1 -1
- package/core/common/version.d.ts +1 -1
- package/core/extension/register-route-component.d.ts +1 -1
- package/core/shared/components/order-state-label/order-state-label.component.d.ts +1 -1
- package/core/shared/dynamic-form-inputs/default-form-inputs.d.ts +1 -1
- package/esm2022/core/common/utilities/configurable-operation-utils.mjs +1 -1
- package/esm2022/core/common/version.mjs +2 -2
- package/esm2022/core/shared/components/asset-preview/asset-preview.component.mjs +3 -3
- package/esm2022/core/shared/components/configurable-input/configurable-input.component.mjs +1 -1
- package/esm2022/core/shared/components/datetime-picker/datetime-picker.service.mjs +1 -1
- package/esm2022/marketing/components/promotion-detail/promotion-detail.component.mjs +8 -8
- package/esm2022/settings/components/payment-method-detail/payment-method-detail.component.mjs +8 -8
- package/fesm2022/vendure-admin-ui-core.mjs +3 -3
- package/fesm2022/vendure-admin-ui-core.mjs.map +1 -1
- package/fesm2022/vendure-admin-ui-marketing.mjs +7 -7
- package/fesm2022/vendure-admin-ui-marketing.mjs.map +1 -1
- package/fesm2022/vendure-admin-ui-settings.mjs +7 -7
- package/fesm2022/vendure-admin-ui-settings.mjs.map +1 -1
- package/package.json +13 -13
- package/settings/components/stock-location-list/stock-location-list.component.d.ts +1 -1
|
@@ -7147,7 +7147,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImpor
|
|
|
7147
7147
|
}], ctorParameters: function () { return [{ type: AlertsService }]; } });
|
|
7148
7148
|
|
|
7149
7149
|
// Auto-generated by the set-version.js script.
|
|
7150
|
-
const ADMIN_UI_VERSION = '2.1.
|
|
7150
|
+
const ADMIN_UI_VERSION = '2.1.5';
|
|
7151
7151
|
|
|
7152
7152
|
/* eslint-disable @angular-eslint/directive-selector */
|
|
7153
7153
|
class FormFieldControlDirective {
|
|
@@ -14128,11 +14128,11 @@ class AssetPreviewComponent {
|
|
|
14128
14128
|
this.disablePreviousButton = this.assets?.[this.previewAssetIndex - 1]?.id ? false : true;
|
|
14129
14129
|
}
|
|
14130
14130
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: AssetPreviewComponent, deps: [{ token: i1$4.FormBuilder }, { token: DataService }, { token: NotificationService }, { token: i0.ChangeDetectorRef }, { token: ModalService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
14131
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: AssetPreviewComponent, selector: "vdr-asset-preview", inputs: { asset: "asset", assets: "assets", editable: "editable", customFields: "customFields", customFieldsForm: "customFieldsForm" }, outputs: { assetChange: "assetChange", editClick: "editClick" }, viewQueries: [{ propertyName: "imageElementRef", first: true, predicate: ["imageElement"], descendants: true, static: true }, { propertyName: "previewDivRef", first: true, predicate: ["previewDiv"], descendants: true, static: true }], ngImport: i0, template: "<vdr-page-detail-layout>\r\n <vdr-page-detail-sidebar>\r\n <vdr-card>\r\n <div *ngIf=\"!editable\" class=\"mb-2\">\r\n <a\r\n class=\"button-ghost\"\r\n [routerLink]=\"['/catalog', 'assets', asset.id]\"\r\n (click)=\"editClick.emit()\"\r\n >\r\n <clr-icon shape=\"edit\"></clr-icon>\r\n {{ 'common.edit' | translate }}\r\n <clr-icon shape=\"arrow right\"></clr-icon>\r\n </a>\r\n </div>\r\n <vdr-form-field *ngIf=\"editable\" [label]=\"'common.name' | translate\" class=\"mb-2\">\r\n <input\r\n type=\"text\"\r\n [formControl]=\"form.get('name')\"\r\n [readonly]=\"!(['UpdateCatalog', 'UpdateAsset'] | hasPermission) || settingFocalPoint\"\r\n />\r\n </vdr-form-field>\r\n <vdr-labeled-data [label]=\"'common.name' | translate\" *ngIf=\"!editable\">\r\n <span class=\"elide\">\r\n {{ asset.name }}\r\n </span>\r\n </vdr-labeled-data>\r\n <vdr-labeled-data [label]=\"'asset.source-file' | translate\">\r\n <a [href]=\"asset.source\" [title]=\"asset.source\" target=\"_blank\" class=\"elide source-link\">{{\r\n getSourceFileName()\r\n }}</a>\r\n </vdr-labeled-data>\r\n\r\n <vdr-labeled-data [label]=\"'asset.original-asset-size' | translate\">\r\n {{ asset.fileSize | filesize }}\r\n </vdr-labeled-data>\r\n\r\n <vdr-labeled-data [label]=\"'asset.dimensions' | translate\">\r\n {{ asset.width }} x {{ asset.height }}\r\n </vdr-labeled-data>\r\n\r\n <vdr-labeled-data [label]=\"'asset.focal-point' | translate\">\r\n <span *ngIf=\"fpx\"\r\n ><clr-icon shape=\"crosshairs\"></clr-icon> x: {{ fpx | number : '1.2-2' }}, y:\r\n {{ fpy | number : '1.2-2' }}</span\r\n >\r\n <span *ngIf=\"!fpx\">{{ 'common.not-set' | translate }}</span>\r\n <div class=\"flex mt-1\">\r\n <button\r\n class=\"button-small mr-1\"\r\n [disabled]=\"settingFocalPoint\"\r\n (click)=\"setFocalPointStart()\"\r\n >\r\n <ng-container *ngIf=\"!fpx\">{{ 'asset.set-focal-point' | translate }}</ng-container>\r\n <ng-container *ngIf=\"fpx\">{{ 'asset.update-focal-point' | translate }}</ng-container>\r\n </button>\r\n <button\r\n class=\"button-small\"\r\n [disabled]=\"settingFocalPoint\"\r\n *ngIf=\"!!fpx\"\r\n (click)=\"removeFocalPoint()\"\r\n >\r\n {{ 'asset.unset-focal-point' | translate }}\r\n </button>\r\n </div>\r\n </vdr-labeled-data>\r\n <vdr-labeled-data [label]=\"'common.tags' | translate\">\r\n <ng-container *ngIf=\"editable\">\r\n <vdr-tag-selector [formControl]=\"form.get('tags')\"></vdr-tag-selector>\r\n <button class=\"button-small mt-1\" (click)=\"manageTags()\">\r\n <clr-icon shape=\"tags\"></clr-icon>\r\n {{ 'common.manage-tags' | translate }}\r\n </button>\r\n </ng-container>\r\n <div *ngIf=\"!editable\">\r\n <vdr-chip *ngFor=\"let tag of asset.tags\" [colorFrom]=\"tag.value\">\r\n <clr-icon shape=\"tag\" class=\"mr2\"></clr-icon>\r\n {{ tag.value }}</vdr-chip\r\n >\r\n </div>\r\n </vdr-labeled-data>\r\n </vdr-card>\r\n <vdr-card *ngIf=\"customFields.length\" [title]=\"'common.custom-fields' | translate\">\r\n <vdr-tabbed-custom-fields\r\n entityName=\"Asset\"\r\n [compact]=\"true\"\r\n [customFields]=\"customFields\"\r\n [customFieldsFormGroup]=\"customFieldsForm\"\r\n [readonly]=\"!(['UpdateCatalog', 'UpdateAsset'] | hasPermission)\"\r\n ></vdr-tabbed-custom-fields>\r\n </vdr-card>\r\n <vdr-card [title]=\"'asset.preview' | translate\">\r\n <vdr-form-field>\r\n <select name=\"options\" [(ngModel)]=\"size\" [disabled]=\"settingFocalPoint\">\r\n <option value=\"tiny\">tiny</option>\r\n <option value=\"thumb\">thumb</option>\r\n <option value=\"small\">small</option>\r\n <option value=\"medium\">medium</option>\r\n <option value=\"large\">large</option>\r\n <option value=\"\">full size</option>\r\n </select>\r\n </vdr-form-field>\r\n <div class=\"asset-detail\">{{ width }} x {{ height }}</div>\r\n <vdr-asset-preview-links [asset]=\"asset\"></vdr-asset-preview-links>\r\n </vdr-card>\r\n <vdr-card>\r\n <vdr-page-entity-info *ngIf=\"asset as entity\" [entity]=\"entity\"></vdr-page-entity-info>\r\n </vdr-card>\r\n </vdr-page-detail-sidebar>\r\n <div class=\"carousel-container\">\r\n <button *ngIf=\"showSlideButtons\" (click)=\"previousImage()\" [class.disabled]=\"disablePreviousButton\"><clr-icon shape=\"caret left\" class=\"color-weight-800\"></clr-icon\r\n ></button>\r\n <div class=\"preview-image\" #previewDiv [class.centered]=\"centered\">\r\n <div class=\"image-wrapper\">\r\n <vdr-focal-point-control\r\n [width]=\"width\"\r\n [height]=\"height\"\r\n [fpx]=\"fpx\"\r\n [fpy]=\"fpy\"\r\n [editable]=\"settingFocalPoint\"\r\n (focalPointChange)=\"onFocalPointChange($event)\"\r\n >\r\n <img\r\n class=\"asset-image\"\r\n [src]=\"asset | assetPreview : size\"\r\n [ngClass]=\"size\"\r\n #imageElement\r\n (load)=\"onImageLoad()\"\r\n />\r\n </vdr-focal-point-control>\r\n <div class=\"focal-point-info\" *ngIf=\"settingFocalPoint\">\r\n <button class=\"icon-button\" (click)=\"setFocalPointCancel()\">\r\n <clr-icon shape=\"times\"></clr-icon>\r\n </button>\r\n <button\r\n class=\"btn btn-primary btn-sm\"\r\n (click)=\"setFocalPointEnd()\"\r\n [disabled]=\"!lastFocalPoint\"\r\n >\r\n <clr-icon shape=\"crosshairs\"></clr-icon>\r\n {{ 'asset.set-focal-point' | translate }}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n <button *ngIf=\"showSlideButtons\" (click)=\"nextImage()\" [class.disabled]=\"disableNextButton\"><clr-icon shape=\"caret right\" class=\"color-weight-800\"></clr-icon\r\n ></button>\r\n </div>\r\n</vdr-page-detail-layout>\r\n", styles: [":host{height:100%}.preview-image{width:100%;max-width:750px;height:100%;min-height:60vh;overflow:auto;text-align:center;box-shadow:inset 0 0 5px #0000001a;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAACuoAAArqAVDM774AAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTZEaa/1AAAAK0lEQVQ4T2P4jwP8xgFGNSADqDwGIF0DlMYAUH0YYFQDMoDKYwASNfz/DwB/JvcficphowAAAABJRU5ErkJggg==);margin-top:var(--space-unit);flex:1}.preview-image.centered{display:flex;align-items:center;justify-content:center}.preview-image vdr-focal-point-control{position:relative;box-shadow:0 0 10px -3px #00000026}.preview-image .image-wrapper{position:relative}.preview-image .asset-image{width:100%}.preview-image .asset-image.tiny{max-width:50px;max-height:50px}.preview-image .asset-image.thumb{max-width:150px;max-height:150px}.preview-image .asset-image.small{max-width:300px;max-height:300px}.preview-image .asset-image.medium{max-width:500px;max-height:500px}.preview-image .asset-image.large{max-width:800px;max-height:800px}.preview-image .focal-point-info{position:absolute;display:flex;right:0}.controls{display:flex;flex-direction:column;margin-inline-start:12px;min-width:15vw;max-width:25vw;transition:opacity .3s}.controls.fade{opacity:.5}.controls .name-input{margin-bottom:24px}.controls ::ng-deep .clr-control-container{width:100%}.controls ::ng-deep .clr-control-container .clr-input{width:100%}.controls .elide{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block}.controls .source-link{direction:rtl}.controls .preview-select{display:flex;align-items:center}.controls .preview-select clr-select-container{margin-inline-end:12px}.carousel-container{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.carousel-container button{cursor:pointer;width:30px;height:30px;border:none;border-radius:50%;text-align:center;background-color:var(--color-grey-300)}.carousel-container button:hover{background-color:var(--color-grey-400)}.carousel-container .disabled{pointer-events:none;opacity:.4}\n"], dependencies: [{ kind: "directive", type: i1$3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"] }, { kind: "directive", type: FormFieldControlDirective, selector: "input, textarea, select" }, { kind: "component", type: LabeledDataComponent, selector: "vdr-labeled-data", inputs: ["label"] }, { kind: "component", type: FocalPointControlComponent, selector: "vdr-focal-point-control", inputs: ["visible", "editable", "width", "height", "fpx", "fpy"], outputs: ["focalPointChange"] }, { kind: "component", type: TagSelectorComponent, selector: "vdr-tag-selector", inputs: ["placeholder"] }, { kind: "component", type: TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }, { kind: "component", type: AssetPreviewLinksComponent, selector: "vdr-asset-preview-links", inputs: ["asset"] }, { kind: "component", type: PageEntityInfoComponent, selector: "vdr-page-entity-info", inputs: ["entity"] }, { kind: "component", type: PageDetailLayoutComponent, selector: "vdr-page-detail-layout" }, { kind: "component", type: PageDetailSidebarComponent, selector: "vdr-page-detail-sidebar" }, { kind: "component", type: CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "pipe", type: i2.DecimalPipe, name: "number" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "pipe", type: FileSizePipe, name: "filesize" }, { kind: "pipe", type: HasPermissionPipe, name: "hasPermission" }, { kind: "pipe", type: AssetPreviewPipe, name: "assetPreview" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
14131
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: AssetPreviewComponent, selector: "vdr-asset-preview", inputs: { asset: "asset", assets: "assets", editable: "editable", customFields: "customFields", customFieldsForm: "customFieldsForm" }, outputs: { assetChange: "assetChange", editClick: "editClick" }, viewQueries: [{ propertyName: "imageElementRef", first: true, predicate: ["imageElement"], descendants: true, static: true }, { propertyName: "previewDivRef", first: true, predicate: ["previewDiv"], descendants: true, static: true }], ngImport: i0, template: "<vdr-page-detail-layout>\r\n <vdr-page-detail-sidebar>\r\n <vdr-card>\r\n <div *ngIf=\"!editable\" class=\"mb-2\">\r\n <a\r\n class=\"button-ghost\"\r\n [routerLink]=\"['/catalog', 'assets', asset.id]\"\r\n (click)=\"editClick.emit()\"\r\n >\r\n <clr-icon shape=\"edit\"></clr-icon>\r\n {{ 'common.edit' | translate }}\r\n <clr-icon shape=\"arrow right\"></clr-icon>\r\n </a>\r\n </div>\r\n <vdr-form-field *ngIf=\"editable\" [label]=\"'common.name' | translate\" class=\"mb-2\">\r\n <input\r\n type=\"text\"\r\n [formControl]=\"form.get('name')\"\r\n [readonly]=\"!(['UpdateCatalog', 'UpdateAsset'] | hasPermission) || settingFocalPoint\"\r\n />\r\n </vdr-form-field>\r\n <vdr-labeled-data [label]=\"'common.name' | translate\" *ngIf=\"!editable\">\r\n <span class=\"elide\">\r\n {{ asset.name }}\r\n </span>\r\n </vdr-labeled-data>\r\n <vdr-labeled-data [label]=\"'asset.source-file' | translate\">\r\n <a [href]=\"asset.source\" [title]=\"asset.source\" target=\"_blank\" class=\"elide source-link\">{{\r\n getSourceFileName()\r\n }}</a>\r\n </vdr-labeled-data>\r\n\r\n <vdr-labeled-data [label]=\"'asset.original-asset-size' | translate\">\r\n {{ asset.fileSize | filesize }}\r\n </vdr-labeled-data>\r\n\r\n <vdr-labeled-data [label]=\"'asset.dimensions' | translate\">\r\n {{ asset.width }} x {{ asset.height }}\r\n </vdr-labeled-data>\r\n\r\n <vdr-labeled-data [label]=\"'asset.focal-point' | translate\">\r\n <span *ngIf=\"fpx\"\r\n ><clr-icon shape=\"crosshairs\"></clr-icon> x: {{ fpx | number : '1.2-2' }}, y:\r\n {{ fpy | number : '1.2-2' }}</span\r\n >\r\n <span *ngIf=\"!fpx\">{{ 'common.not-set' | translate }}</span>\r\n <div class=\"flex mt-1\">\r\n <button\r\n class=\"button-small mr-1\"\r\n [disabled]=\"settingFocalPoint\"\r\n (click)=\"setFocalPointStart()\"\r\n >\r\n <ng-container *ngIf=\"!fpx\">{{ 'asset.set-focal-point' | translate }}</ng-container>\r\n <ng-container *ngIf=\"fpx\">{{ 'asset.update-focal-point' | translate }}</ng-container>\r\n </button>\r\n <button\r\n class=\"button-small\"\r\n [disabled]=\"settingFocalPoint\"\r\n *ngIf=\"!!fpx\"\r\n (click)=\"removeFocalPoint()\"\r\n >\r\n {{ 'asset.unset-focal-point' | translate }}\r\n </button>\r\n </div>\r\n </vdr-labeled-data>\r\n <vdr-labeled-data [label]=\"'common.tags' | translate\">\r\n <ng-container *ngIf=\"editable\">\r\n <vdr-tag-selector [formControl]=\"form.get('tags')\"></vdr-tag-selector>\r\n <button class=\"button-small mt-1\" (click)=\"manageTags()\">\r\n <clr-icon shape=\"tags\"></clr-icon>\r\n {{ 'common.manage-tags' | translate }}\r\n </button>\r\n </ng-container>\r\n <div *ngIf=\"!editable\">\r\n <vdr-chip *ngFor=\"let tag of asset.tags\" [colorFrom]=\"tag.value\">\r\n <clr-icon shape=\"tag\" class=\"mr2\"></clr-icon>\r\n {{ tag.value }}</vdr-chip\r\n >\r\n </div>\r\n </vdr-labeled-data>\r\n </vdr-card>\r\n <vdr-card *ngIf=\"customFields.length\" [title]=\"'common.custom-fields' | translate\">\r\n <vdr-tabbed-custom-fields\r\n entityName=\"Asset\"\r\n [compact]=\"true\"\r\n [customFields]=\"customFields\"\r\n [customFieldsFormGroup]=\"customFieldsForm\"\r\n [readonly]=\"!(['UpdateCatalog', 'UpdateAsset'] | hasPermission)\"\r\n ></vdr-tabbed-custom-fields>\r\n </vdr-card>\r\n <vdr-card [title]=\"'asset.preview' | translate\">\r\n <vdr-form-field>\r\n <select name=\"options\" [(ngModel)]=\"size\" [disabled]=\"settingFocalPoint\">\r\n <option value=\"tiny\">tiny</option>\r\n <option value=\"thumb\">thumb</option>\r\n <option value=\"small\">small</option>\r\n <option value=\"medium\">medium</option>\r\n <option value=\"large\">large</option>\r\n <option value=\"\">full size</option>\r\n </select>\r\n </vdr-form-field>\r\n <div class=\"asset-detail\">{{ width }} x {{ height }}</div>\r\n <vdr-asset-preview-links [asset]=\"asset\"></vdr-asset-preview-links>\r\n </vdr-card>\r\n <vdr-card>\r\n <vdr-page-entity-info *ngIf=\"asset as entity\" [entity]=\"entity\"></vdr-page-entity-info>\r\n </vdr-card>\r\n </vdr-page-detail-sidebar>\r\n <div class=\"carousel-container\">\r\n <button *ngIf=\"showSlideButtons\" (click)=\"previousImage()\" class=\"carousel-button\" [class.disabled]=\"disablePreviousButton\">\r\n <clr-icon shape=\"caret left\" class=\"color-weight-800\"></clr-icon>\r\n </button>\r\n <div class=\"preview-image\" #previewDiv [class.centered]=\"centered\">\r\n <div class=\"image-wrapper\">\r\n <vdr-focal-point-control\r\n [width]=\"width\"\r\n [height]=\"height\"\r\n [fpx]=\"fpx\"\r\n [fpy]=\"fpy\"\r\n [editable]=\"settingFocalPoint\"\r\n (focalPointChange)=\"onFocalPointChange($event)\"\r\n >\r\n <img\r\n class=\"asset-image\"\r\n [src]=\"asset | assetPreview : size\"\r\n [ngClass]=\"size\"\r\n #imageElement\r\n (load)=\"onImageLoad()\"\r\n />\r\n </vdr-focal-point-control>\r\n <div class=\"focal-point-info\" *ngIf=\"settingFocalPoint\">\r\n <button class=\"icon-button\" (click)=\"setFocalPointCancel()\">\r\n <clr-icon shape=\"times\"></clr-icon>\r\n </button>\r\n <button\r\n class=\"btn btn-primary btn-sm\"\r\n (click)=\"setFocalPointEnd()\"\r\n [disabled]=\"!lastFocalPoint\"\r\n >\r\n <clr-icon shape=\"crosshairs\"></clr-icon>\r\n {{ 'asset.set-focal-point' | translate }}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n <button *ngIf=\"showSlideButtons\" (click)=\"nextImage()\" class=\"carousel-button\" [class.disabled]=\"disableNextButton\">\r\n <clr-icon shape=\"caret right\" class=\"color-weight-800\"></clr-icon>\r\n </button>\r\n </div>\r\n</vdr-page-detail-layout>\r\n", styles: [":host{height:100%}.preview-image{width:100%;max-width:750px;height:100%;min-height:60vh;overflow:auto;text-align:center;box-shadow:inset 0 0 5px #0000001a;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAACuoAAArqAVDM774AAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTZEaa/1AAAAK0lEQVQ4T2P4jwP8xgFGNSADqDwGIF0DlMYAUH0YYFQDMoDKYwASNfz/DwB/JvcficphowAAAABJRU5ErkJggg==);margin-top:var(--space-unit);flex:1}.preview-image.centered{display:flex;align-items:center;justify-content:center}.preview-image vdr-focal-point-control{position:relative;box-shadow:0 0 10px -3px #00000026}.preview-image .image-wrapper{position:relative}.preview-image .asset-image{width:100%}.preview-image .asset-image.tiny{max-width:50px;max-height:50px}.preview-image .asset-image.thumb{max-width:150px;max-height:150px}.preview-image .asset-image.small{max-width:300px;max-height:300px}.preview-image .asset-image.medium{max-width:500px;max-height:500px}.preview-image .asset-image.large{max-width:800px;max-height:800px}.preview-image .focal-point-info{position:absolute;display:flex;right:0}.controls{display:flex;flex-direction:column;margin-inline-start:12px;min-width:15vw;max-width:25vw;transition:opacity .3s}.controls.fade{opacity:.5}.controls .name-input{margin-bottom:24px}.controls ::ng-deep .clr-control-container{width:100%}.controls ::ng-deep .clr-control-container .clr-input{width:100%}.controls .elide{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block}.controls .source-link{direction:rtl}.controls .preview-select{display:flex;align-items:center}.controls .preview-select clr-select-container{margin-inline-end:12px}.carousel-container{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.carousel-container button.carousel-button{cursor:pointer;width:30px;height:30px;border:none;border-radius:50%;text-align:center;background-color:var(--color-grey-300)}.carousel-container button.carousel-button:hover{background-color:var(--color-grey-400)}.carousel-container .disabled{pointer-events:none;opacity:.4}\n"], dependencies: [{ kind: "directive", type: i1$3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"] }, { kind: "directive", type: FormFieldControlDirective, selector: "input, textarea, select" }, { kind: "component", type: LabeledDataComponent, selector: "vdr-labeled-data", inputs: ["label"] }, { kind: "component", type: FocalPointControlComponent, selector: "vdr-focal-point-control", inputs: ["visible", "editable", "width", "height", "fpx", "fpy"], outputs: ["focalPointChange"] }, { kind: "component", type: TagSelectorComponent, selector: "vdr-tag-selector", inputs: ["placeholder"] }, { kind: "component", type: TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }, { kind: "component", type: AssetPreviewLinksComponent, selector: "vdr-asset-preview-links", inputs: ["asset"] }, { kind: "component", type: PageEntityInfoComponent, selector: "vdr-page-entity-info", inputs: ["entity"] }, { kind: "component", type: PageDetailLayoutComponent, selector: "vdr-page-detail-layout" }, { kind: "component", type: PageDetailSidebarComponent, selector: "vdr-page-detail-sidebar" }, { kind: "component", type: CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "pipe", type: i2.DecimalPipe, name: "number" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "pipe", type: FileSizePipe, name: "filesize" }, { kind: "pipe", type: HasPermissionPipe, name: "hasPermission" }, { kind: "pipe", type: AssetPreviewPipe, name: "assetPreview" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
14132
14132
|
}
|
|
14133
14133
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: AssetPreviewComponent, decorators: [{
|
|
14134
14134
|
type: Component,
|
|
14135
|
-
args: [{ selector: 'vdr-asset-preview', changeDetection: ChangeDetectionStrategy.OnPush, template: "<vdr-page-detail-layout>\r\n <vdr-page-detail-sidebar>\r\n <vdr-card>\r\n <div *ngIf=\"!editable\" class=\"mb-2\">\r\n <a\r\n class=\"button-ghost\"\r\n [routerLink]=\"['/catalog', 'assets', asset.id]\"\r\n (click)=\"editClick.emit()\"\r\n >\r\n <clr-icon shape=\"edit\"></clr-icon>\r\n {{ 'common.edit' | translate }}\r\n <clr-icon shape=\"arrow right\"></clr-icon>\r\n </a>\r\n </div>\r\n <vdr-form-field *ngIf=\"editable\" [label]=\"'common.name' | translate\" class=\"mb-2\">\r\n <input\r\n type=\"text\"\r\n [formControl]=\"form.get('name')\"\r\n [readonly]=\"!(['UpdateCatalog', 'UpdateAsset'] | hasPermission) || settingFocalPoint\"\r\n />\r\n </vdr-form-field>\r\n <vdr-labeled-data [label]=\"'common.name' | translate\" *ngIf=\"!editable\">\r\n <span class=\"elide\">\r\n {{ asset.name }}\r\n </span>\r\n </vdr-labeled-data>\r\n <vdr-labeled-data [label]=\"'asset.source-file' | translate\">\r\n <a [href]=\"asset.source\" [title]=\"asset.source\" target=\"_blank\" class=\"elide source-link\">{{\r\n getSourceFileName()\r\n }}</a>\r\n </vdr-labeled-data>\r\n\r\n <vdr-labeled-data [label]=\"'asset.original-asset-size' | translate\">\r\n {{ asset.fileSize | filesize }}\r\n </vdr-labeled-data>\r\n\r\n <vdr-labeled-data [label]=\"'asset.dimensions' | translate\">\r\n {{ asset.width }} x {{ asset.height }}\r\n </vdr-labeled-data>\r\n\r\n <vdr-labeled-data [label]=\"'asset.focal-point' | translate\">\r\n <span *ngIf=\"fpx\"\r\n ><clr-icon shape=\"crosshairs\"></clr-icon> x: {{ fpx | number : '1.2-2' }}, y:\r\n {{ fpy | number : '1.2-2' }}</span\r\n >\r\n <span *ngIf=\"!fpx\">{{ 'common.not-set' | translate }}</span>\r\n <div class=\"flex mt-1\">\r\n <button\r\n class=\"button-small mr-1\"\r\n [disabled]=\"settingFocalPoint\"\r\n (click)=\"setFocalPointStart()\"\r\n >\r\n <ng-container *ngIf=\"!fpx\">{{ 'asset.set-focal-point' | translate }}</ng-container>\r\n <ng-container *ngIf=\"fpx\">{{ 'asset.update-focal-point' | translate }}</ng-container>\r\n </button>\r\n <button\r\n class=\"button-small\"\r\n [disabled]=\"settingFocalPoint\"\r\n *ngIf=\"!!fpx\"\r\n (click)=\"removeFocalPoint()\"\r\n >\r\n {{ 'asset.unset-focal-point' | translate }}\r\n </button>\r\n </div>\r\n </vdr-labeled-data>\r\n <vdr-labeled-data [label]=\"'common.tags' | translate\">\r\n <ng-container *ngIf=\"editable\">\r\n <vdr-tag-selector [formControl]=\"form.get('tags')\"></vdr-tag-selector>\r\n <button class=\"button-small mt-1\" (click)=\"manageTags()\">\r\n <clr-icon shape=\"tags\"></clr-icon>\r\n {{ 'common.manage-tags' | translate }}\r\n </button>\r\n </ng-container>\r\n <div *ngIf=\"!editable\">\r\n <vdr-chip *ngFor=\"let tag of asset.tags\" [colorFrom]=\"tag.value\">\r\n <clr-icon shape=\"tag\" class=\"mr2\"></clr-icon>\r\n {{ tag.value }}</vdr-chip\r\n >\r\n </div>\r\n </vdr-labeled-data>\r\n </vdr-card>\r\n <vdr-card *ngIf=\"customFields.length\" [title]=\"'common.custom-fields' | translate\">\r\n <vdr-tabbed-custom-fields\r\n entityName=\"Asset\"\r\n [compact]=\"true\"\r\n [customFields]=\"customFields\"\r\n [customFieldsFormGroup]=\"customFieldsForm\"\r\n [readonly]=\"!(['UpdateCatalog', 'UpdateAsset'] | hasPermission)\"\r\n ></vdr-tabbed-custom-fields>\r\n </vdr-card>\r\n <vdr-card [title]=\"'asset.preview' | translate\">\r\n <vdr-form-field>\r\n <select name=\"options\" [(ngModel)]=\"size\" [disabled]=\"settingFocalPoint\">\r\n <option value=\"tiny\">tiny</option>\r\n <option value=\"thumb\">thumb</option>\r\n <option value=\"small\">small</option>\r\n <option value=\"medium\">medium</option>\r\n <option value=\"large\">large</option>\r\n <option value=\"\">full size</option>\r\n </select>\r\n </vdr-form-field>\r\n <div class=\"asset-detail\">{{ width }} x {{ height }}</div>\r\n <vdr-asset-preview-links [asset]=\"asset\"></vdr-asset-preview-links>\r\n </vdr-card>\r\n <vdr-card>\r\n <vdr-page-entity-info *ngIf=\"asset as entity\" [entity]=\"entity\"></vdr-page-entity-info>\r\n </vdr-card>\r\n </vdr-page-detail-sidebar>\r\n <div class=\"carousel-container\">\r\n
|
|
14135
|
+
args: [{ selector: 'vdr-asset-preview', changeDetection: ChangeDetectionStrategy.OnPush, template: "<vdr-page-detail-layout>\r\n <vdr-page-detail-sidebar>\r\n <vdr-card>\r\n <div *ngIf=\"!editable\" class=\"mb-2\">\r\n <a\r\n class=\"button-ghost\"\r\n [routerLink]=\"['/catalog', 'assets', asset.id]\"\r\n (click)=\"editClick.emit()\"\r\n >\r\n <clr-icon shape=\"edit\"></clr-icon>\r\n {{ 'common.edit' | translate }}\r\n <clr-icon shape=\"arrow right\"></clr-icon>\r\n </a>\r\n </div>\r\n <vdr-form-field *ngIf=\"editable\" [label]=\"'common.name' | translate\" class=\"mb-2\">\r\n <input\r\n type=\"text\"\r\n [formControl]=\"form.get('name')\"\r\n [readonly]=\"!(['UpdateCatalog', 'UpdateAsset'] | hasPermission) || settingFocalPoint\"\r\n />\r\n </vdr-form-field>\r\n <vdr-labeled-data [label]=\"'common.name' | translate\" *ngIf=\"!editable\">\r\n <span class=\"elide\">\r\n {{ asset.name }}\r\n </span>\r\n </vdr-labeled-data>\r\n <vdr-labeled-data [label]=\"'asset.source-file' | translate\">\r\n <a [href]=\"asset.source\" [title]=\"asset.source\" target=\"_blank\" class=\"elide source-link\">{{\r\n getSourceFileName()\r\n }}</a>\r\n </vdr-labeled-data>\r\n\r\n <vdr-labeled-data [label]=\"'asset.original-asset-size' | translate\">\r\n {{ asset.fileSize | filesize }}\r\n </vdr-labeled-data>\r\n\r\n <vdr-labeled-data [label]=\"'asset.dimensions' | translate\">\r\n {{ asset.width }} x {{ asset.height }}\r\n </vdr-labeled-data>\r\n\r\n <vdr-labeled-data [label]=\"'asset.focal-point' | translate\">\r\n <span *ngIf=\"fpx\"\r\n ><clr-icon shape=\"crosshairs\"></clr-icon> x: {{ fpx | number : '1.2-2' }}, y:\r\n {{ fpy | number : '1.2-2' }}</span\r\n >\r\n <span *ngIf=\"!fpx\">{{ 'common.not-set' | translate }}</span>\r\n <div class=\"flex mt-1\">\r\n <button\r\n class=\"button-small mr-1\"\r\n [disabled]=\"settingFocalPoint\"\r\n (click)=\"setFocalPointStart()\"\r\n >\r\n <ng-container *ngIf=\"!fpx\">{{ 'asset.set-focal-point' | translate }}</ng-container>\r\n <ng-container *ngIf=\"fpx\">{{ 'asset.update-focal-point' | translate }}</ng-container>\r\n </button>\r\n <button\r\n class=\"button-small\"\r\n [disabled]=\"settingFocalPoint\"\r\n *ngIf=\"!!fpx\"\r\n (click)=\"removeFocalPoint()\"\r\n >\r\n {{ 'asset.unset-focal-point' | translate }}\r\n </button>\r\n </div>\r\n </vdr-labeled-data>\r\n <vdr-labeled-data [label]=\"'common.tags' | translate\">\r\n <ng-container *ngIf=\"editable\">\r\n <vdr-tag-selector [formControl]=\"form.get('tags')\"></vdr-tag-selector>\r\n <button class=\"button-small mt-1\" (click)=\"manageTags()\">\r\n <clr-icon shape=\"tags\"></clr-icon>\r\n {{ 'common.manage-tags' | translate }}\r\n </button>\r\n </ng-container>\r\n <div *ngIf=\"!editable\">\r\n <vdr-chip *ngFor=\"let tag of asset.tags\" [colorFrom]=\"tag.value\">\r\n <clr-icon shape=\"tag\" class=\"mr2\"></clr-icon>\r\n {{ tag.value }}</vdr-chip\r\n >\r\n </div>\r\n </vdr-labeled-data>\r\n </vdr-card>\r\n <vdr-card *ngIf=\"customFields.length\" [title]=\"'common.custom-fields' | translate\">\r\n <vdr-tabbed-custom-fields\r\n entityName=\"Asset\"\r\n [compact]=\"true\"\r\n [customFields]=\"customFields\"\r\n [customFieldsFormGroup]=\"customFieldsForm\"\r\n [readonly]=\"!(['UpdateCatalog', 'UpdateAsset'] | hasPermission)\"\r\n ></vdr-tabbed-custom-fields>\r\n </vdr-card>\r\n <vdr-card [title]=\"'asset.preview' | translate\">\r\n <vdr-form-field>\r\n <select name=\"options\" [(ngModel)]=\"size\" [disabled]=\"settingFocalPoint\">\r\n <option value=\"tiny\">tiny</option>\r\n <option value=\"thumb\">thumb</option>\r\n <option value=\"small\">small</option>\r\n <option value=\"medium\">medium</option>\r\n <option value=\"large\">large</option>\r\n <option value=\"\">full size</option>\r\n </select>\r\n </vdr-form-field>\r\n <div class=\"asset-detail\">{{ width }} x {{ height }}</div>\r\n <vdr-asset-preview-links [asset]=\"asset\"></vdr-asset-preview-links>\r\n </vdr-card>\r\n <vdr-card>\r\n <vdr-page-entity-info *ngIf=\"asset as entity\" [entity]=\"entity\"></vdr-page-entity-info>\r\n </vdr-card>\r\n </vdr-page-detail-sidebar>\r\n <div class=\"carousel-container\">\r\n <button *ngIf=\"showSlideButtons\" (click)=\"previousImage()\" class=\"carousel-button\" [class.disabled]=\"disablePreviousButton\">\r\n <clr-icon shape=\"caret left\" class=\"color-weight-800\"></clr-icon>\r\n </button>\r\n <div class=\"preview-image\" #previewDiv [class.centered]=\"centered\">\r\n <div class=\"image-wrapper\">\r\n <vdr-focal-point-control\r\n [width]=\"width\"\r\n [height]=\"height\"\r\n [fpx]=\"fpx\"\r\n [fpy]=\"fpy\"\r\n [editable]=\"settingFocalPoint\"\r\n (focalPointChange)=\"onFocalPointChange($event)\"\r\n >\r\n <img\r\n class=\"asset-image\"\r\n [src]=\"asset | assetPreview : size\"\r\n [ngClass]=\"size\"\r\n #imageElement\r\n (load)=\"onImageLoad()\"\r\n />\r\n </vdr-focal-point-control>\r\n <div class=\"focal-point-info\" *ngIf=\"settingFocalPoint\">\r\n <button class=\"icon-button\" (click)=\"setFocalPointCancel()\">\r\n <clr-icon shape=\"times\"></clr-icon>\r\n </button>\r\n <button\r\n class=\"btn btn-primary btn-sm\"\r\n (click)=\"setFocalPointEnd()\"\r\n [disabled]=\"!lastFocalPoint\"\r\n >\r\n <clr-icon shape=\"crosshairs\"></clr-icon>\r\n {{ 'asset.set-focal-point' | translate }}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n <button *ngIf=\"showSlideButtons\" (click)=\"nextImage()\" class=\"carousel-button\" [class.disabled]=\"disableNextButton\">\r\n <clr-icon shape=\"caret right\" class=\"color-weight-800\"></clr-icon>\r\n </button>\r\n </div>\r\n</vdr-page-detail-layout>\r\n", styles: [":host{height:100%}.preview-image{width:100%;max-width:750px;height:100%;min-height:60vh;overflow:auto;text-align:center;box-shadow:inset 0 0 5px #0000001a;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAIAAACQkWg2AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAACuoAAArqAVDM774AAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTZEaa/1AAAAK0lEQVQ4T2P4jwP8xgFGNSADqDwGIF0DlMYAUH0YYFQDMoDKYwASNfz/DwB/JvcficphowAAAABJRU5ErkJggg==);margin-top:var(--space-unit);flex:1}.preview-image.centered{display:flex;align-items:center;justify-content:center}.preview-image vdr-focal-point-control{position:relative;box-shadow:0 0 10px -3px #00000026}.preview-image .image-wrapper{position:relative}.preview-image .asset-image{width:100%}.preview-image .asset-image.tiny{max-width:50px;max-height:50px}.preview-image .asset-image.thumb{max-width:150px;max-height:150px}.preview-image .asset-image.small{max-width:300px;max-height:300px}.preview-image .asset-image.medium{max-width:500px;max-height:500px}.preview-image .asset-image.large{max-width:800px;max-height:800px}.preview-image .focal-point-info{position:absolute;display:flex;right:0}.controls{display:flex;flex-direction:column;margin-inline-start:12px;min-width:15vw;max-width:25vw;transition:opacity .3s}.controls.fade{opacity:.5}.controls .name-input{margin-bottom:24px}.controls ::ng-deep .clr-control-container{width:100%}.controls ::ng-deep .clr-control-container .clr-input{width:100%}.controls .elide{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block}.controls .source-link{direction:rtl}.controls .preview-select{display:flex;align-items:center}.controls .preview-select clr-select-container{margin-inline-end:12px}.carousel-container{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.carousel-container button.carousel-button{cursor:pointer;width:30px;height:30px;border:none;border-radius:50%;text-align:center;background-color:var(--color-grey-300)}.carousel-container button.carousel-button:hover{background-color:var(--color-grey-400)}.carousel-container .disabled{pointer-events:none;opacity:.4}\n"] }]
|
|
14136
14136
|
}], ctorParameters: function () { return [{ type: i1$4.FormBuilder }, { type: DataService }, { type: NotificationService }, { type: i0.ChangeDetectorRef }, { type: ModalService }]; }, propDecorators: { asset: [{
|
|
14137
14137
|
type: Input
|
|
14138
14138
|
}], assets: [{
|