@blerp/design 1.4.5 → 1.4.7

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 (72) 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 +45 -27
  5. package/dist/cjs/Blerp.js +8 -20
  6. package/dist/cjs/BlerpListViewPremium.js +25 -21
  7. package/dist/cjs/BlerpListViewSkeleton.js +6 -6
  8. package/dist/cjs/CollectionCard.js +27 -36
  9. package/dist/cjs/CollectionListViewPremium.js +17 -14
  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 +6 -132
  25. package/dist/cjs/Toggle.js +2 -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 +7 -96
  29. package/dist/cjs/UserPage/UserProfileHeader.js +6 -291
  30. package/dist/cjs/UsernameWithPopout.js +6 -4
  31. package/dist/cjs/icons.js +4 -1
  32. package/dist/cjs/index.js +135 -216
  33. package/dist/cjs/neo-components/Navigation.js +0 -2
  34. package/dist/cjs/neo-components/withSx.js +0 -1
  35. package/dist/cjs/neo-utils/sxToStyle.js +0 -2
  36. package/dist/esm/Blerp/BlerpImageRow.js +7 -2
  37. package/dist/esm/Blerp/BlerpSavePopup.js +9 -2
  38. package/dist/esm/Blerp/BlerpTitleRow.js +6 -2
  39. package/dist/esm/Blerp/BlerpTopRow.js +19 -3
  40. package/dist/esm/Blerp.js +3 -14
  41. package/dist/esm/BlerpListViewPremium.js +6 -2
  42. package/dist/esm/BlerpListViewSkeleton.js +1 -1
  43. package/dist/esm/CollectionCard.js +8 -17
  44. package/dist/esm/CollectionListViewPremium.js +5 -2
  45. package/dist/esm/CollectionSkeleton.js +1 -1
  46. package/dist/esm/Dropdown.js +4 -1
  47. package/dist/esm/EllipsisLoader.js +3 -2
  48. package/dist/esm/GroupCard.js +2 -1
  49. package/dist/esm/ImageEditor.js +2 -1
  50. package/dist/esm/ImageUpload.js +7 -2
  51. package/dist/esm/NewBlerp.js +5 -1
  52. package/dist/esm/NewCollectionModal.js +8 -3
  53. package/dist/esm/PremiumCollectionCard.js +4 -2
  54. package/dist/esm/PurchaseModals/CheckoutModal.js +4 -2
  55. package/dist/esm/PurchaseModals/PremiumBlerpCheckoutModal.js +4 -2
  56. package/dist/esm/PurchaseModals/PremiumCollectionCheckoutModal.js +4 -2
  57. package/dist/esm/PurchaseModals/PremiumSubscriptionCheckoutModal.js +4 -2
  58. package/dist/esm/ReactionButtons.js +5 -2
  59. package/dist/esm/Theme.js +5 -130
  60. package/dist/esm/Toggle.js +2 -2
  61. package/dist/esm/UserCard.js +2 -1
  62. package/dist/esm/UserPage/LibraryControls.js +20 -11
  63. package/dist/esm/UserPage/UserLibraryHeader.js +6 -92
  64. package/dist/esm/UserPage/UserProfileHeader.js +5 -285
  65. package/dist/esm/UsernameWithPopout.js +3 -1
  66. package/dist/esm/icons.js +2 -1
  67. package/dist/esm/index.js +44 -129
  68. package/dist/esm/neo-components/Navigation.js +0 -2
  69. package/dist/esm/neo-components/ThemeProvider.js +1 -1
  70. package/dist/esm/neo-components/withSx.js +0 -1
  71. package/dist/esm/neo-utils/sxToStyle.js +0 -2
  72. package/package.json +31 -9
@@ -1,289 +1,9 @@
1
- import _extends from '@babel/runtime/helpers/extends';
2
- import _defineProperty from '@babel/runtime/helpers/defineProperty';
3
- import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
4
- import React, { useState, useEffect } from 'react';
5
- import { Stack, IconButton, Box, Text, Divider, Button } from '../index.js';
6
- import { useWindowSize } from '../ScreenSizeHook.js';
7
- import { extractDominantColor } from '../helpers.js';
8
- import { useBlerpTheme } from '../Theme.js';
9
- import { TwitchIcon } from '../Icons/Icons.js';
1
+ // TODO: If this component is needed, import dependencies directly (not from ../index)
10
2
 
