@primer/components 0.0.0-2021927193941 → 0.0.0-2021927203131

package/lib/ActionList/Item.js

@@ -35,33 +35,14 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-/**
- * These colors are not yet in our default theme.  Need to remove this once they are added.
- */
 const customItemThemes = {
   default: {
-    hover: {
-      light: 'rgba(46, 77, 108, 0.06)',
-      dark: 'rgba(201, 206, 212, 0.12)',
-      dark_dimmed: 'rgba(201, 206, 212, 0.12)'
-    },
-    focus: {
-      light: 'rgba(54, 77, 100, 0.16)',
-      dark: 'rgba(201, 206, 212, 0.24)',
-      dark_dimmed: 'rgba(201, 206, 212, 0.24)'
-    }
+    hover: (0, _constants.get)('colors.neutral.subtle'),
+    focus: (0, _constants.get)('colors.neutral.muted')
   },
   danger: {
-    hover: {
-      light: 'rgba(234, 74, 90, 0.08)',
-      dark: 'rgba(248, 81, 73, 0.16)',
-      dark_dimmed: 'rgba(248, 81, 73, 0.16)'
-    },
-    focus: {
-      light: 'rgba(234, 74, 90, 0.14)',
-      dark: 'rgba(248, 81, 73, 0.24)',
-      dark_dimmed: 'rgba(248, 81, 73, 0.24)'
-    }
+    hover: (0, _constants.get)('colors.danger.subtle'),
+    focus: (0, _constants.get)('colors.danger.muted')
   }
 };
 /**
@@ -230,8 +211,8 @@ const Item = /*#__PURE__*/_react.default.forwardRef((itemProps, ref) => {
     }
   }, [onAction, disabled, itemProps, onClick]);
   const customItemTheme = customItemThemes[variant];
-  const hoverBackground = (0, _ThemeProvider.useColorSchemeVar)(customItemTheme.hover, 'inherit');
-  const focusBackground = (0, _ThemeProvider.useColorSchemeVar)(customItemTheme.focus, 'inherit');
+  const hoverBackground = customItemTheme.hover;
+  const focusBackground = customItemTheme.focus;
   const {
     theme
   } = (0, _ThemeProvider.useTheme)();

package/lib-esm/ActionList/Item.js

@@ -8,37 +8,17 @@ import Truncate from '../Truncate';
 import styled from 'styled-components';
 import { StyledHeader } from './Header';
 import { StyledDivider } from './Divider';
-import { useColorSchemeVar, useTheme } from '../ThemeProvider';
+import { useTheme } from '../ThemeProvider';
 import { activeDescendantActivatedDirectly, activeDescendantActivatedIndirectly, isActiveDescendantAttribute } from '../behaviors/focusZone';
 import { useSSRSafeId } from '@react-aria/ssr';
-
-/**
- * These colors are not yet in our default theme.  Need to remove this once they are added.
- */
 const customItemThemes = {
   default: {
-    hover: {
-      light: 'rgba(46, 77, 108, 0.06)',
-      dark: 'rgba(201, 206, 212, 0.12)',
-      dark_dimmed: 'rgba(201, 206, 212, 0.12)'
-    },
-    focus: {
-      light: 'rgba(54, 77, 100, 0.16)',
-      dark: 'rgba(201, 206, 212, 0.24)',
-      dark_dimmed: 'rgba(201, 206, 212, 0.24)'
-    }
+    hover: get('colors.neutral.subtle'),
+    focus: get('colors.neutral.muted')
   },
   danger: {
-    hover: {
-      light: 'rgba(234, 74, 90, 0.08)',
-      dark: 'rgba(248, 81, 73, 0.16)',
-      dark_dimmed: 'rgba(248, 81, 73, 0.16)'
-    },
-    focus: {
-      light: 'rgba(234, 74, 90, 0.14)',
-      dark: 'rgba(248, 81, 73, 0.24)',
-      dark_dimmed: 'rgba(248, 81, 73, 0.24)'
-    }
+    hover: get('colors.danger.subtle'),
+    focus: get('colors.danger.muted')
   }
 };
 /**
@@ -197,8 +177,8 @@ export const Item = /*#__PURE__*/React.forwardRef((itemProps, ref) => {
     }
   }, [onAction, disabled, itemProps, onClick]);
   const customItemTheme = customItemThemes[variant];
-  const hoverBackground = useColorSchemeVar(customItemTheme.hover, 'inherit');
-  const focusBackground = useColorSchemeVar(customItemTheme.focus, 'inherit');
+  const hoverBackground = customItemTheme.hover;
+  const focusBackground = customItemTheme.focus;
   const {
     theme
   } = useTheme();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@primer/components",
-  "version": "0.0.0-2021927193941",
+  "version": "0.0.0-2021927203131",
   "description": "Primer react components",
   "main": "lib/index.js",
   "module": "lib-esm/index.js",
@@ -132,7 +132,6 @@
     "rollup-plugin-visualizer": "5.5.0",
     "semver": "7.3.5",
     "size-limit": "5.0.2",
-    "storybook-addon-performance": "0.16.1",
     "styled-components": "4.4.1",
     "typescript": "4.2.2"
   },