diff --git a/src/Umbraco.Web.UI.Client/src/packages/media/media/modals/media-picker/components/media-picker-folder-path.element.ts b/src/Umbraco.Web.UI.Client/src/packages/media/media/modals/media-picker/components/media-picker-folder-path.element.ts index 7aa35f9370f9..dafec931f505 100644 --- a/src/Umbraco.Web.UI.Client/src/packages/media/media/modals/media-picker/components/media-picker-folder-path.element.ts +++ b/src/Umbraco.Web.UI.Client/src/packages/media/media/modals/media-picker/components/media-picker-folder-path.element.ts @@ -90,7 +90,6 @@ export class UmbMediaPickerFolderPathElement extends UmbLitElement { requestAnimationFrame(() => { const element = this.getHostElement().shadowRoot!.querySelector('#new-folder') as UUIInputElement; element.focus(); - element.select(); }); } @@ -136,6 +135,15 @@ export class UmbMediaPickerFolderPathElement extends UmbLitElement { this.dispatchEvent(new UmbChangeEvent()); } + #onKeypress(e: KeyboardEvent) { + if (e.key === 'Enter') { + requestAnimationFrame(() => { + const element = this.getHostElement().shadowRoot!.querySelector('#new-folder') as UUIInputElement; + element.blur(); + }); + } + } + override render() { return html`
${repeat( @@ -151,11 +159,17 @@ export class UmbMediaPickerFolderPathElement extends UmbLitElement { )}${this._typingNewFolder ? html`` - : html`+`} + : html` + + `}
`; } @@ -172,6 +186,14 @@ export class UmbMediaPickerFolderPathElement extends UmbLitElement { #path uui-input { height: 100%; } + + #new-folder { + margin-left: var(--uui-size-2); + } + + #path uui-button uui-icon { + --uui-icon-color: inherit; + } `, ]; }