From 9b9709567b827ae0e125e10d132352696f6fac97 Mon Sep 17 00:00:00 2001
From: Mads Rasmussen <madsr@hey.com>
Date: Wed, 28 Aug 2024 12:11:26 +0200
Subject: [PATCH] feat: implement readonly for uui-card-block-type

---
 .../lib/uui-card-block-type.element.ts          | 17 +++++++++++++++--
 1 file changed, 15 insertions(+), 2 deletions(-)

diff --git a/packages/uui-card-block-type/lib/uui-card-block-type.element.ts b/packages/uui-card-block-type/lib/uui-card-block-type.element.ts
index 20d12f746..aa7221f6d 100644
--- a/packages/uui-card-block-type/lib/uui-card-block-type.element.ts
+++ b/packages/uui-card-block-type/lib/uui-card-block-type.element.ts
@@ -46,8 +46,7 @@ export class UUICardBlockTypeElement extends UUICardElement {
         style=${styleMap({ backgroundColor: this.background })}>
         <slot></slot>
       </div>
-      ${this.href ? this.#renderLink() : this.#renderButton()}
-
+      ${this.#renderContent()}
       <slot name="tag"></slot>
       <slot name="actions"></slot>
     `;
@@ -83,6 +82,16 @@ export class UUICardBlockTypeElement extends UUICardElement {
     `;
   }
 
+  #renderContent() {
+    if (this.readonly) {
+      return html`<div id="open-part">
+        <strong>${this.name}</strong><small>${this.description}</small>
+      </div>`;
+    } else {
+      return html` ${this.href ? this.#renderLink() : this.#renderButton()} `;
+    }
+  }
+
   static styles = [
     ...UUICardElement.styles,
     css`
@@ -135,6 +144,10 @@ export class UUICardBlockTypeElement extends UUICardElement {
         color: var(--uui-color-contrast-disabled);
       }
 
+      :host([readonly]) #open-part {
+        pointer-events: none;
+      }
+
       #open-part:hover strong {
         text-decoration: underline;
       }