Update <SvgIcon /> with global className

near · Nov 8, 2024 · 77aeac8 · 77aeac8
1 parent 479b969
commit 77aeac8
Show file tree

Hide file tree

Showing 5 changed files with 5 additions and 11 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@near-pagoda/ui",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "description": "A React component library that implements the official NEAR design system.",
   "license": "MIT",
   "repository": {

diff --git a/src/components/Dropdown/Dropdown.module.scss b/src/components/Dropdown/Dropdown.module.scss
@@ -96,7 +96,7 @@
   cursor: pointer;
   transition: var(--transitions);
 
-  [data-icon][data-color='current'] {
+  :global(.svgIcon[data-color='current']) {
     color: var(--sand-10) !important;
   }
 
@@ -109,7 +109,7 @@
   &[data-state='open'] {
     background-color: var(--sand-3);
 
-    [data-icon] {
+    :global(.svgIcon) {
       color: var(--violet-10) !important;
     }
   }

diff --git a/src/components/ImageIcon.tsx b/src/components/ImageIcon.tsx
@@ -14,7 +14,7 @@ type Props = {
 
 export const ImageIcon = ({ alt, className = '', fallbackIcon, size = 'm', src, ...props }: Props) => {
   return (
-    <div className={`${s.imageIcon} ${className}`} data-icon data-size={size} {...props}>
+    <div className={`${s.imageIcon} ${className} image-icon`} data-size={size} {...props}>
       {src ? <img src={src} alt={alt} /> : fallbackIcon}
     </div>
   );

diff --git a/src/components/SvgIcon.tsx b/src/components/SvgIcon.tsx
@@ -25,9 +25,8 @@ export const SvgIcon = ({
 }: Props) => {
   return (
     <div
-      className={`${s.svgIcon} ${className}`}
+      className={`${s.svgIcon} ${className} svgIcon`}
       data-color={color}
-      data-icon
       data-size={size}
       data-no-fill={noFill}
       data-no-stroke={noStroke}

diff --git a/src/components/Table/Table.module.scss b/src/components/Table/Table.module.scss
@@ -54,11 +54,6 @@
       bottom: var(--table-half-padding);
     }
   }
-
-  &[data-test='true'] {
-    position: fixed;
-    top: 100px;
-  }
 }
 
 .foot {