11
- const _excluded = ["path", "sx", "size"];
12
-
13
- 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; }
14
-
15
- 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(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; }
16
-
17
- const Icon = _ref => {
18
- let {
19
- path,
20
- sx,
21
- size = "24px"
22
- } = _ref,
23
- props = _objectWithoutProperties(_ref, _excluded);
24
-
25
- return /*#__PURE__*/React.createElement(Box, _extends({
26
- component: "svg",
27
- viewBox: "0 0 24 24",
28
- width: size,
29
- height: size,
30
- fill: "currentColor",
31
- sx: _objectSpread({
32
- display: 'inline-block',
33
- flexShrink: 0
34
- }, sx)
35
- }, props), /*#__PURE__*/React.createElement("path", {
36
- d: path
37
- }));
38
- };
39
-
40
- const paths = {
41
- add: "M18 13h-5v5c0 .55-.45 1-1 1s-1-.45-1-1v-5H6c-.55 0-1-.45-1-1s.45-1 1-1h5V6c0-.55.45-1 1-1s1 .45 1 1v5h5c.55 0 1 .45 1 1s-.45 1-1 1z",
42
- edit: "M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34a.9959.9959 0 00-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z",
43
- personAdd: "M15 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm-9-2V7H4v3H1v2h3v3h2v-3h3v-2H6zm9 4c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z",
44
- personRemove: "M15 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm-9-2V7H4v3H1v2h3v3h2v-3h3v-2H6zm9 4c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z",
45
- // Simplified
46
- facebook: "M5 3h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2m13 2h-2.5A3.5 3.5 0 0 0 12 8.5V11h-2v3h2v7h3v-7h3v-3h-3V9a1 1 0 0 1 1-1h2V5z",
47
- twitter: "M22.46 6c-.77.35-1.6.58-2.46.69.88-.53 1.56-1.37 1.88-2.38-.83.5-1.75.85-2.72 1.05C18.37 4.5 17.26 4 16 4c-2.35 0-4.27 1.92-4.27 4.29 0 .34.04.67.11.98C8.28 9.09 5.11 7.38 3 4.79c-.37.63-.58 1.37-.58 2.15 0 1.48.75 2.78 1.89 3.54-.7 0-1.35-.2-1.92-.53v.05c0 2.03 1.44 3.73 3.35 4.12-.35.1-.73.15-1.12.15-.27 0-.54-.03-.8-.08.54 1.66 2.08 2.87 3.91 2.91-1.42 1.12-3.23 1.78-5.2 1.78-.34 0-.67-.02-1-.06C3.04 20.1 5.31 20.8 7.72 20.8c9.27 0 14.34-7.68 14.34-14.34 0-.22 0-.44-.01-.66.98-.7 1.84-1.59 2.51-2.6z",
48
- instagram: "M7.8 2h8.4C19.4 2 22 4.6 22 7.8v8.4a5.8 5.8 0 0 1-5.8 5.8H7.8C4.6 22 2 19.4 2 16.2V7.8A5.8 5.8 0 0 1 7.8 2m-.2 2A3.6 3.6 0 0 0 4 7.6v8.8C4 18.39 5.61 20 7.6 20h8.8a3.6 3.6 0 0 0 3.6-3.6V7.6C20 5.61 18.39 4 16.4 4H7.6m9.65 1.5a1.25 1.25 0 0 1 1.25 1.25A1.25 1.25 0 0 1 17.25 8 1.25 1.25 0 0 1 16 6.75a1.25 1.25 0 0 1 1.25-1.25M12 7a5 5 0 0 1 5 5 5 5 0 0 1-5 5 5 5 0 0 1-5-5 5 5 0 0 1 5-5m0 2a3 3 0 0 0-3 3 3 3 0 0 0 3 3 3 3 0 0 0 3-3 3 3 0 0 0-3-3z",
49
- youtube: "M10 15l5.19-3L10 9v6m11.56-7.83c.13.47.22 1.1.28 1.9.07.8.1 1.49.1 2.09L22 12c0 2.19-.16 3.8-.44 4.83-.25.9-.83 1.48-1.73 1.73-.47.13-1.33.22-2.65.28-1.3.07-2.49.1-3.59.1L12 19c-4.19 0-6.8-.16-7.83-.44-.9-.25-1.48-.83-1.73-1.73-.13-.47-.22-1.1-.28-1.9-.07-.8-.1-1.49-.1-2.09L2 12c0-2.19.16-3.8.44-4.83.25-.9.83-1.48 1.73-1.73.47-.13 1.33-.22 2.65-.28 1.3-.07 2.49-.1 3.59-.1L12 5c4.19 0 6.8.16 7.83.44.9.25 1.48.83 1.73 1.73z",
50
- pinterest: "M12.2 2C7.12 2 3 6.12 3 11.2c0 3.9 2.42 7.23 5.87 8.58-.08-.72-.15-1.83.03-2.62.16-.71 1.05-4.44 1.05-4.44s-.27-.54-.27-1.33c0-1.25.72-2.18 1.63-2.18.77 0 1.14.58 1.14 1.27 0 .77-.49 1.93-.74 3-.21.87.44 1.58 1.29 1.58 1.55 0 2.74-1.64 2.74-4 0-2.09-1.5-3.55-3.64-3.55-2.48 0-3.93 1.86-3.93 3.77 0 .75.29 1.55.65 1.99.07.09.08.17.06.25-.07.28-.22.88-.25.99-.04.16-.14.2-.32.11-1.19-.55-1.93-2.3-1.93-3.7 0-3.02 2.2-5.78 6.32-5.78 3.32 0 5.89 2.36 5.89 5.52 0 3.3-2.08 5.96-4.97 5.96-.97 0-1.88-.5-2.2-.1l-.59 2.27c-.22.82-.8 1.85-1.19 2.48 1.1.34 2.26.52 3.47.52 5.08 0 9.2-4.12 9.2-9.2C21.4 6.12 17.28 2 12.2 2z"
3
+ const UserProfileHeader = () => {
4
+ return null;
51
5
  };
52
6
 
53
- const UserProfileHeader = _ref2 => {
54
- var _userData$profileImag3, _userData$profileImag4, _userData$headerImage, _userData$headerImage2, _userData$headerImage3, _userData$headerImage4, _userData$profileImag5, _userData$profileImag6, _userData$socialLinks2;
55
-
56
- let {
57
- followUser,
58
- isOwner,
59
- userData,
60
- openEdit
61
- } = _ref2;
62
- const theme = useBlerpTheme();
63
- const [profileColors, setProfileColors] = useState(null);
64
- const size = useWindowSize();
65
- useEffect(() => {
66
- var _userData$profileImag, _userData$profileImag2;
67
-
68
- if (userData !== null && userData !== void 0 && (_userData$profileImag = userData.profileImage) !== null && _userData$profileImag !== void 0 && (_userData$profileImag2 = _userData$profileImag.original) !== null && _userData$profileImag2 !== void 0 && _userData$profileImag2.url) {
69
- extractDominantColor(userData.profileImage.original.url, setProfileColors);
70
- }
71
- }, [userData === null || userData === void 0 ? void 0 : (_userData$profileImag3 = userData.profileImage) === null || _userData$profileImag3 === void 0 ? void 0 : (_userData$profileImag4 = _userData$profileImag3.original) === null || _userData$profileImag4 === void 0 ? void 0 : _userData$profileImag4.url]);
72
-
73
- const renderSocialLinks = () => {
74
- var _userData$socialLinks;
75
-
76
- return userData === null || userData === void 0 ? void 0 : (_userData$socialLinks = userData.socialLinks) === null || _userData$socialLinks === void 0 ? void 0 : _userData$socialLinks.map((socialItem, index) => {
77
- let icon;
78
- const commonSx = {
79
- color: "notBlack.main",
80
- cursor: "pointer",
81
- ":hover": {
82
- color: "starling.main"
83
- }
84
- };
85
-
86
- switch (socialItem.name) {
87
- case "twitch":
88
- icon = /*#__PURE__*/React.createElement(TwitchIcon, {
89
- sx: commonSx
90
- });
91
- break;
92
-
93
- case "twitter":
94
- icon = /*#__PURE__*/React.createElement(Icon, {
95
- path: paths.twitter,
96
- sx: commonSx
97
- });
98
- break;
99
-
100
- case "youtube":
101
- icon = /*#__PURE__*/React.createElement(Icon, {
102
- path: paths.youtube,
103
- sx: commonSx
104
- });
105
- break;
106
-
107
- case "instagram":
108
- icon = /*#__PURE__*/React.createElement(Icon, {
109
- path: paths.instagram,
110
- sx: commonSx
111
- });
112
- break;
113
-
114
- case "pinterest":
115
- icon = /*#__PURE__*/React.createElement(Icon, {
116
- path: paths.pinterest,
117
- sx: commonSx
118
- });
119
- break;
120
-
121
- case "facebook":
122
- icon = /*#__PURE__*/React.createElement(Icon, {
123
- path: paths.facebook,
124
- sx: commonSx
125
- });
126
- break;
127
- }
128
-
129
- return /*#__PURE__*/React.createElement("a", {
130
- key: socialItem.name + index,
131
- target: "_blank",
132
- href: socialItem.link,
133
- style: {
134
- margin: "5px",
135
- height: "65%"
136
- },
137
- rel: "nofollow noreferrer"
138
- }, icon);
139
- });
140
- };
141
-
142
- return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Stack, {
143
- width: "100%",
144
- sx: {
145
- height: "250px",
146
- justifyContent: size.width <= 600 ? "space-around" : "center",
147
- alignItems: "center",
148
- background: userData !== null && userData !== void 0 && (_userData$headerImage = userData.headerImage) !== null && _userData$headerImage !== void 0 && (_userData$headerImage2 = _userData$headerImage.original) !== null && _userData$headerImage2 !== void 0 && _userData$headerImage2.url ? "linear-gradient(rgba(0,0,0,.3), rgba(0,0,0,.3)), url(".concat(userData === null || userData === void 0 ? void 0 : (_userData$headerImage3 = userData.headerImage) === null || _userData$headerImage3 === void 0 ? void 0 : (_userData$headerImage4 = _userData$headerImage3.original) === null || _userData$headerImage4 === void 0 ? void 0 : _userData$headerImage4.url, ")") : "linear-gradient(135deg, ".concat(profileColors ? profileColors[0] : theme.colors.ibisRed, ", ").concat(profileColors ? profileColors[1] : theme.colors.starling, ")"),
149
- backgroundRepeat: "no-repeat",
150
- backgroundSize: "cover",
151
- backgroundPosition: "center",
152
- position: "relative",
153
- overflow: "hidden"
154
- }
155
- }, isOwner && /*#__PURE__*/React.createElement(IconButton, {
156
- sx: {
157
- position: "absolute",
158
- top: "10px",
159
- right: "10px",
160
- cursor: "pointer",
161
- color: "white.main",
162
- ":hover": {
163
- color: "notBlack.main",
164
- backgroundColor: "white.main"
165
- }
166
- },
167
- onClick: () => openEdit()
168
- }, /*#__PURE__*/React.createElement(Icon, {
169
- path: paths.edit,
170
- size: "16px"
171
- })), /*#__PURE__*/React.createElement(Stack, {
172
- direction: "row",
173
- width: "80%",
174
- maxWidth: "1300px",
175
- flexWrap: "wrap",
176
- margin: "0 auto",
177
- justifyContent: "space-between",
178
- alignItems: "flex-end",
179
- height: "50%"
180
- }, /*#__PURE__*/React.createElement(Box, {
181
- sx: {
182
- background: "linear-gradient(135deg, ".concat(profileColors ? profileColors[0] : theme.colors.ibisRed, ", ").concat(profileColors ? profileColors[1] : theme.colors.starling, ")"),
183
- boxShadow: "5px 5px 15px #0000009c"
184
- },
185
- borderRadius: "8px",
186
- width: "400px",
187
- height: "100%"
188
- }, /*#__PURE__*/React.createElement(Stack, {
189
- direction: "row",
190
- height: "100%",
191
- alignItems: "center",
192
- position: "relative"
193
- }, /*#__PURE__*/React.createElement(IconButton, {
194
- sx: {
195
- position: "absolute",
196
- padding: "5px",
197
- top: "5px",
198
- right: "5px",
199
- cursor: "pointer",
200
- color: "white.override",
201
- fontSize: "12px",
202
- ":hover": {
203
- color: "notBlack.main",
204
- backgroundColor: "white.main"
205
- }
206
- },
207
- onClick: () => {
208
- isOwner ? openEdit() : followUser({
209
- variables: {
210
- record: {
211
- userIdToFollow: userData._id
212
- }
213
- }
214
- });
215
- }
216
- }, isOwner ? /*#__PURE__*/React.createElement(Icon, {
217
- path: paths.edit,
218
- size: "20px"
219
- }) : userData !== null && userData !== void 0 && userData.loggedInIsFollower ? /*#__PURE__*/React.createElement(Icon, {
220
- path: paths.personRemove,
221
- size: "20px"
222
- }) : /*#__PURE__*/React.createElement(Icon, {
223
- path: paths.personAdd,
224
- size: "20px"
225
- })), /*#__PURE__*/React.createElement("img", {
226
- style: {
227
- borderRadius: "50%",
228
- objectFit: "cover",
229
- width: "90px",
230
- height: "90px",
231
- margin: "0 20px"
232
- },
233
- alt: "profile img",
234
- src: userData === null || userData === void 0 ? void 0 : (_userData$profileImag5 = userData.profileImage) === null || _userData$profileImag5 === void 0 ? void 0 : (_userData$profileImag6 = _userData$profileImag5.original) === null || _userData$profileImag6 === void 0 ? void 0 : _userData$profileImag6.url
235
- }), /*#__PURE__*/React.createElement(Stack, {
236
- marginLeft: "20px"
237
- }, /*#__PURE__*/React.createElement(Stack, {
238
- direction: "row"
239
- }, /*#__PURE__*/React.createElement(Text, {
240
- noWrap: true,
241
- maxWidth: "200px",
242
- color: "white.override",
243
- lineHeight: "51px",
244
- fontSize: size.width <= 600 ? "30px" : "47px"
245
- }, userData === null || userData === void 0 ? void 0 : userData.username)), /*#__PURE__*/React.createElement(Stack, {
246
- direction: "row",
247
- divider: /*#__PURE__*/React.createElement(Divider, {
248
- orientation: "vertical",
249
- flexItem: true,
250
- sx: {
251
- borderColor: "white.override",
252
- margin: "5px"
253
- }
254
- })
255
- }, /*#__PURE__*/React.createElement(Text, {
256
- color: "white.override",
257
- fontSize: "16px"
258
- }, userData === null || userData === void 0 ? void 0 : userData.followerCount, " Followers"), /*#__PURE__*/React.createElement(Text, {
259
- color: "white.override",
260
- fontSize: "16px"
261
- }, userData === null || userData === void 0 ? void 0 : userData.followingCount, " Following"))))), /*#__PURE__*/React.createElement(Stack, {
262
- direction: "row",
263
- backgroundColor: "grey2.main",
264
- borderRadius: "8px",
265
- height: "30%",
266
- alignItems: "center",
267
- marginTop: "20px",
268
- justifyContent: "space-around"
269
- }, isOwner ? (userData === null || userData === void 0 ? void 0 : (_userData$socialLinks2 = userData.socialLinks) === null || _userData$socialLinks2 === void 0 ? void 0 : _userData$socialLinks2.length) === 0 ? /*#__PURE__*/React.createElement(Button, {
270
- variant: "text",
271
- onClick: () => openEdit()
272
- }, "+ New Social") : /*#__PURE__*/React.createElement(IconButton, {
273
- sx: {
274
- cursor: "pointer",
275
- color: "notBlack.main",
276
- padding: "5px",
277
- backgroundColor: "grey2.main",
278
- ":hover": {
279
- backgroundColor: "white.main"
280
- }
281
- },
282
- onClick: () => openEdit()
283
- }, /*#__PURE__*/React.createElement(Icon, {
284
- path: paths.add,
285
- size: "16px"
286
- })) : /*#__PURE__*/React.createElement(React.Fragment, null), renderSocialLinks()))));
287
- };
7
+ var UserProfileHeader$1 = UserProfileHeader;
288
8
 
