@sproutsocial/racine 22.5.1 → 23.1.0

package/commonjs/Menu/Menu.js

@@ -17,19 +17,20 @@ var _Button = _interopRequireDefault(require("../Button"));
 var _seedsReactCheckbox = _interopRequireDefault(require("@sproutsocial/seeds-react-checkbox"));
 var _Icon = _interopRequireDefault(require("../Icon"));
 var _Input = _interopRequireDefault(require("../Input"));
-var _Popout = _interopRequireDefault(require("../Popout"));
+var _seedsReactPopout = _interopRequireDefault(require("@sproutsocial/seeds-react-popout"));
 var _Radio = _interopRequireDefault(require("../Radio"));
 var _Switch = _interopRequireDefault(require("../Switch"));
 var _Text = _interopRequireDefault(require("../Text"));
 var _utils = require("./utils");
 var _styles = require("./styles");
+var _jsxRuntime = require("react/jsx-runtime");
 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"],
   _excluded5 = ["children", "role", "multiselect", "innerRef"],
   _excluded6 = ["role", "children", "onChange", "value", "multiselect", "innerRef", "footerContent"],
-  _excluded7 = ["content", "popoutProps", "children", "onClick", "closeOnItemClick", "id", "placement", "isOpen", "setIsOpen"];
+  _excluded7 = ["content", "popoutProps", "children", "onClick", "closeOnItemClick", "id", "placement", "isOpen", "setIsOpen"]; // eslint-disable-next-line @typescript-eslint/no-empty-function
 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); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -38,7 +39,6 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
