@primer/components 0.0.0-20219835928 → 0.0.0-2022530195733

package/lib/Position.js

@@ -3,7 +3,11 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Sticky = exports.Relative = exports.Fixed = exports.Absolute = exports.default = void 0;
+exports.Absolute = Absolute;
+exports.Fixed = Fixed;
+exports.Relative = Relative;
+exports.Sticky = Sticky;
+exports.default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
@@ -11,77 +15,54 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
 
 var _Box = _interopRequireDefault(require("./Box"));
 
+var _constants = require("./constants");
+
+var _sx = _interopRequireDefault(require("./sx"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: 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); }
 
-/**
- * @deprecated Use the Box component instead (i.e. <Position> → <Box>)
- */
 const Position = (0, _styledComponents.default)(_Box.default).withConfig({
   displayName: "Position",
   componentId: "fla1y3-0"
-})([""]);
-
-/**
- * @deprecated Use the Box component instead (i.e. <Absolute> → <Box position="absolute">)
- */
+})(["", ";", ";"], _constants.POSITION, _sx.default);
 var _default = Position; // Absolute
 
 exports.default = _default;
 
-/**
- * @deprecated Use the Box component instead (i.e. <Absolute> → <Box position="absolute">)
- */
-const Absolute = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+function Absolute(props) {
   return /*#__PURE__*/_react.default.createElement(Position, _extends({}, props, {
-    position: "absolute",
-    ref: ref
+    position: "absolute"
   }));
-});
+}
 
-exports.Absolute = Absolute;
-Absolute.displayName = 'Absolute'; // Fixed
+Absolute.displayName = "Absolute";
 
-/**
- * @deprecated Use the Box component instead (i.e. <Fixed> → <Box position="fixed">)
- */
-const Fixed = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+function Fixed(props) {
   return /*#__PURE__*/_react.default.createElement(Position, _extends({}, props, {
-    position: "fixed",
-    ref: ref
+    position: "fixed"
   }));
-});
+}
 
-exports.Fixed = Fixed;
-Fixed.displayName = 'Fixed'; // Relative
+Fixed.displayName = "Fixed";
 
-/**
- * @deprecated Use the Box component instead (i.e. <Relative> → <Box position="relative">)
- */
-const Relative = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+function Relative(props) {
   return /*#__PURE__*/_react.default.createElement(Position, _extends({}, props, {
-    position: "relative",
-    ref: ref
+    position: "relative"
   }));
-});
+}
 
-exports.Relative = Relative;
-Relative.displayName = 'Relative'; // Sticky
+Relative.displayName = "Relative";
 
-/**
- * @deprecated Use the Box component instead (i.e. <Sticky> → <Box position="sticky">)
- */
-const Sticky = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+function Sticky(props) {
   return /*#__PURE__*/_react.default.createElement(Position, _extends({}, props, {
-    position: "sticky",
-    ref: ref
+    position: "sticky"
   }));
-});
+}
 
-exports.Sticky = Sticky;
+Sticky.displayName = "Sticky";
 Sticky.defaultProps = {
   top: 0,
   zIndex: 1
-};
-Sticky.displayName = 'Sticky';
+};

package/lib/ProgressBar.js