289
- export { UserProfileHeader as default };
9
+ export { UserProfileHeader$1 as default };
@@ -1,7 +1,9 @@
1
1
  import _defineProperty from '@babel/runtime/helpers/defineProperty';
2
2
  import React, { useState } from 'react';
3
- import { Stack, Popover, Text } from './index.js';
4
3
  import { UserCard } from './UserCard.js';
4
+ import { Stack } from './neo-components/Stack.js';
5
+ import { Popover } from './neo-components/Navigation.js';
6
+ import { Text } from './neo-components/Text.js';
5
7
 
6
8
  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; }
7
9
 
package/dist/esm/icons.js CHANGED
@@ -155,5 +155,6 @@ const icons = {
155
155
  tabView: "https://cdn.blerp.com/blerp_products/Icons/Tabview-Starling.svg"
156
156
  }
157
157
  };
158
+ var icons$1 = icons;
158
159
 
159
- export { icons as default };
160
+ export { icons$1 as default };
package/dist/esm/index.js CHANGED
@@ -1,49 +1,20 @@
1
- import { ThemeProvider as ThemeProvider$1 } from './neo-components/ThemeProvider.js';
2
- import { createTheme as createTheme$1 } from './neo-components/createTheme.js';
3
- import { CircularProgress as CircularProgress$1 } from './neo-components/CircularProgress.js';
4
- import { Box as Box$1 } from './neo-components/Box.js';
5
- import { Stack as Stack$1 } from './neo-components/Stack.js';
6
- import { Grid as Grid$1 } from './neo-components/Grid.js';
7
- import { Container as Container$1 } from './neo-components/Container.js';
8
- import { Typography } from './neo-components/Text.js';
9
- import { Button as Button$1 } from './neo-components/Button.js';
10
- import { IconButton as IconButton$1 } from './neo-components/IconButton.js';
11
- import { Fab, SpeedDial as SpeedDial$1 } from './neo-components/Fab.js';
12
- import './neo-components/ToggleButton.js';
13
- import { TextField, InputAdornment as InputAdornment$1 } from './neo-components/Input.js';
14
- import { Checkbox as Checkbox$1, Radio, Rating as Rating$1, Select as Select$1, Slider as Slider$1, Switch as Switch$1 } from './neo-components/FormControls.js';
15
- import { Autocomplete as Autocomplete$1 } from './neo-components/Autocomplete.js';
16
- import { Card as Card$1, Paper as Paper$1 } from './neo-components/Paper.js';
17
- import { Backdrop as Backdrop$1, Dialog as Dialog$1, Modal as Modal$1 } from './neo-components/Dialog.js';
18
- import { Drawer as Drawer$1, Menu as Menu$1, Tabs as Tabs$1, Tab as Tab$1, Alert as Alert$1, Snackbar as Snackbar$1, Popover as Popover$1, MenuItem as MenuItem$1, AlertTitle as AlertTitle$1 } from './neo-components/Navigation.js';
19
- import { BottomNavigation as BottomNavigation$1 } from './neo-components/BottomNavigation.js';
20
- import { Stepper as Stepper$1 } from './neo-components/Stepper.js';
21
- import { Link as Link$1, LinearProgress as LinearProgress$1, Skeleton as Skeleton$1, Avatar as Avatar$1, Badge as Badge$1, Chip as Chip$1, Divider as Divider$1, Tooltip as Tooltip$1 } from './neo-components/Misc.js';
22
- import { AccordionSummary as AccordionSummary$1, AccordionDetails as AccordionDetails$1, AccordionActions as AccordionActions$1, ImageList as ImageList$1, ButtonGroup as ButtonGroup$1, Breadcrumbs as Breadcrumbs$1, Pagination as Pagination$1, Accordion as Accordion$1, AppBar as AppBar$1, List as List$1, Table as Table$1, Toolbar as Toolbar$1, SvgIcon as SvgIcon$1, FormControl as FormControl$1, InputLabel as InputLabel$1 } from './neo-components/Layout.js';
23
- import '@babel/runtime/helpers/extends';
24
- import '@babel/runtime/helpers/defineProperty';
25
- import '@babel/runtime/helpers/objectWithoutProperties';
26
- import 'react';
27
- import { Blerp as Blerp$1 } from './Blerp.js';
28
- import { NewBlerp as NewBlerp$1 } from './NewBlerp.js';
29
- import { NewBlerpTest as NewBlerpTest$1 } from './NewBlerpTest.js';
30
- import { UserCard as UserCard$1 } from './UserCard.js';
31
- import { GroupCard as GroupCard$1 } from './GroupCard.js';
32
- import { UsernameWithPopout as UsernameWithPopout$1 } from './UsernameWithPopout.js';
33
- import { BlerpAudioContextProvider as BlerpAudioContextProvider$1 } from './BlerpAudioContextProvider.js';
34
- import { BlerpListView as BlerpListView$1 } from './BlerpListView.js';
35
- import { CollectionListViewPremium as CollectionListViewPremium$1 } from './CollectionListViewPremium.js';
36
- import { BlerpListViewPremium as BlerpListViewPremium$1 } from './BlerpListViewPremium.js';
37
- import { Toggle as Toggle$1 } from './Toggle.js';
38
- import { Dropdown as Dropdown$1, NewDropdown as NewDropdown$1 } from './Dropdown.js';
39
- import { NewCollectionModal as NewCollectionModal$1 } from './NewCollectionModal.js';
40
- import { BlerpSkeleton as BlerpSkeleton$1 } from './BlerpSkeleton.js';
41
- import { BlerpListViewSkeleton as BlerpListViewSkeleton$1 } from './BlerpListViewSkeleton.js';
42
- import { CollectionSkeleton as CollectionSkeleton$1 } from './CollectionSkeleton.js';
43
- import BlerpTheme from './Theme.js';
44
- import { CollectionCard as CollectionCard$1 } from './CollectionCard.js';
45
- export { BlerpCardIcon, BlerpCoinsIcon, BlerpyIcon, BookmarkAddRounded, BroomIcon, ChannelPointsIcon, ClockIcon, CogIcon, CrownIcon, DiamondIcon, DiscordIcon, GiftIcon, LightbulbIcon, NewDiscordIcon, OpenLockIcon, PlayOutlineIcon, PlaySolidIcon, PointerFingerIcon, PresentGiftIcon, RadarDishIcon, ShortcutIcon, SparkleGiftIcon, TikTokIcon, TwitchBitIcon, TwitchIcon, UnsafeIcon, WalkonIcon, WindowsIcon } from './Icons/Icons.js';
46
- export { SnackbarContext, SnackbarProvider } from './SnackbarContextProvider.js';
1
+ export { Blerp } from './Blerp.js';
2
+ export { NewBlerp } from './NewBlerp.js';
3
+ export { NewBlerpTest } from './NewBlerpTest.js';
4
+ export { UserCard } from './UserCard.js';
5
+ export { GroupCard } from './GroupCard.js';
6
+ export { UsernameWithPopout } from './UsernameWithPopout.js';
7
+ export { BlerpAudioContextProvider } from './BlerpAudioContextProvider.js';
8
+ export { BlerpListView } from './BlerpListView.js';
9
+ export { BlerpListViewPremium } from './BlerpListViewPremium.js';
10
+ export { CollectionListViewPremium } from './CollectionListViewPremium.js';
11
+ export { Toggle } from './Toggle.js';
12
+ export { Dropdown, NewDropdown } from './Dropdown.js';
13
+ export { NewCollectionModal } from './NewCollectionModal.js';
14
+ export { BlerpSkeleton } from './BlerpSkeleton.js';
15
+ export { BlerpListViewSkeleton } from './BlerpListViewSkeleton.js';
16
+ export { CollectionSkeleton } from './CollectionSkeleton.js';
17
+ export { CollectionCard } from './CollectionCard.js';
47
18
  export { default as UserProfileHeader } from './UserPage/UserProfileHeader.js';
