import { Component, ContentChild, EventEmitter, inject, Input, Output, ViewChild, ViewEncapsulation } from '@angular/core';
import Cropper from 'cropperjs';
import { FooterComponent, HeaderComponent } from '@seniorsistemas/angular-components/structure';
import { isNullOrUndefined } from '@seniorsistemas/angular-components/utils';
import { ActiveDialog } from '@seniorsistemas/angular-components/dialog';
import * as i0 from "@angular/core";
import * as i1 from "@seniorsistemas/angular-components/button";
import * as i2 from "@seniorsistemas/angular-components/empty-state";
import * as i3 from "@seniorsistemas/angular-components/dialog";
import * as i4 from "@seniorsistemas/angular-components/template";
export class ImageCropperComponent {
    activeDialog = inject(ActiveDialog, { optional: true });
    static nextId = 0;
    id = `s-image-cropper-${ImageCropperComponent.nextId++}`;
    visible = false;
    header = 'Recortar imagem';
    cropLabel = 'Recortar';
    selectAnotherLabel = 'Trocar';
    removeLabel = 'Remover';
    cancelLabel = 'Cancelar';
    emptyStateTitle = 'Selecione uma foto, em seguida você poderá ajustá-la';
    emptyStateActionLabel = 'Escolher imagem';
    emptyStateIconClass = 'fa fa-picture-o';
    aspectRatio = NaN;
    rounded = false;
    allowSelectAnother = true;
    allowRemove = true;
    allowCancel = true;
    imageSource;
    visibleChange = new EventEmitter();
    changeImage = new EventEmitter();
    croppedImage = new EventEmitter();
    croppedCanvas = new EventEmitter();
    removedImage = new EventEmitter();
    cancel = new EventEmitter();
    image = null;
    headerSection = null;
    footerSection = null;
    cropper = null;
    ngOnInit() {
        if (this.imageSource)
            this.initCropper();
    }
    ngOnChanges(changes) {
        if (changes['imageSource'] && changes['imageSource'].currentValue) {
            this.initCropper();
        }
    }
    initCropper() {
        if (isNullOrUndefined(this.image)) {
            return;
        }
        ;
        if (this.cropper) {
            this.cropper.destroy();
        }
        this.image.nativeElement.src = this.imageSource;
        this.cropper = new Cropper(this.image.nativeElement, {
            aspectRatio: this.rounded ? 1 : this.aspectRatio,
            guides: false,
            dragMode: 'move',
            minCropBoxHeight: 2,
            minCropBoxWidth: 2,
            toggleDragModeOnDblclick: false,
        });
    }
    getRoundedCanvas(sourceCanvas) {
        const canvas = document.createElement('canvas');
        const context = canvas.getContext('2d');
        if (isNullOrUndefined(context))
            return null;
        const width = sourceCanvas.width;
        const height = sourceCanvas.height;
        canvas.width = width;
        canvas.height = height;
        context.imageSmoothingEnabled = true;
        context.drawImage(sourceCanvas, 0, 0, width, height);
        context.globalCompositeOperation = 'destination-in';
        context.beginPath();
        context.arc(width / 2, height / 2, Math.min(width, height) / 2, 0, 2 * Math.PI, true);
        context.fill();
        return canvas;
    }
    onCropImage() {
        if (!this.imageSource) {
            this.croppedImage.emit();
            this.croppedCanvas.emit();
        }
        else {
            const cropperCanvas = this.cropper?.getCroppedCanvas();
            if (cropperCanvas) {
                const canvas = this.rounded ? this.getRoundedCanvas(cropperCanvas) : cropperCanvas;
                if (canvas) {
                    this.croppedCanvas.emit(canvas);
                    this.croppedImage.emit(canvas.toDataURL());
                }
            }
        }
        this.visible = false;
        this.visibleChange.emit(false);
    }
    onChangeImage() {
        this.changeImage.emit();
    }
    onRemoveImage() {
        this.imageSource = undefined;
        this.removedImage.emit();
    }
    onCancel() {
        this.visible = false;
        this.visibleChange.emit(false);
        this.cancel.emit();
    }
    onModalVisibleChange(visible) {
        if (!visible)
            this.onCancel();
        this.visibleChange.emit(visible);
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ImageCropperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ImageCropperComponent, selector: "s-image-cropper", inputs: { id: "id", visible: "visible", header: "header", cropLabel: "cropLabel", selectAnotherLabel: "selectAnotherLabel", removeLabel: "removeLabel", cancelLabel: "cancelLabel", emptyStateTitle: "emptyStateTitle", emptyStateActionLabel: "emptyStateActionLabel", emptyStateIconClass: "emptyStateIconClass", aspectRatio: "aspectRatio", rounded: "rounded", allowSelectAnother: "allowSelectAnother", allowRemove: "allowRemove", allowCancel: "allowCancel", imageSource: "imageSource" }, outputs: { visibleChange: "visibleChange", changeImage: "changeImage", croppedImage: "croppedImage", croppedCanvas: "croppedCanvas", removedImage: "removedImage", cancel: "cancel" }, queries: [{ propertyName: "headerSection", first: true, predicate: HeaderComponent, descendants: true, static: true }, { propertyName: "footerSection", first: true, predicate: FooterComponent, descendants: true, static: true }], viewQueries: [{ propertyName: "image", first: true, predicate: ["image"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div [id]=\"id\">\n    @let roundedClass = rounded ? 's-image-cropper--rounded' : '';\n    <s-dialog\n        size=\"lg\"\n        [contentClassName]=\"'s-image-cropper ' + roundedClass\"\n        [header]=\"headerSection ? '' : header\"\n        [(visible)]=\"visible\"\n        (visibleChange)=\"onModalVisibleChange($event!)\"\n        [draggable]=\"false\"\n    >\n        @if (headerSection) {\n            <ng-template sTemplate=\"header\">\n                <ng-content select=\"s-header\"></ng-content>\n            </ng-template>\n        }\n        @if (!imageSource) {\n            <s-empty-state\n                [id]=\"id + '-empty-state'\"\n                [title]=\"emptyStateTitle\"\n                [iconClass]=\"emptyStateIconClass\"\n                [primaryActionLabel]=\"emptyStateActionLabel\"\n                (primaryAction)=\"onChangeImage()\"\n            >\n            </s-empty-state>\n        }\n        <div\n            [attr.data-hidden]=\"!imageSource\"\n            class=\"image-container\"\n        >\n            <img\n                [id]=\"id + '-cropper'\"\n                #image\n                [src]=\"imageSource || ''\"\n                alt=\"cropped image\"\n            />\n        </div>\n        <ng-template sTemplate=\"footer\">\n            @if (!footerSection) {\n                <div class=\"button-container\">\n                    @if (allowCancel) {\n                        <s-button\n                            [id]=\"id + '-cancel-button'\"\n                            type=\"button\"\n                            priority=\"link\"\n                            [label]=\"cancelLabel\"\n                            (clicked)=\"onCancel()\"\n                        >\n                        </s-button>\n                    }\n\n                    <div>\n                        @if (imageSource && allowRemove) {\n                            <s-button\n                                [id]=\"id + '-remove-button'\"\n                                type=\"button\"\n                                priority=\"secondary\"\n                                [label]=\"removeLabel\"\n                                (clicked)=\"onRemoveImage()\"\n                            >\n                            </s-button>\n                        }\n                        @if (imageSource && allowSelectAnother) {\n                            <s-button\n                                [id]=\"id + '-select-another-button'\"\n                                type=\"button\"\n                                priority=\"secondary\"\n                                [label]=\"selectAnotherLabel\"\n                                (clicked)=\"onChangeImage()\"\n                            >\n                            </s-button>\n                        }\n                        <s-button\n                            [id]=\"id + '-crop-button'\"\n                            type=\"button\"\n                            [label]=\"cropLabel\"\n                            (clicked)=\"onCropImage()\"\n                        >\n                        </s-button>\n                    </div>\n                </div>\n            }\n            @if (footerSection) {\n                <ng-content select=\"s-footer\"> </ng-content>\n            }\n        </ng-template>\n    </s-dialog>\n</div>\n", styles: [".cropper-container{-webkit-touch-callout:none;direction:ltr;font-size:0;line-height:0;position:relative;-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.cropper-container img{backface-visibility:hidden;display:block;height:100%;image-orientation:0deg;max-height:none!important;max-width:none!important;min-height:0!important;min-width:0!important;width:100%}.cropper-canvas,.cropper-crop-box,.cropper-drag-box,.cropper-modal,.cropper-wrap-box{inset:0;position:absolute}.cropper-canvas,.cropper-wrap-box{overflow:hidden}.cropper-drag-box{background-color:#fff;opacity:0}.cropper-modal{background-color:#000;opacity:.5}.cropper-view-box{display:block;height:100%;outline:1px solid #39f;outline-color:#3399ffbf;overflow:hidden;width:100%}.cropper-dashed{border:0 dashed #eee;display:block;opacity:.5;position:absolute}.cropper-dashed.dashed-h{border-bottom-width:1px;border-top-width:1px;height:33.33333%;left:0;top:33.33333%;width:100%}.cropper-dashed.dashed-v{border-left-width:1px;border-right-width:1px;height:100%;left:33.33333%;top:0;width:33.33333%}.cropper-center{display:block;height:0;left:50%;opacity:.75;position:absolute;top:50%;width:0}.cropper-center:after,.cropper-center:before{background-color:#eee;content:\" \";display:block;position:absolute}.cropper-center:before{height:1px;left:-3px;top:0;width:7px}.cropper-center:after{height:7px;left:0;top:-3px;width:1px}.cropper-face,.cropper-line,.cropper-point{display:block;height:100%;opacity:.1;position:absolute;width:100%}.cropper-face{background-color:#fff;left:0;top:0}.cropper-line{background-color:#39f}.cropper-line.line-e{cursor:ew-resize;right:-3px;top:0;width:5px}.cropper-line.line-n{cursor:ns-resize;height:5px;left:0;top:-3px}.cropper-line.line-w{cursor:ew-resize;left:-3px;top:0;width:5px}.cropper-line.line-s{bottom:-3px;cursor:ns-resize;height:5px;left:0}.cropper-point{background-color:#39f;height:5px;opacity:.75;width:5px}.cropper-point.point-e{cursor:ew-resize;margin-top:-3px;right:-3px;top:50%}.cropper-point.point-n{cursor:ns-resize;left:50%;margin-left:-3px;top:-3px}.cropper-point.point-w{cursor:ew-resize;left:-3px;margin-top:-3px;top:50%}.cropper-point.point-s{bottom:-3px;cursor:s-resize;left:50%;margin-left:-3px}.cropper-point.point-ne{cursor:nesw-resize;right:-3px;top:-3px}.cropper-point.point-nw{cursor:nwse-resize;left:-3px;top:-3px}.cropper-point.point-sw{bottom:-3px;cursor:nesw-resize;left:-3px}.cropper-point.point-se{bottom:-3px;cursor:nwse-resize;height:20px;opacity:1;right:-3px;width:20px}@media (min-width:768px){.cropper-point.point-se{height:15px;width:15px}}@media (min-width:992px){.cropper-point.point-se{height:10px;width:10px}}@media (min-width:1200px){.cropper-point.point-se{height:5px;opacity:.75;width:5px}}.cropper-point.point-se:before{background-color:#39f;bottom:-50%;content:\" \";display:block;height:200%;opacity:0;position:absolute;right:-50%;width:200%}.cropper-invisible{opacity:0}.cropper-bg{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC)}.cropper-hide{display:block;height:0;position:absolute;width:0}.cropper-hidden{display:none!important}.cropper-move{cursor:move}.cropper-crop{cursor:crosshair}.cropper-disabled .cropper-drag-box,.cropper-disabled .cropper-face,.cropper-disabled .cropper-line,.cropper-disabled .cropper-point{cursor:not-allowed}.s-image-cropper{border-radius:0!important;display:flex;justify-content:space-between;flex-direction:column}.s-image-cropper .image-container{display:flex;align-items:center;justify-content:center;height:100%}.s-image-cropper img{max-width:100%;max-height:100%}.s-image-cropper .button-container{display:flex;justify-content:space-between;width:100%}.s-image-cropper .cropper-view-box{outline:2px dashed #fff}.s-image-cropper .cropper-line{opacity:0}.s-image-cropper .cropper-point{background-color:#fff;opacity:1;height:15px;width:15px;border-radius:50%}.s-image-cropper .cropper-point.point-e{right:-8.5px;top:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-n{top:-8.5px;left:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-w{left:-8.5px;top:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-s{bottom:-8.5px;left:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-ne{right:-8.5px;top:-8.5px}.s-image-cropper .cropper-point.point-nw{left:-8.5px;top:-8.5px}.s-image-cropper .cropper-point.point-sw{left:-8.5px;bottom:-8.5px}.s-image-cropper .cropper-point.point-se{right:-8.5px;bottom:-8.5px}.s-image-cropper--rounded .cropper-view-box,.s-image-cropper--rounded .cropper-face{border-radius:50%}.s-image-cropper--rounded .cropper-view-box{outline:1px dashed rgba(255,255,255,.3)}.s-image-cropper--rounded .cropper-view-box:after{border:2px dashed #fff;border-radius:50%;content:\"\";height:100%;left:0;position:absolute;top:0;width:100%}\n/*! Bundled license information:\n\ncropperjs/dist/cropper.min.css:\n  (*!\n   * Cropper.js v1.6.2\n   * https://fengyuanchen.github.io/cropperjs\n   *\n   * Copyright 2015-present Chen Fengyuan\n   * Released under the MIT license\n   *\n   * Date: 2024-04-21T07:43:02.731Z\n   *)\n*/\n"], dependencies: [{ kind: "component", type: i1.ButtonComponent, selector: "s-button", inputs: ["id", "label", "tooltip", "tooltipPosition", "iconClass", "rightIconClass", "caret", "styleClass", "baseZIndex", "disabled", "auxiliary", "type", "priority", "menuOptions", "size", "slide", "animation", "badge", "iconColor"], outputs: ["clicked"] }, { kind: "component", type: i2.EmptyStateComponent, selector: "s-empty-state", inputs: ["id", "title", "iconClass", "description", "showPrimaryAction", "showSecondaryAction", "primaryActionLabel", "secondaryActionLabel", "primaryModel"], outputs: ["primaryAction", "secondaryAction"] }, { kind: "component", type: i3.DialogComponent, selector: "s-dialog", inputs: ["header", "visible", "size", "contentClassName", "escapeOnEsc", "destroyClickOutside"], outputs: ["visibleChange"] }, { kind: "directive", type: i4.TemplateDirective, selector: "[sTemplate]", inputs: ["sTemplate"] }], encapsulation: i0.ViewEncapsulation.None });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ImageCropperComponent, decorators: [{
            type: Component,
            args: [{ selector: 's-image-cropper', encapsulation: ViewEncapsulation.None, template: "<div [id]=\"id\">\n    @let roundedClass = rounded ? 's-image-cropper--rounded' : '';\n    <s-dialog\n        size=\"lg\"\n        [contentClassName]=\"'s-image-cropper ' + roundedClass\"\n        [header]=\"headerSection ? '' : header\"\n        [(visible)]=\"visible\"\n        (visibleChange)=\"onModalVisibleChange($event!)\"\n        [draggable]=\"false\"\n    >\n        @if (headerSection) {\n            <ng-template sTemplate=\"header\">\n                <ng-content select=\"s-header\"></ng-content>\n            </ng-template>\n        }\n        @if (!imageSource) {\n            <s-empty-state\n                [id]=\"id + '-empty-state'\"\n                [title]=\"emptyStateTitle\"\n                [iconClass]=\"emptyStateIconClass\"\n                [primaryActionLabel]=\"emptyStateActionLabel\"\n                (primaryAction)=\"onChangeImage()\"\n            >\n            </s-empty-state>\n        }\n        <div\n            [attr.data-hidden]=\"!imageSource\"\n            class=\"image-container\"\n        >\n            <img\n                [id]=\"id + '-cropper'\"\n                #image\n                [src]=\"imageSource || ''\"\n                alt=\"cropped image\"\n            />\n        </div>\n        <ng-template sTemplate=\"footer\">\n            @if (!footerSection) {\n                <div class=\"button-container\">\n                    @if (allowCancel) {\n                        <s-button\n                            [id]=\"id + '-cancel-button'\"\n                            type=\"button\"\n                            priority=\"link\"\n                            [label]=\"cancelLabel\"\n                            (clicked)=\"onCancel()\"\n                        >\n                        </s-button>\n                    }\n\n                    <div>\n                        @if (imageSource && allowRemove) {\n                            <s-button\n                                [id]=\"id + '-remove-button'\"\n                                type=\"button\"\n                                priority=\"secondary\"\n                                [label]=\"removeLabel\"\n                                (clicked)=\"onRemoveImage()\"\n                            >\n                            </s-button>\n                        }\n                        @if (imageSource && allowSelectAnother) {\n                            <s-button\n                                [id]=\"id + '-select-another-button'\"\n                                type=\"button\"\n                                priority=\"secondary\"\n                                [label]=\"selectAnotherLabel\"\n                                (clicked)=\"onChangeImage()\"\n                            >\n                            </s-button>\n                        }\n                        <s-button\n                            [id]=\"id + '-crop-button'\"\n                            type=\"button\"\n                            [label]=\"cropLabel\"\n                            (clicked)=\"onCropImage()\"\n                        >\n                        </s-button>\n                    </div>\n                </div>\n            }\n            @if (footerSection) {\n                <ng-content select=\"s-footer\"> </ng-content>\n            }\n        </ng-template>\n    </s-dialog>\n</div>\n", styles: [".cropper-container{-webkit-touch-callout:none;direction:ltr;font-size:0;line-height:0;position:relative;-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.cropper-container img{backface-visibility:hidden;display:block;height:100%;image-orientation:0deg;max-height:none!important;max-width:none!important;min-height:0!important;min-width:0!important;width:100%}.cropper-canvas,.cropper-crop-box,.cropper-drag-box,.cropper-modal,.cropper-wrap-box{inset:0;position:absolute}.cropper-canvas,.cropper-wrap-box{overflow:hidden}.cropper-drag-box{background-color:#fff;opacity:0}.cropper-modal{background-color:#000;opacity:.5}.cropper-view-box{display:block;height:100%;outline:1px solid #39f;outline-color:#3399ffbf;overflow:hidden;width:100%}.cropper-dashed{border:0 dashed #eee;display:block;opacity:.5;position:absolute}.cropper-dashed.dashed-h{border-bottom-width:1px;border-top-width:1px;height:33.33333%;left:0;top:33.33333%;width:100%}.cropper-dashed.dashed-v{border-left-width:1px;border-right-width:1px;height:100%;left:33.33333%;top:0;width:33.33333%}.cropper-center{display:block;height:0;left:50%;opacity:.75;position:absolute;top:50%;width:0}.cropper-center:after,.cropper-center:before{background-color:#eee;content:\" \";display:block;position:absolute}.cropper-center:before{height:1px;left:-3px;top:0;width:7px}.cropper-center:after{height:7px;left:0;top:-3px;width:1px}.cropper-face,.cropper-line,.cropper-point{display:block;height:100%;opacity:.1;position:absolute;width:100%}.cropper-face{background-color:#fff;left:0;top:0}.cropper-line{background-color:#39f}.cropper-line.line-e{cursor:ew-resize;right:-3px;top:0;width:5px}.cropper-line.line-n{cursor:ns-resize;height:5px;left:0;top:-3px}.cropper-line.line-w{cursor:ew-resize;left:-3px;top:0;width:5px}.cropper-line.line-s{bottom:-3px;cursor:ns-resize;height:5px;left:0}.cropper-point{background-color:#39f;height:5px;opacity:.75;width:5px}.cropper-point.point-e{cursor:ew-resize;margin-top:-3px;right:-3px;top:50%}.cropper-point.point-n{cursor:ns-resize;left:50%;margin-left:-3px;top:-3px}.cropper-point.point-w{cursor:ew-resize;left:-3px;margin-top:-3px;top:50%}.cropper-point.point-s{bottom:-3px;cursor:s-resize;left:50%;margin-left:-3px}.cropper-point.point-ne{cursor:nesw-resize;right:-3px;top:-3px}.cropper-point.point-nw{cursor:nwse-resize;left:-3px;top:-3px}.cropper-point.point-sw{bottom:-3px;cursor:nesw-resize;left:-3px}.cropper-point.point-se{bottom:-3px;cursor:nwse-resize;height:20px;opacity:1;right:-3px;width:20px}@media (min-width:768px){.cropper-point.point-se{height:15px;width:15px}}@media (min-width:992px){.cropper-point.point-se{height:10px;width:10px}}@media (min-width:1200px){.cropper-point.point-se{height:5px;opacity:.75;width:5px}}.cropper-point.point-se:before{background-color:#39f;bottom:-50%;content:\" \";display:block;height:200%;opacity:0;position:absolute;right:-50%;width:200%}.cropper-invisible{opacity:0}.cropper-bg{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC)}.cropper-hide{display:block;height:0;position:absolute;width:0}.cropper-hidden{display:none!important}.cropper-move{cursor:move}.cropper-crop{cursor:crosshair}.cropper-disabled .cropper-drag-box,.cropper-disabled .cropper-face,.cropper-disabled .cropper-line,.cropper-disabled .cropper-point{cursor:not-allowed}.s-image-cropper{border-radius:0!important;display:flex;justify-content:space-between;flex-direction:column}.s-image-cropper .image-container{display:flex;align-items:center;justify-content:center;height:100%}.s-image-cropper img{max-width:100%;max-height:100%}.s-image-cropper .button-container{display:flex;justify-content:space-between;width:100%}.s-image-cropper .cropper-view-box{outline:2px dashed #fff}.s-image-cropper .cropper-line{opacity:0}.s-image-cropper .cropper-point{background-color:#fff;opacity:1;height:15px;width:15px;border-radius:50%}.s-image-cropper .cropper-point.point-e{right:-8.5px;top:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-n{top:-8.5px;left:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-w{left:-8.5px;top:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-s{bottom:-8.5px;left:calc(50% - 4.5px)}.s-image-cropper .cropper-point.point-ne{right:-8.5px;top:-8.5px}.s-image-cropper .cropper-point.point-nw{left:-8.5px;top:-8.5px}.s-image-cropper .cropper-point.point-sw{left:-8.5px;bottom:-8.5px}.s-image-cropper .cropper-point.point-se{right:-8.5px;bottom:-8.5px}.s-image-cropper--rounded .cropper-view-box,.s-image-cropper--rounded .cropper-face{border-radius:50%}.s-image-cropper--rounded .cropper-view-box{outline:1px dashed rgba(255,255,255,.3)}.s-image-cropper--rounded .cropper-view-box:after{border:2px dashed #fff;border-radius:50%;content:\"\";height:100%;left:0;position:absolute;top:0;width:100%}\n/*! Bundled license information:\n\ncropperjs/dist/cropper.min.css:\n  (*!\n   * Cropper.js v1.6.2\n   * https://fengyuanchen.github.io/cropperjs\n   *\n   * Copyright 2015-present Chen Fengyuan\n   * Released under the MIT license\n   *\n   * Date: 2024-04-21T07:43:02.731Z\n   *)\n*/\n"] }]
        }], propDecorators: { id: [{
                type: Input
            }], visible: [{
                type: Input
            }], header: [{
                type: Input
            }], cropLabel: [{
                type: Input
            }], selectAnotherLabel: [{
                type: Input
            }], removeLabel: [{
                type: Input
            }], cancelLabel: [{
                type: Input
            }], emptyStateTitle: [{
                type: Input
            }], emptyStateActionLabel: [{
                type: Input
            }], emptyStateIconClass: [{
                type: Input
            }], aspectRatio: [{
                type: Input
            }], rounded: [{
                type: Input
            }], allowSelectAnother: [{
                type: Input
            }], allowRemove: [{
                type: Input
            }], allowCancel: [{
                type: Input
            }], imageSource: [{
                type: Input
            }], visibleChange: [{
                type: Output
            }], changeImage: [{
                type: Output
            }], croppedImage: [{
                type: Output
            }], croppedCanvas: [{
                type: Output
            }], removedImage: [{
                type: Output
            }], cancel: [{
                type: Output
            }], image: [{
                type: ViewChild,
                args: ['image', { static: true }]
            }], headerSection: [{
                type: ContentChild,
                args: [HeaderComponent, { static: true }]
            }], footerSection: [{
                type: ContentChild,
                args: [FooterComponent, { static: true }]
            }] } });
//# sourceMappingURL=data:application/json;base64, 