From d35479844567ca7ec17290eddf561fb83ae4871c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?G=C3=B6khan=20=C3=96zt=C3=BCrk?= <gokhaanozturk@gmail.com>
Date: Tue, 22 Aug 2023 15:08:59 +0300
Subject: [PATCH 1/2] feat: add color prop

---
 src/components/TabItem/RTabItem.vue | 16 ++++++++++++++++
 src/components/TabItem/tab-item.css |  2 +-
 2 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/src/components/TabItem/RTabItem.vue b/src/components/TabItem/RTabItem.vue
index 267e26a..8fda458 100644
--- a/src/components/TabItem/RTabItem.vue
+++ b/src/components/TabItem/RTabItem.vue
@@ -84,6 +84,15 @@ export interface IProps {
    * <TabItem block />
    */
   block?: boolean;
+
+  /**
+   * Color of the tab item
+   * @type string
+   * @default ''
+   * @example
+   * <TabItem color="" />
+   */
+  color?: string;
 }
 const props = withDefaults(defineProps<IProps>(), {
   label: '',
@@ -107,6 +116,12 @@ const classes = computed(() => {
   };
 });
 
+const style = computed(() => {
+  return {
+    color: props.color,
+  };
+});
+
 /**
  * @description Fires when the tab is clicked
  * @param {id} id - The id of the tab
@@ -129,6 +144,7 @@ function handleIconClick(): void {
     :aria-disabled="props.disabled"
     :aria-selected="props.modelValue === props.id"
     :class="classes"
+    :style="style"
     :disabled="props.disabled"
     @click.stop="handleTab(props.id)"
   >
diff --git a/src/components/TabItem/tab-item.css b/src/components/TabItem/tab-item.css
index 245ceb1..ccb8e2b 100644
--- a/src/components/TabItem/tab-item.css
+++ b/src/components/TabItem/tab-item.css
@@ -1,7 +1,7 @@
 @import '../../index.css';
 
 .tab-item {
-  @apply transition-all gap-2 min-w-fit py-3 px-6 bg-transparent flex justify-center items-center text-gray-500 text-sm font-medium cursor-pointer;
+  @apply transition-all gap-2 min-w-fit py-3 px-6 bg-transparent flex justify-center items-center text-[var(--neutral-500)] text-sm font-medium cursor-pointer;
 
   &:disabled {
     @apply cursor-not-allowed bg-inherit opacity-50;

From 7216c99a2c21519d6417b520f0c9d31d4825b0ba Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?G=C3=B6khan=20=C3=96zt=C3=BCrk?= <gokhaanozturk@gmail.com>
Date: Tue, 22 Aug 2023 15:10:29 +0300
Subject: [PATCH 2/2] WIP: add default value

---
 src/components/TabItem/RTabItem.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/components/TabItem/RTabItem.vue b/src/components/TabItem/RTabItem.vue
index 8fda458..28bf3d2 100644
--- a/src/components/TabItem/RTabItem.vue
+++ b/src/components/TabItem/RTabItem.vue
@@ -103,6 +103,7 @@ const props = withDefaults(defineProps<IProps>(), {
   modelValue: '',
   tile: false,
   block: false,
+  color: '',
 });
 
 const emit = defineEmits(['update:modelValue', 'click:icon']);