@brightspace-ui/core 3.34.0 → 3.35.1

package/components/button/button-icon.js

@@ -36,7 +36,13 @@ class ButtonIcon extends PropertyRequiredMixin(ThemeMixin(ButtonMixin(VisibleOnA
 			 * REQUIRED: Preset icon key (e.g. "tier1:gear")
 			 * @type {string}
 			 */
-			icon: { type: String, reflect: true, required: true },
+			icon: {
+				type: String,
+				reflect: true,
+				required: {
+					validator: (_value, elem, hasValue) => hasValue || elem._hasCustomIcon
+				}
+			},
 
 			/**
 			 * ACCESSIBILITY: REQUIRED: Accessible text for the button
@@ -162,6 +168,8 @@ class ButtonIcon extends PropertyRequiredMixin(ThemeMixin(ButtonMixin(VisibleOnA
 		this._buttonId = getUniqueId();
 		/** @internal */
 		this._describedById = getUniqueId();
+		/** @internal */
+		this._hasCustomIcon = false;
 	}
 
 	render() {
@@ -185,13 +193,19 @@ class ButtonIcon extends PropertyRequiredMixin(ThemeMixin(ButtonMixin(VisibleOnA
 				name="${ifDefined(this.name)}"
 				title="${ifDefined(this.text)}"
 				type="${this._getType()}">
-				<slot name="icon">${icon}</slot>
+				<slot name="icon" @slotchange="${this._handleSlotChange}">${icon}</slot>
 		</button>
 		${this.description ? html`<span id="${this._describedById}" hidden>${this.description}</span>` : null}
 		${this.disabled && this.disabledTooltip ? html`<d2l-tooltip for="${this._buttonId}">${this.disabledTooltip}</d2l-tooltip>` : ''}
 		`;
 	}
 
+	_handleSlotChange(e) {
+		this._hasCustomIcon = e.target.assignedNodes().find(
+			node => node.nodeType === 1 && node.tagName.toLowerCase() === 'd2l-icon-custom'
+		) !== undefined;
+	}
+
 }
 
 customElements.define('d2l-button-icon', ButtonIcon);

package/components/html-block/html-block.js

@@ -216,7 +216,10 @@ class HtmlBlock extends LitElement {
 
 		const contextValsPromise = contextKeysPromise.then(contextKeys => {
 			return Promise.allSettled(contextKeys.map(key => {
-				return tryGet(key, undefined, ctx => this._context.set(key, ctx));
+				return tryGet(key, undefined, ctx => {
+					this._context.set(key, ctx);
+					this.updated(new Map([['_context']]));
+				});
 			}));
 		});
 
@@ -234,24 +237,17 @@ class HtmlBlock extends LitElement {
 			'd2l-html-block-compact': this.compact
 		};
 
-		if (this._embedsFeatureEnabled()) {
-			return html`
-				<div class="${classMap(renderContainerClasses)}">
-					${!this.noDeferredRendering ? until(this._processEmbeds(), nothing) : nothing}
-				</div>
-				${this.noDeferredRendering ? html`<slot @slotchange="${this._handleSlotChange}"></slot>` : ''}
-			`;
-		} else {
-			return html`
-				<div class="${classMap(renderContainerClasses)}"></div>
-				${this.noDeferredRendering ? html`<slot @slotchange="${this._handleSlotChange}"></slot>` : ''}
-			`;
-		}
+		return html`
+			<div class="${classMap(renderContainerClasses)}">
+				${!this.noDeferredRendering ? until(this._processEmbeds(), nothing) : nothing}
+			</div>
+			${this.noDeferredRendering ? html`<slot @slotchange="${this._handleSlotChange}"></slot>` : ''}
+		`;
 	}
 
 	async updated(changedProperties) {
 		super.updated(changedProperties);
-		if ((changedProperties.has('html') || changedProperties.has('_context')) && this.html !== undefined && this.html !== null && !this.noDeferredRendering) {
+		if ((changedProperties.has('embeds') || changedProperties.has('_context')) && this.html !== undefined && this.html !== null && !this.noDeferredRendering) {
 			await this._updateRenderContainer();
 		}
 	}
@@ -260,10 +256,6 @@ class HtmlBlock extends LitElement {
 		return this._renderersProcessedPromise;
 	}
 
-	_embedsFeatureEnabled() {
-		return window.D2L?.LP?.Web?.UI?.Flags.Flag('shield-7574-enable-embed-rendering-framework', true);
-	}
-
 	async _handleSlotChange(e) {
 		if (!e.target || !this.shadowRoot || !this.noDeferredRendering) return;
 		await this._renderInline(e.target);
@@ -272,6 +264,7 @@ class HtmlBlock extends LitElement {
 	async _processEmbeds() {
 		const htmlFragment = document.createRange().createContextualFragment(this.html);
 		await renderEmbeds(htmlFragment);
+		this.updated(new Map([['embeds']]));
 		return htmlFragment;
 	}
 
@@ -315,7 +308,6 @@ class HtmlBlock extends LitElement {
 
 	async _updateRenderContainer() {
 		const renderContainer = this.shadowRoot.querySelector('.d2l-html-block-rendered');
-		if (!this._embedsFeatureEnabled()) renderContainer.innerHTML = this.html;
 		await this._processRenderers(renderContainer);
 	}
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@brightspace-ui/core",
-  "version": "3.34.0",
+  "version": "3.35.1",
   "description": "A collection of accessible, free, open-source web components for building Brightspace applications",
   "type": "module",
   "repository": "https://github.com/BrightspaceUI/core.git",