@bnsights/bbsf-controls 1.2.25 → 1.2.26

package/README.md

@@ -407,6 +407,9 @@ If the issue persists, consider using a different HTML editor component that's c
 - Added explicit package exports for controls SCSS assets so Angular browser and application builders can resolve deep style imports from consuming packages.
 - Kept backward compatibility for extensionless Sass imports such as `@bnsights/bbsf-controls/src/lib/assets/sass/variables`.
 - Marked CSS, SCSS, and packaged assets as side-effectful so published global styles are preserved by consumers.
+- Added `LogoCropperComponent` as a standalone upload modal component exported from `@bnsights/bbsf-controls`.
+- Re-exported `LogoCropperComponent` through `BBSFUploadsModule` and the package public API.
+- Added `ngx-image-cropper` dependency for logo cropping support with Angular 19-compatible peer dependencies.
 
 ## 1.2.25 / 15-06-2026
 

package/fesm2022/bnsights-bbsf-controls.mjs

@@ -55,6 +55,7 @@ import { AngularCropperjsModule } from 'angular-cropperjs';
 import * as i5$2 from 'ng2-file-upload';
 import { FileUploader, FileUploadModule } from 'ng2-file-upload';
 import { takeUntil, switchMap, map, tap } from 'rxjs/operators';
+import { ImageCropperComponent } from 'ngx-image-cropper';
 import * as i7$4 from '@fullcalendar/angular';
 import { FullCalendarModule } from '@fullcalendar/angular';
 import * as i8$1 from '@angular/google-maps';
@@ -8828,6 +8829,76 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.16", ngImpo
                 args: ['angularCropper', { static: false }]
             }] } });
 