48
19
  export { default as UserLibraryHeader } from './UserPage/UserLibraryHeader.js';
49
20
  export { default as ReactionButtons } from './ReactionButtons.js';
@@ -51,90 +22,34 @@ export { default as CheckoutModal } from './PurchaseModals/CheckoutModal.js';
51
22
  export { default as PremiumBlerpCheckoutModal } from './PurchaseModals/PremiumBlerpCheckoutModal.js';
52
23
  export { default as PremiumCollectionCheckoutModal } from './PurchaseModals/PremiumCollectionCheckoutModal.js';
53
24
  export { default as PremiumSubscriptionCheckoutModal } from './PurchaseModals/PremiumSubscriptionCheckoutModal.js';
25
+ export { SnackbarContext, SnackbarProvider } from './SnackbarContextProvider.js';
26
+ export { BlerpCardIcon, BlerpCoinsIcon, BlerpyIcon, BookmarkAddRounded, BroomIcon, ChannelPointsIcon, ClockIcon, CogIcon, CrownIcon, DiamondIcon, DiscordIcon, GiftIcon, LightbulbIcon, NewDiscordIcon, OpenLockIcon, PlayOutlineIcon, PlaySolidIcon, PointerFingerIcon, PresentGiftIcon, RadarDishIcon, ShortcutIcon, SparkleGiftIcon, TikTokIcon, TwitchBitIcon, TwitchIcon, UnsafeIcon, WalkonIcon, WindowsIcon } from './Icons/Icons.js';
27
+ export { default as Theme } from './Theme.js';
28
+ export { Accordion, AccordionActions, AccordionDetails, AccordionSummary, AppBar, Breadcrumbs, ButtonGroup, FormControl, ImageList, InputLabel, List, Pagination, SvgIcon, Table, Toolbar } from './neo-components/Layout.js';
29
+ export { Alert, AlertTitle, Drawer, Menu, MenuItem, Popover, Snackbar, Tab, Tabs } from './neo-components/Navigation.js';
30
+ export { Autocomplete } from './neo-components/Autocomplete.js';
31
+ export { Avatar, Badge, Chip, Divider, LinearProgress, Link, Skeleton, Tooltip } from './neo-components/Misc.js';
32
+ export { Backdrop, Dialog, Modal } from './neo-components/Dialog.js';
33
+ export { BottomNavigation } from './neo-components/BottomNavigation.js';
34
+ export { Box } from './neo-components/Box.js';
35
+ export { Button } from './neo-components/Button.js';
36
+ export { Card, Paper } from './neo-components/Paper.js';
37
+ export { Checkbox, Radio, Radio as RadioButton, Rating, Select, Slider, Switch } from './neo-components/FormControls.js';
38
+ export { CircularProgress } from './neo-components/CircularProgress.js';
39
+ export { Container } from './neo-components/Container.js';
40
+ export { Fab, Fab as FloatingActionButton, SpeedDial } from './neo-components/Fab.js';
41
+ export { Grid } from './neo-components/Grid.js';
42
+ export { IconButton } from './neo-components/IconButton.js';
43
+ export { TextField as Input, InputAdornment, TextField } from './neo-components/Input.js';
44
+ export { Stack } from './neo-components/Stack.js';
45
+ export { Stepper } from './neo-components/Stepper.js';
46
+ export { Typography as Text, Typography } from './neo-components/Text.js';
47
+ export { createTheme } from './neo-components/createTheme.js';
48
+ export { ThemeProvider } from './neo-components/ThemeProvider.js';
54
49
 
