diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/components/block-grid-entry/block-grid-entry.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/components/block-grid-entry/block-grid-entry.element.ts
index e0b4528101..5fb10c3349 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/components/block-grid-entry/block-grid-entry.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/components/block-grid-entry/block-grid-entry.element.ts
@@ -467,7 +467,7 @@ export class UmbBlockGridEntryElement extends UmbLitElement implements UmbProper
`;
}
- #renderBuiltinBlockView() {
+ #renderBuiltinBlockView = () => {
if (this._unsupported) {
return this.#renderUnsupportedBlock();
}
@@ -407,7 +407,7 @@ export class UmbBlockListEntryElement extends UmbLitElement implements UmbProper
return this.#renderInlineBlock();
}
return this.#renderRefBlock();
- }
+ };
#renderBlock() {
return this.contentKey && (this._contentTypeAlias || this._unsupported)
@@ -417,11 +417,10 @@ export class UmbBlockListEntryElement extends UmbLitElement implements UmbProper
type="blockEditorCustomView"
default-element=${this._inlineEditingMode ? 'umb-inline-list-block' : 'umb-ref-list-block'}
.renderMethod=${this.#extensionSlotRenderMethod}
+ .fallbackRenderMethod=${this.#renderBuiltinBlockView}
.props=${this._blockViewProps}
.filter=${this.#extensionSlotFilterMethod}
- single
- >${this.#renderBuiltinBlockView()}
+ single>
${this.#renderActionBar()}
${!this._showContentEdit && this._contentInvalid
? html`!`
diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-rte/components/block-rte-entry/block-rte-entry.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-rte/components/block-rte-entry/block-rte-entry.element.ts
index 92129a97f2..63d79ac8f8 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/block/block-rte/components/block-rte-entry/block-rte-entry.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-rte/components/block-rte-entry/block-rte-entry.element.ts
@@ -277,11 +277,10 @@ export class UmbBlockRteEntryElement extends UmbLitElement implements UmbPropert
type="blockEditorCustomView"
default-element="umb-ref-rte-block"
.renderMethod=${this.#extensionSlotRenderMethod}
+ .fallbackRenderMethod=${this.#renderBuiltinBlockView}
.props=${this._blockViewProps}
.filter=${this.#filterBlockCustomViews}
- single>
- ${this.#renderRefBlock()}
-
+ single>
${this.#renderActionBar()}
${!this._showContentEdit && this._contentInvalid
? html`!`
@@ -297,6 +296,14 @@ export class UmbBlockRteEntryElement extends UmbLitElement implements UmbPropert
: nothing;
}
+ #renderBuiltinBlockView = () => {
+ // TODO: Missing unsupported rendering [NL]
+ /*if (this._unsupported) {
+ return this.#renderUnsupportedBlock();
+ }*/
+ return this.#renderRefBlock();
+ };
+
#renderRefBlock() {
return html` TemplateResult | TemplateResult<1> | HTMLElement | null | undefined | typeof nothing;
@property({ attribute: false })
- public defaultRenderMethod?: () =>
+ public fallbackRenderMethod?: () =>
| TemplateResult
| TemplateResult<1>
| HTMLElement
@@ -142,15 +142,18 @@ export class UmbExtensionSlotElement extends UmbLitElement {
}
override render() {
+ // First renders something once _permitted is set, this is to avoid flickering. [NL]
return this._permitted
? this._permitted.length > 0
? repeat(this._permitted, (ext) => ext.alias, this.#renderExtension)
- : this.defaultRenderMethod
- ? this.defaultRenderMethod()
- : html``
+ : this.#renderNoting()
: nothing;
}
+ #renderNoting() {
+ return this.fallbackRenderMethod ? this.fallbackRenderMethod() : html``;
+ }
+
#renderExtension = (ext: UmbExtensionElementInitializer, i: number) => {
return this.renderMethod ? this.renderMethod(ext, i) : ext.component;
};
diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/extension-registry/components/extension-with-api-slot/extension-with-api-slot.element.ts b/src/Umbraco.Web.UI.Client/src/packages/core/extension-registry/components/extension-with-api-slot/extension-with-api-slot.element.ts
index 9b299c1b9c..9f2e56413f 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/core/extension-registry/components/extension-with-api-slot/extension-with-api-slot.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/core/extension-registry/components/extension-with-api-slot/extension-with-api-slot.element.ts
@@ -143,6 +143,15 @@ export class UmbExtensionWithApiSlotElement extends UmbLitElement {
index: number,
) => TemplateResult | TemplateResult<1> | HTMLElement | null | undefined | typeof nothing;
+ @property({ attribute: false })
+ public fallbackRenderMethod?: () =>
+ | TemplateResult
+ | TemplateResult<1>
+ | HTMLElement
+ | null
+ | undefined
+ | typeof nothing;
+
override connectedCallback(): void {
super.connectedCallback();
this.#attached = true;
@@ -185,10 +194,14 @@ export class UmbExtensionWithApiSlotElement extends UmbLitElement {
return this._permitted
? this._permitted.length > 0
? repeat(this._permitted, (ext) => ext.alias, this.#renderExtension)
- : html``
+ : this.#renderNoting()
: nothing;
}
+ #renderNoting() {
+ return this.fallbackRenderMethod ? this.fallbackRenderMethod() : html``;
+ }
+
#renderExtension = (ext: UmbExtensionElementAndApiInitializer, i: number) => {
return this.renderMethod ? this.renderMethod(ext, i) : ext.component;
};