@blerp/design 1.0.55 → 1.0.56

package/dist/index.cjs.js

@@ -28,6 +28,7 @@ var AvatarEditor = require('react-avatar-editor');
 var Dropzone = require('react-dropzone');
 var InsertPhotoRoundedIcon = require('@mui/icons-material/InsertPhotoRounded');
 var styles = require('@mui/material/styles');
+var Slide = require('@mui/material/Slide');
 var Lottie = require('react-lottie');
 var AddRoundedIcon = require('@mui/icons-material/AddRounded');
 var FacebookIcon = require('@mui/icons-material/Facebook');
@@ -94,6 +95,7 @@ var _regeneratorRuntime__default = /*#__PURE__*/_interopDefaultLegacy(_regenerat
 var AvatarEditor__default = /*#__PURE__*/_interopDefaultLegacy(AvatarEditor);
 var Dropzone__default = /*#__PURE__*/_interopDefaultLegacy(Dropzone);
 var InsertPhotoRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(InsertPhotoRoundedIcon);
+var Slide__default = /*#__PURE__*/_interopDefaultLegacy(Slide);
 var Lottie__default = /*#__PURE__*/_interopDefaultLegacy(Lottie);
 var AddRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(AddRoundedIcon);
 var FacebookIcon__default = /*#__PURE__*/_interopDefaultLegacy(FacebookIcon);
@@ -2478,9 +2480,9 @@ BlerpListViewPremium$1.propTypes = {
   handleClickUnsave: PropTypes__default['default'].func.isRequired
 };
 
-function ownKeys$4(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys$5(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$4(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$4(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread$5(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$5(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$5(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
 var colors = {
   white: "#ffffff",
@@ -2525,8 +2527,8 @@ var overrideColors = {
   buntingBlueOverride: colors.buntingBlue,
   popnYellowOverride: colors.popnYellow
 };
-var lightColors = _objectSpread$4(_objectSpread$4({}, colors), overrideColors);
-var darkColors = _objectSpread$4({
+var lightColors = _objectSpread$5(_objectSpread$5({}, colors), overrideColors);
+var darkColors = _objectSpread$5({
   white: colors.black,
   waxwing: colors.notBlack,
   grey2: colors.grey7,
@@ -2730,9 +2732,9 @@ var darkPalette = {
 
 var _templateObject$b, _templateObject2$6, _templateObject3$5, _templateObject4$3;
 
-function ownKeys$3(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys$4(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$3(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$3(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$4(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$4(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
 var motion1 = function motion1(props) {
   return styled.keyframes(_templateObject$b || (_templateObject$b = _taggedTemplateLiteral__default['default'](["\n  0% {\n    transform: scale(0);\n  }\n  100% {\n    transform: scale(1);\n  }\n"])));
@@ -2770,7 +2772,7 @@ var EllipsisLoader = function EllipsisLoader(_ref) {
     color: color,
     size: size,
     sizeUnit: sizeUnit,
-    style: _objectSpread$3({}, style)
+    style: _objectSpread$4({}, style)
   }, /*#__PURE__*/React__default['default'].createElement("div", null), /*#__PURE__*/React__default['default'].createElement("div", null), /*#__PURE__*/React__default['default'].createElement("div", null), /*#__PURE__*/React__default['default'].createElement("div", null));
 };
 EllipsisLoader.defaultProps = {
@@ -2823,9 +2825,9 @@ var Toggle$1 = function Toggle(_ref) {
   }), /*#__PURE__*/React__default['default'].createElement(Slider$2, null)));
 };
 
-function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys$3(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$2(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$3(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$3(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 //     box-shadow: 0px 0px 20px #0000001a;
 //     div:focus {
 //         border: none !important;
@@ -2871,7 +2873,7 @@ var Dropdown$1 = function Dropdown(_ref) {
     color: "waxwing",
     icon: true,
     disableElevation: true,
-    sx: _objectSpread$2({
+    sx: _objectSpread$3({
       borderRadius: "4px",
       color: "notBlack.main",
       paddingRight: "4px",
@@ -2926,7 +2928,7 @@ var Dropdown$1 = function Dropdown(_ref) {
       horizontal: "left"
     },
     PaperProps: {
-      sx: _objectSpread$2({
+      sx: _objectSpread$3({
         "& ul": {
           padding: "0"
         },
@@ -3958,6 +3960,146 @@ var icons = {
   }
 };
 
+function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$2(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+/*
+snackbarContext.triggerSnackbar({
+  message: `Added to ${collection.title}`,
+  severity: "success",
+  actionButton: (
+    <Button
+      color="inherit"
+      variant="text"
+      size="small"
+      onClick={() => {
+        globalContext.setActiveBoard(collection);
+      }}>
+      View
+    </Button>
+  ),
+});
+*/
+
+var SnackbarContext = /*#__PURE__*/React__default['default'].createContext({
+  snackbarValues: {
+    open: false,
+    message: "Set a message",
+    position: {
+      vertical: "bottom",
+      horizontal: "center"
+    },
+    slideDirection: "up",
+    severity: "success",
+    actionButton: /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null)
+  },
+  triggerSnackbar: function triggerSnackbar() {
+    return null;
+  }
+});
+
+var slideTransition = function slideTransition(props) {
+  return /*#__PURE__*/React__default['default'].createElement(Slide__default['default'], _extends__default['default']({}, props, {
+    direction: "up"
+  }));
+};
+
+var SnackbarProvider = function SnackbarProvider(props) {
+  var _useState = React.useState(false),
+      _useState2 = _slicedToArray__default['default'](_useState, 2),
+      open = _useState2[0],
+      setOpen = _useState2[1];
+
+  var _useState3 = React.useState({
+    message: "Set a message",
+    position: {
+      vertical: "bottom",
+      horizontal: "center"
+    },
+    color: "notBlack",
+    slideDirection: "up",
+    severity: "success",
+    actionButton: /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null)
+  }),
+      _useState4 = _slicedToArray__default['default'](_useState3, 2),
+      snackbarValues = _useState4[0],
+      setSnackbarValues = _useState4[1];
+
+  var triggerSnackbar = function triggerSnackbar(_ref) {
+    var _ref$message = _ref.message,
+        message = _ref$message === void 0 ? "Set a message" : _ref$message,
+        _ref$position = _ref.position,
+        position = _ref$position === void 0 ? {
+      vertical: "bottom",
+      horizontal: "center"
+    } : _ref$position,
+        _ref$slideDirection = _ref.slideDirection,
+        slideDirection = _ref$slideDirection === void 0 ? "up" : _ref$slideDirection,
+        _ref$severity = _ref.severity,
+        severity = _ref$severity === void 0 ? "success" : _ref$severity,
+        color = _ref.color,
+        _ref$actionButton = _ref.actionButton,
+        actionButton = _ref$actionButton === void 0 ? /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null) : _ref$actionButton;
+
+    if (!color) {
+      switch (severity) {
+        case "success":
+          color = "seafoam";
+          break;
+
+        case "error":
+          color = "ibisRed";
+          break;
+
+        default:
+          color = "notBlack";
+          break;
+      }
+    }
+
+    setOpen(true);
+    setSnackbarValues({
+      message: message,
+      position: position,
+      color: color,
+      slideDirection: slideDirection,
+      severity: severity,
+      actionButton: actionButton
+    });
+  };
+
+  return /*#__PURE__*/React__default['default'].createElement(SnackbarContext.Provider, {
+    value: {
+      snackbarValues: snackbarValues,
+      setSnackbarValues: setSnackbarValues,
+      triggerSnackbar: triggerSnackbar
+    }
+  }, /*#__PURE__*/React__default['default'].createElement(Snackbar, {
+    anchorOrigin: _objectSpread$2({}, snackbarValues.position),
+    autoHideDuration: 5000,
+    open: open,
+    sx: {
+      minWidth: "30%"
+    },
+    TransitionComponent: slideTransition,
+    onClose: function onClose() {
+      return setOpen(false);
+    },
+    key: "snackbar-toast"
+  }, /*#__PURE__*/React__default['default'].createElement(Alert, {
+    severity: snackbarValues.severity,
+    variant: "filled",
+    color: snackbarValues.color,
+    action: snackbarValues.actionButton,
+    sx: {
+      width: "100%",
+      "& svg": {
+        color: "white.override"
+      }
+    }
+  }, snackbarValues.message)), props.children);
+};
+
 function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$1(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
@@ -4189,7 +4331,7 @@ var BlerpTheme = function BlerpTheme(_ref) {
       icons: icons,
       mode: mode === "dark" ? "dark" : "light"
     }, currentTheme)
-  }, children));
+  }, /*#__PURE__*/React__default['default'].createElement(SnackbarProvider, null, children)));
 };
 
 var LottieAnimation = function LottieAnimation(_ref) {
@@ -89850,6 +89992,8 @@ exports.ShortcutIcon = ShortcutIcon;
 exports.Skeleton = Skeleton;
 exports.Slider = Slider;
 exports.Snackbar = Snackbar;
+exports.SnackbarContext = SnackbarContext;
+exports.SnackbarProvider = SnackbarProvider;
 exports.SpeedDial = SpeedDial;
 exports.Stack = Stack;
 exports.Stepper = Stepper;

package/dist/index.esm.js

@@ -25,6 +25,7 @@ import AvatarEditor from 'react-avatar-editor';
 import Dropzone from 'react-dropzone';
 import InsertPhotoRoundedIcon from '@mui/icons-material/InsertPhotoRounded';
 import { createTheme, ThemeProvider } from '@mui/material/styles';
+import Slide from '@mui/material/Slide';
 import Lottie from 'react-lottie';
 import AddRoundedIcon from '@mui/icons-material/AddRounded';
 import FacebookIcon from '@mui/icons-material/Facebook';
@@ -2411,9 +2412,9 @@ BlerpListViewPremium$1.propTypes = {
   handleClickUnsave: PropTypes.func.isRequired
 };
 
-function ownKeys$4(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys$5(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$4(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$4(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread$5(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$5(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$5(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
 var colors = {
   white: "#ffffff",
@@ -2458,8 +2459,8 @@ var overrideColors = {
   buntingBlueOverride: colors.buntingBlue,
   popnYellowOverride: colors.popnYellow
 };
-var lightColors = _objectSpread$4(_objectSpread$4({}, colors), overrideColors);
-var darkColors = _objectSpread$4({
+var lightColors = _objectSpread$5(_objectSpread$5({}, colors), overrideColors);
+var darkColors = _objectSpread$5({
   white: colors.black,
   waxwing: colors.notBlack,
   grey2: colors.grey7,
@@ -2663,9 +2664,9 @@ var darkPalette = {
 
 var _templateObject$b, _templateObject2$6, _templateObject3$5, _templateObject4$3;
 
-function ownKeys$3(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys$4(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$3(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$3(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$4(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$4(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
 var motion1 = function motion1(props) {
   return keyframes(_templateObject$b || (_templateObject$b = _taggedTemplateLiteral(["\n  0% {\n    transform: scale(0);\n  }\n  100% {\n    transform: scale(1);\n  }\n"])));
@@ -2703,7 +2704,7 @@ var EllipsisLoader = function EllipsisLoader(_ref) {
     color: color,
     size: size,
     sizeUnit: sizeUnit,
-    style: _objectSpread$3({}, style)
+    style: _objectSpread$4({}, style)
   }, /*#__PURE__*/React__default.createElement("div", null), /*#__PURE__*/React__default.createElement("div", null), /*#__PURE__*/React__default.createElement("div", null), /*#__PURE__*/React__default.createElement("div", null));
 };
 EllipsisLoader.defaultProps = {
@@ -2756,9 +2757,9 @@ var Toggle$1 = function Toggle(_ref) {
   }), /*#__PURE__*/React__default.createElement(Slider$2, null)));
 };
 
-function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function ownKeys$3(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$2(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$3(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$3(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 //     box-shadow: 0px 0px 20px #0000001a;
 //     div:focus {
 //         border: none !important;
@@ -2804,7 +2805,7 @@ var Dropdown$1 = function Dropdown(_ref) {
     color: "waxwing",
     icon: true,
     disableElevation: true,
-    sx: _objectSpread$2({
+    sx: _objectSpread$3({
       borderRadius: "4px",
       color: "notBlack.main",
       paddingRight: "4px",
@@ -2859,7 +2860,7 @@ var Dropdown$1 = function Dropdown(_ref) {
       horizontal: "left"
     },
     PaperProps: {
-      sx: _objectSpread$2({
+      sx: _objectSpread$3({
         "& ul": {
           padding: "0"
         },
@@ -3891,6 +3892,146 @@ var icons = {
   }
 };
 
+function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$2(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+/*
+snackbarContext.triggerSnackbar({
+  message: `Added to ${collection.title}`,
+  severity: "success",
+  actionButton: (
+    <Button
+      color="inherit"
+      variant="text"
+      size="small"
+      onClick={() => {
+        globalContext.setActiveBoard(collection);
+      }}>
+      View
+    </Button>
+  ),
+});
+*/
+
+var SnackbarContext = /*#__PURE__*/React__default.createContext({
+  snackbarValues: {
+    open: false,
+    message: "Set a message",
+    position: {
+      vertical: "bottom",
+      horizontal: "center"
+    },
+    slideDirection: "up",
+    severity: "success",
+    actionButton: /*#__PURE__*/React__default.createElement(React__default.Fragment, null)
+  },
+  triggerSnackbar: function triggerSnackbar() {
+    return null;
+  }
+});
+
+var slideTransition = function slideTransition(props) {
+  return /*#__PURE__*/React__default.createElement(Slide, _extends({}, props, {
+    direction: "up"
+  }));
+};
+
+var SnackbarProvider = function SnackbarProvider(props) {
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      open = _useState2[0],
+      setOpen = _useState2[1];
+
+  var _useState3 = useState({
+    message: "Set a message",
+    position: {
+      vertical: "bottom",
+      horizontal: "center"
+    },
+    color: "notBlack",
+    slideDirection: "up",
+    severity: "success",
+    actionButton: /*#__PURE__*/React__default.createElement(React__default.Fragment, null)
+  }),
+      _useState4 = _slicedToArray(_useState3, 2),
+      snackbarValues = _useState4[0],
+      setSnackbarValues = _useState4[1];
+
+  var triggerSnackbar = function triggerSnackbar(_ref) {
+    var _ref$message = _ref.message,
+        message = _ref$message === void 0 ? "Set a message" : _ref$message,
+        _ref$position = _ref.position,
+        position = _ref$position === void 0 ? {
+      vertical: "bottom",
+      horizontal: "center"
+    } : _ref$position,
+        _ref$slideDirection = _ref.slideDirection,
+        slideDirection = _ref$slideDirection === void 0 ? "up" : _ref$slideDirection,
+        _ref$severity = _ref.severity,
+        severity = _ref$severity === void 0 ? "success" : _ref$severity,
+        color = _ref.color,
+        _ref$actionButton = _ref.actionButton,
+        actionButton = _ref$actionButton === void 0 ? /*#__PURE__*/React__default.createElement(React__default.Fragment, null) : _ref$actionButton;
+
+    if (!color) {
+      switch (severity) {
+        case "success":
+          color = "seafoam";
+          break;
+
+        case "error":
+          color = "ibisRed";
+          break;
+
+        default:
+          color = "notBlack";
+          break;
+      }
+    }
+
+    setOpen(true);
+    setSnackbarValues({
+      message: message,
+      position: position,
+      color: color,
+      slideDirection: slideDirection,
+      severity: severity,
+      actionButton: actionButton
+    });
+  };
+
+  return /*#__PURE__*/React__default.createElement(SnackbarContext.Provider, {
+    value: {
+      snackbarValues: snackbarValues,
+      setSnackbarValues: setSnackbarValues,
+      triggerSnackbar: triggerSnackbar
+    }
+  }, /*#__PURE__*/React__default.createElement(Snackbar, {
+    anchorOrigin: _objectSpread$2({}, snackbarValues.position),
+    autoHideDuration: 5000,
+    open: open,
+    sx: {
+      minWidth: "30%"
+    },
+    TransitionComponent: slideTransition,
+    onClose: function onClose() {
+      return setOpen(false);
+    },
+    key: "snackbar-toast"
+  }, /*#__PURE__*/React__default.createElement(Alert, {
+    severity: snackbarValues.severity,
+    variant: "filled",
+    color: snackbarValues.color,
+    action: snackbarValues.actionButton,
+    sx: {
+      width: "100%",
+      "& svg": {
+        color: "white.override"
+      }
+    }
+  }, snackbarValues.message)), props.children);
+};
+
 function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$1(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
@@ -4122,7 +4263,7 @@ var BlerpTheme = function BlerpTheme(_ref) {
       icons: icons,
       mode: mode === "dark" ? "dark" : "light"
     }, currentTheme)
-  }, children));
+  }, /*#__PURE__*/React__default.createElement(SnackbarProvider, null, children)));
 };
 
 var LottieAnimation = function LottieAnimation(_ref) {
@@ -89710,4 +89851,4 @@ var Themes = {
 // };
 // export default returnLibrary();
 
-export { Accordion, Alert, AppBar, Autocomplete, Avatar, Backdrop, Badge, Blerp, BlerpCardIcon, BlerpCoinsIcon, BlerpListView, BlerpListViewPremium, BlerpListViewSkeleton, BlerpSkeleton, BlerpyIcon, BookmarkAddRounded, BottomNavigation, Box, Breadcrumbs, Button, ButtonGroup, Card, ChannelPointsIcon, Checkbox, CheckoutModal, Chip, ClockIcon, CogIcon, CollectionCard, CollectionListViewPremium, CollectionSkeleton, Container, CrownIcon, Dialog, DiamondIcon, DiscordIcon, Divider, Drawer, Dropdown, FloatingActionButton, GiftIcon, Grid, IconButton, ImageList, Input, InputAdornment, LightbulbIcon, LinearProgress, Link, List, Menu, MenuItem, Modal, NewCollectionModal, OpenLockIcon, Pagination, Paper, PlayOutlineIcon, PlaySolidIcon, PointerFingerIcon, Popover, PremiumBlerpCheckoutModal, PremiumCollectionCheckoutModal, PremiumSubscriptionCheckoutModal, RadarDishIcon, RadioButton, Rating, ReactionButtons, Select, ShortcutIcon, Skeleton, Slider, Snackbar, SpeedDial, Stack, Stepper, Switch, Table, Tabs, Text, Theme, Themes, Toggle, Toolbar, Tooltip, TwitchBitIcon, TwitchIcon, UnsafeIcon, UserLibraryHeader, UserProfileHeader, WalkonIcon, WindowsIcon, darkThemeV1, lightThemeV1, mainTheme };
+export { Accordion, Alert, AppBar, Autocomplete, Avatar, Backdrop, Badge, Blerp, BlerpCardIcon, BlerpCoinsIcon, BlerpListView, BlerpListViewPremium, BlerpListViewSkeleton, BlerpSkeleton, BlerpyIcon, BookmarkAddRounded, BottomNavigation, Box, Breadcrumbs, Button, ButtonGroup, Card, ChannelPointsIcon, Checkbox, CheckoutModal, Chip, ClockIcon, CogIcon, CollectionCard, CollectionListViewPremium, CollectionSkeleton, Container, CrownIcon, Dialog, DiamondIcon, DiscordIcon, Divider, Drawer, Dropdown, FloatingActionButton, GiftIcon, Grid, IconButton, ImageList, Input, InputAdornment, LightbulbIcon, LinearProgress, Link, List, Menu, MenuItem, Modal, NewCollectionModal, OpenLockIcon, Pagination, Paper, PlayOutlineIcon, PlaySolidIcon, PointerFingerIcon, Popover, PremiumBlerpCheckoutModal, PremiumCollectionCheckoutModal, PremiumSubscriptionCheckoutModal, RadarDishIcon, RadioButton, Rating, ReactionButtons, Select, ShortcutIcon, Skeleton, Slider, Snackbar, SnackbarContext, SnackbarProvider, SpeedDial, Stack, Stepper, Switch, Table, Tabs, Text, Theme, Themes, Toggle, Toolbar, Tooltip, TwitchBitIcon, TwitchIcon, UnsafeIcon, UserLibraryHeader, UserProfileHeader, WalkonIcon, WindowsIcon, darkThemeV1, lightThemeV1, mainTheme };

package/dist/index.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@mui/material'), require('@babel/runtime/helpers/slicedToArray'), require('prop-types'), require('react'), require('react-color-extractor'), require('styled-components'), require('@babel/runtime/helpers/taggedTemplateLiteral'), require('@mui/icons-material'), require('@mui/icons-material/BookmarkOutlined'), require('@mui/icons-material/LockRounded'), require('@mui/icons-material/BookmarkAddOutlined'), require('@mui/icons-material/MoreHorizRounded'), require('react-palette'), require('@babel/runtime/helpers/typeof'), require('@mui/icons-material/KeyboardArrowRightRounded'), require('@babel/runtime/helpers/defineProperty'), require('@mui/icons-material/KeyboardArrowDownRounded'), require('@mui/icons-material/CloseRounded'), require('@mui/icons-material/FileUploadRounded'), require('@babel/runtime/helpers/extends'), require('@babel/runtime/helpers/asyncToGenerator'), require('@babel/runtime/regenerator'), require('react-avatar-editor'), require('react-dropzone'), require('@mui/icons-material/InsertPhotoRounded'), require('@mui/material/styles'), require('react-lottie'), require('@mui/icons-material/AddRounded'), require('@mui/icons-material/Facebook'), require('@mui/icons-material/Instagram'), require('@mui/icons-material/ModeEditRounded'), require('@mui/icons-material/PersonAddRounded'), require('@mui/icons-material/Pinterest'), require('@mui/icons-material/Twitter'), require('@mui/icons-material/YouTube'), require('@mui/icons-material/PersonRemoveRounded'), require('@babel/runtime/helpers/toConsumableArray'), require('@mui/icons-material/FilterAltRounded'), require('@mui/icons-material/MenuRounded'), require('@mui/icons-material/ViewModuleRounded'), require('@mui/icons-material/SettingsRounded'), require('@mui/icons-material/SortRounded'), require('@mui/icons-material/ChevronRightRounded'), require('@mui/icons-material/PersonRounded'), require('@mui/icons-material/SearchRounded'), require('@mui/icons-material/BookmarkRemoveOutlined'), require('@mui/icons-material/VisibilityOffRounded')) :
-    typeof define === 'function' && define.amd ? define(['exports', '@mui/material', '@babel/runtime/helpers/slicedToArray', 'prop-types', 'react', 'react-color-extractor', 'styled-components', '@babel/runtime/helpers/taggedTemplateLiteral', '@mui/icons-material', '@mui/icons-material/BookmarkOutlined', '@mui/icons-material/LockRounded', '@mui/icons-material/BookmarkAddOutlined', '@mui/icons-material/MoreHorizRounded', 'react-palette', '@babel/runtime/helpers/typeof', '@mui/icons-material/KeyboardArrowRightRounded', '@babel/runtime/helpers/defineProperty', '@mui/icons-material/KeyboardArrowDownRounded', '@mui/icons-material/CloseRounded', '@mui/icons-material/FileUploadRounded', '@babel/runtime/helpers/extends', '@babel/runtime/helpers/asyncToGenerator', '@babel/runtime/regenerator', 'react-avatar-editor', 'react-dropzone', '@mui/icons-material/InsertPhotoRounded', '@mui/material/styles', 'react-lottie', '@mui/icons-material/AddRounded', '@mui/icons-material/Facebook', '@mui/icons-material/Instagram', '@mui/icons-material/ModeEditRounded', '@mui/icons-material/PersonAddRounded', '@mui/icons-material/Pinterest', '@mui/icons-material/Twitter', '@mui/icons-material/YouTube', '@mui/icons-material/PersonRemoveRounded', '@babel/runtime/helpers/toConsumableArray', '@mui/icons-material/FilterAltRounded', '@mui/icons-material/MenuRounded', '@mui/icons-material/ViewModuleRounded', '@mui/icons-material/SettingsRounded', '@mui/icons-material/SortRounded', '@mui/icons-material/ChevronRightRounded', '@mui/icons-material/PersonRounded', '@mui/icons-material/SearchRounded', '@mui/icons-material/BookmarkRemoveOutlined', '@mui/icons-material/VisibilityOffRounded'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global['react-awesome-buttons'] = {}, global.material, global._slicedToArray, global.PropTypes, global.React, global.reactColorExtractor, global.styled, global._taggedTemplateLiteral, global.iconsMaterial, global.BookmarkOutlinedIcon, global.LockRoundedIcon, global.BookmarkAddOutlinedIcon, global.MoreHorizRoundedIcon, global.reactPalette, global._typeof, global.KeyboardArrowRightRoundedIcon, global._defineProperty, global.KeyboardArrowDownRoundedIcon, global.CloseRoundedIcon, global.FileUploadRoundedIcon, global._extends, global._asyncToGenerator, global._regeneratorRuntime, global.AvatarEditor, global.Dropzone, global.InsertPhotoRoundedIcon, global.styles, global.Lottie, global.AddRoundedIcon, global.FacebookIcon, global.InstagramIcon, global.ModeEditRoundedIcon, global.PersonAddRoundedIcon, global.PinterestIcon, global.TwitterIcon, global.YouTubeIcon, global.PersonRemoveRoundedIcon, global._toConsumableArray, null, global.MenuRoundedIcon, global.ViewModuleRoundedIcon, null, global.SortRoundedIcon, global.ChevronRightRoundedIcon, global.PersonRoundedIcon, global.SearchRoundedIcon, global.BookmarkRemoveOutlinedIcon, global.VisibilityOffRoundedIcon));
-}(this, (function (exports, material, _slicedToArray, PropTypes, React, reactColorExtractor, styled, _taggedTemplateLiteral, iconsMaterial, BookmarkOutlinedIcon, LockRoundedIcon, BookmarkAddOutlinedIcon, MoreHorizRoundedIcon, reactPalette, _typeof, KeyboardArrowRightRoundedIcon, _defineProperty, KeyboardArrowDownRoundedIcon, CloseRoundedIcon, FileUploadRoundedIcon, _extends, _asyncToGenerator, _regeneratorRuntime, AvatarEditor, Dropzone, InsertPhotoRoundedIcon, styles, Lottie, AddRoundedIcon, FacebookIcon, InstagramIcon, ModeEditRoundedIcon, PersonAddRoundedIcon, PinterestIcon, TwitterIcon, YouTubeIcon, PersonRemoveRoundedIcon, _toConsumableArray, FilterAltRounded, MenuRoundedIcon, ViewModuleRoundedIcon, SettingsRounded, SortRoundedIcon, ChevronRightRoundedIcon, PersonRoundedIcon, SearchRoundedIcon, BookmarkRemoveOutlinedIcon, VisibilityOffRoundedIcon) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@mui/material'), require('@babel/runtime/helpers/slicedToArray'), require('prop-types'), require('react'), require('react-color-extractor'), require('styled-components'), require('@babel/runtime/helpers/taggedTemplateLiteral'), require('@mui/icons-material'), require('@mui/icons-material/BookmarkOutlined'), require('@mui/icons-material/LockRounded'), require('@mui/icons-material/BookmarkAddOutlined'), require('@mui/icons-material/MoreHorizRounded'), require('react-palette'), require('@babel/runtime/helpers/typeof'), require('@mui/icons-material/KeyboardArrowRightRounded'), require('@babel/runtime/helpers/defineProperty'), require('@mui/icons-material/KeyboardArrowDownRounded'), require('@mui/icons-material/CloseRounded'), require('@mui/icons-material/FileUploadRounded'), require('@babel/runtime/helpers/extends'), require('@babel/runtime/helpers/asyncToGenerator'), require('@babel/runtime/regenerator'), require('react-avatar-editor'), require('react-dropzone'), require('@mui/icons-material/InsertPhotoRounded'), require('@mui/material/styles'), require('@mui/material/Slide'), require('react-lottie'), require('@mui/icons-material/AddRounded'), require('@mui/icons-material/Facebook'), require('@mui/icons-material/Instagram'), require('@mui/icons-material/ModeEditRounded'), require('@mui/icons-material/PersonAddRounded'), require('@mui/icons-material/Pinterest'), require('@mui/icons-material/Twitter'), require('@mui/icons-material/YouTube'), require('@mui/icons-material/PersonRemoveRounded'), require('@babel/runtime/helpers/toConsumableArray'), require('@mui/icons-material/FilterAltRounded'), require('@mui/icons-material/MenuRounded'), require('@mui/icons-material/ViewModuleRounded'), require('@mui/icons-material/SettingsRounded'), require('@mui/icons-material/SortRounded'), require('@mui/icons-material/ChevronRightRounded'), require('@mui/icons-material/PersonRounded'), require('@mui/icons-material/SearchRounded'), require('@mui/icons-material/BookmarkRemoveOutlined'), require('@mui/icons-material/VisibilityOffRounded')) :
+    typeof define === 'function' && define.amd ? define(['exports', '@mui/material', '@babel/runtime/helpers/slicedToArray', 'prop-types', 'react', 'react-color-extractor', 'styled-components', '@babel/runtime/helpers/taggedTemplateLiteral', '@mui/icons-material', '@mui/icons-material/BookmarkOutlined', '@mui/icons-material/LockRounded', '@mui/icons-material/BookmarkAddOutlined', '@mui/icons-material/MoreHorizRounded', 'react-palette', '@babel/runtime/helpers/typeof', '@mui/icons-material/KeyboardArrowRightRounded', '@babel/runtime/helpers/defineProperty', '@mui/icons-material/KeyboardArrowDownRounded', '@mui/icons-material/CloseRounded', '@mui/icons-material/FileUploadRounded', '@babel/runtime/helpers/extends', '@babel/runtime/helpers/asyncToGenerator', '@babel/runtime/regenerator', 'react-avatar-editor', 'react-dropzone', '@mui/icons-material/InsertPhotoRounded', '@mui/material/styles', '@mui/material/Slide', 'react-lottie', '@mui/icons-material/AddRounded', '@mui/icons-material/Facebook', '@mui/icons-material/Instagram', '@mui/icons-material/ModeEditRounded', '@mui/icons-material/PersonAddRounded', '@mui/icons-material/Pinterest', '@mui/icons-material/Twitter', '@mui/icons-material/YouTube', '@mui/icons-material/PersonRemoveRounded', '@babel/runtime/helpers/toConsumableArray', '@mui/icons-material/FilterAltRounded', '@mui/icons-material/MenuRounded', '@mui/icons-material/ViewModuleRounded', '@mui/icons-material/SettingsRounded', '@mui/icons-material/SortRounded', '@mui/icons-material/ChevronRightRounded', '@mui/icons-material/PersonRounded', '@mui/icons-material/SearchRounded', '@mui/icons-material/BookmarkRemoveOutlined', '@mui/icons-material/VisibilityOffRounded'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global['react-awesome-buttons'] = {}, global.material, global._slicedToArray, global.PropTypes, global.React, global.reactColorExtractor, global.styled, global._taggedTemplateLiteral, global.iconsMaterial, global.BookmarkOutlinedIcon, global.LockRoundedIcon, global.BookmarkAddOutlinedIcon, global.MoreHorizRoundedIcon, global.reactPalette, global._typeof, global.KeyboardArrowRightRoundedIcon, global._defineProperty, global.KeyboardArrowDownRoundedIcon, global.CloseRoundedIcon, global.FileUploadRoundedIcon, global._extends, global._asyncToGenerator, global._regeneratorRuntime, global.AvatarEditor, global.Dropzone, global.InsertPhotoRoundedIcon, global.styles, global.Slide, global.Lottie, global.AddRoundedIcon, global.FacebookIcon, global.InstagramIcon, global.ModeEditRoundedIcon, global.PersonAddRoundedIcon, global.PinterestIcon, global.TwitterIcon, global.YouTubeIcon, global.PersonRemoveRoundedIcon, global._toConsumableArray, null, global.MenuRoundedIcon, global.ViewModuleRoundedIcon, null, global.SortRoundedIcon, global.ChevronRightRoundedIcon, global.PersonRoundedIcon, global.SearchRoundedIcon, global.BookmarkRemoveOutlinedIcon, global.VisibilityOffRoundedIcon));
+}(this, (function (exports, material, _slicedToArray, PropTypes, React, reactColorExtractor, styled, _taggedTemplateLiteral, iconsMaterial, BookmarkOutlinedIcon, LockRoundedIcon, BookmarkAddOutlinedIcon, MoreHorizRoundedIcon, reactPalette, _typeof, KeyboardArrowRightRoundedIcon, _defineProperty, KeyboardArrowDownRoundedIcon, CloseRoundedIcon, FileUploadRoundedIcon, _extends, _asyncToGenerator, _regeneratorRuntime, AvatarEditor, Dropzone, InsertPhotoRoundedIcon, styles, Slide, Lottie, AddRoundedIcon, FacebookIcon, InstagramIcon, ModeEditRoundedIcon, PersonAddRoundedIcon, PinterestIcon, TwitterIcon, YouTubeIcon, PersonRemoveRoundedIcon, _toConsumableArray, FilterAltRounded, MenuRoundedIcon, ViewModuleRoundedIcon, SettingsRounded, SortRoundedIcon, ChevronRightRoundedIcon, PersonRoundedIcon, SearchRoundedIcon, BookmarkRemoveOutlinedIcon, VisibilityOffRoundedIcon) { 'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -48,6 +48,7 @@
     var AvatarEditor__default = /*#__PURE__*/_interopDefaultLegacy(AvatarEditor);
     var Dropzone__default = /*#__PURE__*/_interopDefaultLegacy(Dropzone);
     var InsertPhotoRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(InsertPhotoRoundedIcon);
+    var Slide__default = /*#__PURE__*/_interopDefaultLegacy(Slide);
     var Lottie__default = /*#__PURE__*/_interopDefaultLegacy(Lottie);
     var AddRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(AddRoundedIcon);
     var FacebookIcon__default = /*#__PURE__*/_interopDefaultLegacy(FacebookIcon);
@@ -2432,9 +2433,9 @@
       handleClickUnsave: PropTypes__default['default'].func.isRequired
     };
 
-    function ownKeys$4(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+    function ownKeys$5(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-    function _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$4(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$4(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+    function _objectSpread$5(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$5(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$5(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
     var colors = {
       white: "#ffffff",
@@ -2479,8 +2480,8 @@
       buntingBlueOverride: colors.buntingBlue,
       popnYellowOverride: colors.popnYellow
     };
-    var lightColors = _objectSpread$4(_objectSpread$4({}, colors), overrideColors);
-    var darkColors = _objectSpread$4({
+    var lightColors = _objectSpread$5(_objectSpread$5({}, colors), overrideColors);
+    var darkColors = _objectSpread$5({
       white: colors.black,
       waxwing: colors.notBlack,
       grey2: colors.grey7,
@@ -2684,9 +2685,9 @@
 
     var _templateObject$b, _templateObject2$6, _templateObject3$5, _templateObject4$3;
 
-    function ownKeys$3(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+    function ownKeys$4(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-    function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$3(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$3(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+    function _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$4(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$4(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
     var motion1 = function motion1(props) {
       return styled.keyframes(_templateObject$b || (_templateObject$b = _taggedTemplateLiteral__default['default'](["\n  0% {\n    transform: scale(0);\n  }\n  100% {\n    transform: scale(1);\n  }\n"])));
@@ -2724,7 +2725,7 @@
         color: color,
         size: size,
         sizeUnit: sizeUnit,
-        style: _objectSpread$3({}, style)
+        style: _objectSpread$4({}, style)
       }, /*#__PURE__*/React__default['default'].createElement("div", null), /*#__PURE__*/React__default['default'].createElement("div", null), /*#__PURE__*/React__default['default'].createElement("div", null), /*#__PURE__*/React__default['default'].createElement("div", null));
     };
     EllipsisLoader.defaultProps = {
@@ -2777,9 +2778,9 @@
       }), /*#__PURE__*/React__default['default'].createElement(Slider$2, null)));
     };
 
-    function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+    function ownKeys$3(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-    function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$2(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+    function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$3(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$3(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
     //     box-shadow: 0px 0px 20px #0000001a;
     //     div:focus {
     //         border: none !important;
@@ -2825,7 +2826,7 @@
         color: "waxwing",
         icon: true,
         disableElevation: true,
-        sx: _objectSpread$2({
+        sx: _objectSpread$3({
           borderRadius: "4px",
           color: "notBlack.main",
           paddingRight: "4px",
@@ -2880,7 +2881,7 @@
           horizontal: "left"
         },
         PaperProps: {
-          sx: _objectSpread$2({
+          sx: _objectSpread$3({
             "& ul": {
               padding: "0"
             },
@@ -3912,6 +3913,146 @@
       }
     };
 
+    function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+    function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$2(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+    /*
+    snackbarContext.triggerSnackbar({
+      message: `Added to ${collection.title}`,
+      severity: "success",
+      actionButton: (
+        <Button
+          color="inherit"
+          variant="text"
+          size="small"
+          onClick={() => {
+            globalContext.setActiveBoard(collection);
+          }}>
+          View
+        </Button>
+      ),
+    });
+    */
+
+    var SnackbarContext = /*#__PURE__*/React__default['default'].createContext({
+      snackbarValues: {
+        open: false,
+        message: "Set a message",
+        position: {
+          vertical: "bottom",
+          horizontal: "center"
+        },
+        slideDirection: "up",
+        severity: "success",
+        actionButton: /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null)
+      },
+      triggerSnackbar: function triggerSnackbar() {
+        return null;
+      }
+    });
+
+    var slideTransition = function slideTransition(props) {
+      return /*#__PURE__*/React__default['default'].createElement(Slide__default['default'], _extends__default['default']({}, props, {
+        direction: "up"
+      }));
+    };
+
+    var SnackbarProvider = function SnackbarProvider(props) {
+      var _useState = React.useState(false),
+          _useState2 = _slicedToArray__default['default'](_useState, 2),
+          open = _useState2[0],
+          setOpen = _useState2[1];
+
+      var _useState3 = React.useState({
+        message: "Set a message",
+        position: {
+          vertical: "bottom",
+          horizontal: "center"
+        },
+        color: "notBlack",
+        slideDirection: "up",
+        severity: "success",
+        actionButton: /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null)
+      }),
+          _useState4 = _slicedToArray__default['default'](_useState3, 2),
+          snackbarValues = _useState4[0],
+          setSnackbarValues = _useState4[1];
+
+      var triggerSnackbar = function triggerSnackbar(_ref) {
+        var _ref$message = _ref.message,
+            message = _ref$message === void 0 ? "Set a message" : _ref$message,
+            _ref$position = _ref.position,
+            position = _ref$position === void 0 ? {
+          vertical: "bottom",
+          horizontal: "center"
+        } : _ref$position,
+            _ref$slideDirection = _ref.slideDirection,
+            slideDirection = _ref$slideDirection === void 0 ? "up" : _ref$slideDirection,
+            _ref$severity = _ref.severity,
+            severity = _ref$severity === void 0 ? "success" : _ref$severity,
+            color = _ref.color,
+            _ref$actionButton = _ref.actionButton,
+            actionButton = _ref$actionButton === void 0 ? /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null) : _ref$actionButton;
+
+        if (!color) {
+          switch (severity) {
+            case "success":
+              color = "seafoam";
+              break;
+
+            case "error":
+              color = "ibisRed";
+              break;
+
+            default:
+              color = "notBlack";
+              break;
+          }
+        }
+
+        setOpen(true);
+        setSnackbarValues({
+          message: message,
+          position: position,
+          color: color,
+          slideDirection: slideDirection,
+          severity: severity,
+          actionButton: actionButton
+        });
+      };
+
+      return /*#__PURE__*/React__default['default'].createElement(SnackbarContext.Provider, {
+        value: {
+          snackbarValues: snackbarValues,
+          setSnackbarValues: setSnackbarValues,
+          triggerSnackbar: triggerSnackbar
+        }
+      }, /*#__PURE__*/React__default['default'].createElement(Snackbar, {
+        anchorOrigin: _objectSpread$2({}, snackbarValues.position),
+        autoHideDuration: 5000,
+        open: open,
+        sx: {
+          minWidth: "30%"
+        },
+        TransitionComponent: slideTransition,
+        onClose: function onClose() {
+          return setOpen(false);
+        },
+        key: "snackbar-toast"
+      }, /*#__PURE__*/React__default['default'].createElement(Alert, {
+        severity: snackbarValues.severity,
+        variant: "filled",
+        color: snackbarValues.color,
+        action: snackbarValues.actionButton,
+        sx: {
+          width: "100%",
+          "& svg": {
+            color: "white.override"
+          }
+        }
+      }, snackbarValues.message)), props.children);
+    };
+
     function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
     function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$1(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
@@ -4143,7 +4284,7 @@
           icons: icons,
           mode: mode === "dark" ? "dark" : "light"
         }, currentTheme)
-      }, children));
+      }, /*#__PURE__*/React__default['default'].createElement(SnackbarProvider, null, children)));
     };
 
     var LottieAnimation = function LottieAnimation(_ref) {
@@ -89804,6 +89945,8 @@
     exports.Skeleton = Skeleton;
     exports.Slider = Slider;
     exports.Snackbar = Snackbar;
+    exports.SnackbarContext = SnackbarContext;
+    exports.SnackbarProvider = SnackbarProvider;
     exports.SpeedDial = SpeedDial;
     exports.Stack = Stack;
     exports.Stepper = Stepper;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@blerp/design",
-    "version": "1.0.55",
+    "version": "1.0.56",
     "description": "Blerp UI",
     "main": "dist/index.cjs.js",
     "scripts": {