Image cropper modal import missing component (#20651)

* Import missing component

* Handle nullable type

* Vertically center image

* Add minimum width for SVG without dimensions

* 100% height until max height

* 100% height minus top/bottom padding

* Revert "100% height minus top/bottom padding"

This reverts commit 67ada4c.

* Revert "Handle nullable type"

This reverts commit 3130e11.

* Removed flexbox style

* Fixed circular dependency

---------

Co-authored-by: leekelleher <[email protected]>

Author: 2 people

src/Umbraco.Web.UI.Client/src/packages/media/media/components/input-upload-field/file-upload-preview.element.ts

@@ -1,4 +1,4 @@
-import { getMimeTypeFromExtension } from '../../components/index.js';
+import { getMimeTypeFromExtension } from './utils.js';
 import type { ManifestFileUploadPreview } from './file-upload-preview.extension.js';
 import type { UmbFileUploadPreviewElement as UmbFileUploadPreviewElementInterface } from './file-upload-preview.interface.js';
 import { css, customElement, html, nothing, property, state } from '@umbraco-cms/backoffice/external/lit';

src/Umbraco.Web.UI.Client/src/packages/media/media/components/input-upload-field/preview/input-upload-field-svg.element.ts

@@ -16,9 +16,12 @@ export default class UmbInputUploadFieldSvgElement extends UmbLitElement impleme
 	static override readonly styles = [
 		css`
 			:host {
+				height: 100%;
 				min-height: 240px;
 				max-height: 400px;
+
 				width: fit-content;
+				min-width: 240px;
 				max-width: 100%;
 			}
 

src/Umbraco.Web.UI.Client/src/packages/media/media/modals/image-cropper-editor/image-cropper-editor-modal.element.ts

@@ -15,6 +15,8 @@ import { UMB_MODAL_MANAGER_CONTEXT, UmbModalBaseElement } from '@umbraco-cms/bac
 import { UMB_WORKSPACE_MODAL } from '@umbraco-cms/backoffice/workspace';
 import type { UmbModalManagerContext } from '@umbraco-cms/backoffice/modal';
 
+import '../../components/input-upload-field/file-upload-preview.element.js';
+
 @customElement('umb-image-cropper-editor-modal')
 export class UmbImageCropperEditorModalElement extends UmbModalBaseElement<
 	UmbImageCropperEditorModalData<any>,