Conditionally render property description

This commit is contained in:
leekelleher
2024-06-26 11:49:16 +01:00
parent 4129a558e1
commit 6f4c512160

View File

@@ -60,7 +60,6 @@ export class UmbPropertyLayoutElement extends UmbLitElement {
public invalid?: boolean;
override render() {
const ufmValue = { alias: this.alias, label: this.label, description: this.description };
// TODO: Only show alias on label if user has access to DocumentType within settings:
return html`
<div id="headerColumn">
@@ -69,9 +68,7 @@ export class UmbPropertyLayoutElement extends UmbLitElement {
${when(this.invalid, () => html`<uui-badge color="danger" attention>!</uui-badge>`)}
</uui-label>
<slot name="action-menu"></slot>
<uui-scroll-container id="description">
<umb-ufm-render .markdown=${this.description} .value=${ufmValue}></umb-ufm-render>
</uui-scroll-container>
${this.#renderDescription()}
<slot name="description"></slot>
</div>
<div id="editorColumn">
@@ -82,6 +79,12 @@ export class UmbPropertyLayoutElement extends UmbLitElement {
`;
}
#renderDescription() {
if (!this.description) return;
const ufmValue = { alias: this.alias, label: this.label, description: this.description };
return html`<umb-ufm-render .markdown=${this.description} .value=${ufmValue}></umb-ufm-render>`;
}
static override styles = [
UmbTextStyles,
css`