@sproutsocial/racine 13.8.0 → 14.0.0

package/lib/DatePicker/SingleDatePicker/SingleDatePicker.js

@@ -0,0 +1,27 @@
+var _excluded = ["onDateChange", "date", "focused", "onFocusChange"];
+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 _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 React, { Fragment } from 'react';
+import DayPickerSingleDateController from 'react-dates/lib/components/DayPickerSingleDateController';
+import { ReactDatesCssOverrides } from "../styles";
+import { commonDatePickerProps } from "../common";
+var SingleDatePicker = function SingleDatePicker(_ref) {
+  var onDateChange = _ref.onDateChange,
+    _ref$date = _ref.date,
+    date = _ref$date === void 0 ? null : _ref$date,
+    _ref$focused = _ref.focused,
+    focused = _ref$focused === void 0 ? false : _ref$focused,
+    _ref$onFocusChange = _ref.onFocusChange,
+    onFocusChange = _ref$onFocusChange === void 0 ? function () {} : _ref$onFocusChange,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(ReactDatesCssOverrides, null), /*#__PURE__*/React.createElement(DayPickerSingleDateController, _extends({}, commonDatePickerProps, {
+    date: date,
+    numberOfMonths: 1,
+    onDateChange: onDateChange,
+    initialVisibleMonth: null,
+    focused: focused,
+    onFocusChange: onFocusChange
+  }, rest)));
+};
+export default /*#__PURE__*/React.memo(SingleDatePicker);

package/lib/DatePicker/SingleDatePicker/SingleDatePickerTypes.js

@@ -0,0 +1 @@
+export {};

package/lib/DatePicker/SingleDatePicker/StatefulSingleDatePicker.flow.js

@@ -0,0 +1 @@
+import * as React from 'react';

package/lib/DatePicker/SingleDatePicker/StatefulSingleDatePicker.js

@@ -0,0 +1,29 @@
+var _excluded = ["date", "onDateChange"];
+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); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) { ; } } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+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; }
+import React, { useState } from 'react';
+import SingleDatePicker from "./SingleDatePicker";
+export var StatefulSingleDatePicker = function StatefulSingleDatePicker(_ref) {
+  var date = _ref.date,
+    onDateChange = _ref.onDateChange,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var _useState = useState(date),
+    _useState2 = _slicedToArray(_useState, 2),
+    stateDate = _useState2[0],
+    setDate = _useState2[1];
+  var handleDateChange = function handleDateChange(date) {
+    onDateChange && onDateChange(date);
+    setDate(date);
+  };
+  return /*#__PURE__*/React.createElement(SingleDatePicker, _extends({
+    date: stateDate,
+    onDateChange: handleDateChange
+  }, rest));
+};

package/lib/DatePicker/SingleDatePicker/index.flow.js

@@ -0,0 +1,2 @@
+export * from "./SingleDatePicker.flow";
+export * from "./StatefulSingleDatePicker.flow";

package/lib/DatePicker/SingleDatePicker/index.js

@@ -0,0 +1,5 @@
+import SingleDatePicker from "./SingleDatePicker";
+export default SingleDatePicker;
+export { SingleDatePicker };
+export * from "./StatefulSingleDatePicker";
+export * from "./SingleDatePickerTypes";

package/lib/DatePicker/common.js

@@ -28,10 +28,11 @@ export var commonDatePickerProps = {
       day: day,
       modifiers: modifiers
     }, day.format('D'));
-  }
+  },
+  initialVisibleMonth: null
 };
-
 // Testing utilities
+
 export var formatDateAsCalendarHeader = function formatDateAsCalendarHeader(date) {
   return date.format('MMMM YYYY');
 };

package/lib/DatePicker/index.flow.js

@@ -0,0 +1,5 @@
+export { default as SingleDatePicker } from "./SingleDatePicker/index.flow";
+export { default as DateRangePicker } from "./DateRangePicker/index.flow";
+export * from "./common.flow";
+export * from "./DateRangePicker/index.flow";
+export * from "./SingleDatePicker/index.flow";

package/lib/DatePicker/index.js

@@ -1,3 +1,2 @@
-import SingleDatePicker from "./SingleDatePicker";
-import DateRangePicker from "./DateRangePicker";
-export { SingleDatePicker, DateRangePicker };
+export * from "./SingleDatePicker";
+export * from "./DateRangePicker";

