diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-list/components/inline-list-block/inline-list-block.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-list/components/inline-list-block/inline-list-block.element.ts
index 154673d767..83b3ab6ce3 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/block/block-list/components/inline-list-block/inline-list-block.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-list/components/inline-list-block/inline-list-block.element.ts
@@ -2,9 +2,10 @@ import { UMB_BLOCK_LIST_CONTEXT } from '../../index.js';
import { UMB_BLOCK_WORKSPACE_ALIAS, UMB_BLOCK_WORKSPACE_CONTEXT } from '../../../block/index.js';
import { UmbExtensionsApiInitializer, createExtensionApi } from '@umbraco-cms/backoffice/extension-api';
import { umbExtensionsRegistry } from '@umbraco-cms/backoffice/extension-registry';
-import { customElement, html } from '@umbraco-cms/backoffice/external/lit';
+import { css, customElement, html, state } from '@umbraco-cms/backoffice/external/lit';
import { UmbLitElement } from '@umbraco-cms/internal/lit-element';
import '../../../block/workspace/views/edit/block-workspace-view-edit-no-router.element.js';
+import { UmbTextStyles } from '@umbraco-cms/backoffice/style';
/**
* @element umb-inline-list-block
@@ -15,6 +16,12 @@ export class UmbInlineListBlockElement extends UmbLitElement {
#workspaceContext?: typeof UMB_BLOCK_WORKSPACE_CONTEXT.TYPE;
#contentUdi?: string;
+ @state()
+ _label = '';
+
+ @state()
+ _isOpen = false;
+
constructor() {
super();
@@ -28,6 +35,9 @@ export class UmbInlineListBlockElement extends UmbLitElement {
},
'observeContentUdi',
);
+ this.observe(blockContext.label, (label) => {
+ this._label = label;
+ });
});
this.observe(umbExtensionsRegistry.getByTypeAndAlias('workspace', UMB_BLOCK_WORKSPACE_ALIAS), (manifest) => {
if (manifest) {
@@ -53,8 +63,37 @@ export class UmbInlineListBlockElement extends UmbLitElement {
}
render() {
- return html``;
+ return html`
+
+ ${this._isOpen === true
+ ? html``
+ : ''}
+ `;
}
+
+ static styles = [
+ css`
+ #accordion-button {
+ display: flex;
+ text-align: left;
+ align-items: center;
+ justify-content: flex-start;
+ width: 100%;
+ border: none;
+ background: none;
+ padding: 0;
+ }
+ `,
+ ];
}
export default UmbInlineListBlockElement;
diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/views/edit/block-workspace-view-edit-no-router.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/views/edit/block-workspace-view-edit-no-router.element.ts
index 59346e2b4e..ae8f92868f 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/views/edit/block-workspace-view-edit-no-router.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/block/block/workspace/views/edit/block-workspace-view-edit-no-router.element.ts
@@ -110,6 +110,7 @@ export class UmbBlockWorkspaceViewEditNoRouterElement extends UmbLitElement impl
: ''}
${this._activeTabId !== undefined
? html`(this);
@state()
@@ -66,30 +73,29 @@ export class UmbBlockWorkspaceViewEditTabElement extends UmbLitElement {
render() {
return html`
- ${this._hasProperties
- ? html`
-
-
-
- `
- : ''}
+ ${this._hasProperties ? this.#renderPart(this._tabName) : ''}
${repeat(
this._groups,
(group) => group.name,
- (group) =>
- html`
-
- `,
+ (group) => this.#renderPart(group.name, group.name),
)}
`;
}
+ #renderPart(groupName: string | null | undefined, boxName?: string | null | undefined) {
+ return this.hideSingleGroup && this._groups.length === 1
+ ? html` `
+ : html` `;
+ }
+
static styles = [
UmbTextStyles,
css`