@@ -47,7 +47,6 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-// eslint-disable-next-line @typescript-eslint/no-empty-function
 var noop = function noop() {};
 var getMenuItemRole = function getMenuItemRole(menuRole) {
   switch (menuRole) {
@@ -168,7 +167,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(_seedsReactCheckbox.default, {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_seedsReactCheckbox.default, {
         id: "Checkbox-".concat(id),
         checked: isSelected,
         "aria-hidden": "true",
@@ -177,7 +176,7 @@ var MenuItem = exports.MenuItem = function MenuItem(_ref) {
         mr: 300
       });
     } else if (itemRole === _utils.MENU_ITEM_ROLES.RADIO) {
-      return /*#__PURE__*/React.createElement(_Radio.default, {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Radio.default, {
         id: "Radio-".concat(id),
         name: "Radio-".concat(id),
         checked: isSelected,
@@ -190,7 +189,7 @@ var MenuItem = exports.MenuItem = function MenuItem(_ref) {
   var after = (0, _react.useMemo)(function () {
     if (elemAfter) return elemAfter;
     if (isSelected && !isCheckboxOrRadio) {
-      return /*#__PURE__*/React.createElement(_Icon.default, {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.default, {
         name: "check-solid",
         "aria-hidden": true,
         size: "small",
@@ -198,9 +197,9 @@ var MenuItem = exports.MenuItem = function MenuItem(_ref) {
       });
     }
   }, [elemAfter, isCheckboxOrRadio, isSelected]);
-  return /*#__PURE__*/React.createElement(_styles.MenuItemContainer, _extends({
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.MenuItemContainer, _objectSpread(_objectSpread({
     "data-qa-menu-item": label
-  }, props, {
+  }, props), {}, {
     active: isActive,
     "data-qa-is-active": isActive,
     id: id,
@@ -222,33 +221,36 @@ var MenuItem = exports.MenuItem = function MenuItem(_ref) {
     onClick: !disabled ? handleClick : undefined,
     role: itemRole,
     selected: isSelected,
-    tabIndex: itemRole !== _utils.MENU_ITEM_ROLES.LISTITEM && !disabled ? -1 : undefined
-  }), /*#__PURE__*/React.createElement("div", {
-    ref: ref,
-    style: {
-      display: "flex",
-      alignItems: props.alignItems || "center",
-      justifyContent: "space-between"
-    }
-  }, before, /*#__PURE__*/React.createElement("div", {
-    style: {
-      flexGrow: 1,
-      wordBreak: "break-word",
-      minWidth: 0
-    }
-    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-    //@ts-ignore some legacy ref type mismatch between divs
-    ,
-    ref: textContent
-  }, children), after));
+    tabIndex: itemRole !== _utils.MENU_ITEM_ROLES.LISTITEM && !disabled ? -1 : undefined,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      ref: ref,
+      style: {
+        display: "flex",
+        alignItems: props.alignItems || "center",
+        justifyContent: "space-between"
+      },
+      children: [before, /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        style: {
+          flexGrow: 1,
+          wordBreak: "break-word",
+          minWidth: 0
+        }
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        //@ts-ignore some legacy ref type mismatch between divs
+        ,
+        ref: textContent,
+        children: children
+      }), after]
+    })
+  }));
 };
 var MenuCheckbox = exports.MenuCheckbox = function MenuCheckbox(props) {
-  return /*#__PURE__*/React.createElement(MenuItem, _extends({
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuItem, _objectSpread({
     role: _utils.MENU_ITEM_ROLES.CHECKBOX
   }, props));
 };
 var MenuRadio = exports.MenuRadio = function MenuRadio(props) {
-  return /*#__PURE__*/React.createElement(MenuItem, _extends({
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuItem, _objectSpread({
     role: _utils.MENU_ITEM_ROLES.RADIO
   }, props));
 };
@@ -268,7 +270,7 @@ var MenuSwitch = exports.MenuSwitch = function MenuSwitch(props) {
     return id || (0, _lodash.default)("MenuItem-");
   }, [id]);
   var labelId = "".concat(menuItemId, "-label");
-  var switchElement = /*#__PURE__*/React.createElement(_Switch.default, _extends({
+  var switchElement = /*#__PURE__*/(0, _jsxRuntime.jsx)(_Switch.default, _objectSpread(_objectSpread(_objectSpread({
     id: "".concat(menuItemId, "-switch"),
     checked: props.selected || isValueSelected(menuValue, props.value),
     "aria-hidden": "true",
@@ -278,7 +280,7 @@ var MenuSwitch = exports.MenuSwitch = function MenuSwitch(props) {
     mr: 300
   } : {
     ml: 300
-  }, switchProps, {
+  }), switchProps), {}, {
     // This prop is passed after switchProps to disallow overrides.
     onClick: noop
   }));
@@ -287,15 +289,17 @@ var MenuSwitch = exports.MenuSwitch = function MenuSwitch(props) {
     label: label,
     elemBefore: placement === "before" ? switchElement : undefined,
     // Empty fragment prevents a check icon in elemAfter when the switch is checked. Can be overridden.
-    elemAfter: placement === "before" ? /*#__PURE__*/React.createElement(React.Fragment, null) : switchElement
+    elemAfter: placement === "before" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {}) : switchElement
   }, rest);
-  return /*#__PURE__*/React.createElement(MenuItem, menuItemProps, /*#__PURE__*/React.createElement(_Text.default, _extends({
-    id: labelId
-  }, labelProps, {
-    // This prop is passed after labelProps to disallow overrides.
-    // Fall back to the label prop if children is falsy.
-    children: children || label
-  })));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuItem, _objectSpread(_objectSpread({}, menuItemProps), {}, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.default, _objectSpread(_objectSpread({
+      id: labelId
+    }, labelProps), {}, {
+      // This prop is passed after labelProps to disallow overrides.
+      // Fall back to the label prop if children is falsy.
+      children: children || label
+    }))
+  }));
 };
 var MenuTitle = (0, _styledComponents.default)(_Text.default).withConfig({
   displayName: "Menu__MenuTitle",
@@ -329,22 +333,27 @@ var MenuGroup = exports.MenuGroup = function MenuGroup(_ref6) {
   var menuTitleId = (0, _react.useMemo)(function () {
     return (0, _lodash.default)("menu-title-");
   }, []);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_Box.default, _extends({
-    p: 300,
-    role: "group",
-    "aria-labelledby": title ? menuTitleId : undefined,
-    borderTop: "1px solid",
-    borderColor: "container.border.base"
-  }, props), title && /*#__PURE__*/React.createElement(_StyledMenuTitle, {
-    id: menuTitleId,
-    role: "presentation",
-    fontSize: 200,
-    forwardedAs: titleAs || "li",
-    $_css: isDisabled ? _seedsReactMixins.disabled : undefined
-  }, title), children));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, _objectSpread(_objectSpread({
+      p: 300,
+      role: "group",
+      "aria-labelledby": title ? menuTitleId : undefined,
+      borderTop: "1px solid",
+      borderColor: "container.border.base"
+    }, props), {}, {
+      children: [title && /*#__PURE__*/(0, _jsxRuntime.jsx)(_StyledMenuTitle, {
+        id: menuTitleId,
+        role: "presentation",
+        fontSize: 200,
+        forwardedAs: titleAs || "li",
+        $_css: isDisabled ? _seedsReactMixins.disabled : undefined,
+        children: title
+      }), children]
+    }))
+  });
 };
 var MenuDivider = exports.MenuDivider = function MenuDivider(props) {
-  return /*#__PURE__*/React.createElement(_Box.default, _extends({
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, _objectSpread({
     as: "li",
     role: "separator",
     borderTop: "1px solid",
@@ -379,7 +388,7 @@ var MenuFilterInput = function MenuFilterInput(_ref7) {
       isFilterInputFocused: false
     });
   }, [setState, onBlur]);
-  return /*#__PURE__*/React.createElement(_Input.default, _extends({}, props, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Input.default, _objectSpread(_objectSpread({}, props), {}, {
     type: type,
     value: state.filterQuery,
     onChange: handleOnChange,
@@ -396,7 +405,7 @@ var MenuItems = function MenuItems(_ref8) {
   var _useMenuKeyDown = (0, _utils.useMenuKeyDown)(),
     handleKeyDown = _useMenuKeyDown.handleKeyDown,
     activeDescendent = _useMenuKeyDown.activeDescendent;
-  return /*#__PURE__*/React.createElement(_styles.MenuItemsContainer, _extends({}, props, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.MenuItemsContainer, _objectSpread(_objectSpread({}, props), {}, {
     forwardedAs: "ul",
     ref: innerRef,
     role: role
@@ -409,8 +418,9 @@ var MenuItems = function MenuItems(_ref8) {
     onKeyDown: handleKeyDown,
     margin: 0,
     padding: 0,
-    overflow: "hidden"
-  }), children);
+    overflow: "hidden",
+    children: children
+  }));
 };
 var MenuFooter = function MenuFooter(_ref9) {
   var children = _ref9.children;
@@ -426,10 +436,11 @@ var MenuFooter = function MenuFooter(_ref9) {
       isFooterFocused: true
     });
   }, [setState]);
-  return /*#__PURE__*/React.createElement(_Box.default, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
     onBlur: handleOnBlur,
-    onFocus: handleOnFocus
-  }, children);
+    onFocus: handleOnFocus,
+    children: children
+  });
 };
 var Menu = exports.Menu = function Menu(_ref10) {
   var _ref10$role = _ref10.role,
@@ -460,28 +471,33 @@ var Menu = exports.Menu = function Menu(_ref10) {
   var setContextState = (0, _react.useCallback)(function (newState) {
     setState(_objectSpread(_objectSpread({}, state), newState));
   }, [state]);
-  return /*#__PURE__*/React.createElement(_utils.DescendantProvider, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_utils.DescendantProvider, {
     context: _utils.MenuDescendantContext,
     items: descendants,
-    set: setDescendants
-  }, /*#__PURE__*/React.createElement(_utils.MenuContext.Provider, {
-    value: {
-      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-      // @ts-ignore
-      menuRef: innerRef || menuRef,
-      role: role,
-      onChange: onChange,
-      value: value,
-      multiselect: multiselect,
-      state: state,
-      setState: setContextState,
-      selectCallbacks: selectCallbacks
-    }
-  }, /*#__PURE__*/React.createElement(MenuItems, _extends({}, props, {
-    role: role,
-    multiselect: multiselect,
-    innerRef: menuRef
-  }), children), footerContent ? /*#__PURE__*/React.createElement(MenuFooter, null, footerContent) : null));
+    set: setDescendants,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_utils.MenuContext.Provider, {
+      value: {
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
+        menuRef: innerRef || menuRef,
+        role: role,
+        onChange: onChange,
+        value: value,
+        multiselect: multiselect,
+        state: state,
+        setState: setContextState,
+        selectCallbacks: selectCallbacks
+      },
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(MenuItems, _objectSpread(_objectSpread({}, props), {}, {
+        role: role,
+        multiselect: multiselect,
+        innerRef: menuRef,
+        children: children
+      })), footerContent ? /*#__PURE__*/(0, _jsxRuntime.jsx)(MenuFooter, {
+        children: footerContent
+      }) : null]
+    })
+  });
 };
 MenuGroup.displayName = "Menu.Group";
 MenuItem.displayName = "Menu.Item";
