feat: readonly state for uui-radio

umbraco · Jul 8, 2024 · 201917e · 201917e
1 parent dbad401
commit 201917e
Showing 1 changed file with 10 additions and 1 deletion.
diff --git a/packages/uui-radio/lib/uui-radio.element.ts b/packages/uui-radio/lib/uui-radio.element.ts
@@ -81,6 +81,15 @@ export class UUIRadioElement extends LitElement {
   }
   private _disabled = false;
 
+  /**
+   * Sets the input to readonly mode, meaning value cannot be changed but still able to read and select its content.
+   * @type {boolean}
+   * @attr
+   * @default false
+   */
+  @property({ type: Boolean, reflect: true })
+  readonly = false;
+
   constructor() {
     super();
     this.addEventListener('mousedown', this.#hideFocusOutline);
@@ -162,7 +171,7 @@ export class UUIRadioElement extends LitElement {
         name=${this.name}
         value=${this.value}
         .checked=${this.checked}
-        .disabled=${this.disabled}
+        .disabled=${this.disabled || this.readonly}
         @change=${this._onChange} />
       <div id="button"></div>
       <div id="label">