From 3d380aff85d46138e38cf553341a45aeef5bdf6e Mon Sep 17 00:00:00 2001
From: leekelleher <leekelleher@gmail.com>
Date: Mon, 8 Jul 2024 16:26:29 +0100
Subject: [PATCH] Displays the mandatory indicator on the property's
 `uui-label`

---
 .../property-layout/property-layout.element.ts      | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/property/property-layout/property-layout.element.ts b/src/Umbraco.Web.UI.Client/src/packages/core/property/property-layout/property-layout.element.ts
index ba194a6e06..1724d318a1 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/core/property/property-layout/property-layout.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/core/property/property-layout/property-layout.element.ts
@@ -51,7 +51,7 @@ export class UmbPropertyLayoutElement extends UmbLitElement {
 	public description = '';
 
 	/**
-	 * @description Make the property appear invalid
+	 * @description Make the property appear invalid.
 	 * @type {boolean}
 	 * @attr
 	 * @default undefined
@@ -59,11 +59,20 @@ export class UmbPropertyLayoutElement extends UmbLitElement {
 	@property({ type: Boolean, reflect: true })
 	public invalid?: boolean;
 
+	/**
+	 * @description Display a mandatory indicator.
+	 * @type {boolean}
+	 * @attr
+	 * @default false
+	 */
+	@property({ type: Boolean, reflect: true })
+	public mandatory?: boolean;
+
 	override render() {
 		// TODO: Only show alias on label if user has access to DocumentType within settings:
 		return html`
 			<div id="headerColumn">
-				<uui-label id="label" title=${this.alias}>
+				<uui-label id="label" title=${this.alias} ?required=${this.mandatory}>
 					${this.localize.string(this.label)}
 					${when(this.invalid, () => html`<uui-badge color="danger" attention>!</uui-badge>`)}
 				</uui-label>