@flodesk/grain 9.7.12 → 9.8.0

package/es/components/index.js

@@ -26,4 +26,5 @@ export { Textarea } from './textarea';
 export { Pagination } from './pagination';
 export { Nav, NavItem } from './nav';
 export { Flex } from './flex';
-export { Badge } from './badge';
+export { Badge } from './badge';
+export { Toast } from './toast';

package/es/components/toast.js

@@ -0,0 +1,153 @@
+import "core-js/modules/es.symbol.js";
+import "core-js/modules/es.symbol.description.js";
+import "core-js/modules/es.object.to-string.js";
+import "core-js/modules/es.symbol.iterator.js";
+import "core-js/modules/es.array.iterator.js";
+import "core-js/modules/es.string.iterator.js";
+import "core-js/modules/web.dom-collections.iterator.js";
+import "core-js/modules/es.array.slice.js";
+import "core-js/modules/es.array.from.js";
+import "core-js/modules/es.regexp.exec.js";
+import "core-js/modules/es.object.assign.js";
+import _styled from "@emotion/styled/base";
+
+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 = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+import React, { Fragment, forwardRef, useCallback, useEffect, useRef, useState } from 'react';
+import PropTypes from 'prop-types';
+import { getColor, getRadius, getSpace, getTransition } from '../utilities';
+import { lineHeightAndCapHeightOffset } from '../foundational';
+import { Transition } from '@headlessui/react';
+import { jsx as ___EmotionJSX } from "@emotion/react";
+var variantStyles = {
+  success: {
+    backgroundColor: getColor('success'),
+    color: 'white'
+  },
+  danger: {
+    backgroundColor: getColor('danger'),
+    color: 'white'
+  },
+  neutral: {
+    backgroundColor: getColor('shade12'),
+    color: getColor('shade2')
+  }
+};
+var transitionChildProps = {
+  enter: 'enter',
+  enterFrom: 'enterFrom',
+  enterTo: 'enterTo',
+  leave: 'leave',
+  leaveFrom: 'leaveFrom',
+  leaveTo: 'leaveTo'
+};
+
+var Root = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
+  target: "ep1f3rd1"
+} : {
+  target: "ep1f3rd1",
+  label: "Root"
+})(function (_ref) {
+  var zIndex = _ref.zIndex;
+  return "z-index: ".concat(zIndex);
+}, ";position:fixed;bottom:", getSpace('l'), ";left:50%;transform:translateX(-50%);.leaveTo,.enterFrom{opacity:0;transform:translateY(", getSpace('s'), ");}.enterTo,.leaveTo{transition-duration:", getTransition('fast'), ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL3RvYXN0LmpzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUErQnVCIiwiZmlsZSI6Ii4uLy4uL3NyYy9jb21wb25lbnRzL3RvYXN0LmpzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwgeyBGcmFnbWVudCwgZm9yd2FyZFJlZiwgdXNlQ2FsbGJhY2ssIHVzZUVmZmVjdCwgdXNlUmVmLCB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBQcm9wVHlwZXMgZnJvbSAncHJvcC10eXBlcyc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBnZXRDb2xvciwgZ2V0UmFkaXVzLCBnZXRTcGFjZSwgZ2V0VHJhbnNpdGlvbiB9IGZyb20gJy4uL3V0aWxpdGllcyc7XG5pbXBvcnQgeyBsaW5lSGVpZ2h0QW5kQ2FwSGVpZ2h0T2Zmc2V0IH0gZnJvbSAnLi4vZm91bmRhdGlvbmFsJztcbmltcG9ydCB7IFRyYW5zaXRpb24gfSBmcm9tICdAaGVhZGxlc3N1aS9yZWFjdCc7XG5cbmNvbnN0IHZhcmlhbnRTdHlsZXMgPSB7XG4gIHN1Y2Nlc3M6IHtcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IGdldENvbG9yKCdzdWNjZXNzJyksXG4gICAgY29sb3I6ICd3aGl0ZScsXG4gIH0sXG4gIGRhbmdlcjoge1xuICAgIGJhY2tncm91bmRDb2xvcjogZ2V0Q29sb3IoJ2RhbmdlcicpLFxuICAgIGNvbG9yOiAnd2hpdGUnLFxuICB9LFxuICBuZXV0cmFsOiB7XG4gICAgYmFja2dyb3VuZENvbG9yOiBnZXRDb2xvcignc2hhZGUxMicpLFxuICAgIGNvbG9yOiBnZXRDb2xvcignc2hhZGUyJyksXG4gIH0sXG59O1xuXG5jb25zdCB0cmFuc2l0aW9uQ2hpbGRQcm9wcyA9IHtcbiAgZW50ZXI6ICdlbnRlcicsXG4gIGVudGVyRnJvbTogJ2VudGVyRnJvbScsXG4gIGVudGVyVG86ICdlbnRlclRvJyxcbiAgbGVhdmU6ICdsZWF2ZScsXG4gIGxlYXZlRnJvbTogJ2xlYXZlRnJvbScsXG4gIGxlYXZlVG86ICdsZWF2ZVRvJyxcbn07XG5cbmNvbnN0IFJvb3QgPSBzdHlsZWQuZGl2YFxuICAkeyh7IHpJbmRleCB9KSA9PiBgei1pbmRleDogJHt6SW5kZXh9YH07XG4gIHBvc2l0aW9uOiBmaXhlZDtcbiAgYm90dG9tOiAke2dldFNwYWNlKCdsJyl9O1xuICBsZWZ0OiA1MCU7XG4gIHRyYW5zZm9ybTogdHJhbnNsYXRlWCgtNTAlKTtcblxuICAubGVhdmVUbyxcbiAgLmVudGVyRnJvbSB7XG4gICAgb3BhY2l0eTogMDtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoJHtnZXRTcGFjZSgncycpfSk7XG4gIH1cbiAgLmVudGVyVG8sXG4gIC5sZWF2ZVRvIHtcbiAgICB0cmFuc2l0aW9uLWR1cmF0aW9uOiAke2dldFRyYW5zaXRpb24oJ2Zhc3QnKX07XG4gIH1cbmA7XG5cbmNvbnN0IENvbnRlbnQgPSBzdHlsZWQuZGl2YFxuICAtLXBhZGRpbmc6ICR7Z2V0U3BhY2UoJ2wnKX07XG4gIHBhZGRpbmc6IGNhbGModmFyKC0tcGFkZGluZykgLSAke2xpbmVIZWlnaHRBbmRDYXBIZWlnaHRPZmZzZXR9KSB2YXIoLS1wYWRkaW5nKTtcbiAgd2lkdGg6IG1heC1jb250ZW50O1xuICBtYXgtd2lkdGg6IG1pbigke2dldFNwYWNlKDUwKX0sIGNhbGMoMTAwdncgLSAke2dldFNwYWNlKCdsJyl9ICogMikpO1xuICBib3JkZXItcmFkaXVzOiAke2dldFJhZGl1cygnbScpfTtcbiAgJHsoeyB2YXJpYW50IH0pID0+IHZhcmlhbnRTdHlsZXNbdmFyaWFudF19O1xuYDtcblxuZXhwb3J0IGNvbnN0IFRvYXN0ID0gZm9yd2FyZFJlZihcbiAgKFxuICAgIHsgekluZGV4ID0gMTIwMCwgY2hpbGRyZW4sIGlzT3BlbiwgdmFyaWFudCA9ICduZXV0cmFsJywgZGlzbWlzc1RpbWVvdXQgPSAzMDAwLCBvbkRpc21pc3MgfSxcbiAgICByZWYsXG4gICkgPT4ge1xuICAgIGNvbnN0IFtpc0ludGVybmFsbHlPcGVuLCBzZXRJc0ludGVybmFsbHlPcGVuXSA9IHVzZVN0YXRlKGlzT3Blbik7XG4gICAgY29uc3QgW2lzSG92ZXJlZCwgc2V0SXNIb3ZlcmVkXSA9IHVzZVN0YXRlKGZhbHNlKTtcbiAgICBjb25zdCBkaXNtaXNzVGltZXJSZWYgPSB1c2VSZWYoKTtcblxuICAgIGNvbnN0IGNsZWFyRGlzbWlzc1RpbWVyID0gdXNlQ2FsbGJhY2soKCkgPT4ge1xuICAgICAgaWYgKGRpc21pc3NUaW1lclJlZi5jdXJyZW50KSB7XG4gICAgICAgIGNsZWFyVGltZW91dChkaXNtaXNzVGltZXJSZWYuY3VycmVudCk7XG4gICAgICB9XG4gICAgfSwgW10pO1xuXG4gICAgY29uc3Qgc3RhcnREaXNtaXNzVGltZXIgPSB1c2VDYWxsYmFjaygoKSA9PiB7XG4gICAgICBjbGVhckRpc21pc3NUaW1lcigpO1xuICAgICAgZGlzbWlzc1RpbWVyUmVmLmN1cnJlbnQgPSBzZXRUaW1lb3V0KCgpID0+IHtcbiAgICAgICAgc2V0SXNJbnRlcm5hbGx5T3BlbihmYWxzZSk7XG4gICAgICAgIG9uRGlzbWlzcyAmJiBvbkRpc21pc3MoKTtcbiAgICAgIH0sIGRpc21pc3NUaW1lb3V0KTtcbiAgICB9LCBbY2xlYXJEaXNtaXNzVGltZXIsIGRpc21pc3NUaW1lb3V0LCBvbkRpc21pc3NdKTtcblxuICAgIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgICBzZXRJc0ludGVybmFsbHlPcGVuKGlzT3Blbik7XG4gICAgICBpZiAoaXNPcGVuICYmICFpc0hvdmVyZWQpIHtcbiAgICAgICAgc3RhcnREaXNtaXNzVGltZXIoKTtcbiAgICAgIH1cbiAgICB9LCBbaXNPcGVuLCBpc0hvdmVyZWQsIHN0YXJ0RGlzbWlzc1RpbWVyXSk7XG5cbiAgICBjb25zdCBoYW5kbGVNb3VzZUVudGVyID0gKCkgPT4ge1xuICAgICAgc2V0SXNIb3ZlcmVkKHRydWUpO1xuICAgICAgY2xlYXJEaXNtaXNzVGltZXIoKTtcbiAgICB9O1xuXG4gICAgY29uc3QgaGFuZGxlTW91c2VMZWF2ZSA9ICgpID0+IHtcbiAgICAgIHNldElzSG92ZXJlZChmYWxzZSk7XG4gICAgICBpZiAoaXNPcGVuKSB7XG4gICAgICAgIHN0YXJ0RGlzbWlzc1RpbWVyKCk7XG4gICAgICB9XG4gICAgfTtcblxuICAgIHJldHVybiAoXG4gICAgICA8Um9vdFxuICAgICAgICByZWY9e3JlZn1cbiAgICAgICAgekluZGV4PXt6SW5kZXh9XG4gICAgICAgIG9uTW91c2VFbnRlcj17aGFuZGxlTW91c2VFbnRlcn1cbiAgICAgICAgb25Nb3VzZUxlYXZlPXtoYW5kbGVNb3VzZUxlYXZlfVxuICAgICAgPlxuICAgICAgICA8VHJhbnNpdGlvbiBzaG93PXtpc0ludGVybmFsbHlPcGVufSBhcz17RnJhZ21lbnR9PlxuICAgICAgICAgIDxUcmFuc2l0aW9uLkNoaWxkIGFzPXtGcmFnbWVudH0gey4uLnRyYW5zaXRpb25DaGlsZFByb3BzfT5cbiAgICAgICAgICAgIDxDb250ZW50IHZhcmlhbnQ9e3ZhcmlhbnR9PntjaGlsZHJlbn08L0NvbnRlbnQ+XG4gICAgICAgICAgPC9UcmFuc2l0aW9uLkNoaWxkPlxuICAgICAgICA8L1RyYW5zaXRpb24+XG4gICAgICA8L1Jvb3Q+XG4gICAgKTtcbiAgfSxcbik7XG5cblRvYXN0LnByb3BUeXBlcyA9IHtcbiAgY2hpbGRyZW46IFByb3BUeXBlcy5ub2RlLFxuICB6SW5kZXg6IFByb3BUeXBlcy5udW1iZXIsXG4gIGlzT3BlbjogUHJvcFR5cGVzLmJvb2wsXG4gIHZhcmlhbnQ6IFByb3BUeXBlcy5vbmVPZihbJ3N1Y2Nlc3MnLCAnZGFuZ2VyJywgJ25ldXRyYWwnXSksXG4gIGRpc21pc3NUaW1lb3V0OiBQcm9wVHlwZXMubnVtYmVyLFxuICBvbkRpc21pc3M6IFByb3BUeXBlcy5mdW5jLFxufTtcbiJdfQ== */"));
+
+var Content = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
+  target: "ep1f3rd0"
+} : {
+  target: "ep1f3rd0",
+  label: "Content"
+})("--padding:", getSpace('l'), ";padding:calc(var(--padding) - ", lineHeightAndCapHeightOffset, ") var(--padding);width:max-content;max-width:min(", getSpace(50), ", calc(100vw - ", getSpace('l'), " * 2));border-radius:", getRadius('m'), ";", function (_ref2) {
+  var variant = _ref2.variant;
+  return variantStyles[variant];
+}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9jb21wb25lbnRzL3RvYXN0LmpzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpRDBCIiwiZmlsZSI6Ii4uLy4uL3NyYy9jb21wb25lbnRzL3RvYXN0LmpzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwgeyBGcmFnbWVudCwgZm9yd2FyZFJlZiwgdXNlQ2FsbGJhY2ssIHVzZUVmZmVjdCwgdXNlUmVmLCB1c2VTdGF0ZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBQcm9wVHlwZXMgZnJvbSAncHJvcC10eXBlcyc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBnZXRDb2xvciwgZ2V0UmFkaXVzLCBnZXRTcGFjZSwgZ2V0VHJhbnNpdGlvbiB9IGZyb20gJy4uL3V0aWxpdGllcyc7XG5pbXBvcnQgeyBsaW5lSGVpZ2h0QW5kQ2FwSGVpZ2h0T2Zmc2V0IH0gZnJvbSAnLi4vZm91bmRhdGlvbmFsJztcbmltcG9ydCB7IFRyYW5zaXRpb24gfSBmcm9tICdAaGVhZGxlc3N1aS9yZWFjdCc7XG5cbmNvbnN0IHZhcmlhbnRTdHlsZXMgPSB7XG4gIHN1Y2Nlc3M6IHtcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IGdldENvbG9yKCdzdWNjZXNzJyksXG4gICAgY29sb3I6ICd3aGl0ZScsXG4gIH0sXG4gIGRhbmdlcjoge1xuICAgIGJhY2tncm91bmRDb2xvcjogZ2V0Q29sb3IoJ2RhbmdlcicpLFxuICAgIGNvbG9yOiAnd2hpdGUnLFxuICB9LFxuICBuZXV0cmFsOiB7XG4gICAgYmFja2dyb3VuZENvbG9yOiBnZXRDb2xvcignc2hhZGUxMicpLFxuICAgIGNvbG9yOiBnZXRDb2xvcignc2hhZGUyJyksXG4gIH0sXG59O1xuXG5jb25zdCB0cmFuc2l0aW9uQ2hpbGRQcm9wcyA9IHtcbiAgZW50ZXI6ICdlbnRlcicsXG4gIGVudGVyRnJvbTogJ2VudGVyRnJvbScsXG4gIGVudGVyVG86ICdlbnRlclRvJyxcbiAgbGVhdmU6ICdsZWF2ZScsXG4gIGxlYXZlRnJvbTogJ2xlYXZlRnJvbScsXG4gIGxlYXZlVG86ICdsZWF2ZVRvJyxcbn07XG5cbmNvbnN0IFJvb3QgPSBzdHlsZWQuZGl2YFxuICAkeyh7IHpJbmRleCB9KSA9PiBgei1pbmRleDogJHt6SW5kZXh9YH07XG4gIHBvc2l0aW9uOiBmaXhlZDtcbiAgYm90dG9tOiAke2dldFNwYWNlKCdsJyl9O1xuICBsZWZ0OiA1MCU7XG4gIHRyYW5zZm9ybTogdHJhbnNsYXRlWCgtNTAlKTtcblxuICAubGVhdmVUbyxcbiAgLmVudGVyRnJvbSB7XG4gICAgb3BhY2l0eTogMDtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoJHtnZXRTcGFjZSgncycpfSk7XG4gIH1cbiAgLmVudGVyVG8sXG4gIC5sZWF2ZVRvIHtcbiAgICB0cmFuc2l0aW9uLWR1cmF0aW9uOiAke2dldFRyYW5zaXRpb24oJ2Zhc3QnKX07XG4gIH1cbmA7XG5cbmNvbnN0IENvbnRlbnQgPSBzdHlsZWQuZGl2YFxuICAtLXBhZGRpbmc6ICR7Z2V0U3BhY2UoJ2wnKX07XG4gIHBhZGRpbmc6IGNhbGModmFyKC0tcGFkZGluZykgLSAke2xpbmVIZWlnaHRBbmRDYXBIZWlnaHRPZmZzZXR9KSB2YXIoLS1wYWRkaW5nKTtcbiAgd2lkdGg6IG1heC1jb250ZW50O1xuICBtYXgtd2lkdGg6IG1pbigke2dldFNwYWNlKDUwKX0sIGNhbGMoMTAwdncgLSAke2dldFNwYWNlKCdsJyl9ICogMikpO1xuICBib3JkZXItcmFkaXVzOiAke2dldFJhZGl1cygnbScpfTtcbiAgJHsoeyB2YXJpYW50IH0pID0+IHZhcmlhbnRTdHlsZXNbdmFyaWFudF19O1xuYDtcblxuZXhwb3J0IGNvbnN0IFRvYXN0ID0gZm9yd2FyZFJlZihcbiAgKFxuICAgIHsgekluZGV4ID0gMTIwMCwgY2hpbGRyZW4sIGlzT3BlbiwgdmFyaWFudCA9ICduZXV0cmFsJywgZGlzbWlzc1RpbWVvdXQgPSAzMDAwLCBvbkRpc21pc3MgfSxcbiAgICByZWYsXG4gICkgPT4ge1xuICAgIGNvbnN0IFtpc0ludGVybmFsbHlPcGVuLCBzZXRJc0ludGVybmFsbHlPcGVuXSA9IHVzZVN0YXRlKGlzT3Blbik7XG4gICAgY29uc3QgW2lzSG92ZXJlZCwgc2V0SXNIb3ZlcmVkXSA9IHVzZVN0YXRlKGZhbHNlKTtcbiAgICBjb25zdCBkaXNtaXNzVGltZXJSZWYgPSB1c2VSZWYoKTtcblxuICAgIGNvbnN0IGNsZWFyRGlzbWlzc1RpbWVyID0gdXNlQ2FsbGJhY2soKCkgPT4ge1xuICAgICAgaWYgKGRpc21pc3NUaW1lclJlZi5jdXJyZW50KSB7XG4gICAgICAgIGNsZWFyVGltZW91dChkaXNtaXNzVGltZXJSZWYuY3VycmVudCk7XG4gICAgICB9XG4gICAgfSwgW10pO1xuXG4gICAgY29uc3Qgc3RhcnREaXNtaXNzVGltZXIgPSB1c2VDYWxsYmFjaygoKSA9PiB7XG4gICAgICBjbGVhckRpc21pc3NUaW1lcigpO1xuICAgICAgZGlzbWlzc1RpbWVyUmVmLmN1cnJlbnQgPSBzZXRUaW1lb3V0KCgpID0+IHtcbiAgICAgICAgc2V0SXNJbnRlcm5hbGx5T3BlbihmYWxzZSk7XG4gICAgICAgIG9uRGlzbWlzcyAmJiBvbkRpc21pc3MoKTtcbiAgICAgIH0sIGRpc21pc3NUaW1lb3V0KTtcbiAgICB9LCBbY2xlYXJEaXNtaXNzVGltZXIsIGRpc21pc3NUaW1lb3V0LCBvbkRpc21pc3NdKTtcblxuICAgIHVzZUVmZmVjdCgoKSA9PiB7XG4gICAgICBzZXRJc0ludGVybmFsbHlPcGVuKGlzT3Blbik7XG4gICAgICBpZiAoaXNPcGVuICYmICFpc0hvdmVyZWQpIHtcbiAgICAgICAgc3RhcnREaXNtaXNzVGltZXIoKTtcbiAgICAgIH1cbiAgICB9LCBbaXNPcGVuLCBpc0hvdmVyZWQsIHN0YXJ0RGlzbWlzc1RpbWVyXSk7XG5cbiAgICBjb25zdCBoYW5kbGVNb3VzZUVudGVyID0gKCkgPT4ge1xuICAgICAgc2V0SXNIb3ZlcmVkKHRydWUpO1xuICAgICAgY2xlYXJEaXNtaXNzVGltZXIoKTtcbiAgICB9O1xuXG4gICAgY29uc3QgaGFuZGxlTW91c2VMZWF2ZSA9ICgpID0+IHtcbiAgICAgIHNldElzSG92ZXJlZChmYWxzZSk7XG4gICAgICBpZiAoaXNPcGVuKSB7XG4gICAgICAgIHN0YXJ0RGlzbWlzc1RpbWVyKCk7XG4gICAgICB9XG4gICAgfTtcblxuICAgIHJldHVybiAoXG4gICAgICA8Um9vdFxuICAgICAgICByZWY9e3JlZn1cbiAgICAgICAgekluZGV4PXt6SW5kZXh9XG4gICAgICAgIG9uTW91c2VFbnRlcj17aGFuZGxlTW91c2VFbnRlcn1cbiAgICAgICAgb25Nb3VzZUxlYXZlPXtoYW5kbGVNb3VzZUxlYXZlfVxuICAgICAgPlxuICAgICAgICA8VHJhbnNpdGlvbiBzaG93PXtpc0ludGVybmFsbHlPcGVufSBhcz17RnJhZ21lbnR9PlxuICAgICAgICAgIDxUcmFuc2l0aW9uLkNoaWxkIGFzPXtGcmFnbWVudH0gey4uLnRyYW5zaXRpb25DaGlsZFByb3BzfT5cbiAgICAgICAgICAgIDxDb250ZW50IHZhcmlhbnQ9e3ZhcmlhbnR9PntjaGlsZHJlbn08L0NvbnRlbnQ+XG4gICAgICAgICAgPC9UcmFuc2l0aW9uLkNoaWxkPlxuICAgICAgICA8L1RyYW5zaXRpb24+XG4gICAgICA8L1Jvb3Q+XG4gICAgKTtcbiAgfSxcbik7XG5cblRvYXN0LnByb3BUeXBlcyA9IHtcbiAgY2hpbGRyZW46IFByb3BUeXBlcy5ub2RlLFxuICB6SW5kZXg6IFByb3BUeXBlcy5udW1iZXIsXG4gIGlzT3BlbjogUHJvcFR5cGVzLmJvb2wsXG4gIHZhcmlhbnQ6IFByb3BUeXBlcy5vbmVPZihbJ3N1Y2Nlc3MnLCAnZGFuZ2VyJywgJ25ldXRyYWwnXSksXG4gIGRpc21pc3NUaW1lb3V0OiBQcm9wVHlwZXMubnVtYmVyLFxuICBvbkRpc21pc3M6IFByb3BUeXBlcy5mdW5jLFxufTtcbiJdfQ== */"));
+
+export var Toast = /*#__PURE__*/forwardRef(function (_ref3, ref) {
+  var _ref3$zIndex = _ref3.zIndex,
+      zIndex = _ref3$zIndex === void 0 ? 1200 : _ref3$zIndex,
+      children = _ref3.children,
+      isOpen = _ref3.isOpen,
+      _ref3$variant = _ref3.variant,
+      variant = _ref3$variant === void 0 ? 'neutral' : _ref3$variant,
+      _ref3$dismissTimeout = _ref3.dismissTimeout,
+      dismissTimeout = _ref3$dismissTimeout === void 0 ? 3000 : _ref3$dismissTimeout,
+      onDismiss = _ref3.onDismiss;
+
+  var _useState = useState(isOpen),
+      _useState2 = _slicedToArray(_useState, 2),
+      isInternallyOpen = _useState2[0],
+      setIsInternallyOpen = _useState2[1];
+
+  var _useState3 = useState(false),
+      _useState4 = _slicedToArray(_useState3, 2),
+      isHovered = _useState4[0],
+      setIsHovered = _useState4[1];
+
+  var dismissTimerRef = useRef();
+  var clearDismissTimer = useCallback(function () {
+    if (dismissTimerRef.current) {
+      clearTimeout(dismissTimerRef.current);
+    }
+  }, []);
+  var startDismissTimer = useCallback(function () {
+    clearDismissTimer();
+    dismissTimerRef.current = setTimeout(function () {
+      setIsInternallyOpen(false);
+      onDismiss && onDismiss();
+    }, dismissTimeout);
+  }, [clearDismissTimer, dismissTimeout, onDismiss]);
+  useEffect(function () {
+    setIsInternallyOpen(isOpen);
+
+    if (isOpen && !isHovered) {
+      startDismissTimer();
+    }
+  }, [isOpen, isHovered, startDismissTimer]);
+
+  var handleMouseEnter = function handleMouseEnter() {
+    setIsHovered(true);
+    clearDismissTimer();
+  };
+
+  var handleMouseLeave = function handleMouseLeave() {
+    setIsHovered(false);
+
+    if (isOpen) {
+      startDismissTimer();
+    }
+  };
+
+  return ___EmotionJSX(Root, {
+    ref: ref,
+    zIndex: zIndex,
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave
+  }, ___EmotionJSX(Transition, {
+    show: isInternallyOpen,
+    as: Fragment
+  }, ___EmotionJSX(Transition.Child, _extends({
+    as: Fragment
+  }, transitionChildProps), ___EmotionJSX(Content, {
+    variant: variant
+  }, children))));
+});
+Toast.propTypes = {
+  children: PropTypes.node,
+  zIndex: PropTypes.number,
+  isOpen: PropTypes.bool,
+  variant: PropTypes.oneOf(['success', 'danger', 'neutral']),
+  dismissTimeout: PropTypes.number,
+  onDismiss: PropTypes.func
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flodesk/grain",
-  "version": "9.7.12",
+  "version": "9.8.0",
   "description": "Flodesk design system",
   "module": "es/index.js",
   "author": "Flodesk",