@sproutsocial/racine 22.0.0 → 22.1.0

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # Change Log
 
+## 22.1.0
+
+### Minor Changes
+
+- 3ff0f4c: Menu dependencies are now separate packages.
+
+### Patch Changes
+
+- 4f94d34: Fix broken `active` prop on `Menu.Item` component
+
 ## 22.0.0
 
 ### Major Changes

package/README.md

@@ -55,7 +55,8 @@ Racine uses [Storybook](https://storybook.js.org) for local development. Please
 Spin up a draft PR immediately for two reasons:
 
 1. We'll cache your build making all subsequent builds super fast
-2. Add the "📦 create test versions" label to your PR to generate a beta version of the package to use for testing in other projects.
+2. Add the "📦 create test versions" label to your PR to generate a snapshot version of the package to use for testing in other projects.
+3. You'll need to be sure to add a changeset or a bot will comment on your PR prompting you to do so before a snapshot can be created.
 
 _Note: the snapshot will post as a comment on the PR once it has been generated._  
 

package/commonjs/Button/styles.js

@@ -8,6 +8,7 @@ exports.default = void 0;
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 var _seedsReactSystemProps = require("@sproutsocial/seeds-react-system-props");
 var _seedsReactMixins = require("@sproutsocial/seeds-react-mixins");
+var _seedsReactIcon = require("@sproutsocial/seeds-react-icon");
 var _styles = _interopRequireDefault(require("../Icon/styles"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
@@ -15,7 +16,7 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
 var Container = _styledComponents.default.button.withConfig({
   displayName: "styles__Container",
   componentId: "sc-17njgx1-0"
-})(["display:inline-block;box-sizing:border-box;text-align:center;font-family:", ";border:1px solid ", ";border-radius:", ";border-style:", ";background:", ";color:", ";cursor:pointer;text-decoration:none;line-height:16px;white-space:nowrap;font-weight:", ";transition:all ", " linear;margin:0;padding:", ";font-size:", ";&:visited{color:", ";}&:hover{color:", ";", ";text-decoration:none;box-shadow:", ";}&:active{color:", ";", ";transform:translateY(1px);}&:focus{", "}&:focus:active{box-shadow:none;}", " ", " ", " ", "{vertical-align:text-bottom;}", " ", " ", " ", ""], function (props) {
+})(["display:inline-block;box-sizing:border-box;text-align:center;font-family:", ";border:1px solid ", ";border-radius:", ";border-style:", ";background:", ";color:", ";cursor:pointer;text-decoration:none;line-height:16px;white-space:nowrap;font-weight:", ";transition:all ", " linear;margin:0;padding:", ";font-size:", ";&:visited{color:", ";}&:hover{color:", ";", ";text-decoration:none;box-shadow:", ";}&:active{color:", ";", ";transform:translateY(1px);}&:focus{", "}&:focus:active{box-shadow:none;}", " ", " ", " ", ",", "{vertical-align:text-bottom;}", " ", " ", " ", ""], function (props) {
   return props.theme.fontFamily;
 }, function (props) {
   return props.theme.colors.button[props.appearance].border.base;
@@ -53,6 +54,6 @@ var Container = _styledComponents.default.button.withConfig({
   return props.disabled && _seedsReactMixins.disabled;
 }, function (props) {
   return props.appearance === "pill" && (0, _styledComponents.css)(["display:inline-flex;align-items:center;justify-content:center;background-color:transparent;", " &:focus:active,&:hover{background-color:transparent;box-shadow:inset 0px 0px 0px 1px ", ";}"], _seedsReactMixins.pill, props.theme.colors.button.pill.border.hover);
-}, _styles.default, _seedsReactSystemProps.LAYOUT, _seedsReactSystemProps.COMMON, _seedsReactSystemProps.FLEXBOX, _seedsReactSystemProps.GRID);
+}, _seedsReactIcon.IconContainer, _styles.default, _seedsReactSystemProps.LAYOUT, _seedsReactSystemProps.COMMON, _seedsReactSystemProps.FLEXBOX, _seedsReactSystemProps.GRID);
 Container.displayName = "Button-Container";
 var _default = exports.default = Container; //${props.theme.mode === "dark" ? "screen" : "multiply"}

package/commonjs/Input/Input.js

@@ -8,8 +8,8 @@ var React = _interopRequireWildcard(require("react"));
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _useInteractiveColor = require("../utils/useInteractiveColor");
 var _seedsReactUtilities = require("@sproutsocial/seeds-react-utilities");
-var _Button = _interopRequireDefault(require("../Button"));
-var _Icon = _interopRequireDefault(require("../Icon"));
+var _seedsReactButton = _interopRequireDefault(require("@sproutsocial/seeds-react-button"));
+var _seedsReactIcon = _interopRequireDefault(require("@sproutsocial/seeds-react-icon"));
 var _styles = _interopRequireWildcard(require("./styles"));
 var _excluded = ["autoComplete", "autoFocus", "disabled", "readOnly", "isInvalid", "hasWarning", "id", "name", "placeholder", "type", "required", "value", "elemBefore", "elemAfter", "maxLength", "ariaLabel", "ariaDescribedby", "clearButtonLabel", "innerRef", "onBlur", "onChange", "onClear", "onFocus", "onKeyDown", "onKeyUp", "onPaste", "inputProps", "qa", "appearance", "size"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -36,7 +36,7 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 // regardless of whether it is manually included as elemAfter or automatically included for type="search" Inputs.
 
 var InputContext = /*#__PURE__*/React.createContext({});
-var StyledButton = (0, _styledComponents.default)(_Button.default).withConfig({
+var StyledButton = (0, _styledComponents.default)(_seedsReactButton.default).withConfig({
   displayName: "Input__StyledButton",
   componentId: "sc-j6ok5s-0"
 })(["&:hover,&:active{color:", ";}"], function (props) {
@@ -73,7 +73,7 @@ var ClearButton = function ClearButton() {
     title: clearButtonLabel || "Clear",
     ariaLabel: clearButtonLabel || "Clear",
     color: "icon.base"
-  }, /*#__PURE__*/React.createElement(_Icon.default, {
+  }, /*#__PURE__*/React.createElement(_seedsReactIcon.default, {
     name: "circle-x-outline",
     "aria-hidden": true
   }));
@@ -218,7 +218,7 @@ var Input = /*#__PURE__*/function (_React$Component) {
       }
 
       // Add default elemBefore and elemAfter elements if type is search.
-      var elementBefore = type === "search" && !elemBefore ? /*#__PURE__*/React.createElement(_Icon.default, {
+      var elementBefore = type === "search" && !elemBefore ? /*#__PURE__*/React.createElement(_seedsReactIcon.default, {
         name: "magnifying-glass-outline",
         "aria-hidden": true,
         color: "icon.base"

package/commonjs/Menu/Menu.js

@@ -14,7 +14,7 @@ var _innerText = _interopRequireDefault(require("../utils/innerText"));
 var _seedsReactMixins = require("@sproutsocial/seeds-react-mixins");
 var _Box = _interopRequireDefault(require("../Box"));
 var _Button = _interopRequireDefault(require("../Button"));
-var _Checkbox = _interopRequireDefault(require("../Checkbox"));
+var _seedsReactCheckbox = _interopRequireDefault(require("@sproutsocial/seeds-react-checkbox"));
 var _Icon = _interopRequireDefault(require("../Icon"));
 var _Input = _interopRequireDefault(require("../Input"));
 var _Popout = _interopRequireDefault(require("../Popout"));
@@ -23,7 +23,7 @@ var _Switch = _interopRequireDefault(require("../Switch"));
 var _Text = _interopRequireDefault(require("../Text"));
 var _utils = require("./utils");
 var _styles = require("./styles");
-var _excluded = ["id", "index", "as", "children", "role", "elemBefore", "elemAfter", "value", "onKeyPress", "onClick", "selected", "disabled", "indeterminate", "label"],
+var _excluded = ["id", "index", "as", "children", "role", "elemBefore", "elemAfter", "value", "onKeyPress", "onClick", "selected", "disabled", "indeterminate", "label", "active"],
   _excluded2 = ["placement", "labelProps", "switchProps", "children", "id", "label"],
   _excluded3 = ["children", "title", "titleAs", "disabled"],
   _excluded4 = ["type"],
@@ -84,6 +84,7 @@ var MenuItem = exports.MenuItem = function MenuItem(_ref) {
     disabled = _ref.disabled,
     indeterminate = _ref.indeterminate,
     labelProp = _ref.label,
+    activeProp = _ref.active,
     props = _objectWithoutProperties(_ref, _excluded);
   var _useContext = (0, _react.useContext)(_utils.MenuContext),
     menuRole = _useContext.role,
@@ -124,6 +125,9 @@ var MenuItem = exports.MenuItem = function MenuItem(_ref) {
     _useState2 = _slicedToArray(_useState, 2),
     keyPressed = _useState2[0],
     setKeyPressed = _useState2[1];
+  var isActive = (0, _react.useMemo)(function () {
+    return activeProp || isFocused && keyPressed;
+  }, [activeProp, isFocused, keyPressed]);
   var isCheckboxOrRadio = [_utils.MENU_ITEM_ROLES.CHECKBOX, _utils.MENU_ITEM_ROLES.RADIO
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   ].includes(itemRole); // @ts-notes @refactor - since we're only really checking against the string I think we can safely leave this for refactor, nothing else worked for me
@@ -164,7 +168,7 @@ var MenuItem = exports.MenuItem = function MenuItem(_ref) {
   var before = (0, _react.useMemo)(function () {
     if (elemBefore) return elemBefore;
     if (itemRole === _utils.MENU_ITEM_ROLES.CHECKBOX) {
-      return /*#__PURE__*/React.createElement(_Checkbox.default, {
+      return /*#__PURE__*/React.createElement(_seedsReactCheckbox.default, {
         id: "Checkbox-".concat(id),
         checked: isSelected,
         "aria-hidden": "true",
@@ -197,7 +201,8 @@ var MenuItem = exports.MenuItem = function MenuItem(_ref) {
   return /*#__PURE__*/React.createElement(_styles.MenuItemContainer, _extends({
     "data-qa-menu-item": label
   }, props, {
-    active: isFocused && keyPressed,
+    active: isActive,
+    "data-qa-is-active": isActive,
     id: id,
     "aria-label": labelProp,
     value: valueProp,

package/commonjs/Message/Message.js

@@ -8,7 +8,7 @@ exports.default = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _Avatar = _interopRequireDefault(require("../Avatar"));
 var _Button = _interopRequireDefault(require("../Button"));
-var _Checkbox = _interopRequireDefault(require("../Checkbox"));
+var _seedsReactCheckbox = _interopRequireDefault(require("@sproutsocial/seeds-react-checkbox"));
 var _styles = _interopRequireWildcard(require("./styles"));
 var _constants = require("./constants");
 var _excluded = ["children", "density", "borderColor", "bg", "indentContent", "innerRef", "qa"];
@@ -138,7 +138,7 @@ Message.Avatar = MessageAvatar;
 var MessageCheckbox = function MessageCheckbox(props) {
   return /*#__PURE__*/React.createElement(MessageContext.Consumer, null, function (_ref7) {
     var density = _ref7.density;
-    return /*#__PURE__*/React.createElement(_Checkbox.default, _extends({
+    return /*#__PURE__*/React.createElement(_seedsReactCheckbox.default, _extends({
       appearance: "pill"
       // eslint-disable-next-line @typescript-eslint/ban-ts-comment
       // @ts-ignore - `density` is not a valid prop for `Checkbox`

package/commonjs/index.js

@@ -70,15 +70,15 @@ Object.defineProperty(exports, "useTextContent", {
 });
 var _seedsIllustrations = require("@sproutsocial/seeds-illustrations");
 var _seedsPartnerLogos = require("@sproutsocial/seeds-partner-logos");
-var _systemProps = require("./systemProps");
-Object.keys(_systemProps).forEach(function (key) {
+var _seedsReactSystemProps = require("@sproutsocial/seeds-react-system-props");
+Object.keys(_seedsReactSystemProps).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _systemProps[key]) return;
+  if (key in exports && exports[key] === _seedsReactSystemProps[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _systemProps[key];
+      return _seedsReactSystemProps[key];
     }
   });
 });
@@ -168,15 +168,15 @@ Object.keys(_Breadcrumb).forEach(function (key) {
     }
   });
 });
-var _Button = require("./Button");
-Object.keys(_Button).forEach(function (key) {
+var _seedsReactButton = require("@sproutsocial/seeds-react-button");
+Object.keys(_seedsReactButton).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _Button[key]) return;
+  if (key in exports && exports[key] === _seedsReactButton[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _Button[key];
+      return _seedsReactButton[key];
     }
   });
 });
@@ -216,15 +216,15 @@ Object.keys(_ChartLegend).forEach(function (key) {
     }
   });
 });
-var _Checkbox = require("./Checkbox");
-Object.keys(_Checkbox).forEach(function (key) {
+var _seedsReactCheckbox = require("@sproutsocial/seeds-react-checkbox");
+Object.keys(_seedsReactCheckbox).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _Checkbox[key]) return;
+  if (key in exports && exports[key] === _seedsReactCheckbox[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _Checkbox[key];
+      return _seedsReactCheckbox[key];
     }
   });
 });
@@ -300,15 +300,15 @@ Object.keys(_FormField).forEach(function (key) {
     }
   });
 });
-var _Icon = require("./Icon");
-Object.keys(_Icon).forEach(function (key) {
+var _seedsReactIcon = require("@sproutsocial/seeds-react-icon");
+Object.keys(_seedsReactIcon).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _Icon[key]) return;
+  if (key in exports && exports[key] === _seedsReactIcon[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _Icon[key];
+      return _seedsReactIcon[key];
     }
   });
 });
@@ -336,15 +336,15 @@ Object.keys(_Indicator).forEach(function (key) {
     }
   });
 });
-var _Input = require("./Input");
-Object.keys(_Input).forEach(function (key) {
+var _seedsReactInput = require("@sproutsocial/seeds-react-input");
+Object.keys(_seedsReactInput).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _Input[key]) return;
+  if (key in exports && exports[key] === _seedsReactInput[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _Input[key];
+      return _seedsReactInput[key];
     }
   });
 });
@@ -468,39 +468,51 @@ Object.keys(_Numeral).forEach(function (key) {
     }
   });
 });
-var _PartnerLogo = require("./PartnerLogo");
-Object.keys(_PartnerLogo).forEach(function (key) {
+var _seedsReactPartnerLogo = require("@sproutsocial/seeds-react-partner-logo");
+Object.keys(_seedsReactPartnerLogo).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _PartnerLogo[key]) return;
+  if (key in exports && exports[key] === _seedsReactPartnerLogo[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _PartnerLogo[key];
+      return _seedsReactPartnerLogo[key];
     }
   });
 });
-var _Popout = require("./Popout");
-Object.keys(_Popout).forEach(function (key) {
+var _seedsReactPopout = require("@sproutsocial/seeds-react-popout");
+Object.keys(_seedsReactPopout).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _Popout[key]) return;
+  if (key in exports && exports[key] === _seedsReactPopout[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _Popout[key];
+      return _seedsReactPopout[key];
     }
   });
 });
-var _Radio = require("./Radio");
-Object.keys(_Radio).forEach(function (key) {
+var _seedsReactPortal = require("@sproutsocial/seeds-react-portal");
+Object.keys(_seedsReactPortal).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _Radio[key]) return;
+  if (key in exports && exports[key] === _seedsReactPortal[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _Radio[key];
+      return _seedsReactPortal[key];
+    }
+  });
+});
+var _seedsReactRadio = require("@sproutsocial/seeds-react-radio");
+Object.keys(_seedsReactRadio).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _seedsReactRadio[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _seedsReactRadio[key];
     }
   });
 });
