@sproutsocial/racine 22.5.1 → 23.0.0

package/lib/LoaderButton/LoaderButton.js

@@ -1,5 +1,10 @@
+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); }
 var _excluded = ["isLoading", "disabled", "loaderLabel", "children", "appearance"];
-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; }
 import * as React from "react";
@@ -7,6 +12,8 @@ import styled from "styled-components";
 import Box from "../Box";
 import Button from "../Button";
 import Loader from "../Loader";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 var StyledLoaderButton = styled(Button).withConfig({
   displayName: "LoaderButton__StyledLoaderButton",
   componentId: "sc-taipe0-0"
@@ -33,25 +40,30 @@ export var LoaderButton = function LoaderButton(_ref3) {
     _ref3$appearance = _ref3.appearance,
     appearance = _ref3$appearance === void 0 ? "unstyled" : _ref3$appearance,
     rest = _objectWithoutProperties(_ref3, _excluded);
-  return /*#__PURE__*/React.createElement(StyledLoaderButton, _extends({
+  return /*#__PURE__*/_jsx(StyledLoaderButton, _objectSpread(_objectSpread({
     disabled: disabled || isLoading,
     appearance: appearance,
     "data-qa-button-isloading": isLoading === true
-  }, rest), /*#__PURE__*/React.createElement(Box, {
-    position: "relative"
-  }, /*#__PURE__*/React.createElement(Box, {
-    opacity: isLoading ? 0 : 1,
-    "aria-hidden": isLoading
-  }, children), isLoading && /*#__PURE__*/React.createElement(Box, {
-    position: "absolute",
-    top: -2,
-    left: 0,
-    right: 0,
-    bottom: 0
-  }, /*#__PURE__*/React.createElement(Loader, {
-    text: loaderLabel,
-    size: "small",
-    delay: false
-  }))));
+  }, rest), {}, {
+    children: /*#__PURE__*/_jsxs(Box, {
+      position: "relative",
+      children: [/*#__PURE__*/_jsx(Box, {
+        opacity: isLoading ? 0 : 1,
+        "aria-hidden": isLoading,
+        children: children
+      }), isLoading && /*#__PURE__*/_jsx(Box, {
+        position: "absolute",
+        top: -2,
+        left: 0,
+        right: 0,
+        bottom: 0,
+        children: /*#__PURE__*/_jsx(Loader, {
+          text: loaderLabel,
+          size: "small",
+          delay: false
+        })
+      })]
+    })
+  }));
 };
 export default LoaderButton;

package/lib/Menu/Menu.js

@@ -12,7 +12,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); }
@@ -33,7 +32,7 @@ import Button from "../Button";
 import Checkbox from "@sproutsocial/seeds-react-checkbox";
 import Icon from "../Icon";
 import Input from "../Input";
-import Popout from "../Popout";
+import Popout from "@sproutsocial/seeds-react-popout";
 import Radio from "../Radio";
 import Switch from "../Switch";
 import Text from "../Text";