package/lib/DatePicker/styles.js

@@ -14,7 +14,6 @@ import Box from "../Box";
  * selected-end-no-selected-start
  *
  */
-
 var isSelected = function isSelected(modifiers) {
   return modifiers.has('selected-span') || modifiers.has('selected') || modifiers.has('selected-start') || modifiers.has('selected-end') || modifiers.has('hovered-span') || modifiers.has('after-hovered-start');
 };
@@ -44,7 +43,7 @@ var shouldHaveRightPill = function shouldHaveRightPill(modifiers, day) {
 };
 export var CalendarDay = styled(Box).withConfig({
   displayName: "styles__CalendarDay",
-  componentId: "sc-fso9yi-0"
+  componentId: "sc-uyf25l-0"
 })(["", ";"], function (_ref) {
   var modifiers = _ref.modifiers,
     day = _ref.day,

package/lib/DatePicker/types.js

@@ -0,0 +1 @@
+export {};

package/lib/Drawer/Drawer.flow.js

@@ -0,0 +1 @@
+import * as React from 'react';

package/lib/Drawer/Drawer.js

@@ -0,0 +1,198 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+var _excluded = ["title", "children", "render"],
+  _excluded2 = ["children"],
+  _excluded3 = ["id", "style", "offset", "direction", "children", "disableCloseOnClickOutside", "onClose", "zIndex", "closeTargets"],
+  _excluded4 = ["children", "closeButtonLabel", "direction", "disableCloseOnClickOutside", "id", "isOpen", "offset", "onClose", "zIndex", "closeTargets"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+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(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+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; }
+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); }
+import * as React from 'react';
+import { useContext, useEffect, useRef } from 'react';
+import FocusLock from 'react-focus-lock';
+import { animated } from 'react-spring';
+import Box from "../Box";
+import Button from "../Button";
+import Icon from "../Icon";
+// eslint-disable-next-line import/no-deprecated
+import Text from "../Text";
+import Portal from "../Portal";
+import { SlideTransition } from "./SlideTransition";
+import Container, { Content } from "./styles";
+// If ever we needed to make drawer width configurable, move this to a default prop
+var DRAWER_WIDTH = 600;
+var AnimatedDrawer = animated(Container);
+var doesRefContainEventTarget = function doesRefContainEventTarget(ref, event) {
+  return ref.current && event.target instanceof Node && ref.current.contains(event.target);
+};
+var DrawerContext = /*#__PURE__*/React.createContext({});
+var DrawerCloseButton = function DrawerCloseButton(props) {
+  var _useContext = useContext(DrawerContext),
+    onClose = _useContext.onClose,
+    closeButtonLabel = _useContext.closeButtonLabel;
+  if (props.render) {
+    var _props$render;
+    return (_props$render = props.render({
+      onClose: onClose,
+      closeButtonLabel: closeButtonLabel
+    })) !== null && _props$render !== void 0 ? _props$render : null;
+  }
+  return /*#__PURE__*/React.createElement(Button, _extends({
+    appearance: "pill",
+    "aria-label": closeButtonLabel,
+    onClick: onClose
+  }, props), props.children || /*#__PURE__*/React.createElement(Icon, {
+    name: "x"
+  }));
+};
+var DrawerHeader = function DrawerHeader(_ref) {
+  var _ref$title = _ref.title,
+    title = _ref$title === void 0 ? '' : _ref$title,
+    children = _ref.children,
+    render = _ref.render,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var drawerContext = useContext(DrawerContext);
+  if (render) {
+    return render(drawerContext);
+  }
+  return /*#__PURE__*/React.createElement(Box, _extends({
+    display: "flex",
+    flex: "0 0 auto",
+    justifyContent: "space-between",
+    alignItems: "center",
+    pt: 400,
+    px: 450
+  }, rest), children || /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Text, {
+    as: "h2",
+    fontSize: 400,
+    fontWeight: "semibold",
+    color: "text.headline"
+  }, title), /*#__PURE__*/React.createElement(DrawerCloseButton, null)));
+};
+var DrawerContent = function DrawerContent(_ref2) {
+  var children = _ref2.children,
+    rest = _objectWithoutProperties(_ref2, _excluded2);
+  return /*#__PURE__*/React.createElement(Content, _extends({
+    height: "100%",
+    p: 450,
+    color: "text.body"
+  }, rest), children);
+};
+var Drawer = function Drawer(_ref3) {
+  var id = _ref3.id,
+    style = _ref3.style,
+    offset = _ref3.offset,
+    direction = _ref3.direction,
+    children = _ref3.children,
+    disableCloseOnClickOutside = _ref3.disableCloseOnClickOutside,
+    onClose = _ref3.onClose,
+    zIndex = _ref3.zIndex,
+    closeTargets = _ref3.closeTargets,
+    rest = _objectWithoutProperties(_ref3, _excluded3);
+  var drawerRef = useRef(null);
+  useEffect(function () {
+    var documentBody = document.body;
+    if (!documentBody) {
+      return;
+    }
+    var onEsc = function onEsc(event) {
+      if (event.key === 'Escape') {
+        onClose();
+      }
+    };
+    var bodyClick = function bodyClick(event) {
+      if (!doesRefContainEventTarget(drawerRef, event) && !disableCloseOnClickOutside) {
+        onClose();
+      }
+    };
+    documentBody && documentBody.addEventListener('keydown', onEsc, false);
+    if (closeTargets) {
+      closeTargets.forEach(function (targetElement) {
+        return targetElement && targetElement.addEventListener('click', bodyClick, false);
+      });
+    } else {
+      documentBody.firstElementChild && documentBody.firstElementChild.addEventListener('click', bodyClick, false);
+    }
+    return function () {
+      if (closeTargets) {
+        closeTargets.forEach(function (targetElement) {
+          return targetElement && targetElement.removeEventListener('click', bodyClick, false);
+        });
+      } else {
+        documentBody.firstElementChild && documentBody.firstElementChild.removeEventListener('click', bodyClick, false);
+      }
+    };
+  }, [onClose, disableCloseOnClickOutside, closeTargets]);
+  return /*#__PURE__*/React.createElement(FocusLock, {
+    key: id,
+    autoFocus: false,
+    returnFocus: true
+  }, /*#__PURE__*/React.createElement(AnimatedDrawer, _extends({
+    ref: drawerRef,
+    style: style,
+    width: DRAWER_WIDTH,
+    offset: offset,
+    direction: direction,
+    "data-qa-drawer": id
+  }, rest), children));
+};
+var DrawerContainer = function DrawerContainer(_ref4) {
+  var children = _ref4.children,
+    closeButtonLabel = _ref4.closeButtonLabel,
+    _ref4$direction = _ref4.direction,
+    direction = _ref4$direction === void 0 ? 'right' : _ref4$direction,
+    _ref4$disableCloseOnC = _ref4.disableCloseOnClickOutside,
+    disableCloseOnClickOutside = _ref4$disableCloseOnC === void 0 ? false : _ref4$disableCloseOnC,
+    id = _ref4.id,
+    isOpen = _ref4.isOpen,
+    _ref4$offset = _ref4.offset,
+    offset = _ref4$offset === void 0 ? 0 : _ref4$offset,
+    onClose = _ref4.onClose,
+    _ref4$zIndex = _ref4.zIndex,
+    zIndex = _ref4$zIndex === void 0 ? 7 : _ref4$zIndex,
+    _ref4$closeTargets = _ref4.closeTargets,
+    closeTargets = _ref4$closeTargets === void 0 ? [] : _ref4$closeTargets,
+    rest = _objectWithoutProperties(_ref4, _excluded4);
+  return /*#__PURE__*/React.createElement(Portal, {
+    id: id
+  }, /*#__PURE__*/React.createElement(DrawerContext.Provider, {
+    value: {
+      onClose: onClose,
+      closeButtonLabel: closeButtonLabel
+    }
+  }, /*#__PURE__*/React.createElement(SlideTransition, {
+    width: DRAWER_WIDTH + offset,
+    direction: direction,
+    isVisible: isOpen
+  }, function (_ref5) {
+    var isVisible = _ref5.isVisible,
+      style = _ref5.style,
+      key = _ref5.key;
+    return isVisible && /*#__PURE__*/React.createElement(Drawer, _extends({
+      key: key,
+      id: id,
+      style: _objectSpread(_objectSpread({}, style), {}, {
+        zIndex: zIndex
+      }),
+      offset: offset,
+      direction: direction,
+      disableCloseOnClickOutside: disableCloseOnClickOutside,
+      onClose: onClose,
+      zIndex: zIndex,
+      closeTargets: closeTargets,
+      "data-qa-drawer": id || '',
+      "data-qa-drawer-isopen": isOpen === true
+    }, rest), children);
+  })));
+};
+DrawerHeader.displayName = 'Drawer.Header';
+DrawerContent.displayName = 'Drawer.Content';
+DrawerCloseButton.displayName = 'Drawer.CloseButton';
+DrawerContainer.Header = DrawerHeader;
+DrawerContainer.Content = DrawerContent;
+DrawerContainer.CloseButton = DrawerCloseButton;
+export default DrawerContainer;