55
50
  // import {
56
- const Theme = BlerpTheme;
57
- const AccordionSummary = AccordionSummary$1;
58
- const AccordionDetails = AccordionDetails$1;
59
- const AccordionActions = AccordionActions$1;
60
- const Box = Box$1;
61
- const Container = Container$1;
62
- const Grid = Grid$1;
63
- const Stack = Stack$1;
64
- const ImageList = ImageList$1;
65
- const Autocomplete = Autocomplete$1;
66
- const Button = Button$1;
67
- const ButtonGroup = ButtonGroup$1;
68
- const Checkbox = Checkbox$1;
69
- const FloatingActionButton = Fab;
70
- const RadioButton = Radio;
71
- const Rating = Rating$1;
72
- const Select = Select$1;
73
- const Slider = Slider$1;
74
- const Switch = Switch$1;
75
- const Input = TextField;
76
- const BottomNavigation = BottomNavigation$1;
77
- const Breadcrumbs = Breadcrumbs$1;
78
- const Drawer = Drawer$1;
79
- const Link = Link$1;
80
- const Menu = Menu$1;
81
- const Pagination = Pagination$1;
82
- const SpeedDial = SpeedDial$1;
83
- const Stepper = Stepper$1;
84
- const Tabs = Tabs$1;
85
- const Tab = Tab$1;
86
- const Accordion = Accordion$1;
87
- const AppBar = AppBar$1;
88
- const Card = Card$1;
89
- const Paper = Paper$1;
90
- const Alert = Alert$1;
91
- const Backdrop = Backdrop$1;
92
- const Dialog = Dialog$1;
93
- const LinearProgress = LinearProgress$1;
94
- const Skeleton = Skeleton$1;
95
- const Snackbar = Snackbar$1;
96
- const Avatar = Avatar$1;
97
- const Badge = Badge$1;
98
- const Chip = Chip$1;
99
- const Divider = Divider$1;
100
- const List = List$1;
101
- const Table = Table$1;
102
- const CircularProgress = CircularProgress$1;
103
- const Tooltip = Tooltip$1;
104
- const Toolbar = Toolbar$1;
105
- const Text = Typography;
106
- const Modal = Modal$1;
107
- const Popover = Popover$1;
108
- const Blerp = Blerp$1;
109
- const NewBlerp = NewBlerp$1;
110
- const NewBlerpTest = NewBlerpTest$1;
111
- const GroupCard = GroupCard$1;
112
- const UserCard = UserCard$1;
113
- const UsernameWithPopout = UsernameWithPopout$1;
114
- const BlerpAudioContextProvider = BlerpAudioContextProvider$1;
115
- const IconButton = IconButton$1;
116
- const Toggle = Toggle$1;
117
- const Dropdown = Dropdown$1;
118
- const NewDropdown = NewDropdown$1;
119
- const MenuItem = MenuItem$1;
120
- const NewCollectionModal = NewCollectionModal$1;
121
- const CollectionCard = CollectionCard$1;
122
- const BlerpListView = BlerpListView$1;
123
- const CollectionListViewPremium = CollectionListViewPremium$1;
124
- const BlerpListViewPremium = BlerpListViewPremium$1;
125
- const BlerpSkeleton = BlerpSkeleton$1;
126
- const BlerpListViewSkeleton = BlerpListViewSkeleton$1;
127
- const CollectionSkeleton = CollectionSkeleton$1;
128
- const InputAdornment = InputAdornment$1;
129
- const createTheme = createTheme$1;
130
- const ThemeProvider = ThemeProvider$1;
131
- const AlertTitle = AlertTitle$1;
132
- const SvgIcon = SvgIcon$1;
133
- const FormControl = FormControl$1;
134
- const InputLabel = InputLabel$1; // export const BlerpContextMenu = MBlerpContextMenu;
135
- // export const ListItem = MListItem;
136
- // // export const ListItemText = MListItemText;
137
- // export const ListItemButtonText = MListItemButtonText;
51
+ // Theme Objects (Legacy Support)
52
+ // -----------------------------------------------------------------------------
138
53
 
