From 655aec099f05b03af1853209b98c672803299798 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benny=20Powers=20-=20=D7=A2=D7=9D=20=D7=99=D7=A9=D7=A8?=
 =?UTF-8?q?=D7=90=D7=9C=20=D7=97=D7=99!?=
 <bennypowers@users.noreply.github.com>
Date: Mon, 17 Jun 2024 18:44:00 +0300
Subject: [PATCH] perf(cta): lazy-load icon dependency (#1634)

---
 .changeset/few-buckets-cross.md | 4 ++++
 elements/rh-cta/rh-cta.ts       | 9 +++++++--
 2 files changed, 11 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/few-buckets-cross.md

diff --git a/.changeset/few-buckets-cross.md b/.changeset/few-buckets-cross.md
new file mode 100644
index 0000000000..d2f9c9e39f
--- /dev/null
+++ b/.changeset/few-buckets-cross.md
@@ -0,0 +1,4 @@
+---
+"@rhds/elements": patch
+---
+`<rh-cta>`: lazy-load the icon component dependency
diff --git a/elements/rh-cta/rh-cta.ts b/elements/rh-cta/rh-cta.ts
index a6e50dd09a..e05fc80253 100644
--- a/elements/rh-cta/rh-cta.ts
+++ b/elements/rh-cta/rh-cta.ts
@@ -12,8 +12,6 @@ import { colorContextConsumer, type ColorTheme } from '../../lib/context/color/c
 
 import style from './rh-cta.css';
 
-import '@patternfly/elements/pf-icon/pf-icon.js';
-
 export interface CtaData {
   href?: string;
   text?: string;
@@ -150,6 +148,13 @@ export class RhCta extends LitElement {
 
   #logger = new Logger(this);
 
+  protected override async getUpdateComplete(): Promise<boolean> {
+    if (this.icon) {
+      await import('@patternfly/elements/pf-icon/pf-icon.js');
+    }
+    return super.getUpdateComplete();
+  }
+
   get #isDefault(): boolean {
     return !this.hasAttribute('variant');
   }