From 8314fa8914dd7cabda0b44b4b0cda2cce966b59d Mon Sep 17 00:00:00 2001
From: aPreciado88 <apreciado@esri.com>
Date: Mon, 25 Nov 2024 16:45:38 -0800
Subject: [PATCH 1/2] fix(combobox-item): fix icon color css override

---
 .../src/components/combobox-item/combobox-item.scss              | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/calcite-components/src/components/combobox-item/combobox-item.scss b/packages/calcite-components/src/components/combobox-item/combobox-item.scss
index 1966a6ded72..795d802aa06 100644
--- a/packages/calcite-components/src/components/combobox-item/combobox-item.scss
+++ b/packages/calcite-components/src/components/combobox-item/combobox-item.scss
@@ -105,7 +105,6 @@ ul:focus {
 
 .icon--custom {
   margin-block-start: -1px;
-  @apply text-color-3;
 }
 
 .icon--active {

From f0f0b2ec48afa58b604abb3d2faeb96bb0b62a9d Mon Sep 17 00:00:00 2001
From: aPreciado88 <apreciado@esri.com>
Date: Tue, 26 Nov 2024 10:34:34 -0800
Subject: [PATCH 2/2] fix(combobox-item): add combobox-item simple story to
 custom-theme.stories.ts

---
 .../calcite-components/src/custom-theme.stories.ts     | 10 ++++------
 .../src/custom-theme/combobox-item.ts                  |  7 +++++++
 2 files changed, 11 insertions(+), 6 deletions(-)
 create mode 100644 packages/calcite-components/src/custom-theme/combobox-item.ts

diff --git a/packages/calcite-components/src/custom-theme.stories.ts b/packages/calcite-components/src/custom-theme.stories.ts
index 14ba2329030..defad68ace0 100644
--- a/packages/calcite-components/src/custom-theme.stories.ts
+++ b/packages/calcite-components/src/custom-theme.stories.ts
@@ -18,6 +18,7 @@ import { calciteSwitch } from "./custom-theme/switch";
 import { card, cardThumbnail, cardTokens } from "./custom-theme/card";
 import { checkbox, checkboxTokens } from "./custom-theme/checkbox";
 import { chips, chipTokens } from "./custom-theme/chips";
+import { comboboxItem } from "./custom-theme/combobox-item";
 import { datePicker } from "./custom-theme/date-picker";
 import { dropdown } from "./custom-theme/dropdown";
 import { handle, handleTokens } from "./custom-theme/handle";
@@ -126,13 +127,10 @@ const kitchenSink = (args: Record<string, string>, useTestValues = false) =>
       </div>
       <div class="demo-column">
         ${datePicker} ${tabs} ${label} ${link} ${list} ${loader} ${calciteSwitch} ${avatarIcon} ${avatarInitials}
-        ${avatarThumbnail} ${progress} ${handle} ${textArea} ${popover} ${tile} ${tooltip}
+        ${avatarThumbnail} ${progress} ${handle} ${textArea} ${popover} ${tile} ${tooltip} ${comboboxItem}
       </div>
-      <div class="demo-column">
-      ${navigation} ${navigationLogos} ${navigationUsers}
-       </div>
-      ${alert} 
-
+      <div class="demo-column">${navigation} ${navigationLogos} ${navigationUsers}</div>
+      ${alert}
     </div>
   </div>`;
 
diff --git a/packages/calcite-components/src/custom-theme/combobox-item.ts b/packages/calcite-components/src/custom-theme/combobox-item.ts
new file mode 100644
index 00000000000..1ac6f6c3966
--- /dev/null
+++ b/packages/calcite-components/src/custom-theme/combobox-item.ts
@@ -0,0 +1,7 @@
+import { html } from "../../support/formatting";
+
+export const comboboxItem = html`<calcite-combobox-item
+  icon="altitude"
+  value="altitude"
+  text-label="Altitude"
+></calcite-combobox-item>`;