@@ -41,6 +40,9 @@ import { MENU_ITEM_ROLES, MENU_ROLES, DescendantProvider, useDescendant, useDesc
 import { MenuItemContainer, MenuItemsContainer } from "./styles";
 
 // eslint-disable-next-line @typescript-eslint/no-empty-function
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
 var noop = function noop() {};
 var getMenuItemRole = function getMenuItemRole(menuRole) {
   switch (menuRole) {
@@ -161,7 +163,7 @@ export var MenuItem = function MenuItem(_ref) {
   var before = useMemo(function () {
     if (elemBefore) return elemBefore;
     if (itemRole === MENU_ITEM_ROLES.CHECKBOX) {
-      return /*#__PURE__*/React.createElement(Checkbox, {
+      return /*#__PURE__*/_jsx(Checkbox, {
         id: "Checkbox-".concat(id),
         checked: isSelected,
         "aria-hidden": "true",
@@ -170,7 +172,7 @@ export var MenuItem = function MenuItem(_ref) {
         mr: 300
       });
     } else if (itemRole === MENU_ITEM_ROLES.RADIO) {
-      return /*#__PURE__*/React.createElement(Radio, {
+      return /*#__PURE__*/_jsx(Radio, {
         id: "Radio-".concat(id),
         name: "Radio-".concat(id),
         checked: isSelected,
@@ -183,7 +185,7 @@ export var MenuItem = function MenuItem(_ref) {
   var after = useMemo(function () {
     if (elemAfter) return elemAfter;
     if (isSelected && !isCheckboxOrRadio) {
-      return /*#__PURE__*/React.createElement(Icon, {
+      return /*#__PURE__*/_jsx(Icon, {
         name: "check-solid",
         "aria-hidden": true,
         size: "small",
@@ -191,9 +193,9 @@ export var MenuItem = function MenuItem(_ref) {
       });
     }
   }, [elemAfter, isCheckboxOrRadio, isSelected]);
-  return /*#__PURE__*/React.createElement(MenuItemContainer, _extends({
+  return /*#__PURE__*/_jsx(MenuItemContainer, _objectSpread(_objectSpread({
     "data-qa-menu-item": label
-  }, props, {
+  }, props), {}, {
     active: isActive,
     "data-qa-is-active": isActive,
     id: id,
@@ -215,33 +217,36 @@ export var MenuItem = function MenuItem(_ref) {
     onClick: !disabled ? handleClick : undefined,
     role: itemRole,
     selected: isSelected,
-    tabIndex: itemRole !== 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 !== MENU_ITEM_ROLES.LISTITEM && !disabled ? -1 : undefined,
+    children: /*#__PURE__*/_jsxs("div", {
+      ref: ref,
+      style: {
+        display: "flex",
+        alignItems: props.alignItems || "center",
+        justifyContent: "space-between"
+      },
+      children: [before, /*#__PURE__*/_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]
+    })
+  }));
 };
 export var MenuCheckbox = function MenuCheckbox(props) {
-  return /*#__PURE__*/React.createElement(MenuItem, _extends({
+  return /*#__PURE__*/_jsx(MenuItem, _objectSpread({
     role: MENU_ITEM_ROLES.CHECKBOX
   }, props));
 };
 export var MenuRadio = function MenuRadio(props) {
-  return /*#__PURE__*/React.createElement(MenuItem, _extends({
+  return /*#__PURE__*/_jsx(MenuItem, _objectSpread({
     role: MENU_ITEM_ROLES.RADIO
   }, props));
 };
@@ -261,7 +266,7 @@ export var MenuSwitch = function MenuSwitch(props) {
     return id || uniqueId("MenuItem-");
   }, [id]);
   var labelId = "".concat(menuItemId, "-label");
-  var switchElement = /*#__PURE__*/React.createElement(Switch, _extends({
+  var switchElement = /*#__PURE__*/_jsx(Switch, _objectSpread(_objectSpread(_objectSpread({
     id: "".concat(menuItemId, "-switch"),
     checked: props.selected || isValueSelected(menuValue, props.value),
     "aria-hidden": "true",
@@ -271,7 +276,7 @@ export var MenuSwitch = function MenuSwitch(props) {
     mr: 300
   } : {
     ml: 300
-  }, switchProps, {
+  }), switchProps), {}, {
     // This prop is passed after switchProps to disallow overrides.
     onClick: noop
   }));
@@ -280,15 +285,17 @@ export var 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__*/_jsx(_Fragment, {}) : switchElement
   }, rest);
-  return /*#__PURE__*/React.createElement(MenuItem, menuItemProps, /*#__PURE__*/React.createElement(Text, _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__*/_jsx(MenuItem, _objectSpread(_objectSpread({}, menuItemProps), {}, {
+    children: /*#__PURE__*/_jsx(Text, _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 = styled(Text).withConfig({
   displayName: "Menu__MenuTitle",
@@ -322,22 +329,27 @@ export var MenuGroup = function MenuGroup(_ref6) {
   var menuTitleId = useMemo(function () {
     return uniqueId("menu-title-");
   }, []);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Box, _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 ? disabled : undefined
-  }, title), children));
+  return /*#__PURE__*/_jsx(_Fragment, {
+    children: /*#__PURE__*/_jsxs(Box, _objectSpread(_objectSpread({
+      p: 300,
+      role: "group",
+      "aria-labelledby": title ? menuTitleId : undefined,
+      borderTop: "1px solid",
+      borderColor: "container.border.base"
+    }, props), {}, {
+      children: [title && /*#__PURE__*/_jsx(_StyledMenuTitle, {
+        id: menuTitleId,
+        role: "presentation",
+        fontSize: 200,
+        forwardedAs: titleAs || "li",
+        $_css: isDisabled ? disabled : undefined,
+        children: title
+      }), children]
+    }))
+  });
 };
 export var MenuDivider = function MenuDivider(props) {
-  return /*#__PURE__*/React.createElement(Box, _extends({
+  return /*#__PURE__*/_jsx(Box, _objectSpread({
     as: "li",
     role: "separator",
     borderTop: "1px solid",
@@ -372,7 +384,7 @@ var MenuFilterInput = function MenuFilterInput(_ref7) {
       isFilterInputFocused: false
     });
   }, [setState, onBlur]);
-  return /*#__PURE__*/React.createElement(Input, _extends({}, props, {
+  return /*#__PURE__*/_jsx(Input, _objectSpread(_objectSpread({}, props), {}, {
     type: type,
     value: state.filterQuery,
     onChange: handleOnChange,
@@ -389,7 +401,7 @@ var MenuItems = function MenuItems(_ref8) {
   var _useMenuKeyDown = useMenuKeyDown(),
     handleKeyDown = _useMenuKeyDown.handleKeyDown,
     activeDescendent = _useMenuKeyDown.activeDescendent;
-  return /*#__PURE__*/React.createElement(MenuItemsContainer, _extends({}, props, {
+  return /*#__PURE__*/_jsx(MenuItemsContainer, _objectSpread(_objectSpread({}, props), {}, {
     forwardedAs: "ul",
     ref: innerRef,
     role: role
@@ -402,8 +414,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;
@@ -419,10 +432,11 @@ var MenuFooter = function MenuFooter(_ref9) {
       isFooterFocused: true
     });
   }, [setState]);
-  return /*#__PURE__*/React.createElement(Box, {
+  return /*#__PURE__*/_jsx(Box, {
     onBlur: handleOnBlur,
-    onFocus: handleOnFocus
-  }, children);
+    onFocus: handleOnFocus,
+    children: children
+  });
 };
 export var Menu = function Menu(_ref10) {
   var _ref10$role = _ref10.role,
@@ -453,28 +467,33 @@ export var Menu = function Menu(_ref10) {
   var setContextState = useCallback(function (newState) {
     setState(_objectSpread(_objectSpread({}, state), newState));
   }, [state]);
-  return /*#__PURE__*/React.createElement(DescendantProvider, {
+  return /*#__PURE__*/_jsx(DescendantProvider, {
     context: MenuDescendantContext,
     items: descendants,
-    set: setDescendants
-  }, /*#__PURE__*/React.createElement(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__*/_jsxs(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__*/_jsx(MenuItems, _objectSpread(_objectSpread({}, props), {}, {
+        role: role,
+        multiselect: multiselect,
+        innerRef: menuRef,
+        children: children
+      })), footerContent ? /*#__PURE__*/_jsx(MenuFooter, {
+        children: footerContent
+      }) : null]
+    })
+  });
 };
 MenuGroup.displayName = "Menu.Group";
 MenuItem.displayName = "Menu.Item";
@@ -525,34 +544,39 @@ export var 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(innerText(children)) : undefined;
-  return /*#__PURE__*/React.createElement(MenuButtonContext.Provider, {
+  return /*#__PURE__*/_jsx(MenuButtonContext.Provider, {
     value: {
       closePopout: closePopout,
       closeOnItemClick: closeOnItemClick
-    }
-  }, /*#__PURE__*/React.createElement(Popout, _extends({
-    isOpen: isShown,
-    setIsOpen: setIsShown,
-    content: /*#__PURE__*/React.createElement(CustomPopoutContent, null, content),
-    placement: placement
-  }, popoutProps, {
-    width: props.width
-  }), /*#__PURE__*/React.createElement(Button, _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__*/_jsx(Popout, _objectSpread(_objectSpread({
+      isOpen: isShown,
+      setIsOpen: setIsShown,
+      content: /*#__PURE__*/_jsx(CustomPopoutContent, {
+        children: content
+      }),
+      placement: placement
+    }, popoutProps), {}, {
+      width: props.width,
+      children: /*#__PURE__*/_jsx(Button, _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
+      }))
+    }))
+  });
 };
 export default Menu;

package/lib/Menu/utils/descendants.js

@@ -27,7 +27,7 @@ import { createContext, useState, useLayoutEffect, useEffect, useContext, useCal
  * 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.
  */
-
+import { jsx as _jsx } from "react/jsx-runtime";
 var noop = function noop() {};
 
 /**
@@ -229,9 +229,10 @@ export function DescendantProvider(_ref2) {
       unregisterDescendant: unregisterDescendant
     };
   }, [items, registerDescendant, unregisterDescendant]);
-  return /*#__PURE__*/React.createElement(Ctx.Provider, {
-    value: value
-  }, children);
+  return /*#__PURE__*/_jsx(Ctx.Provider, {
+    value: value,
+    children: children
+  });
 }
 export function useDescendantKeyDown(context, options) {
   var _useContext2 = useContext(context),