@libs-ui/components-image-editor 0.2.164 → 0.2.166
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.
|
@@ -253,7 +253,7 @@ class LibsUiComponentsImageEditorComponent {
|
|
|
253
253
|
originUrl = input();
|
|
254
254
|
nameFile = input();
|
|
255
255
|
hasZoom = input(false);
|
|
256
|
-
aspectRatio =
|
|
256
|
+
aspectRatio = input();
|
|
257
257
|
requiredCropFollowRatio = input(false);
|
|
258
258
|
imageOrigin = viewChild.required('imageOrigin');
|
|
259
259
|
imageClip = viewChild.required('imageClip');
|
|
@@ -820,7 +820,6 @@ class LibsUiComponentsImageEditorComponent {
|
|
|
820
820
|
handlerSelectCropRatioItem(event, key) {
|
|
821
821
|
event.stopPropagation();
|
|
822
822
|
this.cropRatioItemSelected.set(key);
|
|
823
|
-
this.aspectRatio.set(undefined);
|
|
824
823
|
this.changed.set(true);
|
|
825
824
|
this.dragGridCrop.set(true);
|
|
826
825
|
this.updateOriginImageSize();
|
|
@@ -956,7 +955,7 @@ class LibsUiComponentsImageEditorComponent {
|
|
|
956
955
|
this.dynamicComponentService.remove(this.resizeComponentRef);
|
|
957
956
|
}
|
|
958
957
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsImageEditorComponent, deps: [{ token: LINK_IMAGE_ERROR_TOKEN_INJECT, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
959
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsImageEditorComponent, isStandalone: true, selector: "libs_ui-components-image_editor", inputs: { modeShowButton: { classPropertyName: "modeShowButton", publicName: "modeShowButton", isSignal: true, isRequired: false, transformFunction: null }, mimetype: { classPropertyName: "mimetype", publicName: "mimetype", isSignal: true, isRequired: false, transformFunction: null }, zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null }, imgSrc: { classPropertyName: "imgSrc", publicName: "imgSrc", isSignal: true, isRequired: true, transformFunction: null }, originUrl: { classPropertyName: "originUrl", publicName: "originUrl", isSignal: true, isRequired: false, transformFunction: null }, nameFile: { classPropertyName: "nameFile", publicName: "nameFile", isSignal: true, isRequired: false, transformFunction: null }, hasZoom: { classPropertyName: "hasZoom", publicName: "hasZoom", isSignal: true, isRequired: false, transformFunction: null }, aspectRatio: { classPropertyName: "aspectRatio", publicName: "aspectRatio", isSignal: true, isRequired: false, transformFunction: null }, requiredCropFollowRatio: { classPropertyName: "requiredCropFollowRatio", publicName: "requiredCropFollowRatio", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { imgSrc: "imgSrcChange", aspectRatio: "aspectRatioChange", outClose: "outClose", outSaveFile: "outSaveFile", outFunctionsControl: "outFunctionsControl" }, viewQueries: [{ propertyName: "imageOrigin", first: true, predicate: ["imageOrigin"], descendants: true, isSignal: true }, { propertyName: "imageClip", first: true, predicate: ["imageClip"], descendants: true, isSignal: true }, { propertyName: "imageEditorContainer", first: true, predicate: ["imageEditorContainer"], descendants: true, isSignal: true }, { propertyName: "imageContainer", first: true, predicate: ["imageContainer"], descendants: true, isSignal: true }, { propertyName: "cropArea", first: true, predicate: ["cropArea"], descendants: true, isSignal: true }, { propertyName: "cropTL", first: true, predicate: ["cropTL"], descendants: true, isSignal: true }, { propertyName: "cropBL", first: true, predicate: ["cropBL"], descendants: true, isSignal: true }, { propertyName: "cropBR", first: true, predicate: ["cropBR"], descendants: true, isSignal: true }, { propertyName: "cropTR", first: true, predicate: ["cropTR"], descendants: true, isSignal: true }, { propertyName: "cropLineVL", first: true, predicate: ["cropLineVL"], descendants: true, isSignal: true }, { propertyName: "cropLineVR", first: true, predicate: ["cropLineVR"], descendants: true, isSignal: true }, { propertyName: "cropLineHT", first: true, predicate: ["cropLineHT"], descendants: true, isSignal: true }, { propertyName: "cropLineHB", first: true, predicate: ["cropLineHB"], descendants: true, isSignal: true }, { propertyName: "circleTL", first: true, predicate: ["circleTL"], descendants: true, isSignal: true }, { propertyName: "circleTR", first: true, predicate: ["circleTR"], descendants: true, isSignal: true }, { propertyName: "circleBL", first: true, predicate: ["circleBL"], descendants: true, isSignal: true }, { propertyName: "circleBR", first: true, predicate: ["circleBR"], descendants: true, isSignal: true }], ngImport: i0, template: "<libs_ui-components-modal [width]=\"'calc(100vw - 400px)'\"\n [height]=\"'calc(100vh - 100px)'\"\n [minWidth]=\"'1200px'\"\n [headerConfig]=\"{ignoreHeaderTheme: true, removeButtonClose: true}\"\n [bodyConfig]=\"{classInclude: '!p-0', scrollOverlayOptions: {scrollX: 'hidden', scrollY: 'hidden'}}\"\n [footerConfig]=\"{hidden: true}\"\n [zIndex]=\"zIndex()\"\n [buttonsFooter]=\"[]\"\n [mode]=\"'center'\">\n <div class=\"libs-ui-modal-header-custom w-full flex items-center justify-between\">\n <div class=\"w-full relative mx-[24px] h-[16px]\">\n <div class=\"flex w-full libs-ui-font-h4s absolute\">\n <libs_ui-components-popover [type]=\"'text'\"\n [config]=\"{zIndex: zIndex()}\">\n {{ 'i18n_edit_file_name' | translate:{file_name: nameFile()} }}\n </libs_ui-components-popover>\n </div>\n </div>\n <div class=\"flex items-center\">\n @if (modeShowButton() === 'save-file') {\n <libs_ui-components-buttons-button [type]=\"'button-third'\"\n [label]=\"'i18n_cancel'\"\n [disable]=\"loading() || loadingImage()\"\n [classInclude]=\"'py-[6px] px-[12px] mr-[16px]'\"\n (outClick)=\"handlerClose($event)\" />\n\n <libs_ui-components-buttons-button class=\"mr-[24px]\"\n [label]=\"'i18n_save'\"\n [disable]=\"loading() || loadingImage()\"\n [classInclude]=\"'py-[6px] px-[12px]'\"\n (outClick)=\"handlerSaveFile($event,'save-file')\" />\n }\n @else {\n <libs_ui-components-buttons-button [label]=\"'i18n_save_to_new_file'\"\n [type]=\"'button-outline'\"\n [classInclude]=\"'mx-[16px] py-[6px] px-[12px]'\"\n [disable]=\"loading() || loadingImage() || !changed()\"\n (outClick)=\"handlerSaveFile($event,'save-api-as-new-file')\" />\n <libs_ui-components-buttons-button [type]=\"'button-secondary'\"\n [label]=\"'i18n_save'\"\n [classInclude]=\"'py-[6px] px-[12px]'\"\n [disable]=\"loading() || loadingImage() || !changed()\"\n (outClick)=\"handlerSaveFile($event,'save-api')\" />\n <div class=\"h-[12px] libs-ui-border-left-general mx-[16px]\"></div>\n <libs_ui-components-buttons-button class=\"mr-[24px]\"\n [classInclude]=\"'p-[6px]'\"\n [type]=\"'button-third-hover-danger'\"\n [iconOnlyType]=\"true\"\n [disable]=\"loading()\"\n [popover]=\"{config: {content: 'i18n_exit_edit_mode', zIndex: zIndex()}}\"\n [classIconLeft]=\"'libs-ui-icon-close'\"\n (outClick)=\"handlerClose($event)\" />\n }\n </div>\n </div>\n <div class=\"libs-ui-modal-body-custom h-full w-full flex\">\n <div #imageEditorContainer\n class=\"relative w-full h-full bg-[#e6e7ea] border-radius-bottom-left-8px p-[32px]\">\n @if (loadingImage()) {\n <div class=\"absolute h-full w-full bg-[#e6e7ea] top-0 left-0 z-[5]\">\n <libs_ui-components-spinner [size]=\"'medium'\" />\n </div>\n }\n <div class=\"absolute h-[32px] w-[calc(100%-64px)] bg-[#e6e7eab8] top-0 left-[32px] z-[1]\">\n </div>\n <div class=\"absolute w-[32px] h-full bg-[#e6e7eab8] left-0 top-0 z-[1] rounded-bl-[8px]\">\n </div>\n <div class=\"absolute w-[32px] h-full bg-[#e6e7eab8] right-0 top-0 z-[1]\">\n </div>\n <div class=\"absolute h-[32px] w-[calc(100%-64px)] bg-[#e6e7eab8] bottom-0 left-[32px] z-[1]\">\n </div>\n <div #imageContainer\n class=\"relative w-full h-full rounded-bl-[8px] min-h-0\">\n <div #circleTL\n class=\"absolute z-[1]\"\n [class.hidden]=\"!dragGridCrop()\"\n [class.flex]=\"dragGridCrop()\">\n <ng-template *ngTemplateOutlet=\"svgCircle\" />\n </div>\n <div #circleTR\n class=\"absolute z-[1]\"\n [class.hidden]=\"!dragGridCrop()\"\n [class.flex]=\"dragGridCrop()\">\n <ng-template *ngTemplateOutlet=\"svgCircle\" />\n </div>\n <div #circleBL\n class=\"absolute z-[1]\"\n [class.hidden]=\"!dragGridCrop()\"\n [class.flex]=\"dragGridCrop()\">\n <ng-template *ngTemplateOutlet=\"svgCircle\" />\n </div>\n <div #circleBR\n class=\"absolute z-[1]\"\n [class.hidden]=\"!dragGridCrop()\"\n [class.flex]=\"dragGridCrop()\">\n <ng-template *ngTemplateOutlet=\"svgCircle\" />\n </div>\n <img #imageOrigin\n class=\"absolute border-[4px] border-[#8e61ee] rounded-[4px] w-0 h-0\"\n loading=\"lazy\"\n [src]=\"imgSrc()\"\n (load)=\"handlerImageLoaded()\"\n (error)=\"handlerImageError($event)\" />\n <img #imageClip\n class=\"absolute z-[1] w-0 h-0\"\n loading=\"lazy\"\n [src]=\"imgSrc()\"\n (error)=\"handlerImageError($event)\" />\n <div class=\"absolute top-0 left-0 right-0 bottom-0 bg-[#e6e7eab8]\">\n </div>\n <div #cropArea\n class=\"absolute z-[2] border-[4px] border-[#8e61ee] rounded-[4px]\">\n <div class=\"relative w-full h-full\">\n <div #cropTL\n class=\"absolute z-[2] left-[-18px] top-[-17px] cursor-nwse-resize\">\n <ng-template *ngTemplateOutlet=\"svgArrow\" />\n </div>\n <div #cropBL\n class=\"absolute z-[2] left-[-17px] bottom-[-18px] cursor-nesw-resize rotate-[270deg]\">\n <ng-template *ngTemplateOutlet=\"svgArrow\" />\n </div>\n <div #cropTR\n class=\"absolute z-[2] right-[-17px] top-[-17px] cursor-nesw-resize rotate-[90deg]\">\n <ng-template *ngTemplateOutlet=\"svgArrow\" />\n </div>\n <div #cropBR\n class=\"absolute z-[2] right-[-18px] bottom-[-17px] cursor-nwse-resize rotate-[180deg]\">\n <ng-template *ngTemplateOutlet=\"svgArrow\" />\n </div>\n <div #cropLineVL\n class=\"absolute z-[1] w-[12px] left-[-6px] top-0 bottom-0 cursor-ew-resize\">\n </div>\n <div #cropLineVR\n class=\"absolute z-[1] w-[12px] right-[-6px] top-0 bottom-0 cursor-ew-resize\">\n </div>\n <div #cropLineHT\n class=\"absolute z-[1] h-[12px] left-0 top-[-6px] right-0 cursor-ns-resize\">\n </div>\n <div #cropLineHB\n class=\"absolute z-[1] h-[12px] left-0 right-0 bottom-[-6px] cursor-ns-resize\">\n </div>\n\n <div class=\"bg-white absolute h-[1px] top-0 left-0 right-0\"></div>\n <div class=\"bg-white absolute h-[1px] bottom-0 left-0 right-0\"></div>\n <div class=\"bg-white absolute w-[1px] top-0 left-0 bottom-0\"></div>\n <div class=\"bg-white absolute w-[1px] top-0 bottom-0 right-0\"></div>\n <div class=\"bg-white absolute h-[2px] top-[33%] left-0 right-0\"></div>\n <div class=\"bg-white absolute h-[2px] top-[66%] left-0 right-0\"></div>\n <div class=\"bg-white absolute w-[2px] top-0 bottom-0 left-[33%]\"></div>\n <div class=\"bg-white absolute w-[2px] top-0 bottom-0 left-[66%]\"></div>\n </div>\n </div>\n </div>\n @if (loading()) {\n <libs_ui-components-spinner [size]=\"'medium'\" />\n }\n </div>\n <div class=\"w-[320px] shrink-0 p-[16px] bg-[#ffffff] rounded-br-[8px] z-[2]\">\n <div class=\"flex items-center justify-between mb-[16px]\">\n <div class=\"libs-ui-font-h4m\">{{ 'i18n_cutting_ratio' | translate }}</div>\n <libs_ui-components-buttons-button [iconOnlyType]=\"true\"\n [type]=\"'button-third'\"\n [classIconLeft]=\"'libs-ui-icon-refresh'\"\n [classInclude]=\"'p-[6px] mr-[8px]'\"\n [popover]=\"{config: {content: 'i18n_restore_the_original_state', zIndex: zIndex()}}\"\n [disable]=\"loading() || loadingImage() || !changed()\"\n (outClick)=\"handlerRestoreImage($event)\" />\n </div>\n <div class=\"mb-[16px] libs-ui-image-editor-edit-display-grid-gap-16\">\n @for (item of cropRatioItems(); track item.key) {\n <div class=\"flex flex-col items-center\">\n <libs_ui-components-buttons-button [iconOnlyType]=\"true\"\n [sizeButton]=\"'large'\"\n [disable]=\"loading() || loadingImage() || requiredCropFollowRatio()\"\n [type]=\"'button-outline'\"\n [classIconLeft]=\"item.icon+' !text-[20px]'\"\n [isActive]=\"item.key === cropRatioItemSelected()\"\n (outClick)=\"handlerSelectCropRatioItem($event, item.key)\" />\n <div class=\"libs-ui-font-h6r text-[#6a7383] mt-[4px]\">\n {{ (item.key === 'free' ? 'i18n_custom' : item.key) | translate }}\n </div>\n </div>\n }\n </div>\n <div class=\"mb-[16px] flex\">\n <libs_ui-components-inputs-valid class=\"mr-[16px]\"\n [dataType]=\"'int'\"\n [labelConfig]=\"{labelLeft: 'i18n_width', classInclude: 'mb-[4px]', labelLeftClass: 'libs-ui-font-h7r'}\"\n [fieldNameBind]=\"'width'\"\n [(item)]=\"cropSize\"\n [unitsRight]=\"[{id: 'px', label: 'px'}]\"\n [keySelectedUnitRight]=\"'px'\"\n [valueUpDownNumber]=\"1\"\n [maxValueNumber]=\"originWidth()\"\n [disable]=\"loading() || loadingImage()\"\n (outValueChange)=\"handlerCropWidth()\" />\n <libs_ui-components-inputs-valid [dataType]=\"'int'\"\n [labelConfig]=\"{labelLeft: 'i18n_length', classInclude: 'mb-[4px]', labelLeftClass: 'libs-ui-font-h7r'}\"\n [fieldNameBind]=\"'height'\"\n [(item)]=\"cropSize\"\n [unitsRight]=\"[{id: 'px', label: 'px'}]\"\n [keySelectedUnitRight]=\"'px'\"\n [valueUpDownNumber]=\"1\"\n [maxValueNumber]=\"originHeight()\"\n [disable]=\"loading() || loadingImage()\"\n (outValueChange)=\"handlerCropHeight()\" />\n </div>\n <div class=\"libs-ui-font-h4m mb-[16px]\">{{ 'i18n_rotate_photos' | translate }}</div>\n <div class=\"flex libs-ui-image-editor-edit-display-grid-gap-16\">\n <div class=\"flex flex-col items-center\">\n <libs_ui-components-buttons-button [iconOnlyType]=\"true\"\n [sizeButton]=\"'large'\"\n [disable]=\"loading() || loadingImage()\"\n [type]=\"'button-outline'\"\n [classIconLeft]=\"'libs-ui-icon-rotate-image-outline !text-[20px]'\"\n (outClick)=\"handlerRotateImage($event)\" />\n <div class=\"libs-ui-font-h6r text-[#6a7383] mt-[4px]\">\n {{ 'i18n_rotate_ninety_degrees' | translate }}\n </div>\n </div>\n\n <div class=\"flex flex-col items-center\">\n <libs_ui-components-buttons-button [iconOnlyType]=\"true\"\n [sizeButton]=\"'large'\"\n [disable]=\"loading() || loadingImage()\"\n [type]=\"'button-outline'\"\n [classIconLeft]=\"'libs-ui-icon-flip-vertical !text-[20px]'\"\n (outClick)=\"handlerFlipImage($event, 'vertical')\" />\n <div class=\"libs-ui-font-h6r text-[#6a7383] mt-[4px]\">\n {{ 'i18n_vertical_flip' | translate }}\n </div>\n </div>\n\n <div class=\"flex flex-col items-center\">\n <libs_ui-components-buttons-button [iconOnlyType]=\"true\"\n [sizeButton]=\"'large'\"\n [disable]=\"loading() || loadingImage()\"\n [type]=\"'button-outline'\"\n [classIconLeft]=\"'libs-ui-icon-flip-horizontal !text-[20px]'\"\n (outClick)=\"handlerFlipImage($event, 'horizontal')\" />\n <div class=\"libs-ui-font-h6r text-[#6a7383] mt-[4px]\">\n {{ 'i18n_horizontal_flip' | translate }}\n </div>\n </div>\n\n <div class=\"flex flex-col items-center\">\n <libs_ui-components-buttons-button [iconOnlyType]=\"true\"\n [sizeButton]=\"'large'\"\n [disable]=\"loading() || loadingImage()\"\n [type]=\"'button-outline'\"\n [classIconLeft]=\"'libs-ui-icon-scale !text-[20px]'\"\n (outClick)=\"handlerResize($event)\" />\n <div class=\"libs-ui-font-h6r text-[#6a7383] mt-[4px]\">\n {{ 'i18n_resize' | translate }}\n </div>\n </div>\n </div>\n </div>\n </div>\n</libs_ui-components-modal>\n\n<ng-template #svgArrow>\n <svg xmlns=\"http://www.w3.org/2000/svg\"\n width=\"40\"\n height=\"40\"\n viewBox=\"0 0 40 40\"\n fill=\"none\">\n <path d=\"M33.6987 14.6969L18.3309 14.6969C16.516 14.6969 15.0311 16.1818 15.0311 17.9967L15.0311 33.3645\"\n stroke=\"white\"\n stroke-width=\"5.83333\"\n stroke-miterlimit=\"10\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n</ng-template>\n\n<ng-template #svgCircle>\n <svg xmlns=\"http://www.w3.org/2000/svg\"\n width=\"15\"\n height=\"15\"\n viewBox=\"0 0 15 15\"\n fill=\"none\">\n <circle cx=\"7.5\"\n cy=\"7.5\"\n r=\"7.5\"\n fill=\"white\" />\n </svg>\n</ng-template>\n", styles: [".libs-ui-image-editor-edit-display-grid-gap-16{display:grid;gap:16px;grid-template-columns:1fr 1fr 1fr 1fr}.libs-ui-image-editor-edit-top-33{top:33.33%}.libs-ui-image-editor-edit-top-66{top:66.66%}.libs-ui-image-editor-edit-left-33{left:33.33%}.libs-ui-image-editor-edit-left-66{left:66.66%}.libs-ui-image-editor-edit-action-item{display:flex;flex-direction:column;align-items:center;width:60px;cursor:pointer}.libs-ui-image-editor-edit-action-item-icon{padding:12px;border-radius:8px;width:max-content;border:1px solid #e6e7ea}.libs-ui-image-editor-edit-action-item-icon:before{font-size:20px}.libs-ui-image-editor-edit-action-item:hover .libs-ui-image-editor-edit-action-item-icon{border:1px solid var(--mo-global-color-primary-border-hover)}.libs-ui-image-editor-edit-action-item:hover .libs-ui-image-editor-edit-action-item-icon:before{color:var(--mo-global-color-primary-text-bright-20)!important}.libs-ui-image-editor-edit-action-item[active=true] .libs-ui-image-editor-edit-action-item-icon{border:1px solid var(--mo-global-color-primary-border-active)!important;background-color:var(--mo-global-color-primary-background-95)!important}.libs-ui-image-editor-edit-action-item[active=true] .libs-ui-image-editor-edit-action-item-icon:before{color:var(--mo-global-color-primary-text-active)!important}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsModalComponent, selector: "libs_ui-components-modal", inputs: ["show", "mode", "isBackdropTransparent", "isBackgroundTransparentModal", "isSizeBackdropByWidthHeightInput", "hasShadowBoxWhenHiddenBackDropTransparent", "classIncludeModalWrapper", "zIndex", "width", "height", "maxWidth", "maxHeight", "minWidth", "isFullScreen", "disable", "ignoreCommunicateMicroEvent", "headerConfig", "bodyConfig", "footerConfig", "buttonsFooter", "title", "titleUseXssFilter", "titleUseTooltip", "titleUseInnerText"], outputs: ["showChange", "widthChange", "heightChange", "maxWidthChange", "maxHeightChange", "minWidthChange", "disableChange", "buttonsFooterChange", "outScrollContent", "outEvent", "outFunctionControl"] }, { kind: "component", type: LibsUiComponentsInputsValidComponent, selector: "libs_ui-components-inputs-valid", inputs: ["item", "labelConfig", "emitEmptyInDataTypeNumber", "ignoreBlockInputMaxValue", "fieldNameBind", "showCount", "typeComponentSelectItem", "valueComponentSelectItem", "disableComponentSelectItem", "tagInput", "dataType", "typeInput", "modeInput", "resetAutoCompletePassword", "textAreaEnterNotNewLine", "fixedFloat", "acceptNegativeValue", "valueUpDownNumber", "ignoreWidthInput100", "classIncludeInput", "classContainerInput", "readonly", "disable", "noBorder", "backgroundNone", "useColorModeExist", "placeholder", "keepPlaceholderOnly", "classContainerBottomInput", "autoRemoveEmoji", "defaultHeight", "maxHeightTextArea", "minHeightTextArea", "ignoreShowError", "borderError", "iconLeftClass", "popoverContentIconLeft", "iconRightClass", "popoverContentIconRight", "zIndexPopoverContent", "unitsLeft", "configUnitLeft", "keySelectedUnitLeft", "unitsRight", "configUnitRight", "keySelectedUnitRight", "maxValueNumber", "minValueNumber", "ignoreContentLeft", "ignoreContentRight", "isBaselineStyle", "valuePatternShowError", "validPattern", "validRequired", "validMinLength", "validMinValue", "validMaxValue", "validMaxLength", "functionValid", "maxLength", "positionMessageErrorStartInput", "classInclude", "resize", "templateLeftBottomInput", "templateRightBottomInput", "onlyAcceptNegativeValue", "autoAddZeroLessThan10InTypeInt", "maxLengthNumberCount", "classMessageErrorInclude", "ignoreStopPropagationEvent", "ignoreUnitRightClassReadOnly", "paddingRightCustomSpecific", "focusTimeOut"], outputs: ["itemChange", "outValueChange", "outSelect", "outIconLeft", "outIconRight", "outClickButtonLabel", "outSwitchEventLabel", "outLabelRightClick", "outEnterInputEvent", "outHeightAreaChange", "outFunctionsControl", "outFocusAndBlur", "outChangeValueByButtonUpDown"] }, { kind: "component", type: LibsUiComponentsButtonsButtonComponent, selector: "libs_ui-components-buttons-button", inputs: ["flagMouse", "type", "buttonCustom", "sizeButton", "label", "disable", "isPending", "imageLeft", "classInclude", "classIconLeft", "classIconRight", "classLabel", "iconOnlyType", "popover", "ignoreStopPropagationEvent", "zIndex", "widthLabelPopover", "styleIconLeft", "styleButton", "ignoreFocusWhenInputTab", "ignoreSetClickWhenShowPopover", "ignorePointerEvent", "isActive"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsSpinnerComponent, selector: "libs_ui-components-spinner", inputs: ["type", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
958
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LibsUiComponentsImageEditorComponent, isStandalone: true, selector: "libs_ui-components-image_editor", inputs: { modeShowButton: { classPropertyName: "modeShowButton", publicName: "modeShowButton", isSignal: true, isRequired: false, transformFunction: null }, mimetype: { classPropertyName: "mimetype", publicName: "mimetype", isSignal: true, isRequired: false, transformFunction: null }, zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null }, imgSrc: { classPropertyName: "imgSrc", publicName: "imgSrc", isSignal: true, isRequired: true, transformFunction: null }, originUrl: { classPropertyName: "originUrl", publicName: "originUrl", isSignal: true, isRequired: false, transformFunction: null }, nameFile: { classPropertyName: "nameFile", publicName: "nameFile", isSignal: true, isRequired: false, transformFunction: null }, hasZoom: { classPropertyName: "hasZoom", publicName: "hasZoom", isSignal: true, isRequired: false, transformFunction: null }, aspectRatio: { classPropertyName: "aspectRatio", publicName: "aspectRatio", isSignal: true, isRequired: false, transformFunction: null }, requiredCropFollowRatio: { classPropertyName: "requiredCropFollowRatio", publicName: "requiredCropFollowRatio", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { imgSrc: "imgSrcChange", outClose: "outClose", outSaveFile: "outSaveFile", outFunctionsControl: "outFunctionsControl" }, viewQueries: [{ propertyName: "imageOrigin", first: true, predicate: ["imageOrigin"], descendants: true, isSignal: true }, { propertyName: "imageClip", first: true, predicate: ["imageClip"], descendants: true, isSignal: true }, { propertyName: "imageEditorContainer", first: true, predicate: ["imageEditorContainer"], descendants: true, isSignal: true }, { propertyName: "imageContainer", first: true, predicate: ["imageContainer"], descendants: true, isSignal: true }, { propertyName: "cropArea", first: true, predicate: ["cropArea"], descendants: true, isSignal: true }, { propertyName: "cropTL", first: true, predicate: ["cropTL"], descendants: true, isSignal: true }, { propertyName: "cropBL", first: true, predicate: ["cropBL"], descendants: true, isSignal: true }, { propertyName: "cropBR", first: true, predicate: ["cropBR"], descendants: true, isSignal: true }, { propertyName: "cropTR", first: true, predicate: ["cropTR"], descendants: true, isSignal: true }, { propertyName: "cropLineVL", first: true, predicate: ["cropLineVL"], descendants: true, isSignal: true }, { propertyName: "cropLineVR", first: true, predicate: ["cropLineVR"], descendants: true, isSignal: true }, { propertyName: "cropLineHT", first: true, predicate: ["cropLineHT"], descendants: true, isSignal: true }, { propertyName: "cropLineHB", first: true, predicate: ["cropLineHB"], descendants: true, isSignal: true }, { propertyName: "circleTL", first: true, predicate: ["circleTL"], descendants: true, isSignal: true }, { propertyName: "circleTR", first: true, predicate: ["circleTR"], descendants: true, isSignal: true }, { propertyName: "circleBL", first: true, predicate: ["circleBL"], descendants: true, isSignal: true }, { propertyName: "circleBR", first: true, predicate: ["circleBR"], descendants: true, isSignal: true }], ngImport: i0, template: "<libs_ui-components-modal [width]=\"'calc(100vw - 400px)'\"\n [height]=\"'calc(100vh - 100px)'\"\n [minWidth]=\"'1200px'\"\n [headerConfig]=\"{ignoreHeaderTheme: true, removeButtonClose: true}\"\n [bodyConfig]=\"{classInclude: '!p-0', scrollOverlayOptions: {scrollX: 'hidden', scrollY: 'hidden'}}\"\n [footerConfig]=\"{hidden: true}\"\n [zIndex]=\"zIndex()\"\n [buttonsFooter]=\"[]\"\n [mode]=\"'center'\">\n <div class=\"libs-ui-modal-header-custom w-full flex items-center justify-between\">\n <div class=\"w-full relative mx-[24px] h-[16px]\">\n <div class=\"flex w-full libs-ui-font-h4s absolute\">\n <libs_ui-components-popover [type]=\"'text'\"\n [config]=\"{zIndex: zIndex()}\">\n {{ 'i18n_edit_file_name' | translate:{file_name: nameFile()} }}\n </libs_ui-components-popover>\n </div>\n </div>\n <div class=\"flex items-center\">\n @if (modeShowButton() === 'save-file') {\n <libs_ui-components-buttons-button [type]=\"'button-third'\"\n [label]=\"'i18n_cancel'\"\n [disable]=\"loading() || loadingImage()\"\n [classInclude]=\"'py-[6px] px-[12px] mr-[16px]'\"\n (outClick)=\"handlerClose($event)\" />\n\n <libs_ui-components-buttons-button class=\"mr-[24px]\"\n [label]=\"'i18n_save'\"\n [disable]=\"loading() || loadingImage()\"\n [classInclude]=\"'py-[6px] px-[12px]'\"\n (outClick)=\"handlerSaveFile($event,'save-file')\" />\n }\n @else {\n <libs_ui-components-buttons-button [label]=\"'i18n_save_to_new_file'\"\n [type]=\"'button-outline'\"\n [classInclude]=\"'mx-[16px] py-[6px] px-[12px]'\"\n [disable]=\"loading() || loadingImage() || !changed()\"\n (outClick)=\"handlerSaveFile($event,'save-api-as-new-file')\" />\n <libs_ui-components-buttons-button [type]=\"'button-secondary'\"\n [label]=\"'i18n_save'\"\n [classInclude]=\"'py-[6px] px-[12px]'\"\n [disable]=\"loading() || loadingImage() || !changed()\"\n (outClick)=\"handlerSaveFile($event,'save-api')\" />\n <div class=\"h-[12px] libs-ui-border-left-general mx-[16px]\"></div>\n <libs_ui-components-buttons-button class=\"mr-[24px]\"\n [classInclude]=\"'p-[6px]'\"\n [type]=\"'button-third-hover-danger'\"\n [iconOnlyType]=\"true\"\n [disable]=\"loading()\"\n [popover]=\"{config: {content: 'i18n_exit_edit_mode', zIndex: zIndex()}}\"\n [classIconLeft]=\"'libs-ui-icon-close'\"\n (outClick)=\"handlerClose($event)\" />\n }\n </div>\n </div>\n <div class=\"libs-ui-modal-body-custom h-full w-full flex\">\n <div #imageEditorContainer\n class=\"relative w-full h-full bg-[#e6e7ea] border-radius-bottom-left-8px p-[32px]\">\n @if (loadingImage()) {\n <div class=\"absolute h-full w-full bg-[#e6e7ea] top-0 left-0 z-[5]\">\n <libs_ui-components-spinner [size]=\"'medium'\" />\n </div>\n }\n <div class=\"absolute h-[32px] w-[calc(100%-64px)] bg-[#e6e7eab8] top-0 left-[32px] z-[1]\">\n </div>\n <div class=\"absolute w-[32px] h-full bg-[#e6e7eab8] left-0 top-0 z-[1] rounded-bl-[8px]\">\n </div>\n <div class=\"absolute w-[32px] h-full bg-[#e6e7eab8] right-0 top-0 z-[1]\">\n </div>\n <div class=\"absolute h-[32px] w-[calc(100%-64px)] bg-[#e6e7eab8] bottom-0 left-[32px] z-[1]\">\n </div>\n <div #imageContainer\n class=\"relative w-full h-full rounded-bl-[8px] min-h-0\">\n <div #circleTL\n class=\"absolute z-[1]\"\n [class.hidden]=\"!dragGridCrop()\"\n [class.flex]=\"dragGridCrop()\">\n <ng-template *ngTemplateOutlet=\"svgCircle\" />\n </div>\n <div #circleTR\n class=\"absolute z-[1]\"\n [class.hidden]=\"!dragGridCrop()\"\n [class.flex]=\"dragGridCrop()\">\n <ng-template *ngTemplateOutlet=\"svgCircle\" />\n </div>\n <div #circleBL\n class=\"absolute z-[1]\"\n [class.hidden]=\"!dragGridCrop()\"\n [class.flex]=\"dragGridCrop()\">\n <ng-template *ngTemplateOutlet=\"svgCircle\" />\n </div>\n <div #circleBR\n class=\"absolute z-[1]\"\n [class.hidden]=\"!dragGridCrop()\"\n [class.flex]=\"dragGridCrop()\">\n <ng-template *ngTemplateOutlet=\"svgCircle\" />\n </div>\n <img #imageOrigin\n class=\"absolute border-[4px] border-[#8e61ee] rounded-[4px] w-0 h-0\"\n loading=\"lazy\"\n [src]=\"imgSrc()\"\n (load)=\"handlerImageLoaded()\"\n (error)=\"handlerImageError($event)\" />\n <img #imageClip\n class=\"absolute z-[1] w-0 h-0\"\n loading=\"lazy\"\n [src]=\"imgSrc()\"\n (error)=\"handlerImageError($event)\" />\n <div class=\"absolute top-0 left-0 right-0 bottom-0 bg-[#e6e7eab8]\">\n </div>\n <div #cropArea\n class=\"absolute z-[2] border-[4px] border-[#8e61ee] rounded-[4px]\">\n <div class=\"relative w-full h-full\">\n <div #cropTL\n class=\"absolute z-[2] left-[-18px] top-[-17px] cursor-nwse-resize\">\n <ng-template *ngTemplateOutlet=\"svgArrow\" />\n </div>\n <div #cropBL\n class=\"absolute z-[2] left-[-17px] bottom-[-18px] cursor-nesw-resize rotate-[270deg]\">\n <ng-template *ngTemplateOutlet=\"svgArrow\" />\n </div>\n <div #cropTR\n class=\"absolute z-[2] right-[-17px] top-[-17px] cursor-nesw-resize rotate-[90deg]\">\n <ng-template *ngTemplateOutlet=\"svgArrow\" />\n </div>\n <div #cropBR\n class=\"absolute z-[2] right-[-18px] bottom-[-17px] cursor-nwse-resize rotate-[180deg]\">\n <ng-template *ngTemplateOutlet=\"svgArrow\" />\n </div>\n <div #cropLineVL\n class=\"absolute z-[1] w-[12px] left-[-6px] top-0 bottom-0 cursor-ew-resize\">\n </div>\n <div #cropLineVR\n class=\"absolute z-[1] w-[12px] right-[-6px] top-0 bottom-0 cursor-ew-resize\">\n </div>\n <div #cropLineHT\n class=\"absolute z-[1] h-[12px] left-0 top-[-6px] right-0 cursor-ns-resize\">\n </div>\n <div #cropLineHB\n class=\"absolute z-[1] h-[12px] left-0 right-0 bottom-[-6px] cursor-ns-resize\">\n </div>\n\n <div class=\"bg-white absolute h-[1px] top-0 left-0 right-0\"></div>\n <div class=\"bg-white absolute h-[1px] bottom-0 left-0 right-0\"></div>\n <div class=\"bg-white absolute w-[1px] top-0 left-0 bottom-0\"></div>\n <div class=\"bg-white absolute w-[1px] top-0 bottom-0 right-0\"></div>\n <div class=\"bg-white absolute h-[2px] top-[33%] left-0 right-0\"></div>\n <div class=\"bg-white absolute h-[2px] top-[66%] left-0 right-0\"></div>\n <div class=\"bg-white absolute w-[2px] top-0 bottom-0 left-[33%]\"></div>\n <div class=\"bg-white absolute w-[2px] top-0 bottom-0 left-[66%]\"></div>\n </div>\n </div>\n </div>\n @if (loading()) {\n <libs_ui-components-spinner [size]=\"'medium'\" />\n }\n </div>\n <div class=\"w-[320px] shrink-0 p-[16px] bg-[#ffffff] rounded-br-[8px] z-[2]\">\n <div class=\"flex items-center justify-between mb-[16px]\">\n <div class=\"libs-ui-font-h4m\">{{ 'i18n_cutting_ratio' | translate }}</div>\n <libs_ui-components-buttons-button [iconOnlyType]=\"true\"\n [type]=\"'button-third'\"\n [classIconLeft]=\"'libs-ui-icon-refresh'\"\n [classInclude]=\"'p-[6px] mr-[8px]'\"\n [popover]=\"{config: {content: 'i18n_restore_the_original_state', zIndex: zIndex()}}\"\n [disable]=\"loading() || loadingImage() || !changed()\"\n (outClick)=\"handlerRestoreImage($event)\" />\n </div>\n <div class=\"mb-[16px] libs-ui-image-editor-edit-display-grid-gap-16\">\n @for (item of cropRatioItems(); track item.key) {\n <div class=\"flex flex-col items-center\">\n <libs_ui-components-buttons-button [iconOnlyType]=\"true\"\n [sizeButton]=\"'large'\"\n [disable]=\"loading() || loadingImage() || requiredCropFollowRatio()\"\n [type]=\"'button-outline'\"\n [classIconLeft]=\"item.icon+' !text-[20px]'\"\n [isActive]=\"item.key === cropRatioItemSelected()\"\n (outClick)=\"handlerSelectCropRatioItem($event, item.key)\" />\n <div class=\"libs-ui-font-h6r text-[#6a7383] mt-[4px]\">\n {{ (item.key === 'free' ? 'i18n_custom' : item.key) | translate }}\n </div>\n </div>\n }\n </div>\n <div class=\"mb-[16px] flex\">\n <libs_ui-components-inputs-valid class=\"mr-[16px]\"\n [dataType]=\"'int'\"\n [labelConfig]=\"{labelLeft: 'i18n_width', classInclude: 'mb-[4px]', labelLeftClass: 'libs-ui-font-h7r'}\"\n [fieldNameBind]=\"'width'\"\n [(item)]=\"cropSize\"\n [unitsRight]=\"[{id: 'px', label: 'px'}]\"\n [keySelectedUnitRight]=\"'px'\"\n [valueUpDownNumber]=\"1\"\n [maxValueNumber]=\"originWidth()\"\n [disable]=\"loading() || loadingImage()\"\n (outValueChange)=\"handlerCropWidth()\" />\n <libs_ui-components-inputs-valid [dataType]=\"'int'\"\n [labelConfig]=\"{labelLeft: 'i18n_length', classInclude: 'mb-[4px]', labelLeftClass: 'libs-ui-font-h7r'}\"\n [fieldNameBind]=\"'height'\"\n [(item)]=\"cropSize\"\n [unitsRight]=\"[{id: 'px', label: 'px'}]\"\n [keySelectedUnitRight]=\"'px'\"\n [valueUpDownNumber]=\"1\"\n [maxValueNumber]=\"originHeight()\"\n [disable]=\"loading() || loadingImage()\"\n (outValueChange)=\"handlerCropHeight()\" />\n </div>\n <div class=\"libs-ui-font-h4m mb-[16px]\">{{ 'i18n_rotate_photos' | translate }}</div>\n <div class=\"flex libs-ui-image-editor-edit-display-grid-gap-16\">\n <div class=\"flex flex-col items-center\">\n <libs_ui-components-buttons-button [iconOnlyType]=\"true\"\n [sizeButton]=\"'large'\"\n [disable]=\"loading() || loadingImage()\"\n [type]=\"'button-outline'\"\n [classIconLeft]=\"'libs-ui-icon-rotate-image-outline !text-[20px]'\"\n (outClick)=\"handlerRotateImage($event)\" />\n <div class=\"libs-ui-font-h6r text-[#6a7383] mt-[4px]\">\n {{ 'i18n_rotate_ninety_degrees' | translate }}\n </div>\n </div>\n\n <div class=\"flex flex-col items-center\">\n <libs_ui-components-buttons-button [iconOnlyType]=\"true\"\n [sizeButton]=\"'large'\"\n [disable]=\"loading() || loadingImage()\"\n [type]=\"'button-outline'\"\n [classIconLeft]=\"'libs-ui-icon-flip-vertical !text-[20px]'\"\n (outClick)=\"handlerFlipImage($event, 'vertical')\" />\n <div class=\"libs-ui-font-h6r text-[#6a7383] mt-[4px]\">\n {{ 'i18n_vertical_flip' | translate }}\n </div>\n </div>\n\n <div class=\"flex flex-col items-center\">\n <libs_ui-components-buttons-button [iconOnlyType]=\"true\"\n [sizeButton]=\"'large'\"\n [disable]=\"loading() || loadingImage()\"\n [type]=\"'button-outline'\"\n [classIconLeft]=\"'libs-ui-icon-flip-horizontal !text-[20px]'\"\n (outClick)=\"handlerFlipImage($event, 'horizontal')\" />\n <div class=\"libs-ui-font-h6r text-[#6a7383] mt-[4px]\">\n {{ 'i18n_horizontal_flip' | translate }}\n </div>\n </div>\n\n <div class=\"flex flex-col items-center\">\n <libs_ui-components-buttons-button [iconOnlyType]=\"true\"\n [sizeButton]=\"'large'\"\n [disable]=\"loading() || loadingImage()\"\n [type]=\"'button-outline'\"\n [classIconLeft]=\"'libs-ui-icon-scale !text-[20px]'\"\n (outClick)=\"handlerResize($event)\" />\n <div class=\"libs-ui-font-h6r text-[#6a7383] mt-[4px]\">\n {{ 'i18n_resize' | translate }}\n </div>\n </div>\n </div>\n </div>\n </div>\n</libs_ui-components-modal>\n\n<ng-template #svgArrow>\n <svg xmlns=\"http://www.w3.org/2000/svg\"\n width=\"40\"\n height=\"40\"\n viewBox=\"0 0 40 40\"\n fill=\"none\">\n <path d=\"M33.6987 14.6969L18.3309 14.6969C16.516 14.6969 15.0311 16.1818 15.0311 17.9967L15.0311 33.3645\"\n stroke=\"white\"\n stroke-width=\"5.83333\"\n stroke-miterlimit=\"10\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\" />\n </svg>\n</ng-template>\n\n<ng-template #svgCircle>\n <svg xmlns=\"http://www.w3.org/2000/svg\"\n width=\"15\"\n height=\"15\"\n viewBox=\"0 0 15 15\"\n fill=\"none\">\n <circle cx=\"7.5\"\n cy=\"7.5\"\n r=\"7.5\"\n fill=\"white\" />\n </svg>\n</ng-template>\n", styles: [".libs-ui-image-editor-edit-display-grid-gap-16{display:grid;gap:16px;grid-template-columns:1fr 1fr 1fr 1fr}.libs-ui-image-editor-edit-top-33{top:33.33%}.libs-ui-image-editor-edit-top-66{top:66.66%}.libs-ui-image-editor-edit-left-33{left:33.33%}.libs-ui-image-editor-edit-left-66{left:66.66%}.libs-ui-image-editor-edit-action-item{display:flex;flex-direction:column;align-items:center;width:60px;cursor:pointer}.libs-ui-image-editor-edit-action-item-icon{padding:12px;border-radius:8px;width:max-content;border:1px solid #e6e7ea}.libs-ui-image-editor-edit-action-item-icon:before{font-size:20px}.libs-ui-image-editor-edit-action-item:hover .libs-ui-image-editor-edit-action-item-icon{border:1px solid var(--mo-global-color-primary-border-hover)}.libs-ui-image-editor-edit-action-item:hover .libs-ui-image-editor-edit-action-item-icon:before{color:var(--mo-global-color-primary-text-bright-20)!important}.libs-ui-image-editor-edit-action-item[active=true] .libs-ui-image-editor-edit-action-item-icon{border:1px solid var(--mo-global-color-primary-border-active)!important;background-color:var(--mo-global-color-primary-background-95)!important}.libs-ui-image-editor-edit-action-item[active=true] .libs-ui-image-editor-edit-action-item-icon:before{color:var(--mo-global-color-primary-text-active)!important}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: LibsUiComponentsPopoverComponent, selector: "libs_ui-components-popover,[LibsUiComponentsPopoverDirective]", inputs: ["debugId", "flagMouse", "type", "mode", "config", "ignoreShowPopover", "elementRefCustom", "classInclude", "ignoreHiddenPopoverContentWhenMouseLeave", "ignoreStopPropagationEvent", "ignoreCursorPointerModeLikeClick", "isAddContentToParentDocument", "ignoreClickOutside"], outputs: ["outEvent", "outChangStageFlagMouse", "outEventPopoverContent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsModalComponent, selector: "libs_ui-components-modal", inputs: ["show", "mode", "isBackdropTransparent", "isBackgroundTransparentModal", "isSizeBackdropByWidthHeightInput", "hasShadowBoxWhenHiddenBackDropTransparent", "classIncludeModalWrapper", "zIndex", "width", "height", "maxWidth", "maxHeight", "minWidth", "isFullScreen", "disable", "ignoreCommunicateMicroEvent", "headerConfig", "bodyConfig", "footerConfig", "buttonsFooter", "title", "titleUseXssFilter", "titleUseTooltip", "titleUseInnerText"], outputs: ["showChange", "widthChange", "heightChange", "maxWidthChange", "maxHeightChange", "minWidthChange", "disableChange", "buttonsFooterChange", "outScrollContent", "outEvent", "outFunctionControl"] }, { kind: "component", type: LibsUiComponentsInputsValidComponent, selector: "libs_ui-components-inputs-valid", inputs: ["item", "labelConfig", "emitEmptyInDataTypeNumber", "ignoreBlockInputMaxValue", "fieldNameBind", "showCount", "typeComponentSelectItem", "valueComponentSelectItem", "disableComponentSelectItem", "tagInput", "dataType", "typeInput", "modeInput", "resetAutoCompletePassword", "textAreaEnterNotNewLine", "fixedFloat", "acceptNegativeValue", "valueUpDownNumber", "ignoreWidthInput100", "classIncludeInput", "classContainerInput", "readonly", "disable", "noBorder", "backgroundNone", "useColorModeExist", "placeholder", "keepPlaceholderOnly", "classContainerBottomInput", "autoRemoveEmoji", "defaultHeight", "maxHeightTextArea", "minHeightTextArea", "ignoreShowError", "borderError", "iconLeftClass", "popoverContentIconLeft", "iconRightClass", "popoverContentIconRight", "zIndexPopoverContent", "unitsLeft", "configUnitLeft", "keySelectedUnitLeft", "unitsRight", "configUnitRight", "keySelectedUnitRight", "maxValueNumber", "minValueNumber", "ignoreContentLeft", "ignoreContentRight", "isBaselineStyle", "valuePatternShowError", "validPattern", "validRequired", "validMinLength", "validMinValue", "validMaxValue", "validMaxLength", "functionValid", "maxLength", "positionMessageErrorStartInput", "classInclude", "resize", "templateLeftBottomInput", "templateRightBottomInput", "onlyAcceptNegativeValue", "autoAddZeroLessThan10InTypeInt", "maxLengthNumberCount", "classMessageErrorInclude", "ignoreStopPropagationEvent", "ignoreUnitRightClassReadOnly", "paddingRightCustomSpecific", "focusTimeOut"], outputs: ["itemChange", "outValueChange", "outSelect", "outIconLeft", "outIconRight", "outClickButtonLabel", "outSwitchEventLabel", "outLabelRightClick", "outEnterInputEvent", "outHeightAreaChange", "outFunctionsControl", "outFocusAndBlur", "outChangeValueByButtonUpDown"] }, { kind: "component", type: LibsUiComponentsButtonsButtonComponent, selector: "libs_ui-components-buttons-button", inputs: ["flagMouse", "type", "buttonCustom", "sizeButton", "label", "disable", "isPending", "imageLeft", "classInclude", "classIconLeft", "classIconRight", "classLabel", "iconOnlyType", "popover", "ignoreStopPropagationEvent", "zIndex", "widthLabelPopover", "styleIconLeft", "styleButton", "ignoreFocusWhenInputTab", "ignoreSetClickWhenShowPopover", "ignorePointerEvent", "isActive"], outputs: ["outClick", "outPopoverEvent", "outFunctionsControl"] }, { kind: "component", type: LibsUiComponentsSpinnerComponent, selector: "libs_ui-components-spinner", inputs: ["type", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
960
959
|
}
|
|
961
960
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LibsUiComponentsImageEditorComponent, decorators: [{
|
|
962
961
|
type: Component,
|