@@ -564,15 +576,15 @@ Object.keys(_Stack).forEach(function (key) {
     }
   });
 });
-var _Switch = require("./Switch");
-Object.keys(_Switch).forEach(function (key) {
+var _seedsReactSwitch = require("@sproutsocial/seeds-react-switch");
+Object.keys(_seedsReactSwitch).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _Switch[key]) return;
+  if (key in exports && exports[key] === _seedsReactSwitch[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _Switch[key];
+      return _seedsReactSwitch[key];
     }
   });
 });
@@ -636,15 +648,15 @@ Object.keys(_Tabs).forEach(function (key) {
     }
   });
 });
-var _Text = require("./Text");
-Object.keys(_Text).forEach(function (key) {
+var _seedsReactText = require("@sproutsocial/seeds-react-text");
+Object.keys(_seedsReactText).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _Text[key]) return;
+  if (key in exports && exports[key] === _seedsReactText[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function get() {
-      return _Text[key];
+      return _seedsReactText[key];
     }
   });
 });

package/dist/types/Button/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/Button/styles.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,eAAe,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AACrE,UAAU,oBAAqB,SAAQ,eAAe;IACpD,UAAU,EAAE,oBAAoB,CAAC;IACjC,UAAU,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;CAClC;AACD,QAAA,MAAM,SAAS,8HA2Gd,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/Button/styles.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,eAAe,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AACrE,UAAU,oBAAqB,SAAQ,eAAe;IACpD,UAAU,EAAE,oBAAoB,CAAC;IACjC,UAAU,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;CAClC;AACD,QAAA,MAAM,SAAS,8HA2Gd,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/types/Listbox/Listbox.d.ts

