@blerp/design 1.4.4 → 1.4.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (74) hide show
  1. package/dist/cjs/Blerp/BlerpImageRow.js +22 -15
  2. package/dist/cjs/Blerp/BlerpSavePopup.js +20 -11
  3. package/dist/cjs/Blerp/BlerpTitleRow.js +16 -10
  4. package/dist/cjs/Blerp/BlerpTopRow.js +32 -25
  5. package/dist/cjs/Blerp.js +8 -7
  6. package/dist/cjs/BlerpListViewPremium.js +24 -20
  7. package/dist/cjs/BlerpListViewSkeleton.js +6 -6
  8. package/dist/cjs/CollectionCard.js +29 -25
  9. package/dist/cjs/CollectionListViewPremium.js +16 -13
  10. package/dist/cjs/CollectionSkeleton.js +5 -5
  11. package/dist/cjs/Dropdown.js +27 -24
  12. package/dist/cjs/EllipsisLoader.js +4 -3
  13. package/dist/cjs/GroupCard.js +8 -7
  14. package/dist/cjs/ImageEditor.js +4 -1
  15. package/dist/cjs/ImageUpload.js +23 -16
  16. package/dist/cjs/NewBlerp.js +41 -37
  17. package/dist/cjs/NewCollectionModal.js +27 -22
  18. package/dist/cjs/PremiumCollectionCard.js +10 -8
  19. package/dist/cjs/PurchaseModals/CheckoutModal.js +7 -3
  20. package/dist/cjs/PurchaseModals/PremiumBlerpCheckoutModal.js +7 -3
  21. package/dist/cjs/PurchaseModals/PremiumCollectionCheckoutModal.js +7 -3
  22. package/dist/cjs/PurchaseModals/PremiumSubscriptionCheckoutModal.js +7 -3
  23. package/dist/cjs/ReactionButtons.js +10 -5
  24. package/dist/cjs/Theme.js +8 -27
  25. package/dist/cjs/Toggle.js +1 -1
  26. package/dist/cjs/UserCard.js +13 -12
  27. package/dist/cjs/UserPage/LibraryControls.js +40 -29
  28. package/dist/cjs/UserPage/UserLibraryHeader.js +14 -8
  29. package/dist/cjs/UserPage/UserProfileHeader.js +28 -19
  30. package/dist/cjs/UsernameWithPopout.js +6 -4
  31. package/dist/cjs/colors.js +2 -1
  32. package/dist/cjs/icons.js +4 -1
  33. package/dist/cjs/index.js +135 -216
  34. package/dist/cjs/neo-components/Navigation.js +0 -2
  35. package/dist/cjs/neo-components/withSx.js +0 -1
  36. package/dist/cjs/neo-utils/sxToStyle.js +0 -2
  37. package/dist/esm/Blerp/BlerpImageRow.js +8 -3
  38. package/dist/esm/Blerp/BlerpSavePopup.js +9 -2
  39. package/dist/esm/Blerp/BlerpTitleRow.js +9 -5
  40. package/dist/esm/Blerp/BlerpTopRow.js +10 -5
  41. package/dist/esm/Blerp.js +2 -1
  42. package/dist/esm/BlerpListViewPremium.js +9 -5
  43. package/dist/esm/BlerpListViewSkeleton.js +1 -1
  44. package/dist/esm/CollectionCard.js +10 -6
  45. package/dist/esm/CollectionListViewPremium.js +7 -4
  46. package/dist/esm/CollectionSkeleton.js +1 -1
  47. package/dist/esm/Dropdown.js +10 -7
  48. package/dist/esm/EllipsisLoader.js +3 -2
  49. package/dist/esm/GroupCard.js +4 -3
  50. package/dist/esm/ImageEditor.js +2 -1
  51. package/dist/esm/ImageUpload.js +11 -6
  52. package/dist/esm/NewBlerp.js +13 -9
  53. package/dist/esm/NewCollectionModal.js +16 -11
  54. package/dist/esm/PremiumCollectionCard.js +4 -2
  55. package/dist/esm/PurchaseModals/CheckoutModal.js +4 -2
  56. package/dist/esm/PurchaseModals/PremiumBlerpCheckoutModal.js +4 -2
  57. package/dist/esm/PurchaseModals/PremiumCollectionCheckoutModal.js +4 -2
  58. package/dist/esm/PurchaseModals/PremiumSubscriptionCheckoutModal.js +4 -2
  59. package/dist/esm/ReactionButtons.js +5 -2
  60. package/dist/esm/Theme.js +5 -24
  61. package/dist/esm/Toggle.js +1 -1
  62. package/dist/esm/UserCard.js +7 -6
  63. package/dist/esm/UserPage/LibraryControls.js +20 -11
  64. package/dist/esm/UserPage/UserLibraryHeader.js +6 -2
  65. package/dist/esm/UserPage/UserProfileHeader.js +12 -5
  66. package/dist/esm/UsernameWithPopout.js +4 -2
  67. package/dist/esm/colors.js +2 -1
  68. package/dist/esm/icons.js +2 -1
  69. package/dist/esm/index.js +44 -129
  70. package/dist/esm/neo-components/Navigation.js +0 -2
  71. package/dist/esm/neo-components/ThemeProvider.js +1 -1
  72. package/dist/esm/neo-components/withSx.js +0 -1
  73. package/dist/esm/neo-utils/sxToStyle.js +0 -2
  74. package/package.json +31 -9
