@blerp/design 1.4.5 → 1.4.7

package/dist/cjs/Blerp/BlerpImageRow.js

@@ -1,12 +1,17 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
 var _extends = require('@babel/runtime/helpers/extends');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 var React = require('react');
-var index = require('../index.js');
 var Theme = require('../Theme.js');
 var Icons = require('../Icons/Icons.js');
+var Stack = require('../neo-components/Stack.js');
+var Box = require('../neo-components/Box.js');
+var Text = require('../neo-components/Text.js');
+var Misc = require('../neo-components/Misc.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -29,7 +34,7 @@ const Icon = _ref => {
   } = _ref,
       props = _objectWithoutProperties__default["default"](_ref, _excluded);
 
-  return /*#__PURE__*/React__default["default"].createElement(index.Box, _extends__default["default"]({
+  return /*#__PURE__*/React__default["default"].createElement(Box.Box, _extends__default["default"]({
     component: "svg",
     viewBox: "0 0 24 24",
     width: size,
@@ -74,10 +79,10 @@ const BlerpImageRow = _ref2 => {
   const theme = Theme.useBlerpTheme();
 
   if (bite.visibility === "PRIVATE" && !isOwner) {
-    return /*#__PURE__*/React__default["default"].createElement(index.Stack, {
+    return /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
       direction: "row",
       marginTop: sizeParams.buttonSize === "small" && "28px"
-    }, /*#__PURE__*/React__default["default"].createElement(index.Box, {
+    }, /*#__PURE__*/React__default["default"].createElement(Box.Box, {
       sx: {
         height: sizeParams.imageSize,
         width: sizeParams.imageSize,
@@ -89,7 +94,7 @@ const BlerpImageRow = _ref2 => {
           transform: "scale(1.1)"
         }
       }
-    }, /*#__PURE__*/React__default["default"].createElement(index.Box, {
+    }, /*#__PURE__*/React__default["default"].createElement(Box.Box, {
       id: "blerp-image-scrim-private",
       sx: {
         height: sizeParams.imageSize,
@@ -111,7 +116,7 @@ const BlerpImageRow = _ref2 => {
           display: "none"
         }
       }
-    }, /*#__PURE__*/React__default["default"].createElement(index.Text, {
+    }, /*#__PURE__*/React__default["default"].createElement(Text.Text, {
       sx: {
         display: "none",
         fontWeight: "regular",
@@ -128,10 +133,10 @@ const BlerpImageRow = _ref2 => {
     }))));
   }
 
-  return /*#__PURE__*/React__default["default"].createElement(index.Stack, {
+  return /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
     direction: "row",
     marginTop: sizeParams.buttonSize === "small" && "28px"
-  }, /*#__PURE__*/React__default["default"].createElement(index.Box, {
+  }, /*#__PURE__*/React__default["default"].createElement(Box.Box, {
     sx: {
       height: sizeParams.imageSize,
       width: sizeParams.imageSize,
@@ -144,7 +149,7 @@ const BlerpImageRow = _ref2 => {
         transform: "scale(1.1)"
       }
     }
-  }, /*#__PURE__*/React__default["default"].createElement(index.Box, {
+  }, /*#__PURE__*/React__default["default"].createElement(Box.Box, {
     onClick: () => handleClickPlay(),
     sx: {
       height: sizeParams.imageSize,
@@ -176,7 +181,7 @@ const BlerpImageRow = _ref2 => {
       height: "40px",
       color: "white.override"
     }
-  }), isPremium && isLocked ? /*#__PURE__*/React__default["default"].createElement(index.Box, {
+  }), isPremium && isLocked ? /*#__PURE__*/React__default["default"].createElement(Box.Box, {
     className: "save-container",
     onClick: e => {
       e.stopPropagation();
@@ -205,7 +210,7 @@ const BlerpImageRow = _ref2 => {
         color: theme.colors.white
       }
     }
-  }, /*#__PURE__*/React__default["default"].createElement(index.Stack, {
+  }, /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
     sx: {
       position: "relative",
       top: "1px",
@@ -213,7 +218,7 @@ const BlerpImageRow = _ref2 => {
         color: "white.main"
       }
     }
-  }, /*#__PURE__*/React__default["default"].createElement(index.Tooltip, {
+  }, /*#__PURE__*/React__default["default"].createElement(Misc.Tooltip, {
     title: "Unlock"
   }, actionButtonHovered ? /*#__PURE__*/React__default["default"].createElement(Icons.OpenLockIcon, {
     sx: {
@@ -229,7 +234,7 @@ const BlerpImageRow = _ref2 => {
     sx: {
       color: "notBlack.override"
     }
-  })))) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, primaryActionButton ? primaryActionButton : /*#__PURE__*/React__default["default"].createElement(index.Box, {
+  })))) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, primaryActionButton ? primaryActionButton : /*#__PURE__*/React__default["default"].createElement(Box.Box, {
     className: "save-container",
     onClick: e => {
       e.stopPropagation();
@@ -263,7 +268,7 @@ const BlerpImageRow = _ref2 => {
         color: theme.colors.white
       }
     }
-  }, /*#__PURE__*/React__default["default"].createElement(index.Stack, {
+  }, /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
     sx: {
       position: "relative",
       top: "1px",
@@ -283,4 +288,6 @@ const BlerpImageRow = _ref2 => {
   }) : /*#__PURE__*/React__default["default"].createElement(Icons.BookmarkAddRounded, null)))))));
 };
 
-module.exports = BlerpImageRow;
+var BlerpImageRow$1 = BlerpImageRow;
+
+exports["default"] = BlerpImageRow$1;

package/dist/cjs/Blerp/BlerpSavePopup.js

@@ -1,8 +1,15 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
 var React = require('react');
-var index = require('../index.js');
 var Theme = require('../Theme.js');
+var Navigation = require('../neo-components/Navigation.js');
+var Grid = require('../neo-components/Grid.js');
+var Misc = require('../neo-components/Misc.js');
+var Box = require('../neo-components/Box.js');
+var Stack = require('../neo-components/Stack.js');
+var Button = require('../neo-components/Button.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -35,7 +42,7 @@ const BlerpSavePopup = _ref => {
     anchorRef
   } = _ref;
   const theme = Theme.useBlerpTheme();
-  return /*#__PURE__*/React__default["default"].createElement(index.Popover, {
+  return /*#__PURE__*/React__default["default"].createElement(Navigation.Popover, {
     open: openSave,
     onClose: () => setOpenSave(false),
     anchorEl: anchorRef.current,
@@ -60,7 +67,7 @@ const BlerpSavePopup = _ref => {
       vertical: "center",
       horizontal: "center"
     }
-  }, /*#__PURE__*/React__default["default"].createElement(index.Grid, {
+  }, /*#__PURE__*/React__default["default"].createElement(Grid.Grid, {
     display: "grid",
     gridTemplateColumns: "repeat(5, 1fr)",
     alignItems: "center",
@@ -70,14 +77,14 @@ const BlerpSavePopup = _ref => {
     var _bite$userReactions;
 
     const isActive = bite === null || bite === void 0 ? void 0 : (_bite$userReactions = bite.userReactions) === null || _bite$userReactions === void 0 ? void 0 : _bite$userReactions.reactions.includes(reaction);
-    return /*#__PURE__*/React__default["default"].createElement(index.Grid, {
+    return /*#__PURE__*/React__default["default"].createElement(Grid.Grid, {
       key: "".concat(reaction, "-button"),
       gridColumn: "span 1",
       display: "flex",
       justifyContent: "center"
-    }, /*#__PURE__*/React__default["default"].createElement(index.Tooltip, {
+    }, /*#__PURE__*/React__default["default"].createElement(Misc.Tooltip, {
       title: reaction
-    }, /*#__PURE__*/React__default["default"].createElement(index.Box, {
+    }, /*#__PURE__*/React__default["default"].createElement(Box.Box, {
       onClick: () => {
         var _bite$userReactions2;
 
@@ -107,13 +114,13 @@ const BlerpSavePopup = _ref => {
       height: "100%",
       src: reactionIconUrls[reaction]
     }))));
-  })), /*#__PURE__*/React__default["default"].createElement(index.Stack, {
+  })), /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
     justifyContent: "space-around",
     alignItems: "center",
     direction: "row",
     width: "100%",
     flexWrap: "wrap"
-  }, /*#__PURE__*/React__default["default"].createElement(index.Button, {
+  }, /*#__PURE__*/React__default["default"].createElement(Button.Button, {
     variant: "contained",
     color: "seafoam",
     size: "small",
@@ -123,7 +130,7 @@ const BlerpSavePopup = _ref => {
       fontSize: (sizeParams === null || sizeParams === void 0 ? void 0 : sizeParams.buttonSize) === "small" ? "10px" : "16px"
     },
     onClick: () => setOpenSave(false)
-  }, "DONE"), unsaveButton ? unsaveButton : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, (!bite.isPremium || !bite.owned) && /*#__PURE__*/React__default["default"].createElement(index.Button, {
+  }, "DONE"), unsaveButton ? unsaveButton : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, (!bite.isPremium || !bite.owned) && /*#__PURE__*/React__default["default"].createElement(Button.Button, {
     onClick: () => {
       handleClickUnsave();
       setOpenSave(false);
@@ -144,7 +151,7 @@ const BlerpSavePopup = _ref => {
         margin: "0"
       }
     })
-  }, "UNSAVE")), organizeButton ? organizeButton : /*#__PURE__*/React__default["default"].createElement(index.Button, {
+  }, "UNSAVE")), organizeButton ? organizeButton : /*#__PURE__*/React__default["default"].createElement(Button.Button, {
     variant: "text",
     color: "grey4",
     sx: {
@@ -158,4 +165,6 @@ const BlerpSavePopup = _ref => {
   }, "Organize")));
 };
 
-module.exports = BlerpSavePopup;
+var BlerpSavePopup$1 = BlerpSavePopup;
+
+exports["default"] = BlerpSavePopup$1;

package/dist/cjs/Blerp/BlerpTitleRow.js

@@ -1,7 +1,11 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
 var React = require('react');
-var index = require('../index.js');
+var Stack = require('../neo-components/Stack.js');
+var Box = require('../neo-components/Box.js');
+var Text = require('../neo-components/Text.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -20,7 +24,7 @@ const BlerpTitleRow = _ref => {
   } = _ref;
 
   if (bite.visibility === "PRIVATE" && !isOwner) {
-    return /*#__PURE__*/React__default["default"].createElement(index.Stack, {
+    return /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
       direction: "row",
       sx: {
         width: "90%",
@@ -30,7 +34,7 @@ const BlerpTitleRow = _ref => {
         justifyContent: "center",
         margin: "auto"
       }
-    }, /*#__PURE__*/React__default["default"].createElement(index.Box, {
+    }, /*#__PURE__*/React__default["default"].createElement(Box.Box, {
       onClick: e => {
         if (handleClickTitle) {
           e.stopPropagation();
@@ -45,7 +49,7 @@ const BlerpTitleRow = _ref => {
         textOverflow: "ellipsis",
         overflow: "hidden"
       }
-    }, /*#__PURE__*/React__default["default"].createElement(index.Text, {
+    }, /*#__PURE__*/React__default["default"].createElement(Text.Text, {
       textAlign: "center",
       fontSize: sizeParams.fontSize,
       color: isPremium && !isLocked ? "white.override" : "white.override",
@@ -59,7 +63,7 @@ const BlerpTitleRow = _ref => {
     }, title || bite.title)));
   }
 
-  return /*#__PURE__*/React__default["default"].createElement(index.Stack, {
+  return /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
     direction: "row",
     sx: {
       width: "90%",
@@ -70,7 +74,7 @@ const BlerpTitleRow = _ref => {
       justifyContent: "center",
       margin: "auto"
     }
-  }, isLinkTitle ? /*#__PURE__*/React__default["default"].createElement(index.Box, {
+  }, isLinkTitle ? /*#__PURE__*/React__default["default"].createElement(Box.Box, {
     onClick: e => {
       if (handleClickTitle) {
         e.stopPropagation();
@@ -90,7 +94,7 @@ const BlerpTitleRow = _ref => {
     style: {
       textDecoration: "none"
     }
-  }, /*#__PURE__*/React__default["default"].createElement(index.Text, {
+  }, /*#__PURE__*/React__default["default"].createElement(Text.Text, {
     textAlign: "center",
     fontSize: sizeParams.fontSize,
     color: isPremium ? "white.override" : "white.override",
@@ -101,7 +105,7 @@ const BlerpTitleRow = _ref => {
       textOverflow: "ellipsis"
     },
     lineHeight: sizeParams.buttonSize === "small" ? "16px" : "24px"
-  }, title || bite.title))) : /*#__PURE__*/React__default["default"].createElement(index.Box, {
+  }, title || bite.title))) : /*#__PURE__*/React__default["default"].createElement(Box.Box, {
     onClick: e => {
       if (handleClickTitle) {
         e.stopPropagation();
@@ -116,7 +120,7 @@ const BlerpTitleRow = _ref => {
       textOverflow: "ellipsis",
       overflow: "hidden"
     }
-  }, /*#__PURE__*/React__default["default"].createElement(index.Text, {
+  }, /*#__PURE__*/React__default["default"].createElement(Text.Text, {
     textAlign: "center",
     fontSize: sizeParams.fontSize,
     color: isPremium ? "white.override" : "white.override",
@@ -130,4 +134,6 @@ const BlerpTitleRow = _ref => {
   }, title || bite.title)));
 };
 
-module.exports = BlerpTitleRow;
+var BlerpTitleRow$1 = BlerpTitleRow;
+
+exports["default"] = BlerpTitleRow$1;

package/dist/cjs/Blerp/BlerpTopRow.js

@@ -1,10 +1,14 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var React = require('react');
-var Blerp = require('../Blerp.js');
 var Icons = require('../Icons/Icons.js');
-var index = require('../index.js');
+var Stack = require('../neo-components/Stack.js');
+var Text = require('../neo-components/Text.js');
+var Misc = require('../neo-components/Misc.js');
+var IconButton = require('../neo-components/IconButton.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -14,6 +18,18 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 function ownKeys(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(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(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(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+const reactionIconUrls = {
+  FUNNY: "https://cdn.blerp.com/blerp_products/Icons/Funny%403x.svg",
+  MUSIC: "https://cdn.blerp.com/blerp_products/Icons/Music%403x.svg",
+  NSFW: "https://cdn.blerp.com/blerp_products/Icons/NSFW%403x.svg",
+  SAD: "https://cdn.blerp.com/blerp_products/Icons/Sad.svg",
+  SCARY: "https://cdn.blerp.com/blerp_products/Icons/Scary%403x.svg",
+  ANGRY: "https://cdn.blerp.com/blerp_products/Icons/Anger%403x.svg",
+  HAPPY: "https://cdn.blerp.com/blerp_products/Icons/Happy%403x.svg",
+  TROLL: "https://cdn.blerp.com/blerp_products/Icons/Troll%403x.svg",
+  SHOCKED: "https://cdn.blerp.com/blerp_products/Icons/Shock.svg",
+  LOVE: "https://cdn.blerp.com/blerp_products/Icons/Heart%403x.svg"
+}; // Inline SVG Icons
 
 const IconLock = _ref => {
   let {
@@ -121,14 +137,14 @@ const BlerpTopRow = _ref5 => {
     return n.toString();
   }
 
-  return /*#__PURE__*/React__default["default"].createElement(index.Stack, {
+  return /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
     direction: "row",
     width: "100%",
     justifyContent: "space-between",
     alignItems: "center",
     height: bite.visibility !== "PRIVATE" || isOwner ? "30px" : "30px",
     position: sizeParams.buttonSize === "small" && "absolute"
-  }, (bite.visibility !== "PRIVATE" || isOwner) && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(index.Text, {
+  }, (bite.visibility !== "PRIVATE" || isOwner) && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Text.Text, {
     fontSize: "12px",
     color: isPremium && !isLocked ? "white.main" : "notBlack.main",
     sx: {
@@ -136,7 +152,7 @@ const BlerpTopRow = _ref5 => {
       top: "30px",
       left: "10px"
     }
-  }, bite === null || bite === void 0 ? void 0 : bite.audienceRating), (bite === null || bite === void 0 ? void 0 : bite.audioDuration) && /*#__PURE__*/React__default["default"].createElement(index.Text, {
+  }, bite === null || bite === void 0 ? void 0 : bite.audienceRating), (bite === null || bite === void 0 ? void 0 : bite.audioDuration) && /*#__PURE__*/React__default["default"].createElement(Text.Text, {
     fontSize: "8px",
     color: isPremium ? "waxwing.main" : "grey5.main",
     sx: {
@@ -148,12 +164,12 @@ const BlerpTopRow = _ref5 => {
       right: "8px",
       opacity: isBlerpHovered ? 1 : 0.78
     }
-  }, (Number(bite === null || bite === void 0 ? void 0 : bite.audioDuration) / 1000).toFixed(1), sizeParams.buttonSize === "small" ? "s" : "sec"), (bite === null || bite === void 0 ? void 0 : bite.listingType) === "UNSAFE" && /*#__PURE__*/React__default["default"].createElement(index.Tooltip, {
+  }, (Number(bite === null || bite === void 0 ? void 0 : bite.audioDuration) / 1000).toFixed(1), sizeParams.buttonSize === "small" ? "s" : "sec"), (bite === null || bite === void 0 ? void 0 : bite.listingType) === "UNSAFE" && /*#__PURE__*/React__default["default"].createElement(Misc.Tooltip, {
     title: "May contain potentially sensitive content",
     sx: {
       wordWrap: "break-word"
     }
-  }, /*#__PURE__*/React__default["default"].createElement(index.IconButton, {
+  }, /*#__PURE__*/React__default["default"].createElement(IconButton.IconButton, {
     className: "unsafe-icon-blrp",
     sx: {
       position: "absolute",
@@ -166,7 +182,7 @@ const BlerpTopRow = _ref5 => {
       fontSize: "18px",
       color: "ibisRed.main"
     }
-  }))), /*#__PURE__*/React__default["default"].createElement(index.Stack, {
+  }))), /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
     direction: "row",
     alignItems: "center",
     justifyContent: "space-between",
@@ -177,7 +193,7 @@ const BlerpTopRow = _ref5 => {
       position: "relative",
       left: "2px"
     }
-  }, /*#__PURE__*/React__default["default"].createElement(index.Stack, {
+  }, /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
     sx: {
       backgroundColor: "white.main",
       opacity: ".4",
@@ -187,7 +203,7 @@ const BlerpTopRow = _ref5 => {
       left: "0",
       right: "0"
     }
-  }), bite !== null && bite !== void 0 && bite.saved ? /*#__PURE__*/React__default["default"].createElement(index.IconButton, {
+  }), bite !== null && bite !== void 0 && bite.saved ? /*#__PURE__*/React__default["default"].createElement(IconButton.IconButton, {
     onClick: e => {
       e.stopPropagation();
       getUserReactions();
@@ -199,7 +215,7 @@ const BlerpTopRow = _ref5 => {
     }
   }, /*#__PURE__*/React__default["default"].createElement(IconBookmarkFilled, {
     fontSize: "small"
-  })) : /*#__PURE__*/React__default["default"].createElement(index.IconButton, {
+  })) : /*#__PURE__*/React__default["default"].createElement(IconButton.IconButton, {
     onClick: e => {
       e.stopPropagation();
       getUserReactions();
@@ -212,7 +228,7 @@ const BlerpTopRow = _ref5 => {
     }
   }, /*#__PURE__*/React__default["default"].createElement(Icons.BookmarkAddRounded, {
     fontSize: "small"
-  })), !!(sizeParams.buttonSize === "small" && !(bite !== null && bite !== void 0 && (_bite$topReactions = bite.topReactions) !== null && _bite$topReactions !== void 0 && _bite$topReactions.length) || sizeParams.buttonSize !== "small") && /*#__PURE__*/React__default["default"].createElement(index.Text, {
+  })), !!(sizeParams.buttonSize === "small" && !(bite !== null && bite !== void 0 && (_bite$topReactions = bite.topReactions) !== null && _bite$topReactions !== void 0 && _bite$topReactions.length) || sizeParams.buttonSize !== "small") && /*#__PURE__*/React__default["default"].createElement(Text.Text, {
     color: "notBlack.main",
     fontWeight: "light",
     fontSize: "12px",
@@ -220,15 +236,15 @@ const BlerpTopRow = _ref5 => {
     sx: {
       zIndex: "1"
     }
-  }, formatNumber((bite === null || bite === void 0 ? void 0 : bite.totalSaveCount) > 0 ? bite === null || bite === void 0 ? void 0 : bite.totalSaveCount : "")), !!(bite !== null && bite !== void 0 && (_bite$topReactions2 = bite.topReactions) !== null && _bite$topReactions2 !== void 0 && _bite$topReactions2.length) && /*#__PURE__*/React__default["default"].createElement(index.Stack, {
+  }, formatNumber((bite === null || bite === void 0 ? void 0 : bite.totalSaveCount) > 0 ? bite === null || bite === void 0 ? void 0 : bite.totalSaveCount : "")), !!(bite !== null && bite !== void 0 && (_bite$topReactions2 = bite.topReactions) !== null && _bite$topReactions2 !== void 0 && _bite$topReactions2.length) && /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
     direction: "row",
     alignItems: "center",
     position: "relative",
     width: "40px",
     height: "20px"
-  }, bite === null || bite === void 0 ? void 0 : (_bite$topReactions3 = bite.topReactions) === null || _bite$topReactions3 === void 0 ? void 0 : _bite$topReactions3.map((reaction, index$1) => /*#__PURE__*/React__default["default"].createElement(index.Tooltip, {
+  }, bite === null || bite === void 0 ? void 0 : (_bite$topReactions3 = bite.topReactions) === null || _bite$topReactions3 === void 0 ? void 0 : _bite$topReactions3.map((reaction, index) => /*#__PURE__*/React__default["default"].createElement(Misc.Tooltip, {
     title: reaction,
-    key: index$1
+    key: index
   }, /*#__PURE__*/React__default["default"].createElement("img", {
     alt: reaction,
     className: "reaction-icon-blrp",
@@ -237,22 +253,22 @@ const BlerpTopRow = _ref5 => {
       height: "16px",
       position: "relative",
       margin: "-3px",
-      zIndex: index$1
+      zIndex: index
     },
-    src: Blerp.reactionIconUrls[reaction]
+    src: reactionIconUrls[reaction]
   })))), isPremium ? /*#__PURE__*/React__default["default"].createElement(Icons.DiamondIcon, {
     sx: {
       width: "16px",
       marginRight: "4px",
       zIndex: "1"
     }
-  }) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null))), /*#__PURE__*/React__default["default"].createElement(index.Stack, {
+  }) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null))), /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
     direction: "row",
     alignItems: "center",
     justifyContent: "space-between"
-  }, bite.edgeType === "NewTwitchBiteEdge" && /*#__PURE__*/React__default["default"].createElement(index.Tooltip, {
+  }, bite.edgeType === "NewTwitchBiteEdge" && /*#__PURE__*/React__default["default"].createElement(Misc.Tooltip, {
     title: "Featured on Twitch Bits"
-  }, /*#__PURE__*/React__default["default"].createElement(index.Stack, {
+  }, /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
     sx: {
       alignItems: "center",
       margin: "5px"
@@ -262,9 +278,9 @@ const BlerpTopRow = _ref5 => {
       zIndex: "1",
       fontSize: "18px"
     }
-  }))), bite.edgeType === "ChannelPointsBiteEdge" && /*#__PURE__*/React__default["default"].createElement(index.Tooltip, {
+  }))), bite.edgeType === "ChannelPointsBiteEdge" && /*#__PURE__*/React__default["default"].createElement(Misc.Tooltip, {
     title: "Featured on Twitch Channel Points"
-  }, /*#__PURE__*/React__default["default"].createElement(index.Stack, {
+  }, /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
     sx: {
       alignItems: "center",
       margin: "5px"
@@ -274,25 +290,25 @@ const BlerpTopRow = _ref5 => {
       zIndex: "1",
       fontSize: "18px"
     }
-  }))), (bite.visibility !== "PUBLIC" || !isOwner) && /*#__PURE__*/React__default["default"].createElement("div", null), bite.visibility !== "PUBLIC" && /*#__PURE__*/React__default["default"].createElement(index.Stack, {
+  }))), (bite.visibility !== "PUBLIC" || !isOwner) && /*#__PURE__*/React__default["default"].createElement("div", null), bite.visibility !== "PUBLIC" && /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
     direction: "row",
     sx: {
       alignItems: "center",
       margin: "5px"
     }
-  }, bite.visibility === "UNLISTED" && /*#__PURE__*/React__default["default"].createElement(index.Tooltip, {
+  }, bite.visibility === "UNLISTED" && /*#__PURE__*/React__default["default"].createElement(Misc.Tooltip, {
     title: "Unlisted"
   }, /*#__PURE__*/React__default["default"].createElement("span", null, /*#__PURE__*/React__default["default"].createElement(IconVisibilityOff, {
     sx: {
       fontSize: "15px"
     }
-  }))), bite.visibility === "PRIVATE" && isOwner && /*#__PURE__*/React__default["default"].createElement(index.Tooltip, {
+  }))), bite.visibility === "PRIVATE" && isOwner && /*#__PURE__*/React__default["default"].createElement(Misc.Tooltip, {
     title: "Private"
   }, /*#__PURE__*/React__default["default"].createElement("span", null, /*#__PURE__*/React__default["default"].createElement(IconLock, {
     sx: {
       fontSize: "15px"
     }
-  })))), secondaryActionButton ? secondaryActionButton : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isBlerpHovered ? /*#__PURE__*/React__default["default"].createElement(index.IconButton, {
+  })))), secondaryActionButton ? secondaryActionButton : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isBlerpHovered ? /*#__PURE__*/React__default["default"].createElement(IconButton.IconButton, {
     onClick: e => {
       handleClickThreeDot(e);
     },
@@ -309,4 +325,6 @@ const BlerpTopRow = _ref5 => {
   }, /*#__PURE__*/React__default["default"].createElement(IconMoreHoriz, null)) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null))));
 };
 
-module.exports = BlerpTopRow;
+var BlerpTopRow$1 = BlerpTopRow;
+
+exports["default"] = BlerpTopRow$1;

package/dist/cjs/Blerp.js

@@ -7,26 +7,15 @@ var BlerpImageRow = require('./Blerp/BlerpImageRow.js');
 var BlerpSavePopup = require('./Blerp/BlerpSavePopup.js');
 var BlerpTitleRow = require('./Blerp/BlerpTitleRow.js');
 var BlerpTopRow = require('./Blerp/BlerpTopRow.js');
-var index = require('./index.js');
 var ScreenSizeHook = require('./ScreenSizeHook.js');
 var Theme = require('./Theme.js');
+var Box = require('./neo-components/Box.js');
+var Stack = require('./neo-components/Stack.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-const reactionIconUrls = {
-  FUNNY: "https://cdn.blerp.com/blerp_products/Icons/Funny%403x.svg",
-  MUSIC: "https://cdn.blerp.com/blerp_products/Icons/Music%403x.svg",
-  NSFW: "https://cdn.blerp.com/blerp_products/Icons/NSFW%403x.svg",
-  SAD: "https://cdn.blerp.com/blerp_products/Icons/Sad.svg",
-  SCARY: "https://cdn.blerp.com/blerp_products/Icons/Scary%403x.svg",
-  ANGRY: "https://cdn.blerp.com/blerp_products/Icons/Anger%403x.svg",
-  HAPPY: "https://cdn.blerp.com/blerp_products/Icons/Happy%403x.svg",
-  TROLL: "https://cdn.blerp.com/blerp_products/Icons/Troll%403x.svg",
-  SHOCKED: "https://cdn.blerp.com/blerp_products/Icons/Shock.svg",
-  LOVE: "https://cdn.blerp.com/blerp_products/Icons/Heart%403x.svg"
-};
 const Blerp = _ref => {
   let {
     bite,
@@ -136,7 +125,7 @@ const Blerp = _ref => {
     }
   }
 
-  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(index.Box, {
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Box.Box, {
     id: "blerp-component-".concat(bite._id),
     onClick: e => {
       e.stopPropagation();
@@ -167,7 +156,7 @@ const Blerp = _ref => {
         border: isPremium ? "none" : "2px solid transparent"
       }
     }
-  }, /*#__PURE__*/React__default["default"].createElement(index.Stack, {
+  }, /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
     sx: {
       position: "absolute",
       top: "0",
@@ -178,7 +167,7 @@ const Blerp = _ref => {
       background: profileColors ? "linear-gradient(180deg, ".concat(profileColors[0]).concat(isPremium ? isLocked ? isBlerpHovered ? "C4" : "78" : isBlerpHovered ? "" : "C4" : "0", ", ").concat(theme.colors.grey5Override).concat(isPremium ? isLocked ? isBlerpHovered ? "C4" : "78" : isBlerpHovered ? "" : "C4" : "0", ")") : "",
       backgroundColor: isPremium && !profileColors && "grey5.override"
     }
-  }), /*#__PURE__*/React__default["default"].createElement(BlerpTopRow, {
+  }), /*#__PURE__*/React__default["default"].createElement(BlerpTopRow["default"], {
     bite: bite,
     isOwner: isOwner,
     sizeParams: sizeParams,
@@ -190,7 +179,7 @@ const Blerp = _ref => {
     secondaryActionButton: secondaryActionButton,
     isBlerpHovered: isBlerpHovered,
     handleClickThreeDot: handleClickThreeDot
-  }), /*#__PURE__*/React__default["default"].createElement(BlerpImageRow, {
+  }), /*#__PURE__*/React__default["default"].createElement(BlerpImageRow["default"], {
     bite: bite,
     isOwner: isOwner,
     sizeParams: sizeParams,
@@ -204,7 +193,7 @@ const Blerp = _ref => {
     isBlerpHovered: isBlerpHovered,
     handleClickPlay: handleClickPlay,
     handleClickLock: handleClickLock
-  }), /*#__PURE__*/React__default["default"].createElement(BlerpTitleRow, {
+  }), /*#__PURE__*/React__default["default"].createElement(BlerpTitleRow["default"], {
     bite: bite,
     title: title,
     isLinkTitle: isLinkTitle,
@@ -213,7 +202,7 @@ const Blerp = _ref => {
     isLocked: isLocked,
     isOwner: isOwner,
     sizeParams: sizeParams
-  }), openSave && /*#__PURE__*/React__default["default"].createElement(BlerpSavePopup, {
+  }), openSave && /*#__PURE__*/React__default["default"].createElement(BlerpSavePopup["default"], {
     bite: bite,
     anchorRef: anchorRef,
     setOpenSave: setOpenSave,
@@ -229,4 +218,3 @@ const Blerp = _ref => {
 
 exports.Blerp = Blerp;
 exports["default"] = Blerp;
-exports.reactionIconUrls = reactionIconUrls;