@@ -498,7 +514,7 @@ Menu.Radio = MenuRadio;
 Menu.Switch = MenuSwitch;
 Menu.Divider = MenuDivider;
 Menu.FilterInput = MenuFilterInput;
-var CustomPopoutContent = (0, _styledComponents.default)(_Popout.default.Content).withConfig({
+var CustomPopoutContent = (0, _styledComponents.default)(_seedsReactPopout.default.Content).withConfig({
   displayName: "Menu__CustomPopoutContent",
   componentId: "sc-1jmjosz-2"
 })(["padding:0;margin-left:0;margin-right:0;"]);
@@ -532,34 +548,39 @@ var MenuButton = exports.MenuButton = function MenuButton(_ref11) {
   }, [setIsShown]);
   var ariaLabelledBy = props["aria-labelledby"] ? "".concat(props["aria-labelledby"], " ").concat(id) : undefined;
   var ariaLabel = props["aria-label"] ? "".concat(props["aria-label"], " ").concat((0, _innerText.default)(children)) : undefined;
-  return /*#__PURE__*/React.createElement(_utils.MenuButtonContext.Provider, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_utils.MenuButtonContext.Provider, {
     value: {
       closePopout: closePopout,
       closeOnItemClick: closeOnItemClick
-    }
-  }, /*#__PURE__*/React.createElement(_Popout.default, _extends({
-    isOpen: isShown,
-    setIsOpen: setIsShown,
-    content: /*#__PURE__*/React.createElement(CustomPopoutContent, null, content),
-    placement: placement
-  }, popoutProps, {
-    width: props.width
-  }), /*#__PURE__*/React.createElement(_Button.default, _extends({}, props, {
-    id: id,
-    "aria-labelledby": ariaLabelledBy === null || ariaLabelledBy === void 0 ? void 0 : ariaLabelledBy.trim(),
-    "aria-label": ariaLabel === null || ariaLabel === void 0 ? void 0 : ariaLabel.trim(),
-    active: isShown,
-    onKeyDown: function onKeyDown(e) {
-      if (e.key === "ArrowUp" || e.key === "ArrowDown") {
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        _onClick && _onClick(e); // @ts-notes unfortunately we're passing in a keyboard event here and not the mouse event it expects, so no way to coerce it
-        setIsShown(true);
-      }
     },
-    onClick: function onClick(e) {
-      _onClick && _onClick(e);
-      setIsShown(!isShown);
-    }
-  }), children)));
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_seedsReactPopout.default, _objectSpread(_objectSpread({
+      isOpen: isShown,
+      setIsOpen: setIsShown,
+      content: /*#__PURE__*/(0, _jsxRuntime.jsx)(CustomPopoutContent, {
+        children: content
+      }),
+      placement: placement
+    }, popoutProps), {}, {
+      width: props.width,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, _objectSpread(_objectSpread({}, props), {}, {
+        id: id,
+        "aria-labelledby": ariaLabelledBy === null || ariaLabelledBy === void 0 ? void 0 : ariaLabelledBy.trim(),
+        "aria-label": ariaLabel === null || ariaLabel === void 0 ? void 0 : ariaLabel.trim(),
+        active: isShown,
+        onKeyDown: function onKeyDown(e) {
+          if (e.key === "ArrowUp" || e.key === "ArrowDown") {
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            _onClick && _onClick(e); // @ts-notes unfortunately we're passing in a keyboard event here and not the mouse event it expects, so no way to coerce it
+            setIsShown(true);
+          }
+        },
+        onClick: function onClick(e) {
+          _onClick && _onClick(e);
+          setIsShown(!isShown);
+        },
+        children: children
+      }))
+    }))
+  });
 };
 var _default = exports.default = Menu;

