yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add remove button

Browse Source
This commit is contained in:
JesmoDev
2024-02-12 16:16:05 +01:00
parent 91069cbcbd
commit ce97fa45f8
1 changed files with 15 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/Umbraco.Web.UI.Client/src/packages/media/media/components/input-image-cropper/input-image-cropper.element.ts
View File

@@ -66,6 +66,16 @@ export class UmbInputImageCropperElement extends UmbLitElement {
this._dropzone.browse();
}
#onRemove = () => {
this.value = { ...this.value, src: '' };
if (!this.fileUnique) return;
this.#manager?.removeOne(this.fileUnique);
this.fileUnique = undefined;
this.file = undefined;
this.dispatchEvent(new UmbChangeEvent());
};
render() {
if (this.value.src || this.file) {
return this.#renderImageCropper();
@@ -89,10 +99,11 @@ export class UmbInputImageCropperElement extends UmbLitElement {
}
#renderImageCropper() {
return html`<umb-image-cropper-field
.value=${this.value}
.file=${this.file as File}
@change=${this.#onChange}></umb-image-cropper-field>`;
return html`<umb-image-cropper-field .value=${this.value} .file=${this.file as File} @change=${this.#onChange}>
<uui-button slot="actions" @click=${this.#onRemove} label="Remove files">
<uui-icon name="icon-trash"></uui-icon> Remove file(s)
</uui-button>
</umb-image-cropper-field> `;
}
static styles = css``;