@@ -1,12 +1,17 @@
1
1
  'use strict';
2
2
 
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
3
5
  var _extends = require('@babel/runtime/helpers/extends');
4
6
  var _defineProperty = require('@babel/runtime/helpers/defineProperty');
5
7
  var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
6
8
  var React = require('react');
7
- var index = require('../index.js');
8
9
  var Theme = require('../Theme.js');
10
+ var Stack = require('../neo-components/Stack.js');
11
+ var Box = require('../neo-components/Box.js');
12
+ var Text = require('../neo-components/Text.js');
9
13
  var Icons = require('../Icons/Icons.js');
14
+ var Misc = require('../neo-components/Misc.js');
10
15
 
11
16
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
12
17
 
@@ -29,7 +34,7 @@ const Icon = _ref => {
29
34
  } = _ref,
30
35
  props = _objectWithoutProperties__default["default"](_ref, _excluded);
31
36
 
32
- return /*#__PURE__*/React__default["default"].createElement(index.Box, _extends__default["default"]({
37
+ return /*#__PURE__*/React__default["default"].createElement(Box.Box, _extends__default["default"]({
33
38
  component: "svg",
34
39
  viewBox: "0 0 24 24",
35
40
  width: size,
@@ -74,10 +79,10 @@ const BlerpImageRow = _ref2 => {
74
79
  const theme = Theme.useBlerpTheme();
75
80
 
76
81
  if (bite.visibility === "PRIVATE" && !isOwner) {
77
- return /*#__PURE__*/React__default["default"].createElement(index.Stack, {
82
+ return /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
78
83
  direction: "row",
79
84
  marginTop: sizeParams.buttonSize === "small" && "28px"
80
- }, /*#__PURE__*/React__default["default"].createElement(index.Box, {
85
+ }, /*#__PURE__*/React__default["default"].createElement(Box.Box, {
81
86
  sx: {
82
87
  height: sizeParams.imageSize,
83
88
  width: sizeParams.imageSize,
@@ -89,7 +94,7 @@ const BlerpImageRow = _ref2 => {
89
94
  transform: "scale(1.1)"
90
95
  }
91
96
  }
92
- }, /*#__PURE__*/React__default["default"].createElement(index.Box, {
97
+ }, /*#__PURE__*/React__default["default"].createElement(Box.Box, {
93
98
  id: "blerp-image-scrim-private",
94
99
  sx: {
95
100
  height: sizeParams.imageSize,
@@ -111,7 +116,7 @@ const BlerpImageRow = _ref2 => {
111
116
  display: "none"
112
117
  }
113
118
  }
114
- }, /*#__PURE__*/React__default["default"].createElement(index.Text, {
119
+ }, /*#__PURE__*/React__default["default"].createElement(Text.Typography, {
115
120
  sx: {
116
121
  display: "none",
117
122
  fontWeight: "regular",
@@ -128,10 +133,10 @@ const BlerpImageRow = _ref2 => {
128
133
  }))));
129
134
  }
130
135
 
131
- return /*#__PURE__*/React__default["default"].createElement(index.Stack, {
136
+ return /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
132
137
  direction: "row",
133
138
  marginTop: sizeParams.buttonSize === "small" && "28px"
134
- }, /*#__PURE__*/React__default["default"].createElement(index.Box, {
139
+ }, /*#__PURE__*/React__default["default"].createElement(Box.Box, {
135
140
  sx: {
136
141
  height: sizeParams.imageSize,
137
142
  width: sizeParams.imageSize,
@@ -144,7 +149,7 @@ const BlerpImageRow = _ref2 => {
144
149
  transform: "scale(1.1)"
145
150
  }
146
151
  }
147
- }, /*#__PURE__*/React__default["default"].createElement(index.Box, {
152
+ }, /*#__PURE__*/React__default["default"].createElement(Box.Box, {
148
153
  onClick: () => handleClickPlay(),
149
154
  sx: {
150
155
  height: sizeParams.imageSize,
@@ -176,7 +181,7 @@ const BlerpImageRow = _ref2 => {
176
181
  height: "40px",
177
182
  color: "white.override"
178
183
  }
179
- }), isPremium && isLocked ? /*#__PURE__*/React__default["default"].createElement(index.Box, {
184
+ }), isPremium && isLocked ? /*#__PURE__*/React__default["default"].createElement(Box.Box, {
180
185
  className: "save-container",
181
186
  onClick: e => {
182
187
  e.stopPropagation();
@@ -205,7 +210,7 @@ const BlerpImageRow = _ref2 => {
205
210
  color: theme.colors.white
206
211
  }
207
212
  }
208
- }, /*#__PURE__*/React__default["default"].createElement(index.Stack, {
213
+ }, /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
209
214
  sx: {
210
215
  position: "relative",
211
216
  top: "1px",
@@ -213,7 +218,7 @@ const BlerpImageRow = _ref2 => {
213
218
  color: "white.main"
214
219
  }
215
220
  }
216
- }, /*#__PURE__*/React__default["default"].createElement(index.Tooltip, {
221
+ }, /*#__PURE__*/React__default["default"].createElement(Misc.Tooltip, {
217
222
  title: "Unlock"
218
223
  }, actionButtonHovered ? /*#__PURE__*/React__default["default"].createElement(Icons.OpenLockIcon, {
219
224
  sx: {
@@ -229,7 +234,7 @@ const BlerpImageRow = _ref2 => {
229
234
  sx: {
230
235
  color: "notBlack.override"
231
236
  }
232
- })))) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, primaryActionButton ? primaryActionButton : /*#__PURE__*/React__default["default"].createElement(index.Box, {
237
+ })))) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, primaryActionButton ? primaryActionButton : /*#__PURE__*/React__default["default"].createElement(Box.Box, {
233
238
  className: "save-container",
234
239
  onClick: e => {
235
240
  e.stopPropagation();
@@ -263,7 +268,7 @@ const BlerpImageRow = _ref2 => {
263
268
  color: theme.colors.white
264
269
  }
265
270
  }
266
- }, /*#__PURE__*/React__default["default"].createElement(index.Stack, {
271
+ }, /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
267
272
  sx: {
268
273
  position: "relative",
269
274
  top: "1px",
@@ -283,4 +288,6 @@ const BlerpImageRow = _ref2 => {
283
288
  }) : /*#__PURE__*/React__default["default"].createElement(Icons.BookmarkAddRounded, null)))))));
284
289
  };
285
290
 
286
- module.exports = BlerpImageRow;
291
+ var BlerpImageRow$1 = BlerpImageRow;
292
+
293
+ exports["default"] = BlerpImageRow$1;
@@ -1,8 +1,15 @@
1
1
  'use strict';
2
2
 
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
3
5
  var React = require('react');
4
- var index = require('../index.js');
5
6
  var Theme = require('../Theme.js');
7
+ var Navigation = require('../neo-components/Navigation.js');
8
+ var Grid = require('../neo-components/Grid.js');
9
+ var Misc = require('../neo-components/Misc.js');
10
+ var Box = require('../neo-components/Box.js');
11
+ var Stack = require('../neo-components/Stack.js');
12
+ var Button = require('../neo-components/Button.js');
6
13
 
7
14
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
8
15
 
@@ -35,7 +42,7 @@ const BlerpSavePopup = _ref => {
35
42
  anchorRef
36
43
  } = _ref;
37
44
  const theme = Theme.useBlerpTheme();
38
- return /*#__PURE__*/React__default["default"].createElement(index.Popover, {
45
+ return /*#__PURE__*/React__default["default"].createElement(Navigation.Popover, {
39
46
  open: openSave,
40
47
  onClose: () => setOpenSave(false),
41
48
  anchorEl: anchorRef.current,
@@ -60,7 +67,7 @@ const BlerpSavePopup = _ref => {
60
67
  vertical: "center",
61
68
  horizontal: "center"
62
69
  }
63
- }, /*#__PURE__*/React__default["default"].createElement(index.Grid, {
70
+ }, /*#__PURE__*/React__default["default"].createElement(Grid.Grid, {
64
71
  display: "grid",
65
72
  gridTemplateColumns: "repeat(5, 1fr)",
66
73
  alignItems: "center",
@@ -70,14 +77,14 @@ const BlerpSavePopup = _ref => {
70
77
  var _bite$userReactions;
71
78
 
72
79
  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);
73
- return /*#__PURE__*/React__default["default"].createElement(index.Grid, {
80
+ return /*#__PURE__*/React__default["default"].createElement(Grid.Grid, {
74
81
  key: "".concat(reaction, "-button"),
75
82
  gridColumn: "span 1",
76
83
  display: "flex",
77
84
  justifyContent: "center"
78
- }, /*#__PURE__*/React__default["default"].createElement(index.Tooltip, {
85
+ }, /*#__PURE__*/React__default["default"].createElement(Misc.Tooltip, {
79
86
  title: reaction
80
- }, /*#__PURE__*/React__default["default"].createElement(index.Box, {
87
+ }, /*#__PURE__*/React__default["default"].createElement(Box.Box, {
81
88
  onClick: () => {
82
89
  var _bite$userReactions2;
83
90
 
@@ -107,13 +114,13 @@ const BlerpSavePopup = _ref => {
107
114
  height: "100%",
108
115
  src: reactionIconUrls[reaction]
109
116
  }))));
110
- })), /*#__PURE__*/React__default["default"].createElement(index.Stack, {
117
+ })), /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
111
118
  justifyContent: "space-around",
112
119
  alignItems: "center",
113
120
  direction: "row",
114
121
  width: "100%",
115
122
  flexWrap: "wrap"
116
- }, /*#__PURE__*/React__default["default"].createElement(index.Button, {
123
+ }, /*#__PURE__*/React__default["default"].createElement(Button.Button, {
117
124
  variant: "contained",
118
125
  color: "seafoam",
119
126
  size: "small",
@@ -123,7 +130,7 @@ const BlerpSavePopup = _ref => {
123
130
  fontSize: (sizeParams === null || sizeParams === void 0 ? void 0 : sizeParams.buttonSize) === "small" ? "10px" : "16px"
124
131
  },
125
132
  onClick: () => setOpenSave(false)
126
- }, "DONE"), unsaveButton ? unsaveButton : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, (!bite.isPremium || !bite.owned) && /*#__PURE__*/React__default["default"].createElement(index.Button, {
133
+ }, "DONE"), unsaveButton ? unsaveButton : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, (!bite.isPremium || !bite.owned) && /*#__PURE__*/React__default["default"].createElement(Button.Button, {
127
134
  onClick: () => {
128
135
  handleClickUnsave();
129
136
  setOpenSave(false);
@@ -144,7 +151,7 @@ const BlerpSavePopup = _ref => {
144
151
  margin: "0"
145
152
  }
146
153
  })
147
- }, "UNSAVE")), organizeButton ? organizeButton : /*#__PURE__*/React__default["default"].createElement(index.Button, {
154
+ }, "UNSAVE")), organizeButton ? organizeButton : /*#__PURE__*/React__default["default"].createElement(Button.Button, {
148
155
  variant: "text",
149
156
  color: "grey4",
150
157
  sx: {
@@ -158,4 +165,6 @@ const BlerpSavePopup = _ref => {
158
165
  }, "Organize")));
159
166
  };
160
167
 
161
- module.exports = BlerpSavePopup;
168
+ var BlerpSavePopup$1 = BlerpSavePopup;
169
+
170
+ exports["default"] = BlerpSavePopup$1;
@@ -1,7 +1,11 @@
1
1
  'use strict';
2
2
 
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
3
5
  var React = require('react');
4
- var index = require('../index.js');
6
+ var Stack = require('../neo-components/Stack.js');
7
+ var Box = require('../neo-components/Box.js');
8
+ var Text = require('../neo-components/Text.js');
5
9
 
6
10
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
7
11
 
@@ -20,7 +24,7 @@ const BlerpTitleRow = _ref => {
20
24
  } = _ref;
21
25
 
22
26
  if (bite.visibility === "PRIVATE" && !isOwner) {
23
- return /*#__PURE__*/React__default["default"].createElement(index.Stack, {
27
+ return /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
24
28
  direction: "row",
25
29
  sx: {
26
30
  width: "90%",
@@ -30,7 +34,7 @@ const BlerpTitleRow = _ref => {
30
34
  justifyContent: "center",
31
35
  margin: "auto"
32
36
  }
33
- }, /*#__PURE__*/React__default["default"].createElement(index.Box, {
37
+ }, /*#__PURE__*/React__default["default"].createElement(Box.Box, {
34
38
  onClick: e => {
35
39
  if (handleClickTitle) {
36
40
  e.stopPropagation();
@@ -45,7 +49,7 @@ const BlerpTitleRow = _ref => {
45
49
  textOverflow: "ellipsis",
46
50
  overflow: "hidden"
47
51
  }
48
- }, /*#__PURE__*/React__default["default"].createElement(index.Text, {
52
+ }, /*#__PURE__*/React__default["default"].createElement(Text.Typography, {
49
53
  textAlign: "center",
50
54
  fontSize: sizeParams.fontSize,
51
55
  color: isPremium && !isLocked ? "white.override" : "white.override",
@@ -59,7 +63,7 @@ const BlerpTitleRow = _ref => {
59
63
  }, title || bite.title)));
60
64
  }
61
65
 
62
- return /*#__PURE__*/React__default["default"].createElement(index.Stack, {
66
+ return /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
63
67
  direction: "row",
64
68
  sx: {
65
69
  width: "90%",
@@ -70,7 +74,7 @@ const BlerpTitleRow = _ref => {
70
74
  justifyContent: "center",
71
75
  margin: "auto"
72
76
  }
73
- }, isLinkTitle ? /*#__PURE__*/React__default["default"].createElement(index.Box, {
77
+ }, isLinkTitle ? /*#__PURE__*/React__default["default"].createElement(Box.Box, {
74
78
  onClick: e => {
75
79
  if (handleClickTitle) {
76
80
  e.stopPropagation();
@@ -90,7 +94,7 @@ const BlerpTitleRow = _ref => {
90
94
  style: {
91
95
  textDecoration: "none"
92
96
  }
93
- }, /*#__PURE__*/React__default["default"].createElement(index.Text, {
97
+ }, /*#__PURE__*/React__default["default"].createElement(Text.Typography, {
94
98
  textAlign: "center",
95
99
  fontSize: sizeParams.fontSize,
96
100
  color: isPremium ? "white.override" : "white.override",
@@ -101,7 +105,7 @@ const BlerpTitleRow = _ref => {
101
105
  textOverflow: "ellipsis"
102
106
  },
103
107
  lineHeight: sizeParams.buttonSize === "small" ? "16px" : "24px"
104
- }, title || bite.title))) : /*#__PURE__*/React__default["default"].createElement(index.Box, {
108
+ }, title || bite.title))) : /*#__PURE__*/React__default["default"].createElement(Box.Box, {
105
109
  onClick: e => {
106
110
  if (handleClickTitle) {
107
111
  e.stopPropagation();
@@ -116,7 +120,7 @@ const BlerpTitleRow = _ref => {
116
120
  textOverflow: "ellipsis",
117
121
  overflow: "hidden"
118
122
  }
119
- }, /*#__PURE__*/React__default["default"].createElement(index.Text, {
123
+ }, /*#__PURE__*/React__default["default"].createElement(Text.Typography, {
120
124
  textAlign: "center",
121
125
  fontSize: sizeParams.fontSize,
122
126
  color: isPremium ? "white.override" : "white.override",
@@ -130,4 +134,6 @@ const BlerpTitleRow = _ref => {
130
134
  }, title || bite.title)));
131
135
  };
132
136
 
133
- module.exports = BlerpTitleRow;
137
+ var BlerpTitleRow$1 = BlerpTitleRow;
138
+
139
+ exports["default"] = BlerpTitleRow$1;
@@ -1,10 +1,15 @@
1
1
  'use strict';
2
2
 
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
3
5
  var _defineProperty = require('@babel/runtime/helpers/defineProperty');
4
6
  var React = require('react');
5
7
  var Blerp = require('../Blerp.js');
6
8
  var Icons = require('../Icons/Icons.js');
7
- var index = require('../index.js');
9
+ var Stack = require('../neo-components/Stack.js');
10
+ var Text = require('../neo-components/Text.js');
11
+ var Misc = require('../neo-components/Misc.js');
12
+ var IconButton = require('../neo-components/IconButton.js');
8
13
 
9
14
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
10
15
 
@@ -121,14 +126,14 @@ const BlerpTopRow = _ref5 => {
121
126
  return n.toString();
122
127
  }
123
128
 
124
- return /*#__PURE__*/React__default["default"].createElement(index.Stack, {
129
+ return /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
125
130
  direction: "row",
126
131
  width: "100%",
127
132
  justifyContent: "space-between",
128
133
  alignItems: "center",
129
134
  height: bite.visibility !== "PRIVATE" || isOwner ? "30px" : "30px",
130
135
  position: sizeParams.buttonSize === "small" && "absolute"
131
- }, (bite.visibility !== "PRIVATE" || isOwner) && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(index.Text, {
136
+ }, (bite.visibility !== "PRIVATE" || isOwner) && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Text.Typography, {
132
137
  fontSize: "12px",
133
138
  color: isPremium && !isLocked ? "white.main" : "notBlack.main",
134
139
  sx: {
@@ -136,7 +141,7 @@ const BlerpTopRow = _ref5 => {
136
141
  top: "30px",
137
142
  left: "10px"
138
143
  }
139
- }, 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, {
144
+ }, bite === null || bite === void 0 ? void 0 : bite.audienceRating), (bite === null || bite === void 0 ? void 0 : bite.audioDuration) && /*#__PURE__*/React__default["default"].createElement(Text.Typography, {
140
145
  fontSize: "8px",
141
146
  color: isPremium ? "waxwing.main" : "grey5.main",
142
147
  sx: {
@@ -148,12 +153,12 @@ const BlerpTopRow = _ref5 => {
148
153
  right: "8px",
149
154
  opacity: isBlerpHovered ? 1 : 0.78
150
155
  }
151
- }, (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, {
156
+ }, (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, {
152
157
  title: "May contain potentially sensitive content",
153
158
  sx: {
154
159
  wordWrap: "break-word"
155
160
  }
156
- }, /*#__PURE__*/React__default["default"].createElement(index.IconButton, {
161
+ }, /*#__PURE__*/React__default["default"].createElement(IconButton.IconButton, {
157
162
  className: "unsafe-icon-blrp",
158
163
  sx: {
159
164
  position: "absolute",
@@ -166,7 +171,7 @@ const BlerpTopRow = _ref5 => {
166
171
  fontSize: "18px",
167
172
  color: "ibisRed.main"
168
173
  }
169
- }))), /*#__PURE__*/React__default["default"].createElement(index.Stack, {
174
+ }))), /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
170
175
  direction: "row",
171
176
  alignItems: "center",
172
177
  justifyContent: "space-between",
@@ -177,7 +182,7 @@ const BlerpTopRow = _ref5 => {
177
182
  position: "relative",
178
183
  left: "2px"
179
184
  }
180
- }, /*#__PURE__*/React__default["default"].createElement(index.Stack, {
185
+ }, /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
181
186
  sx: {
182
187
  backgroundColor: "white.main",
183
188
  opacity: ".4",
@@ -187,7 +192,7 @@ const BlerpTopRow = _ref5 => {
187
192
  left: "0",
188
193
  right: "0"
189
194
  }
190
- }), bite !== null && bite !== void 0 && bite.saved ? /*#__PURE__*/React__default["default"].createElement(index.IconButton, {
195
+ }), bite !== null && bite !== void 0 && bite.saved ? /*#__PURE__*/React__default["default"].createElement(IconButton.IconButton, {
191
196
  onClick: e => {
192
197
  e.stopPropagation();
193
198
  getUserReactions();
@@ -199,7 +204,7 @@ const BlerpTopRow = _ref5 => {
199
204
  }
200
205
  }, /*#__PURE__*/React__default["default"].createElement(IconBookmarkFilled, {
201
206
  fontSize: "small"
202
- })) : /*#__PURE__*/React__default["default"].createElement(index.IconButton, {
207
+ })) : /*#__PURE__*/React__default["default"].createElement(IconButton.IconButton, {
203
208
  onClick: e => {
204
209
  e.stopPropagation();
205
210
  getUserReactions();
@@ -212,7 +217,7 @@ const BlerpTopRow = _ref5 => {
212
217
  }
213
218
  }, /*#__PURE__*/React__default["default"].createElement(Icons.BookmarkAddRounded, {
214
219
  fontSize: "small"
215
- })), !!(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, {
220
+ })), !!(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.Typography, {
216
221
  color: "notBlack.main",
217
222
  fontWeight: "light",
218
223
  fontSize: "12px",
@@ -220,15 +225,15 @@ const BlerpTopRow = _ref5 => {
220
225
  sx: {
221
226
  zIndex: "1"
222
227
  }
223
- }, 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, {
228
+ }, 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, {
224
229
  direction: "row",
225
230
  alignItems: "center",
226
231
  position: "relative",
227
232
  width: "40px",
228
233
  height: "20px"
229
- }, 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, {
234
+ }, 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, {
230
235
  title: reaction,
231
- key: index$1
236
+ key: index
232
237
  }, /*#__PURE__*/React__default["default"].createElement("img", {
233
238
  alt: reaction,
234
239
  className: "reaction-icon-blrp",
@@ -237,7 +242,7 @@ const BlerpTopRow = _ref5 => {
237
242
  height: "16px",
238
243
  position: "relative",
239
244
  margin: "-3px",
240
- zIndex: index$1
245
+ zIndex: index
241
246
  },
242
247
  src: Blerp.reactionIconUrls[reaction]
243
248
  })))), isPremium ? /*#__PURE__*/React__default["default"].createElement(Icons.DiamondIcon, {
@@ -246,13 +251,13 @@ const BlerpTopRow = _ref5 => {
246
251
  marginRight: "4px",
247
252
  zIndex: "1"
248
253
  }
249
- }) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null))), /*#__PURE__*/React__default["default"].createElement(index.Stack, {
254
+ }) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null))), /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
250
255
  direction: "row",
251
256
  alignItems: "center",
252
257
  justifyContent: "space-between"
253
- }, bite.edgeType === "NewTwitchBiteEdge" && /*#__PURE__*/React__default["default"].createElement(index.Tooltip, {
258
+ }, bite.edgeType === "NewTwitchBiteEdge" && /*#__PURE__*/React__default["default"].createElement(Misc.Tooltip, {
254
259
  title: "Featured on Twitch Bits"
255
- }, /*#__PURE__*/React__default["default"].createElement(index.Stack, {
260
+ }, /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
256
261
  sx: {
257
262
  alignItems: "center",
258
263
  margin: "5px"
@@ -262,9 +267,9 @@ const BlerpTopRow = _ref5 => {
262
267
  zIndex: "1",
263
268
  fontSize: "18px"
264
269
  }
265
- }))), bite.edgeType === "ChannelPointsBiteEdge" && /*#__PURE__*/React__default["default"].createElement(index.Tooltip, {
270
+ }))), bite.edgeType === "ChannelPointsBiteEdge" && /*#__PURE__*/React__default["default"].createElement(Misc.Tooltip, {
266
271
  title: "Featured on Twitch Channel Points"
267
- }, /*#__PURE__*/React__default["default"].createElement(index.Stack, {
272
+ }, /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
268
273
  sx: {
269
274
  alignItems: "center",
270
275
  margin: "5px"
@@ -274,25 +279,25 @@ const BlerpTopRow = _ref5 => {
274
279
  zIndex: "1",
275
280
  fontSize: "18px"
276
281
  }
277
- }))), (bite.visibility !== "PUBLIC" || !isOwner) && /*#__PURE__*/React__default["default"].createElement("div", null), bite.visibility !== "PUBLIC" && /*#__PURE__*/React__default["default"].createElement(index.Stack, {
282
+ }))), (bite.visibility !== "PUBLIC" || !isOwner) && /*#__PURE__*/React__default["default"].createElement("div", null), bite.visibility !== "PUBLIC" && /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
278
283
  direction: "row",
279
284
  sx: {
280
285
  alignItems: "center",
281
286
  margin: "5px"
282
287
  }
283
- }, bite.visibility === "UNLISTED" && /*#__PURE__*/React__default["default"].createElement(index.Tooltip, {
288
+ }, bite.visibility === "UNLISTED" && /*#__PURE__*/React__default["default"].createElement(Misc.Tooltip, {
284
289
  title: "Unlisted"
285
290
  }, /*#__PURE__*/React__default["default"].createElement("span", null, /*#__PURE__*/React__default["default"].createElement(IconVisibilityOff, {
286
291
  sx: {
287
292
  fontSize: "15px"
288
293
  }
289
- }))), bite.visibility === "PRIVATE" && isOwner && /*#__PURE__*/React__default["default"].createElement(index.Tooltip, {
294
+ }))), bite.visibility === "PRIVATE" && isOwner && /*#__PURE__*/React__default["default"].createElement(Misc.Tooltip, {
290
295
  title: "Private"
291
296
  }, /*#__PURE__*/React__default["default"].createElement("span", null, /*#__PURE__*/React__default["default"].createElement(IconLock, {
292
297
  sx: {
293
298
  fontSize: "15px"
294
299
  }
295
- })))), secondaryActionButton ? secondaryActionButton : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isBlerpHovered ? /*#__PURE__*/React__default["default"].createElement(index.IconButton, {
300
+ })))), secondaryActionButton ? secondaryActionButton : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isBlerpHovered ? /*#__PURE__*/React__default["default"].createElement(IconButton.IconButton, {
296
301
  onClick: e => {
297
302
  handleClickThreeDot(e);
298
303
  },
@@ -309,4 +314,6 @@ const BlerpTopRow = _ref5 => {
309
314
  }, /*#__PURE__*/React__default["default"].createElement(IconMoreHoriz, null)) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null))));
310
315
  };
311
316
 
312
- module.exports = BlerpTopRow;
317
+ var BlerpTopRow$1 = BlerpTopRow;
318
+
319
+ exports["default"] = BlerpTopRow$1;
package/dist/cjs/Blerp.js CHANGED
@@ -7,9 +7,10 @@ var BlerpImageRow = require('./Blerp/BlerpImageRow.js');
7
7
  var BlerpSavePopup = require('./Blerp/BlerpSavePopup.js');
8
8
  var BlerpTitleRow = require('./Blerp/BlerpTitleRow.js');
9
9
  var BlerpTopRow = require('./Blerp/BlerpTopRow.js');
10
- var index = require('./index.js');
11
10
  var ScreenSizeHook = require('./ScreenSizeHook.js');
12
11
  var Theme = require('./Theme.js');
12
+ var Box = require('./neo-components/Box.js');
13
+ var Stack = require('./neo-components/Stack.js');
13
14
 
14
15
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
15
16
 
@@ -136,7 +137,7 @@ const Blerp = _ref => {
136
137
  }
137
138
  }
138
139
 
139
- return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(index.Box, {
140
+ return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Box.Box, {
140
141
  id: "blerp-component-".concat(bite._id),
141
142
  onClick: e => {
142
143
  e.stopPropagation();
@@ -167,7 +168,7 @@ const Blerp = _ref => {
167
168
  border: isPremium ? "none" : "2px solid transparent"
168
169
  }
169
170
  }
170
- }, /*#__PURE__*/React__default["default"].createElement(index.Stack, {
171
+ }, /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
171
172
  sx: {
172
173
  position: "absolute",
173
174
  top: "0",
@@ -178,7 +179,7 @@ const Blerp = _ref => {
178
179
  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", ")") : "",
179
180
  backgroundColor: isPremium && !profileColors && "grey5.override"
180
181
  }
181
- }), /*#__PURE__*/React__default["default"].createElement(BlerpTopRow, {
182
+ }), /*#__PURE__*/React__default["default"].createElement(BlerpTopRow["default"], {
182
183
  bite: bite,
183
184
  isOwner: isOwner,
184
185
  sizeParams: sizeParams,
@@ -190,7 +191,7 @@ const Blerp = _ref => {
190
191
  secondaryActionButton: secondaryActionButton,
191
192
  isBlerpHovered: isBlerpHovered,
192
193
  handleClickThreeDot: handleClickThreeDot
193
- }), /*#__PURE__*/React__default["default"].createElement(BlerpImageRow, {
194
+ }), /*#__PURE__*/React__default["default"].createElement(BlerpImageRow["default"], {
194
195
  bite: bite,
195
196
  isOwner: isOwner,
196
197
  sizeParams: sizeParams,
@@ -204,7 +205,7 @@ const Blerp = _ref => {
204
205
  isBlerpHovered: isBlerpHovered,
205
206
  handleClickPlay: handleClickPlay,
206
207
  handleClickLock: handleClickLock
207
- }), /*#__PURE__*/React__default["default"].createElement(BlerpTitleRow, {
208
+ }), /*#__PURE__*/React__default["default"].createElement(BlerpTitleRow["default"], {
208
209
  bite: bite,
209
210
  title: title,
210
211
  isLinkTitle: isLinkTitle,
@@ -213,7 +214,7 @@ const Blerp = _ref => {
213
214
  isLocked: isLocked,
214
215
  isOwner: isOwner,
215
216
  sizeParams: sizeParams
216
- }), openSave && /*#__PURE__*/React__default["default"].createElement(BlerpSavePopup, {
217
+ }), openSave && /*#__PURE__*/React__default["default"].createElement(BlerpSavePopup["default"], {
217
218
  bite: bite,
218
219
  anchorRef: anchorRef,
219
220
  setOpenSave: setOpenSave,