@codecademy/gamut

73.3.073.3.1-alpha.0e5de6.0
dist/Tag/styles.js
~dist/Tag/styles.jsModified
+10−10
Index: package/dist/Tag/styles.js
===================================================================
--- package/dist/Tag/styles.js
+++ package/dist/Tag/styles.js
@@ -1,6 +1,6 @@
 import { css, states, theme, variant } from '@codecademy/gamut-styles';
-import { ButtonSelectors, Selectors } from '../ButtonBase/ButtonBase';
+import { InteractiveSelectors, Selectors } from '../ButtonBase/ButtonBase';
 export const tagLabelFontSize = 14;
 export const tagLabelPadding = 8;
 export const tagBaseStyles = {
   alignItems: 'center',
@@ -69,9 +69,9 @@
     navigation: {
       bg: 'background-current',
       border: 1,
       borderColor: 'border-secondary',
-      [ButtonSelectors.ACTIVE]: {
+      [InteractiveSelectors.ACTIVE]: {
         bg: 'secondary'
       }
     },
     suggestion: {
@@ -136,33 +136,33 @@
     ':before': {
       display: 'none'
     },
     color: 'text',
-    [ButtonSelectors.FOCUS_VISIBLE]: {
+    [InteractiveSelectors.FOCUS_VISIBLE]: {
       outline: 'none',
       border: 'none'
     },
-    [ButtonSelectors.FOCUS]: {
+    [InteractiveSelectors.FOCUS]: {
       textDecoration: 'none'
     },
-    [ButtonSelectors.HOVER]: {
+    [InteractiveSelectors.HOVER]: {
       bg: 'background-hover'
     },
-    [ButtonSelectors.DISABLED]: {
+    [InteractiveSelectors.DISABLED]: {
       borderColor: 'border-disabled',
       bg: 'background-current'
     }
   },
   variants: {
     navigation: {
-      [ButtonSelectors.ACTIVE]: {
+      [InteractiveSelectors.ACTIVE]: {
         color: 'background',
         bg: 'secondary',
         textDecoration: 'none'
       }
     },
     suggestion: {
-      [ButtonSelectors.ACTIVE]: {
+      [InteractiveSelectors.ACTIVE]: {
         bg: 'primary',
         color: 'background',
         textDecoration: 'none'
       }
@@ -174,9 +174,9 @@
   '::before, ::after': {
     display: 'none'
   },
   // This removes a black solid outline on focus
-  [ButtonSelectors.OUTLINE_FOCUS_VISIBLE]: {
+  [InteractiveSelectors.OUTLINE_FOCUS_VISIBLE]: {
     opacity: 0
   }
 };
 export const dismissButtonLargeStyling = states({
@@ -194,9 +194,9 @@
   [hoverAndFocus]: {
     color: 'background',
     bg: 'secondary-hover'
   },
-  [ButtonSelectors.DISABLED]: {
+  [InteractiveSelectors.DISABLED]: {
     bg: 'background-disabled',
     color: 'text-disabled'
   },
   ...dismissSharedStyles,