package/lib/Drawer/DrawerTypes.js

@@ -0,0 +1 @@
+export {};

package/lib/Drawer/SlideTransition.js

@@ -25,7 +25,7 @@ export var SlideTransition = function SlideTransition(_ref) {
       duration: MOTION_DURATION_MEDIUM * 1000
     }
   });
-  return transitions.map(function (_ref2) {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, transitions.map(function (_ref2) {
     var key = _ref2.key,
       item = _ref2.item,
       props = _ref2.props;
@@ -34,5 +34,5 @@ export var SlideTransition = function SlideTransition(_ref) {
       isVisible: item,
       style: props
     });
-  });
+  }));
 };

package/lib/Drawer/index.flow.js

@@ -1 +1 @@
-import * as React from 'react';
+export * from "./Drawer.flow";

package/lib/Drawer/index.js

@@ -1,211 +1,4 @@
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-var _excluded = ["title", "children", "render"],
-  _excluded2 = ["children"],
-  _excluded3 = ["id", "style", "offset", "direction", "children", "disableCloseOnClickOutside", "onClose", "zIndex", "closeTargets"],
-  _excluded4 = ["children", "closeButtonLabel", "direction", "disableCloseOnClickOutside", "id", "isOpen", "offset", "onClose", "zIndex", "closeTargets"];
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-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(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
-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; }
-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); }
-import * as React from 'react';
-import { useContext, useEffect, useRef } from 'react';
-import FocusLock from 'react-focus-lock';
-import { animated } from 'react-spring';
-import Box from "../Box";
-import Button from "../Button";
-import Icon from "../Icon";
-import Text from "../Text";
-import Portal from "../Portal";
-import { SlideTransition } from "./SlideTransition";
-import Container, { Content } from "./styles";
-// If ever we needed to make drawer width configurable, move this to a default prop
-var DRAWER_WIDTH = 600;
-var AnimatedDrawer = animated(Container);
-var doesRefContainEventTarget = function doesRefContainEventTarget(ref, event) {
-  return ref.current && event.target instanceof Node && ref.current.contains(event.target);
-};
-var DrawerContext = /*#__PURE__*/React.createContext({});
-var DrawerCloseButton = function DrawerCloseButton(props) {
-  var _useContext = useContext(DrawerContext),
-    onClose = _useContext.onClose,
-    closeButtonLabel = _useContext.closeButtonLabel;
-  if (props.render) {
-    return props.render({
-      onClose: onClose,
-      closeButtonLabel: closeButtonLabel
-    });
-  }
-  return (
-    /*#__PURE__*/
-    // $FlowIssue - upgrade v0.112.0
-    React.createElement(Button, _extends({
-      appearance: "pill",
-      "aria-label": closeButtonLabel,
-      onClick: onClose
-    }, props), props.children || /*#__PURE__*/React.createElement(Icon, {
-      name: "x"
-    }))
-  );
-};
-var DrawerHeader = function DrawerHeader(_ref) {
-  var _ref$title = _ref.title,
-    title = _ref$title === void 0 ? '' : _ref$title,
-    children = _ref.children,
-    render = _ref.render,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  var drawerContext = useContext(DrawerContext);
-  if (render) {
-    return render(drawerContext);
-  }
-  return (
-    /*#__PURE__*/
-    // $FlowIssue - upgrade v0.112.0
-    React.createElement(Box, _extends({
-      display: "flex",
-      flex: "0 0 auto",
-      justifyContent: "space-between",
-      alignItems: "center",
-      pt: 400,
-      px: 450
-    }, rest), children || /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Text, {
-      as: "h2",
-      fontSize: 400,
-      fontWeight: "semibold",
-      color: "text.headline"
-    }, title), /*#__PURE__*/React.createElement(DrawerCloseButton, null)))
-  );
-};
-var DrawerContent = function DrawerContent(_ref2) {
-  var children = _ref2.children,
-    rest = _objectWithoutProperties(_ref2, _excluded2);
-  return (
-    /*#__PURE__*/
-    // $FlowIssue - upgrade v0.112.0
-    React.createElement(Content, _extends({
-      height: "100%",
-      p: 450,
-      color: "text.body"
-    }, rest), children)
-  );
-};
-var Drawer = function Drawer(_ref3) {
-  var id = _ref3.id,
-    style = _ref3.style,
-    offset = _ref3.offset,
-    direction = _ref3.direction,
-    children = _ref3.children,
-    disableCloseOnClickOutside = _ref3.disableCloseOnClickOutside,
-    onClose = _ref3.onClose,
-    zIndex = _ref3.zIndex,
-    closeTargets = _ref3.closeTargets,
-    rest = _objectWithoutProperties(_ref3, _excluded3);
-  var drawerRef = useRef(null);
-  useEffect(function () {
-    var documentBody = document.body;
-    if (!documentBody) {
-      return;
-    }
-    var onEsc = function onEsc(event) {
-      if (event.key === 'Escape') {
-        onClose();
-      }
-    };
-    var bodyClick = function bodyClick(event) {
-      if (!doesRefContainEventTarget(drawerRef, event) && !disableCloseOnClickOutside) {
-        onClose();
-      }
-    };
-    documentBody && documentBody.addEventListener('keydown', onEsc, false);
-    if (closeTargets) {
-      closeTargets.forEach(function (targetElement) {
-        return targetElement && targetElement.addEventListener('click', bodyClick, false);
-      });
-    } else {
-      documentBody.firstElementChild && documentBody.firstElementChild.addEventListener('click', bodyClick, false);
-    }
-    return function () {
-      if (closeTargets) {
-        closeTargets.forEach(function (targetElement) {
-          return targetElement && targetElement.removeEventListener('click', bodyClick, false);
-        });
-      } else {
-        documentBody.firstElementChild && documentBody.firstElementChild.removeEventListener('click', bodyClick, false);
-      }
-    };
-  }, [onClose, disableCloseOnClickOutside, closeTargets]);
-  return /*#__PURE__*/React.createElement(FocusLock, {
-    key: id,
-    autoFocus: false,
-    returnFocus: true
-  }, /*#__PURE__*/React.createElement(AnimatedDrawer, _extends({
-    ref: drawerRef,
-    style: style,
-    width: DRAWER_WIDTH,
-    offset: offset,
-    direction: direction,
-    "data-qa-drawer": id
-  }, rest), children));
-};
-var DrawerContainer = function DrawerContainer(_ref4) {
-  var children = _ref4.children,
-    closeButtonLabel = _ref4.closeButtonLabel,
-    _ref4$direction = _ref4.direction,
-    direction = _ref4$direction === void 0 ? 'right' : _ref4$direction,
-    _ref4$disableCloseOnC = _ref4.disableCloseOnClickOutside,
-    disableCloseOnClickOutside = _ref4$disableCloseOnC === void 0 ? false : _ref4$disableCloseOnC,
-    id = _ref4.id,
-    isOpen = _ref4.isOpen,
-    _ref4$offset = _ref4.offset,
-    offset = _ref4$offset === void 0 ? 0 : _ref4$offset,
-    onClose = _ref4.onClose,
-    _ref4$zIndex = _ref4.zIndex,
-    zIndex = _ref4$zIndex === void 0 ? 7 : _ref4$zIndex,
-    _ref4$closeTargets = _ref4.closeTargets,
-    closeTargets = _ref4$closeTargets === void 0 ? [] : _ref4$closeTargets,
-    rest = _objectWithoutProperties(_ref4, _excluded4);
-  return /*#__PURE__*/React.createElement(Portal, {
-    id: id
-  }, /*#__PURE__*/React.createElement(DrawerContext.Provider, {
-    value: {
-      onClose: onClose,
-      closeButtonLabel: closeButtonLabel
-    }
-  }, /*#__PURE__*/React.createElement(SlideTransition, {
-    width: DRAWER_WIDTH + offset,
-    direction: direction,
-    isVisible: isOpen
-  }, function (_ref5) {
-    var isVisible = _ref5.isVisible,
-      style = _ref5.style,
-      key = _ref5.key;
-    return isVisible &&
-    /*#__PURE__*/
-    // $FlowIssue - upgrade v0.112.0
-    React.createElement(Drawer, _extends({
-      key: key,
-      id: id,
-      style: _objectSpread(_objectSpread({}, style), {}, {
-        zIndex: zIndex
-      }),
-      offset: offset,
-      direction: direction,
-      disableCloseOnClickOutside: disableCloseOnClickOutside,
-      onClose: onClose,
-      zIndex: zIndex,
-      closeTargets: closeTargets,
-      "data-qa-drawer": id || '',
-      "data-qa-drawer-isopen": isOpen === true
-    }, rest), children);
-  })));
-};
-DrawerContainer.Header = DrawerHeader;
-DrawerContainer.Content = DrawerContent;
-DrawerContainer.CloseButton = DrawerCloseButton;
-DrawerContainer.Header.displayName = 'Drawer.Header';
-DrawerContainer.Content.displayName = 'Drawer.Content';
-DrawerContainer.CloseButton.displayName = 'Drawer.CloseButton';
-export default DrawerContainer;
+import Drawer from "./Drawer";
+export default Drawer;
+export { Drawer };
+export * from "./DrawerTypes";