@@ -33,7 +33,7 @@ const sizeMap = {
 const ProgressContainer = _styledComponents.default.span.withConfig({
   displayName: "ProgressBar__ProgressContainer",
   componentId: "sc-1tiva13-1"
-})(["display:", ";overflow:hidden;background-color:", ";border-radius:", ";height:", ";", " ", " ", ";"], props => props.inline ? 'inline-flex' : 'flex', (0, _constants.get)('colors.border.default'), (0, _constants.get)('radii.1'), props => sizeMap[props.barSize || 'default'], _constants.COMMON, _styledSystem.width, _sx.default);
+})(["display:", ";overflow:hidden;background-color:", ";border-radius:", ";height:", ";", " ", " ", ";"], props => props.inline ? 'inline-flex' : 'flex', (0, _constants.get)('colors.border.primary'), (0, _constants.get)('radii.1'), props => sizeMap[props.barSize || 'default'], _constants.COMMON, _styledSystem.width, _sx.default);
 
 function ProgressBar({
   progress,

package/lib/SelectMenu/SelectMenu.js

@@ -41,9 +41,9 @@ var _SelectMenuTabs = _interopRequireDefault(require("./SelectMenuTabs"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 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); }
 
@@ -68,10 +68,10 @@ const StyledSelectMenu = _styledComponents.default.details.withConfig({
 })(["", " ", " ", ";"], wrapperStyles, _constants.COMMON, _sx.default);
 
 // 'as' is spread out because we don't want users to be able to change the tag.
-const SelectMenu = /*#__PURE__*/_react.default.forwardRef(({
+const SelectMenu = _react.default.forwardRef(({
   children,
   initialTab = '',
-  as: _ignoredAs,
+  as,
   ...rest
 }, forwardedRef) => {
   const backupRef = (0, _react.useRef)(null);

package/lib/SelectMenu/SelectMenuContext.js

@@ -7,5 +7,5 @@ exports.MenuContext = void 0;
 
 var _react = require("react");
 
-const MenuContext = /*#__PURE__*/(0, _react.createContext)({});
+const MenuContext = (0, _react.createContext)({});
 exports.MenuContext = MenuContext;

package/lib/SelectMenu/SelectMenuDivider.js

@@ -13,11 +13,11 @@ var _sx = _interopRequireDefault(require("../sx"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-const dividerStyles = (0, _styledComponents.css)(["padding:", " ", ";margin:0;font-size:", ";font-weight:", ";color:", ";background-color:", ";border-bottom:", " solid ", ";"], (0, _constants.get)('space.1'), (0, _constants.get)('space.3'), (0, _constants.get)('fontSizes.0'), (0, _constants.get)('fontWeights.bold'), (0, _constants.get)('colors.fg.muted'), (0, _constants.get)('colors.canvas.subtle'), (0, _constants.get)('borderWidths.1'), (0, _constants.get)('colors.border.muted'));
+const dividerStyles = (0, _styledComponents.css)(["padding:", " ", ";margin:0;font-size:", ";font-weight:", ";color:", ";background-color:", ";border-bottom:", " solid ", ";"], (0, _constants.get)('space.1'), (0, _constants.get)('space.3'), (0, _constants.get)('fontSizes.0'), (0, _constants.get)('fontWeights.bold'), (0, _constants.get)('colors.text.tertiary'), (0, _constants.get)('colors.bg.tertiary'), (0, _constants.get)('borderWidths.1'), (0, _constants.get)('colors.selectMenu.borderSecondary'));
 
 const SelectMenuDivider = _styledComponents.default.div.withConfig({
   displayName: "SelectMenuDivider",

package/lib/SelectMenu/SelectMenuFilter.js

@@ -19,21 +19,21 @@ var _SelectMenuContext = require("./SelectMenuContext");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 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); }
 
 const StyledForm = _styledComponents.default.form.withConfig({
   displayName: "SelectMenuFilter__StyledForm",
   componentId: "s7ktlh-0"
-})(["padding:", ";margin:0;border-bottom:", " solid ", ";background-color:", ";", ";@media (min-width:", "){padding:", ";}", ";"], (0, _constants.get)('space.3'), (0, _constants.get)('borderWidths.1'), (0, _constants.get)('colors.border.muted'), (0, _constants.get)('colors.canvas.overlay'), _constants.COMMON, (0, _constants.get)('breakpoints.0'), (0, _constants.get)('space.2'), _sx.default);
+})(["padding:", ";margin:0;border-bottom:", " solid ", ";background-color:", ";", ";@media (min-width:", "){padding:", ";}", ";"], (0, _constants.get)('space.3'), (0, _constants.get)('borderWidths.1'), (0, _constants.get)('colors.selectMenu.borderSecondary'), (0, _constants.get)('colors.bg.overlay'), _constants.COMMON, (0, _constants.get)('breakpoints.0'), (0, _constants.get)('space.2'), _sx.default);
 
-const SelectMenuFilter = /*#__PURE__*/(0, _react.forwardRef)(({
+const SelectMenuFilter = (0, _react.forwardRef)(({
   theme,
   value,
-  sx: sxProp,
+  sx,
   ...rest
 }, forwardedRef) => {
   const inputRef = (0, _react.useRef)(null);
@@ -51,7 +51,7 @@ const SelectMenuFilter = /*#__PURE__*/(0, _react.forwardRef)(({
   }, [open]);
   return /*#__PURE__*/_react.default.createElement(StyledForm, {
     theme: theme,
-    sx: sxProp
+    sx: sx
   }, /*#__PURE__*/_react.default.createElement(_TextInput.default, _extends({
     theme: theme,
     ref: ref,

package/lib/SelectMenu/SelectMenuFooter.js

@@ -13,11 +13,11 @@ var _sx = _interopRequireDefault(require("../sx"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-const footerStyles = (0, _styledComponents.css)(["margin-top:-1px;padding:", " ", ";font-size:", ";color:", ";text-align:center;border-top:", " solid ", ";@media (min-width:", "){padding:", " ", ";}"], (0, _constants.get)('space.2'), (0, _constants.get)('space.3'), (0, _constants.get)('fontSizes.0'), (0, _constants.get)('colors.fg.muted'), (0, _constants.get)('borderWidths.1'), (0, _constants.get)('colors.border.muted'), (0, _constants.get)('breakpoints.0'), (0, _constants.get)('space.1'), (0, _constants.get)('space.2'));
+const footerStyles = (0, _styledComponents.css)(["margin-top:-1px;padding:", " ", ";font-size:", ";color:", ";text-align:center;border-top:", " solid ", ";@media (min-width:", "){padding:", " ", ";}"], (0, _constants.get)('space.2'), (0, _constants.get)('space.3'), (0, _constants.get)('fontSizes.0'), (0, _constants.get)('colors.text.tertiary'), (0, _constants.get)('borderWidths.1'), (0, _constants.get)('colors.selectMenu.borderSecondary'), (0, _constants.get)('breakpoints.0'), (0, _constants.get)('space.1'), (0, _constants.get)('space.2'));
 
 const SelectMenuFooter = _styledComponents.default.footer.withConfig({
   displayName: "SelectMenuFooter",

package/lib/SelectMenu/SelectMenuHeader.js

@@ -22,12 +22,12 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 const SelectMenuTitle = _styledComponents.default.h3.withConfig({
   displayName: "SelectMenuHeader__SelectMenuTitle",
   componentId: "sc-1pwppzc-0"
-})(["color:", ";flex:auto;font-size:", ";font-weight:", ";margin:0;@media (min-width:", "){font-size:inherit;}"], (0, _constants.get)('colors.fg.default'), (0, _constants.get)('fontSizes.1'), (0, _constants.get)('fontWeights.bold'), (0, _constants.get)('breakpoints.0'));
+})(["color:", ";flex:auto;font-size:", ";font-weight:", ";margin:0;@media (min-width:", "){font-size:inherit;}"], (0, _constants.get)('colors.text.primary'), (0, _constants.get)('fontSizes.1'), (0, _constants.get)('fontWeights.bold'), (0, _constants.get)('breakpoints.0'));
 
 const StyledHeader = _styledComponents.default.header.withConfig({
   displayName: "SelectMenuHeader__StyledHeader",
   componentId: "sc-1pwppzc-1"
-})(["display:flex;flex:none;padding:", ";border-bottom:", " solid ", ";", " ", " @media (min-width:", "){padding-top:", ";padding-bottom:", ";}", ";"], (0, _constants.get)('space.3'), (0, _constants.get)('borderWidths'), (0, _constants.get)('colors.border.muted'), _constants.COMMON, _constants.TYPOGRAPHY, (0, _constants.get)('breakpoints.0'), (0, _constants.get)('space.2'), (0, _constants.get)('space.2'), _sx.default);
+})(["display:flex;flex:none;padding:", ";border-bottom:", " solid ", ";", " ", " @media (min-width:", "){padding-top:", ";padding-bottom:", ";}", ";"], (0, _constants.get)('space.3'), (0, _constants.get)('borderWidths'), (0, _constants.get)('colors.selectMenu.borderSecondary'), _constants.COMMON, _constants.TYPOGRAPHY, (0, _constants.get)('breakpoints.0'), (0, _constants.get)('space.2'), (0, _constants.get)('space.2'), _sx.default);
 
 const SelectMenuHeader = ({
   children,

package/lib/SelectMenu/SelectMenuItem.js

@@ -21,13 +21,13 @@ var _SelectMenuContext = require("./SelectMenuContext");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 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); }
 
-const listItemStyles = (0, _styledComponents.css)(["display:flex;align-items:center;padding:", ";overflow:hidden;text-align:left;cursor:pointer;background-color:", ";border:0;border-bottom:", " solid ", ";color:", ";text-decoration:none;font-size:", ";font-family:inherit;width:100%;&:hover{text-decoration:none;}&:focus{outline:none;}&[hidden]{display:none !important;}@media (min-width:", "){padding-top:", ";padding-bottom:", ";}.SelectMenu-icon{width:", ";margin-right:", ";flex-shrink:0;}.SelectMenu-selected-icon{visibility:hidden;transition:transform 0.12s cubic-bezier(0.5,0.1,1,0.5),visibility 0s 0.12s linear;transform:scale(0);}&[aria-checked='true']{font-weight:500;color:", ";.SelectMenu-selected-icon{visibility:visible;transition:transform 0.12s cubic-bezier(0,0,0.2,1),visibility 0s linear;transform:scale(1);}}@media (hover:hover){&:hover,&:active,&:focus{background-color:", ";}}@media (hover:none){&:focus,&:active{background-color:", ";}-webkit-tap-highlight-color:", ";}"], (0, _constants.get)('space.3'), (0, _constants.get)('colors.canvas.overlay'), (0, _constants.get)('borderWidths.1'), (0, _constants.get)('colors.border.muted'), (0, _constants.get)('colors.fg.muted'), (0, _constants.get)('fontSizes.0'), (0, _constants.get)('breakpoints.0'), (0, _constants.get)('space.2'), (0, _constants.get)('space.2'), (0, _constants.get)('space.3'), (0, _constants.get)('space.2'), (0, _constants.get)('colors.fg.default'), (0, _constants.get)('colors.neutral.subtle'), (0, _constants.get)('colors.canvas.subtle'), (0, _constants.get)('colors.selectMenu.tapHighlight'));
+const listItemStyles = (0, _styledComponents.css)(["display:flex;align-items:center;padding:", ";overflow:hidden;text-align:left;cursor:pointer;background-color:", ";border:0;border-bottom:", " solid ", ";color:", ";text-decoration:none;font-size:", ";font-family:inherit;width:100%;&:hover{text-decoration:none;}&:focus{outline:none;}&[hidden]{display:none !important;}@media (min-width:", "){padding-top:", ";padding-bottom:", ";}.SelectMenu-icon{width:", ";margin-right:", ";flex-shrink:0;}.SelectMenu-selected-icon{visibility:hidden;transition:transform 0.12s cubic-bezier(0.5,0.1,1,0.5),visibility 0s 0.12s linear;transform:scale(0);}&[aria-checked='true']{font-weight:500;color:", ";.SelectMenu-selected-icon{visibility:visible;transition:transform 0.12s cubic-bezier(0,0,0.2,1),visibility 0s linear;transform:scale(1);}}@media (hover:hover){body:not(.intent-mouse) .SelectMenu-item:focus,&:hover,&:active,&:focus{background-color:", ";}}@media (hover:none){&:focus,&:active{background-color:", ";}-webkit-tap-highlight-color:", ";}"], (0, _constants.get)('space.3'), (0, _constants.get)('colors.bg.overlay'), (0, _constants.get)('borderWidths.1'), (0, _constants.get)('colors.selectMenu.borderSecondary'), (0, _constants.get)('colors.text.secondary'), (0, _constants.get)('fontSizes.0'), (0, _constants.get)('breakpoints.0'), (0, _constants.get)('space.2'), (0, _constants.get)('space.2'), (0, _constants.get)('space.3'), (0, _constants.get)('space.2'), (0, _constants.get)('colors.text.primary'), (0, _constants.get)('colors.state.hover.secondaryBg'), (0, _constants.get)('colors.bg.secondary'), (0, _constants.get)('colors.selectMenu.tapHighlight'));
 exports.listItemStyles = listItemStyles;
 
 const StyledItem = _styledComponents.default.a.attrs(() => ({
@@ -37,7 +37,7 @@ const StyledItem = _styledComponents.default.a.attrs(() => ({
   componentId: "gjymba-0"
 })(["", " ", " ", ";"], listItemStyles, _constants.COMMON, _sx.default);
 
-const SelectMenuItem = /*#__PURE__*/(0, _react.forwardRef)(({
+const SelectMenuItem = (0, _react.forwardRef)(({
   children,
   selected,
   theme,

package/lib/SelectMenu/SelectMenuList.js

@@ -13,11 +13,11 @@ var _sx = _interopRequireDefault(require("../sx"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-const listStyles = (0, _styledComponents.css)(["position:relative;padding:0;margin:0;flex:auto;overflow-x:hidden;overflow-y:auto;background-color:", ";-webkit-overflow-scrolling:touch;@media (hover:hover){.SelectMenuTab:focus{background-color:", ";}.SelectMenuTab:not([aria-checked='true']):hover{color:", ";background-color:", ";}.SelectMenuTab:not([aria-checked='true']):active{color:", ";background-color:", ";}}"], (0, _constants.get)('colors.canvas.overlay'), (0, _constants.get)('colors.selectMenu.tapFocusBg'), (0, _constants.get)('colors.fg.default'), (0, _constants.get)('colors.canvas.subtle'), (0, _constants.get)('colors.fg.default'), (0, _constants.get)('colors.canvas.subtle'));
+const listStyles = (0, _styledComponents.css)(["position:relative;padding:0;margin:0;flex:auto;overflow-x:hidden;overflow-y:auto;background-color:", ";-webkit-overflow-scrolling:touch;@media (hover:hover){.SelectMenuTab:focus{background-color:", ";}.SelectMenuTab:not([aria-checked='true']):hover{color:", ";background-color:", ";}.SelectMenuTab:not([aria-checked='true']):active{color:", ";background-color:", ";}}"], (0, _constants.get)('colors.bg.overlay'), (0, _constants.get)('colors.selectMenu.tapFocusBg'), (0, _constants.get)('colors.text.primary'), (0, _constants.get)('colors.bg.tertiary'), (0, _constants.get)('colors.text.primary'), (0, _constants.get)('colors.bg.tertiary'));
 
 const SelectMenuList = _styledComponents.default.div.withConfig({
   displayName: "SelectMenuList",

package/lib/SelectMenu/SelectMenuLoadingAnimation.js

@@ -7,21 +7,32 @@ exports.default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
-var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+
+var _StyledOcticon = _interopRequireDefault(require("../StyledOcticon"));
+
+var _octiconsReact = require("@primer/octicons-react");
 
 var _constants = require("../constants");
 
-var _Spinner = _interopRequireDefault(require("../Spinner"));
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+const pulseKeyframes = (0, _styledComponents.keyframes)(["0%{opacity:0.3;}10%{opacity:1;}100%{opacity:0.3;}"]);
+
 const Animation = _styledComponents.default.div.withConfig({
   displayName: "SelectMenuLoadingAnimation__Animation",
   componentId: "sc-17k54td-0"
-})(["padding:", " ", ";text-align:center;background-color:", ";", ""], (0, _constants.get)('space.6'), (0, _constants.get)('space.4'), (0, _constants.get)('colors.canvas.overlay'), _constants.COMMON);
+})(["padding:", " ", ";text-align:center;background-color:", ";animation-name:", ";animation-duration:2s;animation-timing-function:linear;animation-iteration-count:infinite;", ""], (0, _constants.get)('space.6'), (0, _constants.get)('space.4'), (0, _constants.get)('colors.bg.overlay'), pulseKeyframes, _constants.COMMON);
 
 const SelectMenuLoadingAnimation = props => {
-  return /*#__PURE__*/_react.default.createElement(Animation, props, /*#__PURE__*/_react.default.createElement(_Spinner.default, null));
+  return /*#__PURE__*/_react.default.createElement(Animation, props, /*#__PURE__*/_react.default.createElement(_StyledOcticon.default, {
+    size: 32,
+    icon: _octiconsReact.OctofaceIcon
+  }));
 };
 
 SelectMenuLoadingAnimation.displayName = "SelectMenuLoadingAnimation";

package/lib/SelectMenu/SelectMenuModal.js

@@ -15,17 +15,17 @@ var _constants = require("../constants");
 
 var _sx = _interopRequireDefault(require("../sx"));
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: 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); }
 
 const animateModal = (0, _styledComponents.keyframes)(["0%{opacity:0;transform:scale(0.9);}"]);
-const modalStyles = (0, _styledComponents.css)(["position:relative;z-index:99;display:flex;", ";max-height:", ";margin:auto 0;", ";overflow:hidden;pointer-events:auto;flex-direction:column;background-color:", ";border-radius:", ";box-shadow:", ";animation:", " 0.12s cubic-bezier(0,0.1,0.1,1) backwards;@media (min-width:", "){height:auto;max-height:350px;margin:", " 0 ", " 0;font-size:", ";border:", " solid ", ";border-radius:", ";box-shadow:", ";}"], props => props.filter ? 'height: 80%' : '', props => props.filter ? 'none' : '66%', props => props.filter ? 'margin-top: 0' : '', (0, _constants.get)('colors.canvas.overlay'), (0, _constants.get)('radii.2'), (0, _constants.get)('shadows.shadow.small'), animateModal, (0, _constants.get)('breakpoints.0'), (0, _constants.get)('space.1'), (0, _constants.get)('space.3'), (0, _constants.get)('fontSizes.0'), (0, _constants.get)('borderWidths.1'), (0, _constants.get)('colors.border.default'), (0, _constants.get)('radii.2'), (0, _constants.get)('shadows.shadow.small'));
-const modalWrapperStyles = (0, _styledComponents.css)(["position:fixed;top:0;right:0;bottom:0;left:0;z-index:99;display:flex;padding:", ";pointer-events:none;flex-direction:column;&::before{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;content:'';background-color:", ";@media (min-width:", "){display:none;}}@media (min-width:", "){position:absolute;top:auto;right:", ";bottom:auto;left:auto;padding:0;}"], (0, _constants.get)('space.3'), (0, _constants.get)('colors.primer.canvas.backdrop'), (0, _constants.get)('breakpoints.0'), (0, _constants.get)('breakpoints.0'), props => props.align === 'right' ? '0' : 'auto');
+const modalStyles = (0, _styledComponents.css)(["position:relative;z-index:99;display:flex;", ";max-height:", ";margin:auto 0;", ";overflow:hidden;pointer-events:auto;flex-direction:column;background-color:", ";border-radius:", ";box-shadow:", ";animation:", " 0.12s cubic-bezier(0,0.1,0.1,1) backwards;@media (min-width:", "){height:auto;max-height:350px;margin:", " 0 ", " 0;font-size:", ";border:", " solid ", ";border-radius:", ";box-shadow:", ";}"], props => props.filter ? 'height: 80%' : '', props => props.filter ? 'none' : '66%', props => props.filter ? 'margin-top: 0' : '', (0, _constants.get)('colors.bg.overlay'), (0, _constants.get)('radii.2'), (0, _constants.get)('shadows.shadow.small'), animateModal, (0, _constants.get)('breakpoints.0'), (0, _constants.get)('space.1'), (0, _constants.get)('space.3'), (0, _constants.get)('fontSizes.0'), (0, _constants.get)('borderWidths.1'), (0, _constants.get)('colors.border.overlay'), (0, _constants.get)('radii.2'), (0, _constants.get)('shadows.shadow.small'));
+const modalWrapperStyles = (0, _styledComponents.css)(["position:fixed;top:0;right:0;bottom:0;left:0;z-index:99;display:flex;padding:", ";pointer-events:none;flex-direction:column;&::before{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;content:'';background-color:", ";@media (min-width:", "){display:none;}}@media (min-width:", "){position:absolute;top:auto;right:", ";bottom:auto;left:auto;padding:0;}"], (0, _constants.get)('space.3'), (0, _constants.get)('colors.selectMenu.backdropBg'), (0, _constants.get)('breakpoints.0'), (0, _constants.get)('breakpoints.0'), props => props.align === 'right' ? '0' : 'auto');
 
 const Modal = _styledComponents.default.div.withConfig({
   displayName: "SelectMenuModal__Modal",
@@ -37,10 +37,10 @@ const ModalWrapper = _styledComponents.default.div.withConfig({
   componentId: "sc-1m5qo55-1"
 })(["", " ", " ", ";"], modalWrapperStyles, _constants.COMMON, _sx.default);
 
-const SelectMenuModal = /*#__PURE__*/_react.default.forwardRef(({
+const SelectMenuModal = _react.default.forwardRef(({
   children,
   theme,
-  width: widthProp,
+  width,
   ...rest
 }, forwardedRef) => {
   return /*#__PURE__*/_react.default.createElement(ModalWrapper, _extends({
@@ -50,7 +50,7 @@ const SelectMenuModal = /*#__PURE__*/_react.default.forwardRef(({
     ref: forwardedRef
   }), /*#__PURE__*/_react.default.createElement(Modal, {
     theme: theme,
-    width: widthProp
+    width: width
   }, children));
 });
 

package/lib/SelectMenu/SelectMenuTab.js

@@ -17,15 +17,15 @@ var _sx = _interopRequireDefault(require("../sx"));
 
 var _SelectMenuContext = require("./SelectMenuContext");
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: 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); }
 
-const tabStyles = (0, _styledComponents.css)(["flex:1;padding:", " ", ";font-size:", ";font-weight:500;color:", ";text-align:center;background-color:transparent;border:0;box-shadow:inset 0 -1px 0 ", ";@media (min-width:", "){flex:none;padding:", " ", ";border:", " solid transparent;border-bottom-width:0;border-top-left-radius:", ";border-top-right-radius:", ";}&[aria-selected='true']{z-index:1;color:", ";background-color:", ";box-shadow:0 0 0 1px ", ";@media (min-width:", "){border-color:", ";box-shadow:none;}}&:focus{background-color:", ";}"], (0, _constants.get)('space.2'), (0, _constants.get)('space.3'), (0, _constants.get)('fontSizes.0'), (0, _constants.get)('colors.fg.muted'), (0, _constants.get)('colors.border.muted'), (0, _constants.get)('breakpoints.0'), (0, _constants.get)('space.1'), (0, _constants.get)('space.3'), (0, _constants.get)('borderWidths.1'), (0, _constants.get)('radii.2'), (0, _constants.get)('radii.2'), (0, _constants.get)('colors.text-primary'), (0, _constants.get)('colors.canvas.overlay'), (0, _constants.get)('colors.border.muted'), (0, _constants.get)('breakpoints.0'), (0, _constants.get)('colors.border.muted'), (0, _constants.get)('colors.neutral.subtle'));
+const tabStyles = (0, _styledComponents.css)(["flex:1;padding:", " ", ";font-size:", ";font-weight:500;color:", ";text-align:center;background-color:transparent;border:0;box-shadow:inset 0 -1px 0 ", ";@media (min-width:", "){flex:none;padding:", " ", ";border:", " solid transparent;border-bottom-width:0;border-top-left-radius:", ";border-top-right-radius:", ";}&[aria-selected='true']{z-index:1;color:", ";background-color:", ";box-shadow:0 0 0 1px ", ";@media (min-width:", "){border-color:", ";box-shadow:none;}}&:focus{background-color:", ";}"], (0, _constants.get)('space.2'), (0, _constants.get)('space.3'), (0, _constants.get)('fontSizes.0'), (0, _constants.get)('colors.text.tertiary'), (0, _constants.get)('colors.selectMenu.borderSecondary'), (0, _constants.get)('breakpoints.0'), (0, _constants.get)('space.1'), (0, _constants.get)('space.3'), (0, _constants.get)('borderWidths.1'), (0, _constants.get)('radii.2'), (0, _constants.get)('radii.2'), (0, _constants.get)('colors.text-primary'), (0, _constants.get)('colors.bg.overlay'), (0, _constants.get)('colors.selectMenu.borderSecondary'), (0, _constants.get)('breakpoints.0'), (0, _constants.get)('colors.selectMenu.borderSecondary'), (0, _constants.get)('colors.state.hover.secondaryBg'));
 
 const StyledTab = _styledComponents.default.button.withConfig({
   displayName: "SelectMenuTab__StyledTab",

package/lib/SelectMenu/SelectMenuTabPanel.js

@@ -19,16 +19,16 @@ var _SelectMenuList = _interopRequireDefault(require("./SelectMenuList"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 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); }
 
 const TabPanelBase = _styledComponents.default.div.withConfig({
   displayName: "SelectMenuTabPanel__TabPanelBase",
   componentId: "ck0ipe-0"
-})(["border-top:", " solid ", ";", " ", ";"], (0, _constants.get)('borderWidths.1'), (0, _constants.get)('colors.border.muted'), _constants.COMMON, _sx.default);
+})(["border-top:", " solid ", ";", " ", ";"], (0, _constants.get)('borderWidths.1'), (0, _constants.get)('colors.selectMenu.borderSecondary'), _constants.COMMON, _sx.default);
 
 const TabPanel = ({
   tabName,

package/lib/SelectMenu/SelectMenuTabs.js

@@ -13,9 +13,9 @@ var _constants = require("../constants");
 
 var _sx = _interopRequireDefault(require("../sx"));
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 

package/lib/SelectMenu/hooks/useKeyboardNav.js

@@ -83,8 +83,6 @@ function useKeyboardNav(details, open, setOpen) {
           }
         }
         break;
-
-      default:
     }
   }, [details, open, setOpen]);
   (0, _react.useEffect)(() => {

package/lib/SideNav.js

@@ -5,25 +5,25 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _constants = require("./constants");
+var _classnames = _interopRequireDefault(require("classnames"));
 
-var _styledComponents = _interopRequireWildcard(require("styled-components"));
+var _react = _interopRequireDefault(require("react"));
 
-var _Box = _interopRequireDefault(require("./Box"));
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
 
-var _Link = _interopRequireDefault(require("./Link"));
+var _BorderBox = _interopRequireDefault(require("./BorderBox"));
 
-var _react = _interopRequireDefault(require("react"));
+var _constants = require("./constants");
 
-var _classnames = _interopRequireDefault(require("classnames"));
+var _Link = _interopRequireDefault(require("./Link"));
 
 var _sx = _interopRequireDefault(require("./sx"));
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: 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); }
 
@@ -43,11 +43,7 @@ function SideNavBase({
     };
   }
 
-  return /*#__PURE__*/_react.default.createElement(_Box.default, _extends({
-    borderWidth: "1px",
-    borderStyle: "solid",
-    borderColor: "border.default",
-    borderRadius: 2,
+  return /*#__PURE__*/_react.default.createElement(_BorderBox.default, _extends({
     as: "nav",
     className: newClassName
   }, props), children);
@@ -57,11 +53,7 @@ SideNavBase.displayName = "SideNavBase";
 const SideNav = (0, _styledComponents.default)(SideNavBase).withConfig({
   displayName: "SideNav",
   componentId: "sc-15k667c-0"
-})(["background-color:", ";", " ", ";", ";"], (0, _constants.get)('colors.canvas.subtle'), props => props.bordered && (0, _styledComponents.css)(["& > &{border-left:0;border-right:0;border-bottom:0;}"]), _constants.COMMON, _sx.default);
-// used for variant normal hover, focus pseudo selectors
-const CommonAccessibilityVariantNormalStyles = (0, _styledComponents.css)(["background-color:", ";outline:none;text-decoration:none;"], (0, _constants.get)('colors.neutral.subtle')); // used for light weight hover, focus pseudo selectors
-
-const CommonAccessibilityVariantLightWeightStyles = (0, _styledComponents.css)(["color:", ";text-decoration:none;outline:none;"], (0, _constants.get)('colors.fg.default'));
+})(["background-color:", ";", " ", ";", ";"], (0, _constants.get)('colors.bg.secondary'), props => props.bordered && (0, _styledComponents.css)(["& > &{border-left:0;border-right:0;border-bottom:0;}"]), _constants.COMMON, _sx.default);
 const SideNavLink = (0, _styledComponents.default)(_Link.default).attrs(props => {
   const isReactRouter = typeof props.to === 'string';
 
@@ -77,7 +69,7 @@ const SideNavLink = (0, _styledComponents.default)(_Link.default).attrs(props =>
 }).withConfig({
   displayName: "SideNav__SideNavLink",
   componentId: "sc-15k667c-1"
-})(["position:relative;display:block;", " width:100%;text-align:left;font-size:", ";& > ", "{border-bottom:none;}", ".variant-normal > &{color:", ";padding:", ";border:0;border-top:", " solid ", ";&:first-child{border-top:0;border-top-right-radius:", ";border-top-left-radius:", ";}&:last-child{border-bottom-right-radius:", ";border-bottom-left-radius:", ";}&::before{position:absolute;top:0;bottom:0;left:0;z-index:1;width:3px;pointer-events:none;content:'';}&:hover{", "}&:focus{", " box-shadow:", ";z-index:1;}&[aria-current='page'],&[aria-selected='true']{background-color:", ";&::before{background-color:", ";}}}", ".variant-lightweight > &{padding:", " 0;color:", ";&:hover{", "}&:focus{", " box-shadow:", ";z-index:1;}&[aria-current='page'],&[aria-selected='true']{color:", ";font-weight:", ";}}", ";"], props => props.variant === 'full' && (0, _styledComponents.css)(["display:flex;align-items:center;justify-content:space-between;"]), (0, _constants.get)('fontSizes.1'), SideNav, SideNav, (0, _constants.get)('colors.fg.default'), (0, _constants.get)('space.3'), (0, _constants.get)('borderWidths.1'), (0, _constants.get)('colors.border.muted'), (0, _constants.get)('radii.2'), (0, _constants.get)('radii.2'), (0, _constants.get)('radii.2'), (0, _constants.get)('radii.2'), CommonAccessibilityVariantNormalStyles, CommonAccessibilityVariantNormalStyles, (0, _constants.get)('shadows.primer.shadow.focus'), (0, _constants.get)('colors.sidenav.selectedBg'), (0, _constants.get)('colors.primer.border.active'), SideNav, (0, _constants.get)('space.1'), (0, _constants.get)('colors.accent.fg'), CommonAccessibilityVariantLightWeightStyles, CommonAccessibilityVariantLightWeightStyles, (0, _constants.get)('shadows.primer.shadow.focus'), (0, _constants.get)('colors.fg.default'), (0, _constants.get)('fontWeights.semibold'), _sx.default);
+})(["position:relative;display:block;", " width:100%;text-align:left;font-size:", ";& > ", "{border-bottom:none;}&:first-child{border-top-right-radius:", ";border-top-left-radius:", ";}&:last-child{border-bottom-right-radius:", ";border-bottom-left-radius:", ";}", ".variant-normal > &{color:", ";padding:", ";border:0;border-top:", " solid ", ";&:first-child{border-top:0;}&::before{position:absolute;top:0;bottom:0;left:0;z-index:1;width:3px;pointer-events:none;content:'';}&:hover,&:focus{text-decoration:none;background-color:", ";outline:none;}&[aria-current='page'],&[aria-selected='true']{background-color:", ";&::before{background-color:", ";}}}", ".variant-lightweight > &{padding:", " 0;color:", ";&:hover,&:focus{color:", ";text-decoration:none;outline:none;}&[aria-current='page'],&[aria-selected='true']{color:", ";font-weight:", ";}}", ";"], props => props.variant === 'full' && (0, _styledComponents.css)(["display:flex;align-items:center;justify-content:space-between;"]), (0, _constants.get)('fontSizes.1'), SideNav, (0, _constants.get)('radii.2'), (0, _constants.get)('radii.2'), (0, _constants.get)('radii.2'), (0, _constants.get)('radii.2'), SideNav, (0, _constants.get)('colors.text.primary'), (0, _constants.get)('space.3'), (0, _constants.get)('borderWidths.1'), (0, _constants.get)('colors.border.secondary'), (0, _constants.get)('colors.state.hover.secondaryBg'), (0, _constants.get)('colors.sidenav.selectedBg'), (0, _constants.get)('colors.sidenav.borderActive'), SideNav, (0, _constants.get)('space.1'), (0, _constants.get)('colors.text.link'), (0, _constants.get)('colors.text.primary'), (0, _constants.get)('colors.text.primary'), (0, _constants.get)('fontWeights.semibold'), _sx.default);
 SideNav.defaultProps = {
   variant: 'normal'
 };