make load more 100% wide (#18821)

Author: nielslyngsoe

src/Umbraco.Web.UI.Client/src/packages/core/tree/default/default-tree.element.ts

@@ -9,7 +9,7 @@ import type { UmbTreeExpansionModel } from '../expansion-manager/types.js';
 import type { UmbDefaultTreeContext } from './default-tree.context.js';
 import { UMB_TREE_CONTEXT } from './default-tree.context-token.js';
 import type { PropertyValueMap } from '@umbraco-cms/backoffice/external/lit';
-import { html, nothing, customElement, property, state, repeat } from '@umbraco-cms/backoffice/external/lit';
+import { html, nothing, customElement, property, state, repeat, css } from '@umbraco-cms/backoffice/external/lit';
 import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';
 
 @customElement('umb-default-tree')
@@ -171,8 +171,14 @@ export class UmbDefaultTreeElement extends UmbLitElement {
 			return nothing;
 		}
 
-		return html` <uui-button @click=${this.#onLoadMoreClick} label="Load more"></uui-button> `;
+		return html` <uui-button id="load-more" @click=${this.#onLoadMoreClick} label="Load more"></uui-button> `;
 	}
+
+	static override styles = css`
+		#load-more {
+			width: 100%;
+		}
+	`;
 }
 
 export default UmbDefaultTreeElement;

src/Umbraco.Web.UI.Client/src/packages/documents/documents/tree/document-tree.element.ts

@@ -1,14 +1,13 @@
 import { customElement } from '@umbraco-cms/backoffice/external/lit';
 import { UmbDefaultTreeElement } from '@umbraco-cms/backoffice/tree';
 
-const elementName = 'umb-document-tree';
-@customElement(elementName)
+@customElement('umb-document-tree')
 export class UmbDocumentTreeElement extends UmbDefaultTreeElement {}
 
 export { UmbDocumentTreeElement as element };
 
 declare global {
 	interface HTMLElementTagNameMap {
-		[elementName]: UmbDocumentTreeElement;
+		'umb-document-tree': UmbDocumentTreeElement;
 	}
 }