@datarailsshared/datarailsshared 1.5.298 → 1.5.299
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/datarailsshared-datarailsshared-1.5.299.tgz +0 -0
- package/esm2022/lib/dr-inputs/dr-slider/dr-slider.component.mjs +53 -0
- package/esm2022/lib/image-cropper/dr-image-cropper-canvas.service.mjs +78 -0
- package/esm2022/lib/image-cropper/dr-image-cropper.component.mjs +94 -0
- package/esm2022/lib/image-cropper/dr-image-cropper.types.mjs +6 -0
- package/esm2022/public-api.mjs +4 -1
- package/fesm2022/datarailsshared-datarailsshared.mjs +216 -1
- package/fesm2022/datarailsshared-datarailsshared.mjs.map +1 -1
- package/lib/dr-inputs/dr-slider/dr-slider.component.d.ts +18 -0
- package/lib/image-cropper/dr-image-cropper-canvas.service.d.ts +20 -0
- package/lib/image-cropper/dr-image-cropper.component.d.ts +28 -0
- package/lib/image-cropper/dr-image-cropper.types.d.ts +9 -0
- package/package.json +1 -1
- package/public-api.d.ts +3 -0
- package/datarailsshared-datarailsshared-1.5.298.tgz +0 -0
|
@@ -8365,6 +8365,221 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
8365
8365
|
}]
|
|
8366
8366
|
}] });
|
|
8367
8367
|
|
|
8368
|
+
class DrSliderComponent {
|
|
8369
|
+
constructor() {
|
|
8370
|
+
this.max = 100;
|
|
8371
|
+
this.min = 1;
|
|
8372
|
+
this.step = 1;
|
|
8373
|
+
this.rangeValue = 1;
|
|
8374
|
+
this.onChange = () => {
|
|
8375
|
+
};
|
|
8376
|
+
this.onTouched = () => {
|
|
8377
|
+
};
|
|
8378
|
+
}
|
|
8379
|
+
registerOnChange(fn) {
|
|
8380
|
+
this.onChange = fn;
|
|
8381
|
+
}
|
|
8382
|
+
registerOnTouched(fn) {
|
|
8383
|
+
this.onTouched = fn;
|
|
8384
|
+
}
|
|
8385
|
+
setDisabledState(isDisabled) {
|
|
8386
|
+
this.disabled = isDisabled;
|
|
8387
|
+
}
|
|
8388
|
+
writeValue(value) {
|
|
8389
|
+
this.rangeValue = value;
|
|
8390
|
+
}
|
|
8391
|
+
setValue(event) {
|
|
8392
|
+
this.writeValue(event.target.value);
|
|
8393
|
+
this.onChange(this.rangeValue);
|
|
8394
|
+
this.onTouched();
|
|
8395
|
+
}
|
|
8396
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrSliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8397
|
+
/** @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: [
|
|
8398
|
+
{ provide: NG_VALUE_ACCESSOR, useExisting: DrSliderComponent, multi: true }
|
|
8399
|
+
], 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 }); }
|
|
8400
|
+
}
|
|
8401
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrSliderComponent, decorators: [{
|
|
8402
|
+
type: Component,
|
|
8403
|
+
args: [{ selector: 'dr-slider', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
8404
|
+
{ provide: NG_VALUE_ACCESSOR, useExisting: DrSliderComponent, multi: true }
|
|
8405
|
+
], 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"] }]
|
|
8406
|
+
}], propDecorators: { disabled: [{
|
|
8407
|
+
type: Input
|
|
8408
|
+
}], max: [{
|
|
8409
|
+
type: Input
|
|
8410
|
+
}], min: [{
|
|
8411
|
+
type: Input
|
|
8412
|
+
}], step: [{
|
|
8413
|
+
type: Input
|
|
8414
|
+
}], rangeValue: [{
|
|
8415
|
+
type: Input
|
|
8416
|
+
}] } });
|
|
8417
|
+
|
|
8418
|
+
var CROP_IMAGE_MODES;
|
|
8419
|
+
(function (CROP_IMAGE_MODES) {
|
|
8420
|
+
CROP_IMAGE_MODES["SQUARE"] = "square";
|
|
8421
|
+
CROP_IMAGE_MODES["RECTANGLE"] = "rectangle";
|
|
8422
|
+
})(CROP_IMAGE_MODES || (CROP_IMAGE_MODES = {}));
|
|
8423
|
+
|
|
8424
|
+
class DrImageCropperCanvasService {
|
|
8425
|
+
constructor() {
|
|
8426
|
+
this.ALPHA_FOR_SHADOW = 0.2;
|
|
8427
|
+
// this param means that a side of a white square is half of a side of a canvas
|
|
8428
|
+
this.CROP_AREA_PROPORTION = 2;
|
|
8429
|
+
this.RECTANGULAR_SHADOW_WIDTH = 30;
|
|
8430
|
+
this.RECTANGULAR_SHADOW_HEIGHT = 70;
|
|
8431
|
+
}
|
|
8432
|
+
drawShape(canvasSize, cropMode, zoomLevel, htmlImageElement) {
|
|
8433
|
+
this.clearCanvas(canvasSize);
|
|
8434
|
+
this.drawImageByZoom(canvasSize, zoomLevel, htmlImageElement);
|
|
8435
|
+
this.drawShadow(cropMode, canvasSize);
|
|
8436
|
+
}
|
|
8437
|
+
getCoordinates(cropMode, canvasSize) {
|
|
8438
|
+
return cropMode === CROP_IMAGE_MODES.SQUARE
|
|
8439
|
+
? this.getCoordinatesForSquare(canvasSize)
|
|
8440
|
+
: this.getCoordinatesForRectangle(canvasSize);
|
|
8441
|
+
}
|
|
8442
|
+
getCoordinatesForSquare(canvasSize) {
|
|
8443
|
+
const shadowLength = canvasSize / (this.CROP_AREA_PROPORTION * 2);
|
|
8444
|
+
const bottomPosition = canvasSize - shadowLength;
|
|
8445
|
+
return [shadowLength, shadowLength, bottomPosition, bottomPosition].join(',');
|
|
8446
|
+
}
|
|
8447
|
+
getCoordinatesForRectangle(canvasSize) {
|
|
8448
|
+
return [
|
|
8449
|
+
this.RECTANGULAR_SHADOW_WIDTH,
|
|
8450
|
+
this.RECTANGULAR_SHADOW_HEIGHT,
|
|
8451
|
+
canvasSize - this.RECTANGULAR_SHADOW_WIDTH,
|
|
8452
|
+
canvasSize - this.RECTANGULAR_SHADOW_HEIGHT
|
|
8453
|
+
].join(',');
|
|
8454
|
+
}
|
|
8455
|
+
drawShadow(cropMode, canvasSize) {
|
|
8456
|
+
this.ctx.globalAlpha = this.ALPHA_FOR_SHADOW;
|
|
8457
|
+
this.ctx.fillStyle = 'black';
|
|
8458
|
+
if (cropMode === CROP_IMAGE_MODES.SQUARE) {
|
|
8459
|
+
this.drawSquareShadow(canvasSize);
|
|
8460
|
+
}
|
|
8461
|
+
else if (cropMode === CROP_IMAGE_MODES.RECTANGLE) {
|
|
8462
|
+
this.drawRectangularShadow(canvasSize);
|
|
8463
|
+
}
|
|
8464
|
+
this.ctx.globalAlpha = 1;
|
|
8465
|
+
}
|
|
8466
|
+
drawSquareShadow(canvasSize) {
|
|
8467
|
+
const shadowLength = canvasSize / (this.CROP_AREA_PROPORTION * 2);
|
|
8468
|
+
this.ctx.fillRect(0, 0, shadowLength, canvasSize);
|
|
8469
|
+
this.ctx.fillRect(canvasSize - shadowLength, 0, shadowLength, canvasSize);
|
|
8470
|
+
this.ctx.fillRect(shadowLength, 0, 2 * shadowLength, shadowLength);
|
|
8471
|
+
this.ctx.fillRect(shadowLength, canvasSize - shadowLength, 2 * shadowLength, shadowLength);
|
|
8472
|
+
}
|
|
8473
|
+
drawRectangularShadow(canvasSize) {
|
|
8474
|
+
this.ctx.fillRect(0, 0, this.RECTANGULAR_SHADOW_WIDTH, canvasSize);
|
|
8475
|
+
this.ctx.fillRect(canvasSize - this.RECTANGULAR_SHADOW_WIDTH, 0, this.RECTANGULAR_SHADOW_WIDTH, canvasSize);
|
|
8476
|
+
this.ctx.fillRect(this.RECTANGULAR_SHADOW_WIDTH, 0, canvasSize - 2 * this.RECTANGULAR_SHADOW_WIDTH, this.RECTANGULAR_SHADOW_HEIGHT);
|
|
8477
|
+
this.ctx.fillRect(this.RECTANGULAR_SHADOW_WIDTH, canvasSize - this.RECTANGULAR_SHADOW_HEIGHT, canvasSize - 2 * this.RECTANGULAR_SHADOW_WIDTH, this.RECTANGULAR_SHADOW_HEIGHT);
|
|
8478
|
+
}
|
|
8479
|
+
drawImageByZoom(canvasSize, zoomLevel, htmlImageElement) {
|
|
8480
|
+
const maxImageDimension = Math.max(htmlImageElement.width, htmlImageElement.height);
|
|
8481
|
+
const proportion = canvasSize / (this.CROP_AREA_PROPORTION * maxImageDimension);
|
|
8482
|
+
const suitableWidth = htmlImageElement.width * proportion * zoomLevel;
|
|
8483
|
+
const suitableHeight = htmlImageElement.height * proportion * zoomLevel;
|
|
8484
|
+
const rectX = (canvasSize - suitableWidth) / 2;
|
|
8485
|
+
const rectY = (canvasSize - suitableHeight) / 2;
|
|
8486
|
+
this.ctx.drawImage(htmlImageElement, rectX, rectY, suitableWidth, suitableHeight);
|
|
8487
|
+
}
|
|
8488
|
+
clearCanvas(canvasSize) {
|
|
8489
|
+
this.ctx.fillStyle = 'white';
|
|
8490
|
+
this.ctx.fillRect(0, 0, canvasSize, canvasSize);
|
|
8491
|
+
}
|
|
8492
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrImageCropperCanvasService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
8493
|
+
/** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrImageCropperCanvasService }); }
|
|
8494
|
+
}
|
|
8495
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrImageCropperCanvasService, decorators: [{
|
|
8496
|
+
type: Injectable
|
|
8497
|
+
}] });
|
|
8498
|
+
|
|
8499
|
+
class DrImageCropperComponent {
|
|
8500
|
+
constructor(canvasService) {
|
|
8501
|
+
this.canvasService = canvasService;
|
|
8502
|
+
this.maxZoom = 10;
|
|
8503
|
+
this.minZoom = 0.5;
|
|
8504
|
+
this.zoomStep = 0.1;
|
|
8505
|
+
this.zoomLevel = 1;
|
|
8506
|
+
this.cropChanged = new EventEmitter();
|
|
8507
|
+
this.clearClicked = new EventEmitter();
|
|
8508
|
+
this.cropMode = CROP_IMAGE_MODES.SQUARE;
|
|
8509
|
+
this.CROP_IMAGE_MODES = CROP_IMAGE_MODES;
|
|
8510
|
+
}
|
|
8511
|
+
ngOnChanges(changes) {
|
|
8512
|
+
if (changes.imageFile && this.imageFile) {
|
|
8513
|
+
this.readImageFile();
|
|
8514
|
+
}
|
|
8515
|
+
}
|
|
8516
|
+
ngAfterViewInit() {
|
|
8517
|
+
this.canvasService.ctx = this.canvasElement.nativeElement.getContext('2d');
|
|
8518
|
+
}
|
|
8519
|
+
drawImage(newZoomEvent) {
|
|
8520
|
+
if (newZoomEvent !== undefined) {
|
|
8521
|
+
this.zoomLevel = newZoomEvent.target.value;
|
|
8522
|
+
}
|
|
8523
|
+
this.onCropModeUpdated();
|
|
8524
|
+
}
|
|
8525
|
+
onCropModeUpdated(cropMode) {
|
|
8526
|
+
if (cropMode) {
|
|
8527
|
+
this.cropMode = cropMode;
|
|
8528
|
+
}
|
|
8529
|
+
this.canvasService.drawShape(this.cropperSize, this.cropMode, this.zoomLevel, this.htmlImageElement);
|
|
8530
|
+
const coordinates = this.canvasService.getCoordinates(this.cropMode, this.cropperSize);
|
|
8531
|
+
this.canvasElement.nativeElement.toBlob((blob) => {
|
|
8532
|
+
const file = new File([blob], this.imageFile.name, { type: this.imageFile.type, lastModified: Date.now() });
|
|
8533
|
+
this.cropChanged.emit({ file, coordinates, cropMode: this.cropMode });
|
|
8534
|
+
}, this.imageFile.type);
|
|
8535
|
+
}
|
|
8536
|
+
readImageFile() {
|
|
8537
|
+
const reader = new FileReader();
|
|
8538
|
+
reader.onload = () => {
|
|
8539
|
+
this.htmlImageElement = new Image();
|
|
8540
|
+
this.htmlImageElement.src = this.getImagesStringSrc(reader);
|
|
8541
|
+
this.htmlImageElement.onload = () => {
|
|
8542
|
+
this.canvasElement.nativeElement.width = this.canvasElement.nativeElement.height = this.cropperSize;
|
|
8543
|
+
this.drawImage();
|
|
8544
|
+
};
|
|
8545
|
+
};
|
|
8546
|
+
reader.readAsDataURL(this.imageFile);
|
|
8547
|
+
}
|
|
8548
|
+
getImagesStringSrc(reader) {
|
|
8549
|
+
if (typeof reader.result === 'string')
|
|
8550
|
+
return reader.result;
|
|
8551
|
+
const decoder = new TextDecoder();
|
|
8552
|
+
return decoder.decode(reader.result);
|
|
8553
|
+
}
|
|
8554
|
+
/** @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 }); }
|
|
8555
|
+
/** @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 }); }
|
|
8556
|
+
}
|
|
8557
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrImageCropperComponent, decorators: [{
|
|
8558
|
+
type: Component,
|
|
8559
|
+
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"] }]
|
|
8560
|
+
}], ctorParameters: function () { return [{ type: DrImageCropperCanvasService }]; }, propDecorators: { cropperSize: [{
|
|
8561
|
+
type: Input,
|
|
8562
|
+
args: [{ required: true }]
|
|
8563
|
+
}], imageFile: [{
|
|
8564
|
+
type: Input,
|
|
8565
|
+
args: [{ required: true }]
|
|
8566
|
+
}], maxZoom: [{
|
|
8567
|
+
type: Input
|
|
8568
|
+
}], minZoom: [{
|
|
8569
|
+
type: Input
|
|
8570
|
+
}], zoomStep: [{
|
|
8571
|
+
type: Input
|
|
8572
|
+
}], zoomLevel: [{
|
|
8573
|
+
type: Input
|
|
8574
|
+
}], cropChanged: [{
|
|
8575
|
+
type: Output
|
|
8576
|
+
}], clearClicked: [{
|
|
8577
|
+
type: Output
|
|
8578
|
+
}], canvasElement: [{
|
|
8579
|
+
type: ViewChild,
|
|
8580
|
+
args: ['imageCanvas', { static: true }]
|
|
8581
|
+
}] } });
|
|
8582
|
+
|
|
8368
8583
|
class DrDropdownModule {
|
|
8369
8584
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrDropdownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
8370
8585
|
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.12", ngImport: i0, type: DrDropdownModule, declarations: [DrDropdownDirective,
|
|
@@ -8856,5 +9071,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
8856
9071
|
* Generated bundle index. Do not edit.
|
|
8857
9072
|
*/
|
|
8858
9073
|
|
|
8859
|
-
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 };
|
|
9074
|
+
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 };
|
|
8860
9075
|
//# sourceMappingURL=datarailsshared-datarailsshared.mjs.map
|