package/lib/Drawer/styles.js

@@ -3,11 +3,11 @@ import { COMMON } from "../utils/system-props";
 import Box from "../Box";
 export var Content = styled(Box).withConfig({
   displayName: "styles__Content",
-  componentId: "sc-bo5voc-0"
+  componentId: "sc-1nfgsze-0"
 })(["overflow-y:auto;"]);
 var Container = styled.div.withConfig({
   displayName: "styles__Container",
-  componentId: "sc-bo5voc-1"
+  componentId: "sc-1nfgsze-1"
 })(["display:flex;flex-direction:column;position:fixed;top:0;height:100%;width:", "px;background-color:", ";box-shadow:", ";filter:blur(0);", " ", ""], function (props) {
   return props.width;
 }, function (props) {

package/lib/EmptyState/EmptyState.flow.js

@@ -0,0 +1 @@
+import * as React from 'react';

package/lib/EmptyState/EmptyState.js

@@ -0,0 +1,50 @@
+var _excluded = ["media", "headline", "subtext", "primaryAction", "secondaryAction"];
+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 _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';
+import Box from "../Box";
+// eslint-disable-next-line import/no-deprecated
+import Text from "../Text";
+var EmptyState = function EmptyState(_ref) {
+  var media = _ref.media,
+    headline = _ref.headline,
+    subtext = _ref.subtext,
+    primaryAction = _ref.primaryAction,
+    secondaryAction = _ref.secondaryAction,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement(Box, _extends({
+    maxWidth: "400px",
+    mx: "auto",
+    "data-qa-emptystate": headline
+  }, rest), media && /*#__PURE__*/React.createElement(Box, {
+    display: "flex",
+    flexDirection: "column",
+    justifyContent: "center",
+    mb: 450
+  }, media), /*#__PURE__*/React.createElement(Text, {
+    as: "div",
+    textAlign: "center"
+  }, /*#__PURE__*/React.createElement(Text, {
+    as: "p",
+    m: 0,
+    color: "text.headline",
+    fontWeight: "semibold",
+    fontSize: 400
+  }, headline), subtext && /*#__PURE__*/React.createElement(Text, {
+    as: "p",
+    color: "text.subtext",
+    fontSize: 200,
+    mb: 0,
+    mt: 400
+  }, subtext), /*#__PURE__*/React.createElement(Box, {
+    mt: primaryAction || secondaryAction ? 450 : 0
+  }, primaryAction && /*#__PURE__*/React.cloneElement(primaryAction, {
+    appearance: 'primary'
+  }), secondaryAction && /*#__PURE__*/React.createElement(Box, {
+    mt: 400
+  }, /*#__PURE__*/React.cloneElement(secondaryAction, {
+    appearance: 'unstyled'
+  })))));
+};
+export default EmptyState;

package/lib/EmptyState/EmptyStateTypes.js

@@ -0,0 +1 @@
+export {};

package/lib/EmptyState/index.flow.js

@@ -1 +1 @@
-import * as React from 'react';
+export * from "./EmptyState.flow";