@sproutsocial/racine 8.0.0-beta-dark-mode.10 → 8.2.0-link-styles-beta.0

package/lib/IconViewBoxes.js

@@ -3,6 +3,7 @@ module.exports = {
   "add-item": "0 0 16 16",
   "add-keyword": "0 0 16 16",
   "add-team-member": "0 0 18 13",
+  "add-variable": "0 0 18 14",
   "address-card-solid": "0 0 18 16",
   "adobe-experience-manager": "0 0 16 18",
   "ads": "0 0 9 16",
@@ -275,6 +276,7 @@ module.exports = {
   "sent-message": "0 0 16 14",
   "share": "0 0 16 14",
   "shopify": "0 0 16 18",
+  "show-navigation": "0 0 18 14",
   "slack": "0 0 16 16",
   "small-density": "0 0 16 16",
   "smiley": "0 0 16 16",

package/lib/Link/constants.js

@@ -1,7 +1,7 @@
-import { COLOR_BLUE_800, COLOR_BLUE_900 } from "@sproutsocial/seeds-color";
+import { COLOR_BLUE_900 } from "@sproutsocial/seeds-color";
 var defaultLink = {
-  color: "cta.link",
-  hoverColor: COLOR_BLUE_800,
+  color: "link",
+  hoverColor: "link.hover",
   activeColor: COLOR_BLUE_900,
   fontWeight: "semibold"
 };

package/lib/Link/styles.js

@@ -1,11 +1,11 @@
 import styled, { css } from "styled-components";
 import { focusRing, disabled } from "../utils/mixins";
 import Text from "../Text";
-import { TYPOGRAPHY, COMMON } from "../utils/system-props";
+import { TYPOGRAPHY, COMMON, FLEXBOX } from "../utils/system-props";
 var Container = styled(Text).withConfig({
   displayName: "styles__Container",
   componentId: "adcw4a-0"
-})(["border:0;font-family:", ";text-decoration:", ";appearance:none;cursor:pointer;", " font-weight:", ";color:", ";&:hover{color:", ";text-decoration:underline;}&:active{color:", ";}&:focus{", "}&:focus:active{box-shadow:none;}", " ", " ", " ", ""], function (props) {
+})(["border:0;font-family:", ";text-decoration:", ";appearance:none;cursor:pointer;", " font-weight:", ";color:", ";&:hover{color:", ";text-decoration:underline;}&:active{color:", ";}&:focus{", "}&:focus:active{box-shadow:none;}", " ", " ", " ", " ", ""], function (props) {
   return props.theme.fontFamily;
 }, function (props) {
   return props.underline ? "underline" : "none";
@@ -23,5 +23,5 @@ var Container = styled(Text).withConfig({
   return !props.href && css(["background:none;"]);
 }, function (props) {
   return props.disabled && disabled;
-}, COMMON, TYPOGRAPHY);
+}, COMMON, TYPOGRAPHY, FLEXBOX);
 export default Container;

package/lib/Message/index.js

@@ -36,7 +36,7 @@ var avatarSizeMap = function avatarSizeMap(density) {
 var MessageContext = /*#__PURE__*/React.createContext({
   density: MESSAGE_DENSITIES.SMALL,
   borderColor: "container.border.base",
-  bg: "background.container",
+  bg: "container.background.base",
   indentContent: true
 });
 
@@ -47,7 +47,7 @@ var Message = function Message(_ref) {
       _ref$borderColor = _ref.borderColor,
       borderColor = _ref$borderColor === void 0 ? "container.border.base" : _ref$borderColor,
       _ref$bg = _ref.bg,
-      bg = _ref$bg === void 0 ? "background.container" : _ref$bg,
+      bg = _ref$bg === void 0 ? "container.background.base" : _ref$bg,
       _ref$indentContent = _ref.indentContent,
       indentContent = _ref$indentContent === void 0 ? true : _ref$indentContent,
       innerRef = _ref.innerRef,

package/lib/Modal/index.js

@@ -66,11 +66,10 @@ var ModalFooter = function ModalFooter(props) {
 };
 
 ModalFooter.defaultProps = {
-  bg: "background.container"
+  bg: "container.background.base"
 };
-
-// $FlowIssue - upgrade v0.112.0
-var ModalContent = function ModalContent(_ref) {
+var ModalContent = /*#__PURE__*/React.forwardRef( // $FlowIssue - upgrade v0.112.0
+function (_ref, ref) {
   var children = _ref.children,
       rest = _objectWithoutPropertiesLoose(_ref, ["children"]);
 
@@ -79,9 +78,10 @@ var ModalContent = function ModalContent(_ref) {
 
   return /*#__PURE__*/React.createElement(Content, _extends({
     "data-qa-modal": true,
-    "data-qa-label": label
+    "data-qa-label": label,
+    ref: ref
   }, rest), children);
-};
+});
 
 /**
  * The modal you want