@datarailsshared/datarailsshared 1.5.298 → 1.5.300

package/fesm2022/datarailsshared-datarailsshared.mjs

@@ -3160,6 +3160,7 @@ var LinkTheme;
 (function (LinkTheme) {
     LinkTheme["DEFAULT"] = "DEFAULT";
     LinkTheme["DEFAULT_UNDERLINE"] = "DEFAULT_UNDERLINE";
+    LinkTheme["GRAY_UNDERLINE"] = "GRAY_UNDERLINE";
 })(LinkTheme || (LinkTheme = {}));
 const DEFAULT_LINK_FONT_SIZE = '14px';
 const DEFAULT_LINK_FONT_WEIGHT = 400;
@@ -3170,11 +3171,11 @@ class DrLinkComponent {
         this.theme = LinkTheme.DEFAULT;
     }
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrLinkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DrLinkComponent, selector: "dr-link", inputs: { link: "link", fontSize: "fontSize", fontWeight: "fontWeight", theme: "theme" }, ngImport: i0, template: "<a class=\"dr-link\"\n   [class]=\"theme\"\n   [href]=\"link\"\n   [style.font-weight]=\"fontWeight\"\n   [style.font-size]=\"fontSize\">\n    <ng-content></ng-content>\n</a>\n", styles: [".dr-link{font-family:Poppins,sans-serif;font-style:normal;font-size:14px;font-weight:400;line-height:22px;color:#4646ce}.dr-link.DEFAULT{text-decoration:none!important}.dr-link.DEFAULT_UNDERLINE{text-decoration:underline!important}\n"] }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DrLinkComponent, selector: "dr-link", inputs: { link: "link", fontSize: "fontSize", fontWeight: "fontWeight", theme: "theme" }, ngImport: i0, template: "<a class=\"dr-link\"\n   [class]=\"theme\"\n   [href]=\"link\"\n   [style.font-weight]=\"fontWeight\"\n   [style.font-size]=\"fontSize\">\n    <ng-content></ng-content>\n</a>\n", styles: [".dr-link{font-family:Poppins,sans-serif;font-style:normal;font-size:14px;font-weight:400;line-height:22px;color:#4646ce}.dr-link.DEFAULT{text-decoration:none!important}.dr-link.DEFAULT_UNDERLINE{text-decoration:underline!important}.dr-link.GRAY_UNDERLINE{color:#6d6e6f;text-decoration:underline!important}\n"] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrLinkComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'dr-link', template: "<a class=\"dr-link\"\n   [class]=\"theme\"\n   [href]=\"link\"\n   [style.font-weight]=\"fontWeight\"\n   [style.font-size]=\"fontSize\">\n    <ng-content></ng-content>\n</a>\n", styles: [".dr-link{font-family:Poppins,sans-serif;font-style:normal;font-size:14px;font-weight:400;line-height:22px;color:#4646ce}.dr-link.DEFAULT{text-decoration:none!important}.dr-link.DEFAULT_UNDERLINE{text-decoration:underline!important}\n"] }]
+            args: [{ selector: 'dr-link', template: "<a class=\"dr-link\"\n   [class]=\"theme\"\n   [href]=\"link\"\n   [style.font-weight]=\"fontWeight\"\n   [style.font-size]=\"fontSize\">\n    <ng-content></ng-content>\n</a>\n", styles: [".dr-link{font-family:Poppins,sans-serif;font-style:normal;font-size:14px;font-weight:400;line-height:22px;color:#4646ce}.dr-link.DEFAULT{text-decoration:none!important}.dr-link.DEFAULT_UNDERLINE{text-decoration:underline!important}.dr-link.GRAY_UNDERLINE{color:#6d6e6f;text-decoration:underline!important}\n"] }]
         }], propDecorators: { link: [{
                 type: Input,
                 args: [{ required: true }]
@@ -8365,6 +8366,221 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
                 }]
         }] });
 