@@ -3,11 +3,11 @@ import type { TypeListboxProps, TypeListboxButtonProps } from "./ListboxTypes";
 export declare const Listbox: {
     ({ role, children, ...rest }: TypeListboxProps): JSX.Element;
     Option: {
-        ({ id: idProp, index: indexProp, as, children, role: roleProp, elemBefore, elemAfter, value: valueProp, onKeyPress, onClick, selected, disabled, indeterminate, label: labelProp, ...props }: import("../Menu").TypeMenuItemProps): JSX.Element;
+        ({ id: idProp, index: indexProp, as, children, role: roleProp, elemBefore, elemAfter, value: valueProp, onKeyPress, onClick, selected, disabled, indeterminate, label: labelProp, active: activeProp, ...props }: import("../Menu").TypeMenuItemProps): JSX.Element;
         displayName: string;
     };
     Item: {
-        ({ id: idProp, index: indexProp, as, children, role: roleProp, elemBefore, elemAfter, value: valueProp, onKeyPress, onClick, selected, disabled, indeterminate, label: labelProp, ...props }: import("../Menu").TypeMenuItemProps): JSX.Element;
+        ({ id: idProp, index: indexProp, as, children, role: roleProp, elemBefore, elemAfter, value: valueProp, onKeyPress, onClick, selected, disabled, indeterminate, label: labelProp, active: activeProp, ...props }: import("../Menu").TypeMenuItemProps): JSX.Element;
         displayName: string;
     };
     Checkbox: {
@@ -31,7 +31,7 @@ export declare const Listbox: {
         displayName: string;
     };
     FilterInput: {
-        ({ type, ...props }: import("..").TypeInputProps): JSX.Element;
+        ({ type, ...props }: import("../Input").TypeInputProps): JSX.Element;
         displayName: string;
     };
 };

package/dist/types/Menu/Menu.d.ts

@@ -3,7 +3,7 @@ import { TypeBoxProps } from "../Box";
 import { TypeInputProps } from "../Input";
 import type { TypeMenuButtonProps, TypeMenuGroupProps, TypeMenuItemProps, TypeMenuProps, TypeMenuSwitchProps } from "./MenuTypes";
 export declare const MenuItem: {
-    ({ id: idProp, index: indexProp, as, children, role: roleProp, elemBefore, elemAfter, value: valueProp, onKeyPress, onClick, selected, disabled, indeterminate, label: labelProp, ...props }: TypeMenuItemProps): JSX.Element;
+    ({ id: idProp, index: indexProp, as, children, role: roleProp, elemBefore, elemAfter, value: valueProp, onKeyPress, onClick, selected, disabled, indeterminate, label: labelProp, active: activeProp, ...props }: TypeMenuItemProps): JSX.Element;
     displayName: string;
 };
 export declare const MenuCheckbox: {
@@ -34,7 +34,7 @@ export declare const Menu: {
         displayName: string;
     };
     Item: {
-        ({ id: idProp, index: indexProp, as, children, role: roleProp, elemBefore, elemAfter, value: valueProp, onKeyPress, onClick, selected, disabled, indeterminate, label: labelProp, ...props }: TypeMenuItemProps): JSX.Element;
+        ({ id: idProp, index: indexProp, as, children, role: roleProp, elemBefore, elemAfter, value: valueProp, onKeyPress, onClick, selected, disabled, indeterminate, label: labelProp, active: activeProp, ...props }: TypeMenuItemProps): JSX.Element;
         displayName: string;
     };
     Checkbox: {

package/dist/types/Menu/Menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.d.ts","sourceRoot":"","sources":["../../../src/Menu/Menu.tsx"],"names":[],"mappings":";AAcA,OAAY,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAI7C,OAAc,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAKnD,OAAO,KAAK,EACV,mBAAmB,EACnB,kBAAkB,EAClB,iBAAiB,EAEjB,aAAa,EAEb,mBAAmB,EACpB,MAAM,aAAa,CAAC;AA8CrB,eAAO,MAAM,QAAQ;kMAgBlB,iBAAiB;;CAuLnB,CAAC;AACF,eAAO,MAAM,YAAY;YAAW,iBAAiB;;CAEpD,CAAC;AACF,eAAO,MAAM,SAAS;YAAW,iBAAiB;;CAEjD,CAAC;AAEF,eAAO,MAAM,UAAU;YAAW,mBAAmB;;CA8CpD,CAAC;AAUF,eAAO,MAAM,SAAS;mEAMnB,kBAAkB;;CA2BpB,CAAC;AAEF,eAAO,MAAM,WAAW;YAAW,YAAY;;CAQ9C,CAAC;AA4FF,eAAO,MAAM,IAAI;0FASd,aAAa;;;uEA1Ib,kBAAkB;;;;sMA7PlB,iBAAiB;;;;gBAwLgB,iBAAiB;;;;gBAGpB,iBAAiB;;;;gBAIhB,mBAAmB;;;;gBA2FlB,YAAY;;;;6BAUS,cAAc;;;CAuJrE,CAAC;AAuBF,eAAO,MAAM,UAAU,8GAWpB,mBAAmB,gBAwDrB,CAAC;AAEF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Menu.d.ts","sourceRoot":"","sources":["../../../src/Menu/Menu.tsx"],"names":[],"mappings":";AAcA,OAAY,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAI7C,OAAc,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAKnD,OAAO,KAAK,EACV,mBAAmB,EACnB,kBAAkB,EAClB,iBAAiB,EAEjB,aAAa,EAEb,mBAAmB,EACpB,MAAM,aAAa,CAAC;AA8CrB,eAAO,MAAM,QAAQ;sNAiBlB,iBAAiB;;CA4LnB,CAAC;AACF,eAAO,MAAM,YAAY;YAAW,iBAAiB;;CAEpD,CAAC;AACF,eAAO,MAAM,SAAS;YAAW,iBAAiB;;CAEjD,CAAC;AAEF,eAAO,MAAM,UAAU;YAAW,mBAAmB;;CA8CpD,CAAC;AAUF,eAAO,MAAM,SAAS;mEAMnB,kBAAkB;;CA2BpB,CAAC;AAEF,eAAO,MAAM,WAAW;YAAW,YAAY;;CAQ9C,CAAC;AA4FF,eAAO,MAAM,IAAI;0FASd,aAAa;;;uEA1Ib,kBAAkB;;;;0NAlQlB,iBAAiB;;;;gBA6LgB,iBAAiB;;;;gBAGpB,iBAAiB;;;;gBAIhB,mBAAmB;;;;gBA2FlB,YAAY;;;;6BAUS,cAAc;;;CAuJrE,CAAC;AAuBF,eAAO,MAAM,UAAU,8GAWpB,mBAAmB,gBAwDrB,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/dist/types/Message/Message.d.ts

@@ -1,7 +1,7 @@
 import * as React from "react";
 import { TypeAvatarProps } from "../Avatar";
 import { TypeButtonProps } from "../Button";
-import { TypeCheckboxProps } from "../Checkbox";
+import { TypeCheckboxProps } from "@sproutsocial/seeds-react-checkbox";
 import { EnumDensities, TypeMessageProps } from "./MessageTypes";
 declare const Message: {
     ({ children, density, borderColor, bg, indentContent, innerRef, qa, ...rest }: TypeMessageProps): JSX.Element;

package/dist/types/Message/Message.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Message.d.ts","sourceRoot":"","sources":["../../../src/Message/Message.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAe,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AACtD,OAAe,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AACtD,OAAiB,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAQ5D,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AA+BjE,QAAA,MAAM,OAAO;mFASV,gBAAgB;;gBAuBS,gBAAgB;;;;gBAiBd,gBAAgB;;;;gBAehB,gBAAgB;;;;gBAgBlB,gBAAgB;;;;gBAgBd,eAAe;;;;gBAOf,eAAe;;;;gBASb,iBAAiB;;;;iBA3HtC,aAAa;qBACT,gBAAgB,CAAC,aAAa,CAAC;aACvC,gBAAgB,CAAC,IAAI,CAAC;;;;;;;;;CAuC5B,CAAC;AAsGF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"Message.d.ts","sourceRoot":"","sources":["../../../src/Message/Message.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAe,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AACtD,OAAe,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AACtD,OAAiB,EACf,iBAAiB,EAClB,MAAM,oCAAoC,CAAC;AAQ5C,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AA+BjE,QAAA,MAAM,OAAO;mFASV,gBAAgB;;gBAuBS,gBAAgB;;;;gBAiBd,gBAAgB;;;;gBAehB,gBAAgB;;;;gBAgBlB,gBAAgB;;;;gBAgBd,eAAe;;;;gBAOf,eAAe;;;;gBASb,iBAAiB;;;;iBA3HtC,aAAa;qBACT,gBAAgB,CAAC,aAAa,CAAC;aACvC,gBAAgB,CAAC,IAAI,CAAC;;;;;;;;;CAuC5B,CAAC;AAsGF,eAAe,OAAO,CAAC"}

package/dist/types/index.d.ts

@@ -3,7 +3,7 @@ export type { EnumIllustrationNames } from "@sproutsocial/seeds-illustrations";
 export type { EnumLogoNamesWithoutVariants as EnumLogoNames } from "@sproutsocial/seeds-partner-logos";
 export { IllustrationNames as SpotIllustrationNames } from "@sproutsocial/seeds-illustrations";
 export { LogoNamesWithoutVariants as PartnerLogoNames } from "@sproutsocial/seeds-partner-logos";
-export * from "./systemProps";
+export * from "@sproutsocial/seeds-react-system-props";
 export * from "@sproutsocial/seeds-react-theme";
 export { default as ThemeProvider } from "@sproutsocial/seeds-react-theme-provider";
 export { useSelect, useMultiselect, useTextContent, useMeasure, useInteractiveColor, } from "@sproutsocial/seeds-react-hooks";
@@ -13,21 +13,21 @@ export * from "./Badge";
 export * from "./Banner";
 export * from "@sproutsocial/seeds-react-box";
 export * from "./Breadcrumb";
-export * from "./Button";
+export * from "@sproutsocial/seeds-react-button";
 export * from "./Card";
 export * from "./CharacterCounter";
 export * from "./ChartLegend";
-export * from "./Checkbox";
+export * from "@sproutsocial/seeds-react-checkbox";
 export * from "./Collapsible";
 export * from "./DatePicker";
 export * from "./Drawer";
 export * from "./EmptyState";
 export * from "./Fieldset";
 export * from "./FormField";
-export * from "./Icon";
+export * from "@sproutsocial/seeds-react-icon";
 export * from "./Image";
 export * from "./Indicator";
-export * from "./Input";
+export * from "@sproutsocial/seeds-react-input";
 export * from "./KeyboardKey";
 export * from "./Label";
 export * from "./Link";
@@ -38,21 +38,22 @@ export * from "./Menu";
 export * from "./Message";
 export * from "./Modal";
 export * from "./Numeral";
-export * from "./PartnerLogo";
-export * from "./Popout";
-export * from "./Radio";
+export * from "@sproutsocial/seeds-react-partner-logo";
+export * from "@sproutsocial/seeds-react-popout";
+export * from "@sproutsocial/seeds-react-portal";
+export * from "@sproutsocial/seeds-react-radio";
 export * from "./SegmentedControl";
 export * from "./Select";
 export * from "./Skeleton";
 export * from "./SpotIllustration";
 export * from "./Stack";
-export * from "./Switch";
+export * from "@sproutsocial/seeds-react-switch";
 export * from "./Table";
 export * from "./TableCell";
 export * from "./TableHeaderCell";
 export * from "./TableRowAccordion";
 export * from "./Tabs";
-export * from "./Text";
+export * from "@sproutsocial/seeds-react-text";
 export * from "./Textarea";
 export * from "./Toast";
 export * from "./ToggleHint";

package/dist/types/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AACA,YAAY,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAC/D,YAAY,EAAE,qBAAqB,EAAE,MAAM,mCAAmC,CAAC;AAC/E,YAAY,EAAE,4BAA4B,IAAI,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAEvG,OAAO,EAAE,iBAAiB,IAAI,qBAAqB,EAAE,MAAM,mCAAmC,CAAC;AAC/F,OAAO,EAAE,wBAAwB,IAAI,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAGjG,cAAc,eAAe,CAAC;AAC9B,cAAc,iCAAiC,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,0CAA0C,CAAC;AAGpF,OAAO,EACL,SAAS,EACT,cAAc,EACd,cAAc,EACd,UAAU,EACV,mBAAmB,GACpB,MAAM,iCAAiC,CAAC;AACzC,cAAc,kCAAkC,CAAC;AAGjD,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,+BAA+B,CAAC;AAC9C,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,oBAAoB,CAAC;AACnC,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,oBAAoB,CAAC;AACnC,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,aAAa,CAAC;AAC5B,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,kBAAkB,CAAC;AAEjC;;GAEG;AACH,OAAO,EAAE,MAAM,IAAI,KAAK,EAAE,MAAM,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AACA,YAAY,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAC/D,YAAY,EAAE,qBAAqB,EAAE,MAAM,mCAAmC,CAAC;AAC/E,YAAY,EAAE,4BAA4B,IAAI,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAEvG,OAAO,EAAE,iBAAiB,IAAI,qBAAqB,EAAE,MAAM,mCAAmC,CAAC;AAC/F,OAAO,EAAE,wBAAwB,IAAI,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAGjG,cAAc,wCAAwC,CAAC;AACvD,cAAc,iCAAiC,CAAC;AAChD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,0CAA0C,CAAC;AAGpF,OAAO,EACL,SAAS,EACT,cAAc,EACd,cAAc,EACd,UAAU,EACV,mBAAmB,GACpB,MAAM,iCAAiC,CAAC;AACzC,cAAc,kCAAkC,CAAC;AAGjD,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,+BAA+B,CAAC;AAC9C,cAAc,cAAc,CAAC;AAC7B,cAAc,kCAAkC,CAAC;AACjD,cAAc,QAAQ,CAAC;AACvB,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,oCAAoC,CAAC;AACnD,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,gCAAgC,CAAC;AAC/C,cAAc,SAAS,CAAC;AACxB,cAAc,aAAa,CAAC;AAC5B,cAAc,iCAAiC,CAAC;AAChD,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,wCAAwC,CAAC;AACvD,cAAc,kCAAkC,CAAC;AACjD,cAAc,kCAAkC,CAAC;AACjD,cAAc,iCAAiC,CAAC;AAChD,cAAc,oBAAoB,CAAC;AACnC,cAAc,UAAU,CAAC;AACzB,cAAc,YAAY,CAAC;AAC3B,cAAc,oBAAoB,CAAC;AACnC,cAAc,SAAS,CAAC;AACxB,cAAc,kCAAkC,CAAC;AACjD,cAAc,SAAS,CAAC;AACxB,cAAc,aAAa,CAAC;AAC5B,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,QAAQ,CAAC;AACvB,cAAc,gCAAgC,CAAC;AAC/C,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,kBAAkB,CAAC;AAEjC;;GAEG;AACH,OAAO,EAAE,MAAM,IAAI,KAAK,EAAE,MAAM,UAAU,CAAC"}

package/lib/Button/styles.js

@@ -1,11 +1,12 @@
 import styled, { css } from "styled-components";
 import { COMMON, LAYOUT, FLEXBOX, GRID } from "@sproutsocial/seeds-react-system-props";
 import { focusRing, disabled, pill } from "@sproutsocial/seeds-react-mixins";
+import { IconContainer } from "@sproutsocial/seeds-react-icon";
 import Icon from "../Icon/styles";
 var Container = styled.button.withConfig({
   displayName: "styles__Container",
   componentId: "sc-17njgx1-0"
-})(["display:inline-block;box-sizing:border-box;text-align:center;font-family:", ";border:1px solid ", ";border-radius:", ";border-style:", ";background:", ";color:", ";cursor:pointer;text-decoration:none;line-height:16px;white-space:nowrap;font-weight:", ";transition:all ", " linear;margin:0;padding:", ";font-size:", ";&:visited{color:", ";}&:hover{color:", ";", ";text-decoration:none;box-shadow:", ";}&:active{color:", ";", ";transform:translateY(1px);}&:focus{", "}&:focus:active{box-shadow:none;}", " ", " ", " ", "{vertical-align:text-bottom;}", " ", " ", " ", ""], function (props) {
+})(["display:inline-block;box-sizing:border-box;text-align:center;font-family:", ";border:1px solid ", ";border-radius:", ";border-style:", ";background:", ";color:", ";cursor:pointer;text-decoration:none;line-height:16px;white-space:nowrap;font-weight:", ";transition:all ", " linear;margin:0;padding:", ";font-size:", ";&:visited{color:", ";}&:hover{color:", ";", ";text-decoration:none;box-shadow:", ";}&:active{color:", ";", ";transform:translateY(1px);}&:focus{", "}&:focus:active{box-shadow:none;}", " ", " ", " ", ",", "{vertical-align:text-bottom;}", " ", " ", " ", ""], function (props) {
   return props.theme.fontFamily;
 }, function (props) {
   return props.theme.colors.button[props.appearance].border.base;
@@ -43,6 +44,6 @@ var Container = styled.button.withConfig({
   return props.disabled && disabled;
 }, function (props) {
   return props.appearance === "pill" && css(["display:inline-flex;align-items:center;justify-content:center;background-color:transparent;", " &:focus:active,&:hover{background-color:transparent;box-shadow:inset 0px 0px 0px 1px ", ";}"], pill, props.theme.colors.button.pill.border.hover);
-}, Icon, LAYOUT, COMMON, FLEXBOX, GRID);
+}, IconContainer, Icon, LAYOUT, COMMON, FLEXBOX, GRID);
 Container.displayName = "Button-Container";
 export default Container; //${props.theme.mode === "dark" ? "screen" : "multiply"}

package/lib/Input/Input.js

@@ -20,8 +20,8 @@ import * as React from "react";
 import styled from "styled-components";
 import { useInteractiveColor } from "../utils/useInteractiveColor";
 import { mergeRefs } from "@sproutsocial/seeds-react-utilities";
-import Button from "../Button";
-import Icon from "../Icon";
+import Button from "@sproutsocial/seeds-react-button";
+import Icon from "@sproutsocial/seeds-react-icon";
 import Container, { Accessory } from "./styles";
 
 // Using Context so that Input's Input.ClearButton-specific props can be passed to Input.ClearButton,

package/lib/Menu/Menu.js

@@ -1,6 +1,6 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 import _styled from "styled-components";
-var _excluded = ["id", "index", "as", "children", "role", "elemBefore", "elemAfter", "value", "onKeyPress", "onClick", "selected", "disabled", "indeterminate", "label"],
+var _excluded = ["id", "index", "as", "children", "role", "elemBefore", "elemAfter", "value", "onKeyPress", "onClick", "selected", "disabled", "indeterminate", "label", "active"],
   _excluded2 = ["placement", "labelProps", "switchProps", "children", "id", "label"],
   _excluded3 = ["children", "title", "titleAs", "disabled"],
   _excluded4 = ["type"],
@@ -30,7 +30,7 @@ import innerText from "../utils/innerText";
 import { disabled } from "@sproutsocial/seeds-react-mixins";
 import Box from "../Box";
 import Button from "../Button";
-import Checkbox from "../Checkbox";
+import Checkbox from "@sproutsocial/seeds-react-checkbox";
 import Icon from "../Icon";
 import Input from "../Input";
 import Popout from "../Popout";
@@ -77,6 +77,7 @@ export var MenuItem = function MenuItem(_ref) {
     disabled = _ref.disabled,
     indeterminate = _ref.indeterminate,
     labelProp = _ref.label,
+    activeProp = _ref.active,
     props = _objectWithoutProperties(_ref, _excluded);
   var _useContext = useContext(MenuContext),
     menuRole = _useContext.role,
@@ -117,6 +118,9 @@ export var MenuItem = function MenuItem(_ref) {
     _useState2 = _slicedToArray(_useState, 2),
     keyPressed = _useState2[0],
     setKeyPressed = _useState2[1];
+  var isActive = useMemo(function () {
+    return activeProp || isFocused && keyPressed;
+  }, [activeProp, isFocused, keyPressed]);
   var isCheckboxOrRadio = [MENU_ITEM_ROLES.CHECKBOX, MENU_ITEM_ROLES.RADIO
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   ].includes(itemRole); // @ts-notes @refactor - since we're only really checking against the string I think we can safely leave this for refactor, nothing else worked for me
@@ -190,7 +194,8 @@ export var MenuItem = function MenuItem(_ref) {
   return /*#__PURE__*/React.createElement(MenuItemContainer, _extends({
     "data-qa-menu-item": label
   }, props, {
-    active: isFocused && keyPressed,
+    active: isActive,
+    "data-qa-is-active": isActive,
     id: id,
     "aria-label": labelProp,
     value: valueProp,

package/lib/Message/Message.js

@@ -5,7 +5,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 import * as React from "react";
 import Avatar from "../Avatar";
 import Button from "../Button";
-import Checkbox from "../Checkbox";
+import Checkbox from "@sproutsocial/seeds-react-checkbox";
 import Container, { MessageBody as StyledMessageBody, MessageFooter as StyledMessageFooter, MessageHeader as StyledMessageHeader, MessageMeta as StyledMessageMeta } from "./styles";
 import { MESSAGE_DENSITIES } from "./constants";
 var avatarSizeMap = function avatarSizeMap(density) {

package/lib/index.js

@@ -4,7 +4,7 @@ export { IllustrationNames as SpotIllustrationNames } from "@sproutsocial/seeds-
 export { LogoNamesWithoutVariants as PartnerLogoNames } from "@sproutsocial/seeds-partner-logos";
 
 /* Theme and related types */
-export * from "./systemProps";
+export * from "@sproutsocial/seeds-react-system-props";
 export * from "@sproutsocial/seeds-react-theme";
 export { default as ThemeProvider } from "@sproutsocial/seeds-react-theme-provider";
 
@@ -18,21 +18,21 @@ export * from "./Badge";
 export * from "./Banner";
 export * from "@sproutsocial/seeds-react-box";
 export * from "./Breadcrumb";
-export * from "./Button";
+export * from "@sproutsocial/seeds-react-button";
 export * from "./Card";
 export * from "./CharacterCounter";
 export * from "./ChartLegend";
-export * from "./Checkbox";
+export * from "@sproutsocial/seeds-react-checkbox";
 export * from "./Collapsible";
 export * from "./DatePicker";
 export * from "./Drawer";
 export * from "./EmptyState";
 export * from "./Fieldset";
 export * from "./FormField";
-export * from "./Icon";
+export * from "@sproutsocial/seeds-react-icon";
 export * from "./Image";
 export * from "./Indicator";
-export * from "./Input";
+export * from "@sproutsocial/seeds-react-input";
 export * from "./KeyboardKey";
 export * from "./Label";
 export * from "./Link";
@@ -43,21 +43,22 @@ export * from "./Menu";
 export * from "./Message";
 export * from "./Modal";
 export * from "./Numeral";
-export * from "./PartnerLogo";
-export * from "./Popout";
-export * from "./Radio";
+export * from "@sproutsocial/seeds-react-partner-logo";
+export * from "@sproutsocial/seeds-react-popout";
+export * from "@sproutsocial/seeds-react-portal";
+export * from "@sproutsocial/seeds-react-radio";
 export * from "./SegmentedControl";
 export * from "./Select";
 export * from "./Skeleton";
 export * from "./SpotIllustration";
 export * from "./Stack";
-export * from "./Switch";
+export * from "@sproutsocial/seeds-react-switch";
 export * from "./Table";
 export * from "./TableCell";
 export * from "./TableHeaderCell";
 export * from "./TableRowAccordion";
 export * from "./Tabs";
-export * from "./Text";
+export * from "@sproutsocial/seeds-react-text";
 export * from "./Textarea";
 export * from "./Toast";
 export * from "./ToggleHint";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sproutsocial/racine",
-  "version": "22.0.0",
+  "version": "22.1.0",
   "license": "MIT",
   "engines": {
     "node": ">=18"
@@ -57,6 +57,23 @@
     "ts-to-flow": "flowgen $FILE -o $OUTPUT --add-flow-header --no-module-exports"
   },
   "dependencies": {
+    "@sproutsocial/seeds-react-box": "^1.0.0",
+    "@sproutsocial/seeds-react-checkbox": "^1.0.0",
+    "@sproutsocial/seeds-react-input": "^1.0.0",
+    "@sproutsocial/seeds-react-text": "^1.0.0",
+    "@sproutsocial/seeds-react-radio": "^1.0.0",
+    "@sproutsocial/seeds-react-button": "^1.0.0",
+    "@sproutsocial/seeds-react-switch": "^1.0.0",
+    "@sproutsocial/seeds-react-hooks": "^2.0.0",
+    "@sproutsocial/seeds-react-icon": "^1.0.0",
+    "@sproutsocial/seeds-react-mixins": "^2.0.0",
+    "@sproutsocial/seeds-react-partner-logo": "^1.0.0",
+    "@sproutsocial/seeds-react-popout": "^1.0.0",
+    "@sproutsocial/seeds-react-portal": "^1.0.0",
+    "@sproutsocial/seeds-react-system-props": "^2.2.0",
+    "@sproutsocial/seeds-react-theme-provider": "^1.0.0",
+    "@sproutsocial/seeds-react-theme": "^1.0.0",
+    "@sproutsocial/seeds-react-utilities": "^2.0.0",
     "@styled-system/theme-get": "^5.1.2",
     "classnames": "^2.2.6",
     "default-browser-id": "^3.0.0",
@@ -89,6 +106,7 @@
     "@babel/preset-typescript": "^7.22.5",
     "@khanacademy/flow-to-ts": "^0.5.2",
     "@sproutsocial/eslint-config-seeds": "*",
+    "@sproutsocial/seeds-typography": "*",
     "@sproutsocial/seeds-border": "*",
     "@sproutsocial/seeds-color": "*",
     "@sproutsocial/seeds-depth": "*",
@@ -99,14 +117,6 @@
     "@sproutsocial/seeds-partner-logos": "*",
     "@sproutsocial/seeds-space": "*",
     "@sproutsocial/seeds-tsconfig": "*",
-    "@sproutsocial/seeds-typography": "*",
-    "@sproutsocial/seeds-react-box": "*",
-    "@sproutsocial/seeds-react-hooks": "*",
-    "@sproutsocial/seeds-react-mixins": "*",
-    "@sproutsocial/seeds-react-system-props": "*",
-    "@sproutsocial/seeds-react-theme-provider": "*",
-    "@sproutsocial/seeds-react-theme": "*",
-    "@sproutsocial/seeds-react-utilities": "*",
     "@storybook/addon-a11y": "^7.0.0",
     "@storybook/addon-actions": "^7.0.0",
     "@storybook/addon-essentials": "^7.0.0",
@@ -184,23 +194,16 @@
     "ws": "^8.13.0"
   },
   "peerDependencies": {
-    "@sproutsocial/seeds-border": ">=0.3.0",
-    "@sproutsocial/seeds-color": ">=2.1.0",
-    "@sproutsocial/seeds-depth": ">=1.0.0",
-    "@sproutsocial/seeds-icons": "^1.0.0",
-    "@sproutsocial/seeds-motion": ">=1.1.0",
-    "@sproutsocial/seeds-networkcolor": ">=2.14.0",
-    "@sproutsocial/seeds-space": ">=0.4.0",
-    "@sproutsocial/seeds-typography": ">=2.0.0",
-    "@sproutsocial/seeds-partner-logos": ">=1.5.0",
-    "@sproutsocial/seeds-illustrations": ">=1.3.0",
-    "@sproutsocial/seeds-react-box": "^1.0.0",
-    "@sproutsocial/seeds-react-hooks": "^2.0.0",
-    "@sproutsocial/seeds-react-mixins": "^2.0.0",
-    "@sproutsocial/seeds-react-system-props": "^2.0.0",
-    "@sproutsocial/seeds-react-theme-provider": "^1.0.0",
-    "@sproutsocial/seeds-react-theme": "^1.0.0",
-    "@sproutsocial/seeds-react-utilities": "^2.0.0",
+    "@sproutsocial/seeds-typography": "*",
+    "@sproutsocial/seeds-border": "*",
+    "@sproutsocial/seeds-color": "*",
+    "@sproutsocial/seeds-depth": "*",
+    "@sproutsocial/seeds-icons": "*",
+    "@sproutsocial/seeds-illustrations": "*",
+    "@sproutsocial/seeds-motion": "*",
+    "@sproutsocial/seeds-networkcolor": "*",
+    "@sproutsocial/seeds-partner-logos": "*",
+    "@sproutsocial/seeds-space": "*",
     "moment": "^2.29.4",
     "prop-types": "^15.0.0",
     "react": "^16.8.0 || ^17.0.0",