tag theme fix

dojimanetwork · Jun 23, 2024 · f487cf1 · f487cf1
1 parent c9157c2
commit f487cf1
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 8 deletions.
diff --git a/theme/components/Tag/Tag.ts b/theme/components/Tag/Tag.ts
@@ -25,12 +25,13 @@ const variants = {
         color: 'blue.400',
         opacity: 0.76,
       },
-    },
-  })),
-  selectActive: definePartsStyle((props) => ({
-    container: {
-      bg: mode('blue.500', 'blue.900')(props),
-      color: 'whiteAlpha.800',
+      [`
+        &[data-selected=true],
+        &[data-selected=true][aria-selected=true]
+      `]: {
+        bg: mode('blue.500', 'blue.900')(props),
+        color: 'whiteAlpha.800',
+      },
     },
   })),
 };

diff --git a/ui/shared/tagGroupSelect/TagGroupSelect.tsx b/ui/shared/tagGroupSelect/TagGroupSelect.tsx
@@ -34,12 +34,13 @@ const TagGroupSelect = <T extends string>({ items, value, isMulti, onChange }: P
   return (
     <HStack>
       { items.map(item => {
-        const isActive = isMulti ? value.includes(item.id) : value === item.id;
+        const isSelected = isMulti ? value.includes(item.id) : value === item.id;
         return (
           <Tag
+            variant="select"
             key={ item.id }
             data-id={ item.id }
-            variant={ isActive ? 'selectActive' : 'select' }
+            data-selected={ isSelected }
             fontWeight={ 500 }
             cursor="pointer"
             onClick={ onItemClick }