+class DrSliderComponent {
+    constructor() {
+        this.max = 100;
+        this.min = 1;
+        this.step = 1;
+        this.rangeValue = 1;
+        this.onChange = () => {
+        };
+        this.onTouched = () => {
+        };
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        this.disabled = isDisabled;
+    }
+    writeValue(value) {
+        this.rangeValue = value;
+    }
+    setValue(event) {
+        this.writeValue(event.target.value);
+        this.onChange(this.rangeValue);
+        this.onTouched();
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrSliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DrSliderComponent, isStandalone: true, selector: "dr-slider", inputs: { disabled: "disabled", max: "max", min: "min", step: "step", rangeValue: "rangeValue" }, providers: [
+            { provide: NG_VALUE_ACCESSOR, useExisting: DrSliderComponent, multi: true }
+        ], ngImport: i0, template: "<input type=\"range\"\n       [min]=\"min\"\n       [max]=\"max\"\n       [step]=\"step\"\n       [disabled]=\"disabled\"\n       [value]=\"rangeValue\"\n       (change)=\"setValue($event)\"\n/>\n", styles: ["input[type=range]{appearance:none;background:transparent;cursor:pointer}input[type=range]:focus{outline:none}input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:4px;background-color:#dfe0e3}input[type=range]::-webkit-slider-thumb{appearance:none;margin-top:-5px;height:14px;width:14px;border-radius:14px;background-color:#4646ce}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrSliderComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'dr-slider', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+                        { provide: NG_VALUE_ACCESSOR, useExisting: DrSliderComponent, multi: true }
+                    ], standalone: true, template: "<input type=\"range\"\n       [min]=\"min\"\n       [max]=\"max\"\n       [step]=\"step\"\n       [disabled]=\"disabled\"\n       [value]=\"rangeValue\"\n       (change)=\"setValue($event)\"\n/>\n", styles: ["input[type=range]{appearance:none;background:transparent;cursor:pointer}input[type=range]:focus{outline:none}input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:4px;background-color:#dfe0e3}input[type=range]::-webkit-slider-thumb{appearance:none;margin-top:-5px;height:14px;width:14px;border-radius:14px;background-color:#4646ce}\n"] }]
+        }], propDecorators: { disabled: [{
+                type: Input
+            }], max: [{
+                type: Input
+            }], min: [{
+                type: Input
+            }], step: [{
+                type: Input
+            }], rangeValue: [{
+                type: Input
+            }] } });
+
+var CROP_IMAGE_MODES;
+(function (CROP_IMAGE_MODES) {
+    CROP_IMAGE_MODES["SQUARE"] = "square";
+    CROP_IMAGE_MODES["RECTANGLE"] = "rectangle";
+})(CROP_IMAGE_MODES || (CROP_IMAGE_MODES = {}));
+
+class DrImageCropperCanvasService {
+    constructor() {
+        this.ALPHA_FOR_SHADOW = 0.2;
+        // this param means that a side of a white square is half of a side of a canvas
+        this.CROP_AREA_PROPORTION = 2;
+        this.RECTANGULAR_SHADOW_WIDTH = 30;
+        this.RECTANGULAR_SHADOW_HEIGHT = 70;
+    }
+    drawShape(canvasSize, cropMode, zoomLevel, htmlImageElement) {
+        this.clearCanvas(canvasSize);
+        this.drawImageByZoom(canvasSize, zoomLevel, htmlImageElement);
+        this.drawShadow(cropMode, canvasSize);
+    }
+    getCoordinates(cropMode, canvasSize) {
+        return cropMode === CROP_IMAGE_MODES.SQUARE
+            ? this.getCoordinatesForSquare(canvasSize)
+            : this.getCoordinatesForRectangle(canvasSize);
+    }
+    getCoordinatesForSquare(canvasSize) {
+        const shadowLength = canvasSize / (this.CROP_AREA_PROPORTION * 2);
+        const bottomPosition = canvasSize - shadowLength;
+        return [shadowLength, shadowLength, bottomPosition, bottomPosition].join(',');
+    }
+    getCoordinatesForRectangle(canvasSize) {
+        return [
+            this.RECTANGULAR_SHADOW_WIDTH,
+            this.RECTANGULAR_SHADOW_HEIGHT,
+            canvasSize - this.RECTANGULAR_SHADOW_WIDTH,
+            canvasSize - this.RECTANGULAR_SHADOW_HEIGHT
+        ].join(',');
+    }
+    drawShadow(cropMode, canvasSize) {
+        this.ctx.globalAlpha = this.ALPHA_FOR_SHADOW;
+        this.ctx.fillStyle = 'black';
+        if (cropMode === CROP_IMAGE_MODES.SQUARE) {
+            this.drawSquareShadow(canvasSize);
+        }
+        else if (cropMode === CROP_IMAGE_MODES.RECTANGLE) {
+            this.drawRectangularShadow(canvasSize);
+        }
+        this.ctx.globalAlpha = 1;
+    }
+    drawSquareShadow(canvasSize) {
+        const shadowLength = canvasSize / (this.CROP_AREA_PROPORTION * 2);
+        this.ctx.fillRect(0, 0, shadowLength, canvasSize);
+        this.ctx.fillRect(canvasSize - shadowLength, 0, shadowLength, canvasSize);
+        this.ctx.fillRect(shadowLength, 0, 2 * shadowLength, shadowLength);
+        this.ctx.fillRect(shadowLength, canvasSize - shadowLength, 2 * shadowLength, shadowLength);
+    }
+    drawRectangularShadow(canvasSize) {
+        this.ctx.fillRect(0, 0, this.RECTANGULAR_SHADOW_WIDTH, canvasSize);
+        this.ctx.fillRect(canvasSize - this.RECTANGULAR_SHADOW_WIDTH, 0, this.RECTANGULAR_SHADOW_WIDTH, canvasSize);
+        this.ctx.fillRect(this.RECTANGULAR_SHADOW_WIDTH, 0, canvasSize - 2 * this.RECTANGULAR_SHADOW_WIDTH, this.RECTANGULAR_SHADOW_HEIGHT);
+        this.ctx.fillRect(this.RECTANGULAR_SHADOW_WIDTH, canvasSize - this.RECTANGULAR_SHADOW_HEIGHT, canvasSize - 2 * this.RECTANGULAR_SHADOW_WIDTH, this.RECTANGULAR_SHADOW_HEIGHT);
+    }
+    drawImageByZoom(canvasSize, zoomLevel, htmlImageElement) {
+        const maxImageDimension = Math.max(htmlImageElement.width, htmlImageElement.height);
+        const proportion = canvasSize / (this.CROP_AREA_PROPORTION * maxImageDimension);
+        const suitableWidth = htmlImageElement.width * proportion * zoomLevel;
+        const suitableHeight = htmlImageElement.height * proportion * zoomLevel;
+        const rectX = (canvasSize - suitableWidth) / 2;
+        const rectY = (canvasSize - suitableHeight) / 2;
+        this.ctx.drawImage(htmlImageElement, rectX, rectY, suitableWidth, suitableHeight);
+    }
+    clearCanvas(canvasSize) {
+        this.ctx.fillStyle = 'white';
+        this.ctx.fillRect(0, 0, canvasSize, canvasSize);
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrImageCropperCanvasService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrImageCropperCanvasService }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrImageCropperCanvasService, decorators: [{
+            type: Injectable
+        }] });
+
+class DrImageCropperComponent {
+    constructor(canvasService) {
+        this.canvasService = canvasService;
+        this.maxZoom = 10;
+        this.minZoom = 0.5;
+        this.zoomStep = 0.1;
+        this.zoomLevel = 1;
+        this.cropChanged = new EventEmitter();
+        this.clearClicked = new EventEmitter();
+        this.cropMode = CROP_IMAGE_MODES.SQUARE;
+        this.CROP_IMAGE_MODES = CROP_IMAGE_MODES;
+    }
+    ngOnChanges(changes) {
+        if (changes.imageFile && this.imageFile) {
+            this.readImageFile();
+        }
+    }
+    ngAfterViewInit() {
+        this.canvasService.ctx = this.canvasElement.nativeElement.getContext('2d');
+    }
+    drawImage(newZoomEvent) {
+        if (newZoomEvent !== undefined) {
+            this.zoomLevel = newZoomEvent.target.value;
+        }
+        this.onCropModeUpdated();
+    }
+    onCropModeUpdated(cropMode) {
+        if (cropMode) {
+            this.cropMode = cropMode;
+        }
+        this.canvasService.drawShape(this.cropperSize, this.cropMode, this.zoomLevel, this.htmlImageElement);
+        const coordinates = this.canvasService.getCoordinates(this.cropMode, this.cropperSize);
+        this.canvasElement.nativeElement.toBlob((blob) => {
+            const file = new File([blob], this.imageFile.name, { type: this.imageFile.type, lastModified: Date.now() });
+            this.cropChanged.emit({ file, coordinates, cropMode: this.cropMode });
+        }, this.imageFile.type);
+    }
+    readImageFile() {
+        const reader = new FileReader();
+        reader.onload = () => {
+            this.htmlImageElement = new Image();
+            this.htmlImageElement.src = this.getImagesStringSrc(reader);
+            this.htmlImageElement.onload = () => {
+                this.canvasElement.nativeElement.width = this.canvasElement.nativeElement.height = this.cropperSize;
+                this.drawImage();
+            };
+        };
+        reader.readAsDataURL(this.imageFile);
+    }
+    getImagesStringSrc(reader) {
+        if (typeof reader.result === 'string')
+            return reader.result;
+        const decoder = new TextDecoder();
+        return decoder.decode(reader.result);
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrImageCropperComponent, deps: [{ token: DrImageCropperCanvasService }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DrImageCropperComponent, isStandalone: true, selector: "dr-image-cropper", inputs: { cropperSize: "cropperSize", imageFile: "imageFile", maxZoom: "maxZoom", minZoom: "minZoom", zoomStep: "zoomStep", zoomLevel: "zoomLevel" }, outputs: { cropChanged: "cropChanged", clearClicked: "clearClicked" }, providers: [DrImageCropperCanvasService], viewQueries: [{ propertyName: "canvasElement", first: true, predicate: ["imageCanvas"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"crop-mode-btns-container\">\n    <dr-button theme=\"ghost\"\n               [class.active-mode]=\"cropMode === CROP_IMAGE_MODES.SQUARE\"\n               (click)=\"onCropModeUpdated(CROP_IMAGE_MODES.SQUARE)\">\n        <div class=\"mode-btn\">\n            <div class=\"mode-btn__square-icon\"></div>\n            Square\n        </div>\n    </dr-button>\n    <dr-button theme=\"ghost\"\n               [class.active-mode]=\"cropMode === CROP_IMAGE_MODES.RECTANGLE\"\n               (click)=\"onCropModeUpdated(CROP_IMAGE_MODES.RECTANGLE)\">\n        <div class=\"mode-btn\">\n            <div class=\"mode-btn__rectangle-icon\"></div>\n            Rectangle\n        </div>\n    </dr-button>\n</div>\n\n<div class=\"image-cropper\">\n    <canvas #imageCanvas></canvas>\n</div>\n<dr-slider\n        [(ngModel)]=\"zoomLevel\"\n        [max]=\"maxZoom\"\n        [min]=\"minZoom\"\n        [step]=\"zoomStep\"\n        [style.width]=\"cropperSize + 'px'\"\n        class=\"image-crop-slider\"\n        (input)=\"drawImage($event)\">\n</dr-slider>\n<dr-button [theme]=\"'ghost'\" (click)=\"clearClicked.emit()\" class=\"try-another-btn\">\n    Try another image\n</dr-button>\n", styles: [":host{display:flex;flex-direction:column}:host .crop-mode-btns-container{display:flex;justify-content:center;margin-bottom:16px}:host .crop-mode-btns-container ::ng-deep dr-button.active-mode>button{background:#eaeaff}:host .crop-mode-btns-container ::ng-deep dr-button>button{height:56px;width:80px}:host .crop-mode-btns-container dr-button:not(:first-child){margin-left:8px}:host .crop-mode-btns-container .mode-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;color:#333;height:56px;width:80px}:host .crop-mode-btns-container .mode-btn__rectangle-icon{height:8px;width:24px;margin-top:4px;margin-bottom:4px}:host .crop-mode-btns-container .mode-btn__square-icon{width:16px;height:16px}:host .crop-mode-btns-container .mode-btn__rectangle-icon,:host .crop-mode-btns-container .mode-btn__square-icon{border:1px solid #333333}:host .image-cropper{overflow:hidden;position:relative}:host .image-cropper__shadow{position:absolute}:host .image-crop-slider{margin-top:8px}:host .try-another-btn{display:flex;justify-content:center;margin-top:8px}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: DrSliderComponent, selector: "dr-slider", inputs: ["disabled", "max", "min", "step", "rangeValue"] }, { kind: "ngmodule", type: DrInputsModule }, { kind: "component", type: DrButtonComponent, selector: "dr-button", inputs: ["theme", "icon", "iconColor", "iconSize", "iconAfter", "iconAfterColor", "iconAfterSize", "disabled", "isLoading", "isActive"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrImageCropperComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'dr-image-cropper', changeDetection: ChangeDetectionStrategy.OnPush, imports: [FormsModule, DrSliderComponent, DrInputsModule], standalone: true, providers: [DrImageCropperCanvasService], template: "<div class=\"crop-mode-btns-container\">\n    <dr-button theme=\"ghost\"\n               [class.active-mode]=\"cropMode === CROP_IMAGE_MODES.SQUARE\"\n               (click)=\"onCropModeUpdated(CROP_IMAGE_MODES.SQUARE)\">\n        <div class=\"mode-btn\">\n            <div class=\"mode-btn__square-icon\"></div>\n            Square\n        </div>\n    </dr-button>\n    <dr-button theme=\"ghost\"\n               [class.active-mode]=\"cropMode === CROP_IMAGE_MODES.RECTANGLE\"\n               (click)=\"onCropModeUpdated(CROP_IMAGE_MODES.RECTANGLE)\">\n        <div class=\"mode-btn\">\n            <div class=\"mode-btn__rectangle-icon\"></div>\n            Rectangle\n        </div>\n    </dr-button>\n</div>\n\n<div class=\"image-cropper\">\n    <canvas #imageCanvas></canvas>\n</div>\n<dr-slider\n        [(ngModel)]=\"zoomLevel\"\n        [max]=\"maxZoom\"\n        [min]=\"minZoom\"\n        [step]=\"zoomStep\"\n        [style.width]=\"cropperSize + 'px'\"\n        class=\"image-crop-slider\"\n        (input)=\"drawImage($event)\">\n</dr-slider>\n<dr-button [theme]=\"'ghost'\" (click)=\"clearClicked.emit()\" class=\"try-another-btn\">\n    Try another image\n</dr-button>\n", styles: [":host{display:flex;flex-direction:column}:host .crop-mode-btns-container{display:flex;justify-content:center;margin-bottom:16px}:host .crop-mode-btns-container ::ng-deep dr-button.active-mode>button{background:#eaeaff}:host .crop-mode-btns-container ::ng-deep dr-button>button{height:56px;width:80px}:host .crop-mode-btns-container dr-button:not(:first-child){margin-left:8px}:host .crop-mode-btns-container .mode-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;color:#333;height:56px;width:80px}:host .crop-mode-btns-container .mode-btn__rectangle-icon{height:8px;width:24px;margin-top:4px;margin-bottom:4px}:host .crop-mode-btns-container .mode-btn__square-icon{width:16px;height:16px}:host .crop-mode-btns-container .mode-btn__rectangle-icon,:host .crop-mode-btns-container .mode-btn__square-icon{border:1px solid #333333}:host .image-cropper{overflow:hidden;position:relative}:host .image-cropper__shadow{position:absolute}:host .image-crop-slider{margin-top:8px}:host .try-another-btn{display:flex;justify-content:center;margin-top:8px}\n"] }]
+        }], ctorParameters: function () { return [{ type: DrImageCropperCanvasService }]; }, propDecorators: { cropperSize: [{
+                type: Input,
+                args: [{ required: true }]
+            }], imageFile: [{
+                type: Input,
+                args: [{ required: true }]
+            }], maxZoom: [{
+                type: Input
+            }], minZoom: [{
+                type: Input
+            }], zoomStep: [{
+                type: Input
+            }], zoomLevel: [{
+                type: Input
+            }], cropChanged: [{
+                type: Output
+            }], clearClicked: [{
+                type: Output
+            }], canvasElement: [{
+                type: ViewChild,
+                args: ['imageCanvas', { static: true }]
+            }] } });
+
 class DrDropdownModule {
     /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrDropdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
     /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: DrDropdownModule, declarations: [DrDropdownDirective,
@@ -8856,5 +9072,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AnyTagComponent, BadgeStatus, CHAT_MESSAGE_TYPE, CalendarView, ChatMessage, ChatRole, CheckboxComponent, ClickOutsideDirective, ClickOutsideModule, CodeEditorHintWrapperComponent, CustomDateFormat, DEFAULT_LINK_FONT_SIZE, DEFAULT_LINK_FONT_WEIGHT, DIALOG_BUTTON_LABEL, DIALOG_FIELD_TYPE, DIALOG_SIZE, DateFromats, DatePickerPeriodPosition, DateTagComponent, DateTagModule, DateTags, DayTagComponent, DefaultToastrComponent, DefaultTreeviewEventParser, DefaultTreeviewI18n, DialogModalWrapperComponent, DialogService, DialogWrapperComponent, DownlineTreeviewEventParser, DrAccordionComponent, DrAccordionItemBodyComponent, DrAccordionItemComponent, DrAccordionItemHeaderComponent, DrAccordionModule, DrAlertComponent, DrAlertModule, DrAlertTheme, DrAvatarComponent, DrAvatarModule, DrAvatarPipe, DrAvatarService, DrBadgeStatusComponent, DrBadgeStatusModule, DrButtonComponent, DrChatAlertComponent, DrChatComponent, DrChatCustomMessageDirective, DrChatFormComponent, DrChatMessageComponent, DrChatMessageFileComponent, DrChatMessageTextComponent, DrChatModule, DrChatSuggestionsComponent, DrCodeEditorComponent, DrCodeEditorModule, DrCodemirrorComponent, DrDatePickerComponent, DrDatePickerCustomHeaderComponent, DrDatePickerFormatDirective, DrDatePickerRangeComponent, DrDatePickerWithTimeframeComponent, DrDetailsListComponent, DrDetailsListModule, DrDialogModule, DrDotFlashingComponent, DrDropdownComponent, DrDropdownDirective, DrDropdownItemShowPipe, DrDropdownModule, DrDropdownPositionDirective, DrDropdownService, DrErrorComponent, DrErrorModule, DrInputComponent, DrInputsModule, DrLayoutBodyComponent, DrLayoutComponent, DrLayoutHeaderComponent, DrLayoutModule, DrLinkComponent, DrModelDebounceChangeDirective, DrPopoverAlignmentDimension, DrPopoverComponent, DrPopoverDirective, DrPopoverModule, DrPopoverRef, DrPopoverService, DrScenarioConfigurationComponent, DrScenarioModule, DrScenarioTagConfigurationComponent, DrSelectAddItemComponent, DrSelectComponent, DrSharedUtils, DrShowTimeframePipe, DrSpinnerComponent, DrSpinnerDirective, DrSpinnerModule, DrStepperModule, DrTabComponent, DrTabsComponent, DrTabsModule, DrTagComponent, DrTagModule, DrTagsConstructorComponent, DrTagsConstructorModule, DrToastrModule, DrToastrService, DrToggleButtonComponent, DrToggleComponent, DrTooltipDirective, DrTooltipModule, FeedbackSentiment, ForecastTagComponent, ICodeEditorHintIcon, IMAGE_TYPES, LinkTheme, ListTagComponent, ListTagModule, MonthTagComponent, OrderDownlineTreeviewEventParser, QuarterTagComponent, RadioButtonComponent, RadioGroupComponent, Scenario, ScenarioService, StepperComponent, TagTypes, TagsConfigSubType, TagsConstructorService, TimeframeOption, ToastrStatus, ToastrStatusIcon, ToggleButtonMode, TooltipComponent, TooltipDefaultComponent, TooltipInfoComponent, TooltipInfoSimpleComponent, TooltipNoBodyComponent, TooltipPosition, TooltipProcessDefaultComponent, TooltipTheme, TreeviewComponent, TreeviewConfig, TreeviewEventParser, TreeviewHelper, TreeviewI18n, TreeviewItem, TreeviewModule, TreeviewPipe, WeekTagComponent, YearTagComponent };
+export { AnyTagComponent, BadgeStatus, CHAT_MESSAGE_TYPE, CROP_IMAGE_MODES, CalendarView, ChatMessage, ChatRole, CheckboxComponent, ClickOutsideDirective, ClickOutsideModule, CodeEditorHintWrapperComponent, CustomDateFormat, DEFAULT_LINK_FONT_SIZE, DEFAULT_LINK_FONT_WEIGHT, DIALOG_BUTTON_LABEL, DIALOG_FIELD_TYPE, DIALOG_SIZE, DateFromats, DatePickerPeriodPosition, DateTagComponent, DateTagModule, DateTags, DayTagComponent, DefaultToastrComponent, DefaultTreeviewEventParser, DefaultTreeviewI18n, DialogModalWrapperComponent, DialogService, DialogWrapperComponent, DownlineTreeviewEventParser, DrAccordionComponent, DrAccordionItemBodyComponent, DrAccordionItemComponent, DrAccordionItemHeaderComponent, DrAccordionModule, DrAlertComponent, DrAlertModule, DrAlertTheme, DrAvatarComponent, DrAvatarModule, DrAvatarPipe, DrAvatarService, DrBadgeStatusComponent, DrBadgeStatusModule, DrButtonComponent, DrChatAlertComponent, DrChatComponent, DrChatCustomMessageDirective, DrChatFormComponent, DrChatMessageComponent, DrChatMessageFileComponent, DrChatMessageTextComponent, DrChatModule, DrChatSuggestionsComponent, DrCodeEditorComponent, DrCodeEditorModule, DrCodemirrorComponent, DrDatePickerComponent, DrDatePickerCustomHeaderComponent, DrDatePickerFormatDirective, DrDatePickerRangeComponent, DrDatePickerWithTimeframeComponent, DrDetailsListComponent, DrDetailsListModule, DrDialogModule, DrDotFlashingComponent, DrDropdownComponent, DrDropdownDirective, DrDropdownItemShowPipe, DrDropdownModule, DrDropdownPositionDirective, DrDropdownService, DrErrorComponent, DrErrorModule, DrImageCropperComponent, DrInputComponent, DrInputsModule, DrLayoutBodyComponent, DrLayoutComponent, DrLayoutHeaderComponent, DrLayoutModule, DrLinkComponent, DrModelDebounceChangeDirective, DrPopoverAlignmentDimension, DrPopoverComponent, DrPopoverDirective, DrPopoverModule, DrPopoverRef, DrPopoverService, DrScenarioConfigurationComponent, DrScenarioModule, DrScenarioTagConfigurationComponent, DrSelectAddItemComponent, DrSelectComponent, DrSharedUtils, DrShowTimeframePipe, DrSliderComponent, DrSpinnerComponent, DrSpinnerDirective, DrSpinnerModule, DrStepperModule, DrTabComponent, DrTabsComponent, DrTabsModule, DrTagComponent, DrTagModule, DrTagsConstructorComponent, DrTagsConstructorModule, DrToastrModule, DrToastrService, DrToggleButtonComponent, DrToggleComponent, DrTooltipDirective, DrTooltipModule, FeedbackSentiment, ForecastTagComponent, ICodeEditorHintIcon, IMAGE_TYPES, LinkTheme, ListTagComponent, ListTagModule, MonthTagComponent, OrderDownlineTreeviewEventParser, QuarterTagComponent, RadioButtonComponent, RadioGroupComponent, Scenario, ScenarioService, StepperComponent, TagTypes, TagsConfigSubType, TagsConstructorService, TimeframeOption, ToastrStatus, ToastrStatusIcon, ToggleButtonMode, TooltipComponent, TooltipDefaultComponent, TooltipInfoComponent, TooltipInfoSimpleComponent, TooltipNoBodyComponent, TooltipPosition, TooltipProcessDefaultComponent, TooltipTheme, TreeviewComponent, TreeviewConfig, TreeviewEventParser, TreeviewHelper, TreeviewI18n, TreeviewItem, TreeviewModule, TreeviewPipe, WeekTagComponent, YearTagComponent };
 //# sourceMappingURL=datarailsshared-datarailsshared.mjs.map