139
54
  const lightThemeV1 = {
140
55
  pandaPink: "#FE295C",
@@ -369,4 +284,4 @@ const Themes = {
369
284
  // };
370
285
  // export default returnLibrary();
371
286
 
372
- export { Accordion, AccordionActions, AccordionDetails, AccordionSummary, Alert, AlertTitle, AppBar, Autocomplete, Avatar, Backdrop, Badge, Blerp, BlerpAudioContextProvider, BlerpListView, BlerpListViewPremium, BlerpListViewSkeleton, BlerpSkeleton, BottomNavigation, Box, Breadcrumbs, Button, ButtonGroup, Card, Checkbox, Chip, CircularProgress, CollectionCard, CollectionListViewPremium, CollectionSkeleton, Container, Dialog, Divider, Drawer, Dropdown, FloatingActionButton, FormControl, Grid, GroupCard, IconButton, ImageList, Input, InputAdornment, InputLabel, LinearProgress, Link, List, Menu, MenuItem, Modal, NewBlerp, NewBlerpTest, NewCollectionModal, NewDropdown, Pagination, Paper, Popover, RadioButton, Rating, Select, Skeleton, Slider, Snackbar, SpeedDial, Stack, Stepper, SvgIcon, Switch, Tab, Table, Tabs, Text, Theme, ThemeProvider, Themes, Toggle, Toolbar, Tooltip, UserCard, UsernameWithPopout, createTheme, darkThemeV1, lightThemeV1, mainTheme };
287
+ export { Themes, darkThemeV1, lightThemeV1, mainTheme };
@@ -447,8 +447,6 @@ const BaseTabs = /*#__PURE__*/React.forwardRef((_ref4, ref) => {
447
447
  } = useTheme();
448
448
  const tabsRef = useRef(null);
449
449
  const [indicatorStyle, setIndicatorStyle] = useState({});
450
- const colorValue = (colors === null || colors === void 0 ? void 0 : colors[indicatorColor]) || (colors === null || colors === void 0 ? void 0 : colors.ibisRed);
451
- typeof colorValue === "object" ? colorValue.main : colorValue || "ibisRed.main"; // Update indicator position
452
450
 
453
451
  useIsomorphicLayoutEffect(() => {
454
452
  if (!canUseDOM() || !tabsRef.current) return;
@@ -1,5 +1,5 @@
1
1
  import _defineProperty from '@babel/runtime/helpers/defineProperty';
2
- import React, { useMemo, useEffect, useContext, createContext } from 'react';
2
+ import React, { useMemo, useEffect, createContext, useContext } from 'react';
3
3
 
4
4
  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; }
5
5
 
@@ -1,4 +1,3 @@
1
- import '@babel/runtime/helpers/extends';
2
1
  import _defineProperty from '@babel/runtime/helpers/defineProperty';
3
2
  import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
4
3
  import React, { useId, useMemo, useEffect } from 'react';
@@ -1,5 +1,3 @@
1
- import '@babel/runtime/helpers/defineProperty';
2
-
3
1
  /**
4
2
  * Converts MUI sx prop to inline styles
5
3
  * Handles spacing shortcuts, theme colors, pseudo-selectors, nested selectors, and responsive values
package/package.json CHANGED
@@ -1,10 +1,30 @@
1
1
  {
2
2
  "name": "@blerp/design",
3
- "version": "1.4.5",
3
+ "version": "1.4.7",
4
4
  "description": "Blerp UI",
5
- "main": "dist/esm/index.js",
5
+ "main": "dist/cjs/index.js",
6
+ "module": "dist/esm/index.js",
7
+ "sideEffects": false,
8
+ "exports": {
9
+ ".": {
10
+ "import": "./dist/esm/index.js",
11
+ "require": "./dist/cjs/index.js"
12
+ },
13
+ "./neo-components/*": {
14
+ "import": "./dist/esm/neo-components/*.js",
15
+ "require": "./dist/cjs/neo-components/*.js"
16
+ },
17
+ "./*": {
18
+ "import": "./dist/esm/*.js",
19
+ "require": "./dist/cjs/*.js"
20
+ }
21
+ },
22
+ "files": [
23
+ "dist"
24
+ ],
6
25
  "scripts": {
7
26
  "build": "rollup -c",
27
+ "build:prod": "NODE_ENV=production rollup -c",
8
28
  "watch": "rollup -c -w"
9
29
  },
10
30
  "peerDependencies": {
@@ -25,12 +45,6 @@
25
45
  "@blerp/wavesurfer": "^6.4.2",
26
46
  "autoprefixer": "^10.4.23"
27
47
  },
28
- "keywords": [
29
- "react",
30
- "keywords"
31
- ],
32
- "author": "Jordan Rand",
33
- "license": "MIT",
34
48
  "devDependencies": {
35
49
  "@babel/cli": "^7.12.10",
36
50
  "@babel/core": "^7.12.10",
@@ -46,5 +60,13 @@
46
60
  "rollup-plugin-styles": "^3.12.2",
47
61
  "rollup-plugin-terser": "^7.0.2",
48
62
  "styled-components": "5.3.6"
49
- }
63
+ },
64
+ "keywords": [
65
+ "react",
66
+ "ui",
67
+ "components",
68
+ "blerp"
69
+ ],
70
+ "author": "Jordan Rand",
71
+ "license": "MIT"
50
72
  }