From 5d7bcf6de4f44dec77ca2b17e2079bfb8e178aa9 Mon Sep 17 00:00:00 2001
From: Driss Chelouati <driss.chelouati@gmail.com>
Date: Thu, 22 Feb 2024 12:36:30 +0100
Subject: [PATCH] feat(BaseTag): add colors, update class bindings

---
 .playground/pages/tests/base/tag.vue |  9 +++++++++
 components/base/BaseTag.vue          | 18 ++++++++++++++----
 2 files changed, 23 insertions(+), 4 deletions(-)

diff --git a/.playground/pages/tests/base/tag.vue b/.playground/pages/tests/base/tag.vue
index e2379d33..33ebc8d3 100644
--- a/.playground/pages/tests/base/tag.vue
+++ b/.playground/pages/tests/base/tag.vue
@@ -39,6 +39,9 @@ definePageMeta({
           <BaseTag rounded="md" variant="solid" color="info">Label</BaseTag>
           <BaseTag rounded="md" variant="solid" color="warning">Label</BaseTag>
           <BaseTag rounded="md" variant="solid" color="danger">Label</BaseTag>
+          <BaseTag rounded="md" variant="solid" color="light">Label</BaseTag>
+          <BaseTag rounded="md" variant="solid" color="dark">Label</BaseTag>
+          <BaseTag rounded="md" variant="solid" color="black">Label</BaseTag>
         </div>
       </NuiPreview>
 
@@ -54,6 +57,9 @@ definePageMeta({
           <BaseTag rounded="md" variant="pastel" color="info">Label</BaseTag>
           <BaseTag rounded="md" variant="pastel" color="warning">Label</BaseTag>
           <BaseTag rounded="md" variant="pastel" color="danger">Label</BaseTag>
+          <BaseTag rounded="md" variant="pastel" color="light">Label</BaseTag>
+          <BaseTag rounded="md" variant="pastel" color="dark">Label</BaseTag>
+          <BaseTag rounded="md" variant="pastel" color="black">Label</BaseTag>
         </div>
       </NuiPreview>
 
@@ -77,6 +83,9 @@ definePageMeta({
             Label
           </BaseTag>
           <BaseTag rounded="md" variant="outline" color="danger">Label</BaseTag>
+          <BaseTag rounded="md" variant="outline" color="light">Label</BaseTag>
+          <BaseTag rounded="md" variant="outline" color="dark">Label</BaseTag>
+          <BaseTag rounded="md" variant="outline" color="black">Label</BaseTag>
         </div>
       </NuiPreview>
 
diff --git a/components/base/BaseTag.vue b/components/base/BaseTag.vue
index 832cbbda..6b274713 100644
--- a/components/base/BaseTag.vue
+++ b/components/base/BaseTag.vue
@@ -16,7 +16,12 @@ const props = withDefaults(
      */
     color?:
       | 'default'
+      | 'default-contrast'
       | 'muted'
+      | 'muted-contrast'
+      | 'light'
+      | 'dark'
+      | 'black'
       | 'primary'
       | 'info'
       | 'success'
@@ -65,15 +70,20 @@ const variants = {
 
 const radiuses = {
   none: '',
-  sm: 'nui-tag-rounded',
-  md: 'nui-tag-smooth',
-  lg: 'nui-tag-curved',
-  full: 'nui-tag-full',
+  sm: 'nui-tag-rounded-sm',
+  md: 'nui-tag-rounded-md',
+  lg: 'nui-tag-rounded-lg',
+  full: 'nui-tag-rounded-full',
 } as Record<string, string>
 
 const colors = {
   default: 'nui-tag-default',
+  'default-contrast': 'nui-tag-default-contrast',
   muted: 'nui-tag-muted',
+  'muted-contrast': 'nui-tag-muted-contrast',
+  light: 'nui-tag-light',
+  dark: 'nui-tag-dark',
+  black: 'nui-tag-black',
   primary: 'nui-tag-primary',
   info: 'nui-tag-info',
   success: 'nui-tag-success',