+class LogoCropperComponent {
+    constructor(activeModal, utilityService) {
+        this.activeModal = activeModal;
+        this.utilityService = utilityService;
+        this.isHorizontal = true;
+        this.aspectRatio = 3 / 1;
+        this.maintainAspectRatio = true;
+        this.cropperStaticWidth = 0;
+        this.cropperStaticHeight = 0;
+        this.onlyScaleDown = true;
+        this.transform = { scale: 1 };
+        this.croppedBlob = null;
+        this.minScale = 1;
+        this.maxScale = 4;
+        this.scaleStep = 0.1;
+    }
+    ngOnInit() { }
+    translate(key) {
+        return this.utilityService.getResourceValue(key);
+    }
+    imageCropped(event) {
+        this.croppedBlob = event.blob ?? null;
+    }
+    zoomIn() {
+        this.setScale((this.transform.scale ?? 1) + this.scaleStep);
+    }
+    zoomOut() {
+        this.setScale((this.transform.scale ?? 1) - this.scaleStep);
+    }
+    resetZoom() {
+        this.setScale(1);
+    }
+    confirm() {
+        if (!this.croppedBlob)
+            return;
+        const croppedFile = new File([this.croppedBlob], this.imageFile?.name ?? 'logo.png', { type: 'image/png' });
+        this.activeModal.close(croppedFile);
+    }
+    dismiss() {
+        this.activeModal.dismiss();
+    }
+    setScale(scale) {
+        const clamped = Math.min(this.maxScale, Math.max(this.minScale, scale));
+        this.transform = { ...this.transform, scale: clamped };
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.16", ngImport: i0, type: LogoCropperComponent, deps: [{ token: i3$2.NgbActiveModal }, { token: i3.UtilityService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.16", type: LogoCropperComponent, isStandalone: true, selector: "BBSF-LogoCropper", inputs: { imageFile: "imageFile", isHorizontal: "isHorizontal", aspectRatio: "aspectRatio", maintainAspectRatio: "maintainAspectRatio", cropperStaticWidth: "cropperStaticWidth", cropperStaticHeight: "cropperStaticHeight", onlyScaleDown: "onlyScaleDown" }, ngImport: i0, template: "<div class=\"bbsf-logo-cropper\">\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">{{ translate(\"CropImage\") }}</h5>\n    <button type=\"button\" class=\"btn-close\" (click)=\"dismiss()\"></button>\n  </div>\n\n  <div class=\"modal-body d-flex flex-column justify-content-center align-items-center py-0\" style=\"min-height: 200px;\">\n    <image-cropper [class.crop-horizontal]=\"isHorizontal\" [class.crop-vertical]=\"!isHorizontal\" [imageFile]=\"imageFile\"\n      [maintainAspectRatio]=\"maintainAspectRatio\" [aspectRatio]=\"aspectRatio\"\n      [cropperStaticWidth]=\"cropperStaticWidth\" [cropperStaticHeight]=\"cropperStaticHeight\"\n      [onlyScaleDown]=\"onlyScaleDown\" [transform]=\"transform\" format=\"png\" (imageCropped)=\"imageCropped($event)\">\n    </image-cropper>\n\n    <div class=\"d-flex justify-content-center align-items-center gap-2 mt-3\">\n      <button type=\"button\" class=\"btn btn-outline-secondary btn-sm\" (click)=\"zoomOut()\"\n        [title]=\"translate('ZoomOut')\">\n        <i class=\"fa fa-search-minus\"></i>\n      </button>\n      <button type=\"button\" class=\"btn btn-outline-secondary btn-sm\" (click)=\"resetZoom()\"\n        [title]=\"translate('ResetZoom')\">\n        <i class=\"fa fa-undo\"></i>\n      </button>\n      <button type=\"button\" class=\"btn btn-outline-secondary btn-sm\" (click)=\"zoomIn()\" [title]=\"translate('ZoomIn')\">\n        <i class=\"fa fa-search-plus\"></i>\n      </button>\n    </div>\n  </div>\n\n  <div class=\"modal-footer\">\n    <button type=\"button\" class=\"btn btn-sm btn-light\" (click)=\"dismiss()\"> Cancel </button>\n    <button type=\"button\" class=\"btn btn-sm btn-brand\" [disabled]=\"!croppedBlob\" (click)=\"confirm()\">\n      {{ translate(\"Crop\") }}\n    </button>\n  </div>\n</div>\n", styles: [".bbsf-logo-cropper image-cropper.crop-horizontal .ngx-ic-source-image{max-height:45px!important;max-width:none!important}.bbsf-logo-cropper image-cropper.crop-vertical .ngx-ic-source-image{max-width:200px!important;max-height:none!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ImageCropperComponent, selector: "image-cropper", inputs: ["imageChangedEvent", "imageURL", "imageBase64", "imageFile", "imageAltText", "options", "cropperFrameAriaLabel", "output", "format", "autoCrop", "cropper", "transform", "maintainAspectRatio", "aspectRatio", "resetCropOnAspectRatioChange", "resizeToWidth", "resizeToHeight", "cropperMinWidth", "cropperMinHeight", "cropperMaxHeight", "cropperMaxWidth", "cropperStaticWidth", "cropperStaticHeight", "canvasRotation", "initialStepSize", "roundCropper", "onlyScaleDown", "imageQuality", "backgroundColor", "containWithinAspectRatio", "hideResizeSquares", "allowMoveImage", "checkImageType", "alignImage", "disabled", "hidden"], outputs: ["imageCropped", "startCropImage", "imageLoaded", "cropperReady", "loadImageFailed", "transformChange", "cropperChange"] }], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.16", ngImport: i0, type: LogoCropperComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'BBSF-LogoCropper', encapsulation: ViewEncapsulation.None, standalone: true, imports: [
+                        CommonModule,
+                        ImageCropperComponent
+                    ], template: "<div class=\"bbsf-logo-cropper\">\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">{{ translate(\"CropImage\") }}</h5>\n    <button type=\"button\" class=\"btn-close\" (click)=\"dismiss()\"></button>\n  </div>\n\n  <div class=\"modal-body d-flex flex-column justify-content-center align-items-center py-0\" style=\"min-height: 200px;\">\n    <image-cropper [class.crop-horizontal]=\"isHorizontal\" [class.crop-vertical]=\"!isHorizontal\" [imageFile]=\"imageFile\"\n      [maintainAspectRatio]=\"maintainAspectRatio\" [aspectRatio]=\"aspectRatio\"\n      [cropperStaticWidth]=\"cropperStaticWidth\" [cropperStaticHeight]=\"cropperStaticHeight\"\n      [onlyScaleDown]=\"onlyScaleDown\" [transform]=\"transform\" format=\"png\" (imageCropped)=\"imageCropped($event)\">\n    </image-cropper>\n\n    <div class=\"d-flex justify-content-center align-items-center gap-2 mt-3\">\n      <button type=\"button\" class=\"btn btn-outline-secondary btn-sm\" (click)=\"zoomOut()\"\n        [title]=\"translate('ZoomOut')\">\n        <i class=\"fa fa-search-minus\"></i>\n      </button>\n      <button type=\"button\" class=\"btn btn-outline-secondary btn-sm\" (click)=\"resetZoom()\"\n        [title]=\"translate('ResetZoom')\">\n        <i class=\"fa fa-undo\"></i>\n      </button>\n      <button type=\"button\" class=\"btn btn-outline-secondary btn-sm\" (click)=\"zoomIn()\" [title]=\"translate('ZoomIn')\">\n        <i class=\"fa fa-search-plus\"></i>\n      </button>\n    </div>\n  </div>\n\n  <div class=\"modal-footer\">\n    <button type=\"button\" class=\"btn btn-sm btn-light\" (click)=\"dismiss()\"> Cancel </button>\n    <button type=\"button\" class=\"btn btn-sm btn-brand\" [disabled]=\"!croppedBlob\" (click)=\"confirm()\">\n      {{ translate(\"Crop\") }}\n    </button>\n  </div>\n</div>\n", styles: [".bbsf-logo-cropper image-cropper.crop-horizontal .ngx-ic-source-image{max-height:45px!important;max-width:none!important}.bbsf-logo-cropper image-cropper.crop-vertical .ngx-ic-source-image{max-width:200px!important;max-height:none!important}\n"] }]
+        }], ctorParameters: () => [{ type: i3$2.NgbActiveModal }, { type: i3.UtilityService }], propDecorators: { imageFile: [{
+                type: Input
+            }], isHorizontal: [{
+                type: Input
+            }], aspectRatio: [{
+                type: Input
+            }], maintainAspectRatio: [{
+                type: Input
+            }], cropperStaticWidth: [{
+                type: Input
+            }], cropperStaticHeight: [{
+                type: Input
+            }], onlyScaleDown: [{
+                type: Input
+            }] } });
+
 /**
  * BBSF Uploads Module
  *
@@ -8875,11 +8946,13 @@ class BBSFUploadsModule {
             // Import standalone components
             FileUploadComponent,
             ImageUploaderComponent,
-            ProfileImageUploaderComponent], exports: [
+            ProfileImageUploaderComponent,
+            LogoCropperComponent], exports: [
             // Re-export standalone components
             FileUploadComponent,
             ImageUploaderComponent,
-            ProfileImageUploaderComponent] }); }
+            ProfileImageUploaderComponent,
+            LogoCropperComponent] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.16", ngImport: i0, type: BBSFUploadsModule, imports: [CommonModule,
             FormsModule,
             ReactiveFormsModule,
@@ -8891,7 +8964,8 @@ class BBSFUploadsModule {
             // Import standalone components
             FileUploadComponent,
             ImageUploaderComponent,
-            ProfileImageUploaderComponent] }); }
+            ProfileImageUploaderComponent,
+            LogoCropperComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.16", ngImport: i0, type: BBSFUploadsModule, decorators: [{
             type: NgModule,
@@ -8909,14 +8983,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.16", ngImpo
                         // Import standalone components
                         FileUploadComponent,
                         ImageUploaderComponent,
-                        ProfileImageUploaderComponent
+                        ProfileImageUploaderComponent,
+                        LogoCropperComponent
                     ],
                     schemas: [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA],
                     exports: [
                         // Re-export standalone components
                         FileUploadComponent,
                         ImageUploaderComponent,
-                        ProfileImageUploaderComponent
+                        ProfileImageUploaderComponent,
+                        LogoCropperComponent
                     ]
                 }]
         }] });
@@ -12065,5 +12141,5 @@ var ToolbarButtons;
  * Generated bundle index. Do not edit.
  */
 
-export { AddButton, AppBaseComponent, Attribute, AutocompleteDTO, AutocompleteOptions, AutocompleteTextBoxComponent, BBSFControlsModule, BBSFCoreModule, BBSFDatePipe, BBSFDateTimeModule, BBSFDateTimePipe, BBSFDropdownModule, BBSFEditorsModule, BBSFFormsBasicModule, BBSFMultilingualModule, BBSFPhoneModule, BBSFSpecializedModule, BBSFUploadsModule, BBSFUtilityModule, BBSF_DATE_TIME_FORMATS, BTagsInputComponent, BreadCrumb, BreadCrumbModel, CalendarComponent, CalendarEventDTO, CalendarOptions, CalendarView, CancelDTO, CheckBoxComponent, CheckBoxOptions, ConfirmationModalComponent, ConfirmationModalOptions, ControlFilterItem, ControlLayout, ControlOptionsBase, ControlUtility, Country, CustomValidation, CustomValidator, DataType, DateInputComponent, DatePickerOptions, DefaultIntl, DeleteButton, DropdownActionItem, DropdownActions, DropdownListComponent, DropdownListItem, DropdownOptions, EditButton, EditPersonalImage, EnglishArabicDTO, ErrorMassageValidation, ExportButton, FileDTO, FileType, FileUploadComponent, FileUploadModel, FileUploadOptions, FilterItem, FilterOptions, FilterType, FiltersButton, FontSize, ForceDirection, FormComponent, FormOptions, GlobalSettings, GridViewModel, HtmlEditorComponent, HtmlEditorOptions, IconPosition, ImageType, ImageUploadOptions, ImageUploaderComponent, InputType, Insert, JwPaginationComponent, LanguageMode, LanguageValidation, MapAutoCompleteComponent, MapAutoCompleteOptions, MapAutocompleteDTO, MapSearchTypes, MapZoomLevel, MarkDownIcons, MarkdownEditorComponent, MarkdownEditorOptions, MarkdownMode, MenuListType, Misc, MultiLingualHtmlEditorComponent, MultiLingualHtmlEditorOptions, MultiLingualTextAreaComponent, MultiLingualTextAreaOptions, MultiLingualTextBoxComponent, MultiLingualTextBoxOptions, MultilingualControlOptionsBase, MultipleFileUploadModel, NgTemplateNameDirective, OnPagingFiltersChangeService, PageHeaderComponentComponent, PageHeaderOptions, PagingActionMode, PagingComponent, PagingDTO, PagingOptions, Para, PermissionSets, PhoneComponent, PhoneOptions, PickerType, PreventDoubleClickDirective, ProfileImageUploadOptions, ProfileImageUploaderComponent, ProfilePictureDTO, RadioButtonComponent, RadioButtonItem, RadioButtonOptions, RangeNumber, RecaptchaComponent, RecaptchaModel, RecaptchaOptions, RenderComponentService, RepeaterComponent, RepeaterField, RepeaterFieldBuilderComponent, RepeaterItemFieldComponent, RepeaterOptions, RepeaterTableComponent, SaveDTO, SelectMode, StartView, Style, StyleConfirmationMode, TagInputView, TagsInputComponent, TagsInputDTO, TagsInputOptions, TextAreaComponent, TextAreaOptions, TextBoxModel, TextBoxOptions, TextboxComponent, ToggleSlideOptions, ToggleslideComponent, ToolbarButtons, UploadPersonalImage, environment, options };
+export { AddButton, AppBaseComponent, Attribute, AutocompleteDTO, AutocompleteOptions, AutocompleteTextBoxComponent, BBSFControlsModule, BBSFCoreModule, BBSFDatePipe, BBSFDateTimeModule, BBSFDateTimePipe, BBSFDropdownModule, BBSFEditorsModule, BBSFFormsBasicModule, BBSFMultilingualModule, BBSFPhoneModule, BBSFSpecializedModule, BBSFUploadsModule, BBSFUtilityModule, BBSF_DATE_TIME_FORMATS, BTagsInputComponent, BreadCrumb, BreadCrumbModel, CalendarComponent, CalendarEventDTO, CalendarOptions, CalendarView, CancelDTO, CheckBoxComponent, CheckBoxOptions, ConfirmationModalComponent, ConfirmationModalOptions, ControlFilterItem, ControlLayout, ControlOptionsBase, ControlUtility, Country, CustomValidation, CustomValidator, DataType, DateInputComponent, DatePickerOptions, DefaultIntl, DeleteButton, DropdownActionItem, DropdownActions, DropdownListComponent, DropdownListItem, DropdownOptions, EditButton, EditPersonalImage, EnglishArabicDTO, ErrorMassageValidation, ExportButton, FileDTO, FileType, FileUploadComponent, FileUploadModel, FileUploadOptions, FilterItem, FilterOptions, FilterType, FiltersButton, FontSize, ForceDirection, FormComponent, FormOptions, GlobalSettings, GridViewModel, HtmlEditorComponent, HtmlEditorOptions, IconPosition, ImageType, ImageUploadOptions, ImageUploaderComponent, InputType, Insert, JwPaginationComponent, LanguageMode, LanguageValidation, LogoCropperComponent, MapAutoCompleteComponent, MapAutoCompleteOptions, MapAutocompleteDTO, MapSearchTypes, MapZoomLevel, MarkDownIcons, MarkdownEditorComponent, MarkdownEditorOptions, MarkdownMode, MenuListType, Misc, MultiLingualHtmlEditorComponent, MultiLingualHtmlEditorOptions, MultiLingualTextAreaComponent, MultiLingualTextAreaOptions, MultiLingualTextBoxComponent, MultiLingualTextBoxOptions, MultilingualControlOptionsBase, MultipleFileUploadModel, NgTemplateNameDirective, OnPagingFiltersChangeService, PageHeaderComponentComponent, PageHeaderOptions, PagingActionMode, PagingComponent, PagingDTO, PagingOptions, Para, PermissionSets, PhoneComponent, PhoneOptions, PickerType, PreventDoubleClickDirective, ProfileImageUploadOptions, ProfileImageUploaderComponent, ProfilePictureDTO, RadioButtonComponent, RadioButtonItem, RadioButtonOptions, RangeNumber, RecaptchaComponent, RecaptchaModel, RecaptchaOptions, RenderComponentService, RepeaterComponent, RepeaterField, RepeaterFieldBuilderComponent, RepeaterItemFieldComponent, RepeaterOptions, RepeaterTableComponent, SaveDTO, SelectMode, StartView, Style, StyleConfirmationMode, TagInputView, TagsInputComponent, TagsInputDTO, TagsInputOptions, TextAreaComponent, TextAreaOptions, TextBoxModel, TextBoxOptions, TextboxComponent, ToggleSlideOptions, ToggleslideComponent, ToolbarButtons, UploadPersonalImage, environment, options };
 //# sourceMappingURL=bnsights-bbsf-controls.mjs.map