package/commonjs/Menu/utils/descendants.js

@@ -14,6 +14,7 @@ exports.usePrevious = usePrevious;
 exports.wrapEvent = wrapEvent;
 var _react = _interopRequireWildcard(require("react"));
 var React = _react;
+var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["context", "element"],
   _excluded2 = ["element"];
 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); }
@@ -35,13 +36,11 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } /* eslint-disable */
-/**
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } /* eslint-disable */ /**
  * These hooks and utilities are largely copied from the @reach-ui/descendents package. They consider the package
  * pre-release and unstable, so instead of importing it, we copied it here and changed the types from TypeScript to
  * Flow. If the package ever stabilizes, we can import these functions from there and remove this file.
  */
-
 var noop = function noop() {};
 
 /**
@@ -243,9 +242,10 @@ function DescendantProvider(_ref2) {
       unregisterDescendant: unregisterDescendant
     };
   }, [items, registerDescendant, unregisterDescendant]);
-  return /*#__PURE__*/React.createElement(Ctx.Provider, {
-    value: value
-  }, children);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Ctx.Provider, {
+    value: value,
+    children: children
+  });
 }
 function useDescendantKeyDown(context, options) {
   var _useContext2 = (0, _react.useContext)(context),

package/commonjs/Message/Message.js

@@ -11,11 +11,16 @@ var _Button = _interopRequireDefault(require("../Button"));
 var _seedsReactCheckbox = _interopRequireDefault(require("@sproutsocial/seeds-react-checkbox"));
 var _styles = _interopRequireWildcard(require("./styles"));
 var _constants = require("./constants");
+var _jsxRuntime = require("react/jsx-runtime");
 var _excluded = ["children", "density", "borderColor", "bg", "indentContent", "innerRef", "qa"];
 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); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 var avatarSizeMap = function avatarSizeMap(density) {
@@ -50,101 +55,116 @@ var Message = function Message(_ref) {
     innerRef = _ref.innerRef,
     qa = _ref.qa,
     rest = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(MessageContext.Provider, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(MessageContext.Provider, {
     value: {
       density: density,
       borderColor: borderColor,
       indentContent: indentContent
-    }
-  }, /*#__PURE__*/React.createElement(_styles.default, _extends({
-    borderColor: borderColor,
-    bg: bg,
-    ref: innerRef,
-    tabIndex: 0
-  }, qa, rest), children));
+    },
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.default, _objectSpread(_objectSpread(_objectSpread({
+      borderColor: borderColor,
+      bg: bg,
+      ref: innerRef,
+      tabIndex: 0
+    }, qa), rest), {}, {
+      children: children
+    }))
+  });
 };
 var MessageBody = function MessageBody(props) {
-  return /*#__PURE__*/React.createElement(MessageContext.Consumer, null, function (_ref2) {
-    var density = _ref2.density,
-      borderColor = _ref2.borderColor,
-      indentContent = _ref2.indentContent;
-    return /*#__PURE__*/React.createElement(_styles.MessageBody, _extends({
-      "data-qa-message-body": true,
-      density: density,
-      borderColor: borderColor,
-      indentContent: indentContent
-    }, props));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(MessageContext.Consumer, {
+    children: function children(_ref2) {
+      var density = _ref2.density,
+        borderColor = _ref2.borderColor,
+        indentContent = _ref2.indentContent;
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.MessageBody, _objectSpread({
+        "data-qa-message-body": true,
+        density: density,
+        borderColor: borderColor,
+        indentContent: indentContent
+      }, props));
+    }
   });
 };
 MessageBody.displayName = "Message.Body";
 Message.Body = MessageBody;
 var MessageHeader = function MessageHeader(props) {
-  return /*#__PURE__*/React.createElement(MessageContext.Consumer, null, function (_ref3) {
-    var density = _ref3.density,
-      borderColor = _ref3.borderColor;
-    return /*#__PURE__*/React.createElement(_styles.MessageHeader, _extends({
-      density: density,
-      borderColor: borderColor
-    }, props));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(MessageContext.Consumer, {
+    children: function children(_ref3) {
+      var density = _ref3.density,
+        borderColor = _ref3.borderColor;
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.MessageHeader, _objectSpread({
+        density: density,
+        borderColor: borderColor
+      }, props));
+    }
   });
 };
 MessageHeader.displayName = "Message.Header";
 Message.Header = MessageHeader;
 var MessageFooter = function MessageFooter(props) {
-  return /*#__PURE__*/React.createElement(MessageContext.Consumer, null, function (_ref4) {
-    var density = _ref4.density,
-      borderColor = _ref4.borderColor,
-      indentContent = _ref4.indentContent;
-    return /*#__PURE__*/React.createElement(_styles.MessageFooter, _extends({
-      density: density,
-      borderColor: borderColor,
-      indentContent: indentContent
-    }, props));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(MessageContext.Consumer, {
+    children: function children(_ref4) {
+      var density = _ref4.density,
+        borderColor = _ref4.borderColor,
+        indentContent = _ref4.indentContent;
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.MessageFooter, _objectSpread({
+        density: density,
+        borderColor: borderColor,
+        indentContent: indentContent
+      }, props));
+    }
   });
 };
 MessageFooter.displayName = "Message.Footer";
 Message.Footer = MessageFooter;
 var MessageMeta = function MessageMeta(props) {
-  return /*#__PURE__*/React.createElement(MessageContext.Consumer, null, function (_ref5) {
-    var density = _ref5.density,
-      borderColor = _ref5.borderColor,
-      indentContent = _ref5.indentContent;
-    return /*#__PURE__*/React.createElement(_styles.MessageMeta, _extends({
-      density: density,
-      borderColor: borderColor,
-      indentContent: indentContent
-    }, props));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(MessageContext.Consumer, {
+    children: function children(_ref5) {
+      var density = _ref5.density,
+        borderColor = _ref5.borderColor,
+        indentContent = _ref5.indentContent;
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.MessageMeta, _objectSpread({
+        density: density,
+        borderColor: borderColor,
+        indentContent: indentContent
+      }, props));
+    }
   });
 };
 MessageMeta.displayName = "Message.Meta";
 Message.Meta = MessageMeta;
 var MessageButton = function MessageButton(props) {
-  return /*#__PURE__*/React.createElement(_Button.default, _extends({}, props, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, _objectSpread(_objectSpread({}, props), {}, {
     appearance: props.appearance || "pill"
   }));
 };
 MessageButton.displayName = "Message.Button";
 Message.Button = MessageButton;
 var MessageAvatar = function MessageAvatar(props) {
-  return /*#__PURE__*/React.createElement(MessageContext.Consumer, null, function (_ref6) {
-    var density = _ref6.density;
-    return /*#__PURE__*/React.createElement(_Avatar.default, _extends({
-      size: avatarSizeMap(density)
-    }, props));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(MessageContext.Consumer, {
+    children: function children(_ref6) {
+      var density = _ref6.density;
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Avatar.default, _objectSpread({
+        size: avatarSizeMap(density)
+      }, props));
+    }
   });
 };
 MessageAvatar.displayName = "Message.Avatar";
 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(_seedsReactCheckbox.default, _extends({
-      appearance: "pill"
-      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-      // @ts-ignore - `density` is not a valid prop for `Checkbox`
-      ,
-      density: density // @ts-notes - not sure what's intended here so address during refactor
-    }, props));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(MessageContext.Consumer, {
+    children: function children(_ref7) {
+      var density = _ref7.density;
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_seedsReactCheckbox.default, _objectSpread({
+        appearance: "pill"
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore - `density` is not a valid prop for `Checkbox`
+        ,
+        density: density // @ts-notes - not sure what's intended here so address during refactor
+      }, props));
+    }
   });
 };
 MessageCheckbox.displayName = "Message.Checkbox";