@blerp/design 1.1.0 → 1.1.1
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.
- package/dist/index.cjs.js +13 -34
- package/dist/index.esm.js +13 -34
- package/dist/index.umd.js +17 -37
- package/package.json +7 -7
package/dist/index.cjs.js
CHANGED
|
@@ -6,7 +6,6 @@ var material = require('@mui/material');
|
|
|
6
6
|
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
|
|
7
7
|
var PropTypes = require('prop-types');
|
|
8
8
|
var React = require('react');
|
|
9
|
-
var reactColorExtractor = require('react-color-extractor');
|
|
10
9
|
var styled = require('styled-components');
|
|
11
10
|
var _taggedTemplateLiteral = require('@babel/runtime/helpers/taggedTemplateLiteral');
|
|
12
11
|
var iconsMaterial = require('@mui/icons-material');
|
|
@@ -1316,8 +1315,6 @@ var reactionIconUrls$1 = {
|
|
|
1316
1315
|
LOVE: "https://cdn.blerp.com/blerp_products/Icons/Heart%403x.svg"
|
|
1317
1316
|
};
|
|
1318
1317
|
var Blerp$1 = function Blerp(_ref) {
|
|
1319
|
-
var _bite$image, _bite$image$original;
|
|
1320
|
-
|
|
1321
1318
|
var bite = _ref.bite,
|
|
1322
1319
|
title = _ref.title,
|
|
1323
1320
|
variantSize = _ref.variantSize,
|
|
@@ -1353,8 +1350,8 @@ var Blerp$1 = function Blerp(_ref) {
|
|
|
1353
1350
|
|
|
1354
1351
|
var _useState3 = React.useState(null),
|
|
1355
1352
|
_useState4 = _slicedToArray__default['default'](_useState3, 2),
|
|
1356
|
-
profileColors = _useState4[0]
|
|
1357
|
-
|
|
1353
|
+
profileColors = _useState4[0];
|
|
1354
|
+
_useState4[1];
|
|
1358
1355
|
|
|
1359
1356
|
var _useState5 = React.useState(false),
|
|
1360
1357
|
_useState6 = _slicedToArray__default['default'](_useState5, 2),
|
|
@@ -1482,11 +1479,6 @@ var Blerp$1 = function Blerp(_ref) {
|
|
|
1482
1479
|
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", ")") : "",
|
|
1483
1480
|
backgroundColor: isPremium && !profileColors && "grey5.override"
|
|
1484
1481
|
}
|
|
1485
|
-
}), /*#__PURE__*/React__default['default'].createElement(reactColorExtractor.ColorExtractor, {
|
|
1486
|
-
src: bite === null || bite === void 0 ? void 0 : (_bite$image = bite.image) === null || _bite$image === void 0 ? void 0 : (_bite$image$original = _bite$image.original) === null || _bite$image$original === void 0 ? void 0 : _bite$image$original.url,
|
|
1487
|
-
getColors: function getColors(colors) {
|
|
1488
|
-
return setProfileColors(colors);
|
|
1489
|
-
}
|
|
1490
1482
|
}), /*#__PURE__*/React__default['default'].createElement(BlerpTopRow, {
|
|
1491
1483
|
bite: bite,
|
|
1492
1484
|
isOwner: isOwner,
|
|
@@ -7436,7 +7428,7 @@ var LockedScrimBackground = styled__default['default'].div(_templateObject6 || (
|
|
|
7436
7428
|
return props.collectionHovered ? "0.5" : "0";
|
|
7437
7429
|
});
|
|
7438
7430
|
var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
|
|
7439
|
-
var _collection$image, _collection$image$ori, _collection$image2, _collection$image2$or, _collection$
|
|
7431
|
+
var _collection$image, _collection$image$ori, _collection$image2, _collection$image2$or, _collection$ownerObje, _collection$ownerObje2, _collection$ownerObje3, _collection$image3, _collection$image3$or;
|
|
7440
7432
|
|
|
7441
7433
|
var collection = _ref.collection,
|
|
7442
7434
|
variantSize = _ref.variantSize,
|
|
@@ -7463,8 +7455,8 @@ var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
|
|
|
7463
7455
|
|
|
7464
7456
|
var _useState = React.useState(null),
|
|
7465
7457
|
_useState2 = _slicedToArray__default['default'](_useState, 2),
|
|
7466
|
-
cardColors = _useState2[0]
|
|
7467
|
-
|
|
7458
|
+
cardColors = _useState2[0];
|
|
7459
|
+
_useState2[1];
|
|
7468
7460
|
|
|
7469
7461
|
var _useState3 = React.useState(false),
|
|
7470
7462
|
_useState4 = _slicedToArray__default['default'](_useState3, 2),
|
|
@@ -7506,15 +7498,7 @@ var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
|
|
|
7506
7498
|
width: fluid ? "80%" : sizeParams.width,
|
|
7507
7499
|
height: fluid ? "80%" : sizeParams.height
|
|
7508
7500
|
}
|
|
7509
|
-
}, /*#__PURE__*/React__default['default'].createElement(
|
|
7510
|
-
style: {
|
|
7511
|
-
zIndex: "3"
|
|
7512
|
-
},
|
|
7513
|
-
src: collection === null || collection === void 0 ? void 0 : (_collection$image2 = collection.image) === null || _collection$image2 === void 0 ? void 0 : (_collection$image2$or = _collection$image2.original) === null || _collection$image2$or === void 0 ? void 0 : _collection$image2$or.url,
|
|
7514
|
-
getColors: function getColors(colors) {
|
|
7515
|
-
return setCardColors(colors);
|
|
7516
|
-
}
|
|
7517
|
-
}), /*#__PURE__*/React__default['default'].createElement(Box, {
|
|
7501
|
+
}, /*#__PURE__*/React__default['default'].createElement(Box, {
|
|
7518
7502
|
onClick: function onClick(e) {
|
|
7519
7503
|
e.stopPropagation();
|
|
7520
7504
|
if (handleClickBackground) handleClickBackground();
|
|
@@ -7587,7 +7571,7 @@ var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
|
|
|
7587
7571
|
}
|
|
7588
7572
|
}), /*#__PURE__*/React__default['default'].createElement(Box, {
|
|
7589
7573
|
sx: {
|
|
7590
|
-
backgroundImage: "linear-gradient(".concat(data.vibrant || "#000000", "9a, #0000007a), url(").concat(collection === null || collection === void 0 ? void 0 : (_collection$
|
|
7574
|
+
backgroundImage: "linear-gradient(".concat(data.vibrant || "#000000", "9a, #0000007a), url(").concat(collection === null || collection === void 0 ? void 0 : (_collection$image2 = collection.image) === null || _collection$image2 === void 0 ? void 0 : (_collection$image2$or = _collection$image2.original) === null || _collection$image2$or === void 0 ? void 0 : _collection$image2$or.url, ")"),
|
|
7591
7575
|
backgroundSize: "cover",
|
|
7592
7576
|
backgroundPosition: "center",
|
|
7593
7577
|
backgroundRepeat: "no-repeat",
|
|
@@ -7907,7 +7891,7 @@ var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
|
|
|
7907
7891
|
// What to display when variantSize === "small":
|
|
7908
7892
|
React__default['default'].createElement(Box, {
|
|
7909
7893
|
sx: {
|
|
7910
|
-
backgroundImage: "linear-gradient(".concat(cardColors ? cardColors[0] : "#000000", "7a, #0000004a), url(").concat(collection === null || collection === void 0 ? void 0 : (_collection$
|
|
7894
|
+
backgroundImage: "linear-gradient(".concat(cardColors ? cardColors[0] : "#000000", "7a, #0000004a), url(").concat(collection === null || collection === void 0 ? void 0 : (_collection$image3 = collection.image) === null || _collection$image3 === void 0 ? void 0 : (_collection$image3$or = _collection$image3.original) === null || _collection$image3$or === void 0 ? void 0 : _collection$image3$or.url, ")"),
|
|
7911
7895
|
backgroundSize: "cover",
|
|
7912
7896
|
backgroundPosition: "center",
|
|
7913
7897
|
backgroundRepeat: "no-repeat",
|
|
@@ -8306,7 +8290,7 @@ var CollectionCard$1 = function CollectionCard(_ref) {
|
|
|
8306
8290
|
};
|
|
8307
8291
|
|
|
8308
8292
|
var UserProfileHeader = function UserProfileHeader(_ref) {
|
|
8309
|
-
var _userData$
|
|
8293
|
+
var _userData$headerImage, _userData$headerImage2, _userData$headerImage3, _userData$headerImage4, _userData$profileImag, _userData$profileImag2, _userData$socialLinks2;
|
|
8310
8294
|
|
|
8311
8295
|
var followUser = _ref.followUser,
|
|
8312
8296
|
isOwner = _ref.isOwner,
|
|
@@ -8316,8 +8300,8 @@ var UserProfileHeader = function UserProfileHeader(_ref) {
|
|
|
8316
8300
|
|
|
8317
8301
|
var _useState = React.useState(null),
|
|
8318
8302
|
_useState2 = _slicedToArray__default['default'](_useState, 2),
|
|
8319
|
-
profileColors = _useState2[0]
|
|
8320
|
-
|
|
8303
|
+
profileColors = _useState2[0];
|
|
8304
|
+
_useState2[1];
|
|
8321
8305
|
|
|
8322
8306
|
var size = useWindowSize();
|
|
8323
8307
|
|
|
@@ -8414,12 +8398,7 @@ var UserProfileHeader = function UserProfileHeader(_ref) {
|
|
|
8414
8398
|
});
|
|
8415
8399
|
};
|
|
8416
8400
|
|
|
8417
|
-
return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(
|
|
8418
|
-
src: userData === null || userData === void 0 ? void 0 : (_userData$profileImag = userData.profileImage) === null || _userData$profileImag === void 0 ? void 0 : (_userData$profileImag2 = _userData$profileImag.original) === null || _userData$profileImag2 === void 0 ? void 0 : _userData$profileImag2.url,
|
|
8419
|
-
getColors: function getColors(colors) {
|
|
8420
|
-
return setProfileColors(colors);
|
|
8421
|
-
}
|
|
8422
|
-
}), /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
8401
|
+
return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
8423
8402
|
width: "100%",
|
|
8424
8403
|
sx: {
|
|
8425
8404
|
height: "250px",
|
|
@@ -8509,7 +8488,7 @@ var UserProfileHeader = function UserProfileHeader(_ref) {
|
|
|
8509
8488
|
margin: "0 20px"
|
|
8510
8489
|
},
|
|
8511
8490
|
alt: "profile img",
|
|
8512
|
-
src: userData === null || userData === void 0 ? void 0 : (_userData$
|
|
8491
|
+
src: userData === null || userData === void 0 ? void 0 : (_userData$profileImag = userData.profileImage) === null || _userData$profileImag === void 0 ? void 0 : (_userData$profileImag2 = _userData$profileImag.original) === null || _userData$profileImag2 === void 0 ? void 0 : _userData$profileImag2.url
|
|
8513
8492
|
}), /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
8514
8493
|
marginLeft: "20px"
|
|
8515
8494
|
}, /*#__PURE__*/React__default['default'].createElement(Stack, {
|
package/dist/index.esm.js
CHANGED
|
@@ -3,7 +3,6 @@ import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
|
|
|
3
3
|
import PropTypes from 'prop-types';
|
|
4
4
|
import * as React from 'react';
|
|
5
5
|
import React__default, { useState, useEffect, useContext, useRef, createRef, cloneElement } from 'react';
|
|
6
|
-
import { ColorExtractor } from 'react-color-extractor';
|
|
7
6
|
import styled, { ThemeContext, keyframes, ThemeProvider as ThemeProvider$1 } from 'styled-components';
|
|
8
7
|
import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
|
|
9
8
|
import { PauseCircleOutlineRounded, LockRounded, CheckRounded, BookmarkRounded, BookmarkAddOutlined, AccountCircleRounded, VisibilityOffRounded, CancelRounded } from '@mui/icons-material';
|
|
@@ -1247,8 +1246,6 @@ var reactionIconUrls$1 = {
|
|
|
1247
1246
|
LOVE: "https://cdn.blerp.com/blerp_products/Icons/Heart%403x.svg"
|
|
1248
1247
|
};
|
|
1249
1248
|
var Blerp$1 = function Blerp(_ref) {
|
|
1250
|
-
var _bite$image, _bite$image$original;
|
|
1251
|
-
|
|
1252
1249
|
var bite = _ref.bite,
|
|
1253
1250
|
title = _ref.title,
|
|
1254
1251
|
variantSize = _ref.variantSize,
|
|
@@ -1284,8 +1281,8 @@ var Blerp$1 = function Blerp(_ref) {
|
|
|
1284
1281
|
|
|
1285
1282
|
var _useState3 = useState(null),
|
|
1286
1283
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
1287
|
-
profileColors = _useState4[0]
|
|
1288
|
-
|
|
1284
|
+
profileColors = _useState4[0];
|
|
1285
|
+
_useState4[1];
|
|
1289
1286
|
|
|
1290
1287
|
var _useState5 = useState(false),
|
|
1291
1288
|
_useState6 = _slicedToArray(_useState5, 2),
|
|
@@ -1413,11 +1410,6 @@ var Blerp$1 = function Blerp(_ref) {
|
|
|
1413
1410
|
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", ")") : "",
|
|
1414
1411
|
backgroundColor: isPremium && !profileColors && "grey5.override"
|
|
1415
1412
|
}
|
|
1416
|
-
}), /*#__PURE__*/React__default.createElement(ColorExtractor, {
|
|
1417
|
-
src: bite === null || bite === void 0 ? void 0 : (_bite$image = bite.image) === null || _bite$image === void 0 ? void 0 : (_bite$image$original = _bite$image.original) === null || _bite$image$original === void 0 ? void 0 : _bite$image$original.url,
|
|
1418
|
-
getColors: function getColors(colors) {
|
|
1419
|
-
return setProfileColors(colors);
|
|
1420
|
-
}
|
|
1421
1413
|
}), /*#__PURE__*/React__default.createElement(BlerpTopRow, {
|
|
1422
1414
|
bite: bite,
|
|
1423
1415
|
isOwner: isOwner,
|
|
@@ -7367,7 +7359,7 @@ var LockedScrimBackground = styled.div(_templateObject6 || (_templateObject6 = _
|
|
|
7367
7359
|
return props.collectionHovered ? "0.5" : "0";
|
|
7368
7360
|
});
|
|
7369
7361
|
var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
|
|
7370
|
-
var _collection$image, _collection$image$ori, _collection$image2, _collection$image2$or, _collection$
|
|
7362
|
+
var _collection$image, _collection$image$ori, _collection$image2, _collection$image2$or, _collection$ownerObje, _collection$ownerObje2, _collection$ownerObje3, _collection$image3, _collection$image3$or;
|
|
7371
7363
|
|
|
7372
7364
|
var collection = _ref.collection,
|
|
7373
7365
|
variantSize = _ref.variantSize,
|
|
@@ -7394,8 +7386,8 @@ var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
|
|
|
7394
7386
|
|
|
7395
7387
|
var _useState = useState(null),
|
|
7396
7388
|
_useState2 = _slicedToArray(_useState, 2),
|
|
7397
|
-
cardColors = _useState2[0]
|
|
7398
|
-
|
|
7389
|
+
cardColors = _useState2[0];
|
|
7390
|
+
_useState2[1];
|
|
7399
7391
|
|
|
7400
7392
|
var _useState3 = useState(false),
|
|
7401
7393
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
@@ -7437,15 +7429,7 @@ var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
|
|
|
7437
7429
|
width: fluid ? "80%" : sizeParams.width,
|
|
7438
7430
|
height: fluid ? "80%" : sizeParams.height
|
|
7439
7431
|
}
|
|
7440
|
-
}, /*#__PURE__*/React__default.createElement(
|
|
7441
|
-
style: {
|
|
7442
|
-
zIndex: "3"
|
|
7443
|
-
},
|
|
7444
|
-
src: collection === null || collection === void 0 ? void 0 : (_collection$image2 = collection.image) === null || _collection$image2 === void 0 ? void 0 : (_collection$image2$or = _collection$image2.original) === null || _collection$image2$or === void 0 ? void 0 : _collection$image2$or.url,
|
|
7445
|
-
getColors: function getColors(colors) {
|
|
7446
|
-
return setCardColors(colors);
|
|
7447
|
-
}
|
|
7448
|
-
}), /*#__PURE__*/React__default.createElement(Box, {
|
|
7432
|
+
}, /*#__PURE__*/React__default.createElement(Box, {
|
|
7449
7433
|
onClick: function onClick(e) {
|
|
7450
7434
|
e.stopPropagation();
|
|
7451
7435
|
if (handleClickBackground) handleClickBackground();
|
|
@@ -7518,7 +7502,7 @@ var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
|
|
|
7518
7502
|
}
|
|
7519
7503
|
}), /*#__PURE__*/React__default.createElement(Box, {
|
|
7520
7504
|
sx: {
|
|
7521
|
-
backgroundImage: "linear-gradient(".concat(data.vibrant || "#000000", "9a, #0000007a), url(").concat(collection === null || collection === void 0 ? void 0 : (_collection$
|
|
7505
|
+
backgroundImage: "linear-gradient(".concat(data.vibrant || "#000000", "9a, #0000007a), url(").concat(collection === null || collection === void 0 ? void 0 : (_collection$image2 = collection.image) === null || _collection$image2 === void 0 ? void 0 : (_collection$image2$or = _collection$image2.original) === null || _collection$image2$or === void 0 ? void 0 : _collection$image2$or.url, ")"),
|
|
7522
7506
|
backgroundSize: "cover",
|
|
7523
7507
|
backgroundPosition: "center",
|
|
7524
7508
|
backgroundRepeat: "no-repeat",
|
|
@@ -7838,7 +7822,7 @@ var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
|
|
|
7838
7822
|
// What to display when variantSize === "small":
|
|
7839
7823
|
React__default.createElement(Box, {
|
|
7840
7824
|
sx: {
|
|
7841
|
-
backgroundImage: "linear-gradient(".concat(cardColors ? cardColors[0] : "#000000", "7a, #0000004a), url(").concat(collection === null || collection === void 0 ? void 0 : (_collection$
|
|
7825
|
+
backgroundImage: "linear-gradient(".concat(cardColors ? cardColors[0] : "#000000", "7a, #0000004a), url(").concat(collection === null || collection === void 0 ? void 0 : (_collection$image3 = collection.image) === null || _collection$image3 === void 0 ? void 0 : (_collection$image3$or = _collection$image3.original) === null || _collection$image3$or === void 0 ? void 0 : _collection$image3$or.url, ")"),
|
|
7842
7826
|
backgroundSize: "cover",
|
|
7843
7827
|
backgroundPosition: "center",
|
|
7844
7828
|
backgroundRepeat: "no-repeat",
|
|
@@ -8237,7 +8221,7 @@ var CollectionCard$1 = function CollectionCard(_ref) {
|
|
|
8237
8221
|
};
|
|
8238
8222
|
|
|
8239
8223
|
var UserProfileHeader = function UserProfileHeader(_ref) {
|
|
8240
|
-
var _userData$
|
|
8224
|
+
var _userData$headerImage, _userData$headerImage2, _userData$headerImage3, _userData$headerImage4, _userData$profileImag, _userData$profileImag2, _userData$socialLinks2;
|
|
8241
8225
|
|
|
8242
8226
|
var followUser = _ref.followUser,
|
|
8243
8227
|
isOwner = _ref.isOwner,
|
|
@@ -8247,8 +8231,8 @@ var UserProfileHeader = function UserProfileHeader(_ref) {
|
|
|
8247
8231
|
|
|
8248
8232
|
var _useState = useState(null),
|
|
8249
8233
|
_useState2 = _slicedToArray(_useState, 2),
|
|
8250
|
-
profileColors = _useState2[0]
|
|
8251
|
-
|
|
8234
|
+
profileColors = _useState2[0];
|
|
8235
|
+
_useState2[1];
|
|
8252
8236
|
|
|
8253
8237
|
var size = useWindowSize();
|
|
8254
8238
|
|
|
@@ -8345,12 +8329,7 @@ var UserProfileHeader = function UserProfileHeader(_ref) {
|
|
|
8345
8329
|
});
|
|
8346
8330
|
};
|
|
8347
8331
|
|
|
8348
|
-
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(
|
|
8349
|
-
src: userData === null || userData === void 0 ? void 0 : (_userData$profileImag = userData.profileImage) === null || _userData$profileImag === void 0 ? void 0 : (_userData$profileImag2 = _userData$profileImag.original) === null || _userData$profileImag2 === void 0 ? void 0 : _userData$profileImag2.url,
|
|
8350
|
-
getColors: function getColors(colors) {
|
|
8351
|
-
return setProfileColors(colors);
|
|
8352
|
-
}
|
|
8353
|
-
}), /*#__PURE__*/React__default.createElement(Stack, {
|
|
8332
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Stack, {
|
|
8354
8333
|
width: "100%",
|
|
8355
8334
|
sx: {
|
|
8356
8335
|
height: "250px",
|
|
@@ -8440,7 +8419,7 @@ var UserProfileHeader = function UserProfileHeader(_ref) {
|
|
|
8440
8419
|
margin: "0 20px"
|
|
8441
8420
|
},
|
|
8442
8421
|
alt: "profile img",
|
|
8443
|
-
src: userData === null || userData === void 0 ? void 0 : (_userData$
|
|
8422
|
+
src: userData === null || userData === void 0 ? void 0 : (_userData$profileImag = userData.profileImage) === null || _userData$profileImag === void 0 ? void 0 : (_userData$profileImag2 = _userData$profileImag.original) === null || _userData$profileImag2 === void 0 ? void 0 : _userData$profileImag2.url
|
|
8444
8423
|
}), /*#__PURE__*/React__default.createElement(Stack, {
|
|
8445
8424
|
marginLeft: "20px"
|
|
8446
8425
|
}, /*#__PURE__*/React__default.createElement(Stack, {
|
package/dist/index.umd.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
(function (global, factory) {
|
|
2
|
-
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@mui/material'), require('@babel/runtime/helpers/slicedToArray'), require('prop-types'), require('react'), require('
|
|
3
|
-
typeof define === 'function' && define.amd ? define(['exports', '@mui/material', '@babel/runtime/helpers/slicedToArray', 'prop-types', 'react', '
|
|
4
|
-
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global['react-awesome-buttons'] = {}, global.material, global._slicedToArray, global.PropTypes, global.React, global.
|
|
5
|
-
}(this, (function (exports, material, _slicedToArray, PropTypes, React,
|
|
2
|
+
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@mui/material'), require('@babel/runtime/helpers/slicedToArray'), require('prop-types'), require('react'), require('styled-components'), require('@babel/runtime/helpers/taggedTemplateLiteral'), require('@mui/icons-material'), require('@mui/icons-material/BookmarkOutlined'), require('@mui/icons-material/LockRounded'), require('@mui/icons-material/BookmarkAddOutlined'), require('@mui/icons-material/MoreHorizRounded'), require('react-palette'), require('@babel/runtime/helpers/typeof'), require('@mui/icons-material/KeyboardArrowRightRounded'), require('@babel/runtime/helpers/defineProperty'), require('@mui/icons-material/KeyboardArrowDownRounded'), require('@mui/icons-material/CloseRounded'), require('@mui/icons-material/FileUploadRounded'), require('@babel/runtime/helpers/extends'), require('@babel/runtime/helpers/asyncToGenerator'), require('@babel/runtime/regenerator'), require('react-avatar-editor'), require('react-dropzone'), require('@mui/icons-material/InsertPhotoRounded'), require('@mui/material/styles'), require('@mui/material/Slide'), require('@mui/material/Fade'), require('react-lottie'), require('@mui/icons-material/AddRounded'), require('@mui/icons-material/Facebook'), require('@mui/icons-material/Instagram'), require('@mui/icons-material/ModeEditRounded'), require('@mui/icons-material/PersonAddRounded'), require('@mui/icons-material/Pinterest'), require('@mui/icons-material/Twitter'), require('@mui/icons-material/YouTube'), require('@mui/icons-material/PersonRemoveRounded'), require('@babel/runtime/helpers/toConsumableArray'), require('@mui/icons-material/FilterAltRounded'), require('@mui/icons-material/MenuRounded'), require('@mui/icons-material/ViewModuleRounded'), require('@mui/icons-material/SettingsRounded'), require('@mui/icons-material/SortRounded'), require('@mui/icons-material/ChevronRightRounded'), require('@mui/icons-material/PersonRounded'), require('@mui/icons-material/SearchRounded'), require('@mui/icons-material/BookmarkRemoveOutlined'), require('@mui/icons-material/VisibilityOffRounded')) :
|
|
3
|
+
typeof define === 'function' && define.amd ? define(['exports', '@mui/material', '@babel/runtime/helpers/slicedToArray', 'prop-types', 'react', 'styled-components', '@babel/runtime/helpers/taggedTemplateLiteral', '@mui/icons-material', '@mui/icons-material/BookmarkOutlined', '@mui/icons-material/LockRounded', '@mui/icons-material/BookmarkAddOutlined', '@mui/icons-material/MoreHorizRounded', 'react-palette', '@babel/runtime/helpers/typeof', '@mui/icons-material/KeyboardArrowRightRounded', '@babel/runtime/helpers/defineProperty', '@mui/icons-material/KeyboardArrowDownRounded', '@mui/icons-material/CloseRounded', '@mui/icons-material/FileUploadRounded', '@babel/runtime/helpers/extends', '@babel/runtime/helpers/asyncToGenerator', '@babel/runtime/regenerator', 'react-avatar-editor', 'react-dropzone', '@mui/icons-material/InsertPhotoRounded', '@mui/material/styles', '@mui/material/Slide', '@mui/material/Fade', 'react-lottie', '@mui/icons-material/AddRounded', '@mui/icons-material/Facebook', '@mui/icons-material/Instagram', '@mui/icons-material/ModeEditRounded', '@mui/icons-material/PersonAddRounded', '@mui/icons-material/Pinterest', '@mui/icons-material/Twitter', '@mui/icons-material/YouTube', '@mui/icons-material/PersonRemoveRounded', '@babel/runtime/helpers/toConsumableArray', '@mui/icons-material/FilterAltRounded', '@mui/icons-material/MenuRounded', '@mui/icons-material/ViewModuleRounded', '@mui/icons-material/SettingsRounded', '@mui/icons-material/SortRounded', '@mui/icons-material/ChevronRightRounded', '@mui/icons-material/PersonRounded', '@mui/icons-material/SearchRounded', '@mui/icons-material/BookmarkRemoveOutlined', '@mui/icons-material/VisibilityOffRounded'], factory) :
|
|
4
|
+
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global['react-awesome-buttons'] = {}, global.material, global._slicedToArray, global.PropTypes, global.React, global.styled, global._taggedTemplateLiteral, global.iconsMaterial, global.BookmarkOutlinedIcon, global.LockRoundedIcon, global.BookmarkAddOutlinedIcon, global.MoreHorizRoundedIcon, global.reactPalette, global._typeof, global.KeyboardArrowRightRoundedIcon, global._defineProperty, global.KeyboardArrowDownRoundedIcon, global.CloseRoundedIcon, global.FileUploadRoundedIcon, global._extends, global._asyncToGenerator, global._regeneratorRuntime, global.AvatarEditor, global.Dropzone, global.InsertPhotoRoundedIcon, global.styles, global.Slide, global.Fade, global.Lottie, global.AddRoundedIcon, global.FacebookIcon, global.InstagramIcon, global.ModeEditRoundedIcon, global.PersonAddRoundedIcon, global.PinterestIcon, global.TwitterIcon, global.YouTubeIcon, global.PersonRemoveRoundedIcon, global._toConsumableArray, null, global.MenuRoundedIcon, global.ViewModuleRoundedIcon, null, global.SortRoundedIcon, global.ChevronRightRoundedIcon, global.PersonRoundedIcon, global.SearchRoundedIcon, global.BookmarkRemoveOutlinedIcon, global.VisibilityOffRoundedIcon));
|
|
5
|
+
}(this, (function (exports, material, _slicedToArray, PropTypes, React, styled, _taggedTemplateLiteral, iconsMaterial, BookmarkOutlinedIcon, LockRoundedIcon, BookmarkAddOutlinedIcon, MoreHorizRoundedIcon, reactPalette, _typeof, KeyboardArrowRightRoundedIcon, _defineProperty, KeyboardArrowDownRoundedIcon, CloseRoundedIcon, FileUploadRoundedIcon, _extends, _asyncToGenerator, _regeneratorRuntime, AvatarEditor, Dropzone, InsertPhotoRoundedIcon, styles, Slide, Fade, Lottie, AddRoundedIcon, FacebookIcon, InstagramIcon, ModeEditRoundedIcon, PersonAddRoundedIcon, PinterestIcon, TwitterIcon, YouTubeIcon, PersonRemoveRoundedIcon, _toConsumableArray, FilterAltRounded, MenuRoundedIcon, ViewModuleRoundedIcon, SettingsRounded, SortRoundedIcon, ChevronRightRoundedIcon, PersonRoundedIcon, SearchRoundedIcon, BookmarkRemoveOutlinedIcon, VisibilityOffRoundedIcon) { 'use strict';
|
|
6
6
|
|
|
7
7
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
8
8
|
|
|
@@ -1268,8 +1268,6 @@
|
|
|
1268
1268
|
LOVE: "https://cdn.blerp.com/blerp_products/Icons/Heart%403x.svg"
|
|
1269
1269
|
};
|
|
1270
1270
|
var Blerp$1 = function Blerp(_ref) {
|
|
1271
|
-
var _bite$image, _bite$image$original;
|
|
1272
|
-
|
|
1273
1271
|
var bite = _ref.bite,
|
|
1274
1272
|
title = _ref.title,
|
|
1275
1273
|
variantSize = _ref.variantSize,
|
|
@@ -1305,8 +1303,8 @@
|
|
|
1305
1303
|
|
|
1306
1304
|
var _useState3 = React.useState(null),
|
|
1307
1305
|
_useState4 = _slicedToArray__default['default'](_useState3, 2),
|
|
1308
|
-
profileColors = _useState4[0]
|
|
1309
|
-
|
|
1306
|
+
profileColors = _useState4[0];
|
|
1307
|
+
_useState4[1];
|
|
1310
1308
|
|
|
1311
1309
|
var _useState5 = React.useState(false),
|
|
1312
1310
|
_useState6 = _slicedToArray__default['default'](_useState5, 2),
|
|
@@ -1434,11 +1432,6 @@
|
|
|
1434
1432
|
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", ")") : "",
|
|
1435
1433
|
backgroundColor: isPremium && !profileColors && "grey5.override"
|
|
1436
1434
|
}
|
|
1437
|
-
}), /*#__PURE__*/React__default['default'].createElement(reactColorExtractor.ColorExtractor, {
|
|
1438
|
-
src: bite === null || bite === void 0 ? void 0 : (_bite$image = bite.image) === null || _bite$image === void 0 ? void 0 : (_bite$image$original = _bite$image.original) === null || _bite$image$original === void 0 ? void 0 : _bite$image$original.url,
|
|
1439
|
-
getColors: function getColors(colors) {
|
|
1440
|
-
return setProfileColors(colors);
|
|
1441
|
-
}
|
|
1442
1435
|
}), /*#__PURE__*/React__default['default'].createElement(BlerpTopRow, {
|
|
1443
1436
|
bite: bite,
|
|
1444
1437
|
isOwner: isOwner,
|
|
@@ -7388,7 +7381,7 @@
|
|
|
7388
7381
|
return props.collectionHovered ? "0.5" : "0";
|
|
7389
7382
|
});
|
|
7390
7383
|
var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
|
|
7391
|
-
var _collection$image, _collection$image$ori, _collection$image2, _collection$image2$or, _collection$
|
|
7384
|
+
var _collection$image, _collection$image$ori, _collection$image2, _collection$image2$or, _collection$ownerObje, _collection$ownerObje2, _collection$ownerObje3, _collection$image3, _collection$image3$or;
|
|
7392
7385
|
|
|
7393
7386
|
var collection = _ref.collection,
|
|
7394
7387
|
variantSize = _ref.variantSize,
|
|
@@ -7415,8 +7408,8 @@
|
|
|
7415
7408
|
|
|
7416
7409
|
var _useState = React.useState(null),
|
|
7417
7410
|
_useState2 = _slicedToArray__default['default'](_useState, 2),
|
|
7418
|
-
cardColors = _useState2[0]
|
|
7419
|
-
|
|
7411
|
+
cardColors = _useState2[0];
|
|
7412
|
+
_useState2[1];
|
|
7420
7413
|
|
|
7421
7414
|
var _useState3 = React.useState(false),
|
|
7422
7415
|
_useState4 = _slicedToArray__default['default'](_useState3, 2),
|
|
@@ -7458,15 +7451,7 @@
|
|
|
7458
7451
|
width: fluid ? "80%" : sizeParams.width,
|
|
7459
7452
|
height: fluid ? "80%" : sizeParams.height
|
|
7460
7453
|
}
|
|
7461
|
-
}, /*#__PURE__*/React__default['default'].createElement(
|
|
7462
|
-
style: {
|
|
7463
|
-
zIndex: "3"
|
|
7464
|
-
},
|
|
7465
|
-
src: collection === null || collection === void 0 ? void 0 : (_collection$image2 = collection.image) === null || _collection$image2 === void 0 ? void 0 : (_collection$image2$or = _collection$image2.original) === null || _collection$image2$or === void 0 ? void 0 : _collection$image2$or.url,
|
|
7466
|
-
getColors: function getColors(colors) {
|
|
7467
|
-
return setCardColors(colors);
|
|
7468
|
-
}
|
|
7469
|
-
}), /*#__PURE__*/React__default['default'].createElement(Box, {
|
|
7454
|
+
}, /*#__PURE__*/React__default['default'].createElement(Box, {
|
|
7470
7455
|
onClick: function onClick(e) {
|
|
7471
7456
|
e.stopPropagation();
|
|
7472
7457
|
if (handleClickBackground) handleClickBackground();
|
|
@@ -7539,7 +7524,7 @@
|
|
|
7539
7524
|
}
|
|
7540
7525
|
}), /*#__PURE__*/React__default['default'].createElement(Box, {
|
|
7541
7526
|
sx: {
|
|
7542
|
-
backgroundImage: "linear-gradient(".concat(data.vibrant || "#000000", "9a, #0000007a), url(").concat(collection === null || collection === void 0 ? void 0 : (_collection$
|
|
7527
|
+
backgroundImage: "linear-gradient(".concat(data.vibrant || "#000000", "9a, #0000007a), url(").concat(collection === null || collection === void 0 ? void 0 : (_collection$image2 = collection.image) === null || _collection$image2 === void 0 ? void 0 : (_collection$image2$or = _collection$image2.original) === null || _collection$image2$or === void 0 ? void 0 : _collection$image2$or.url, ")"),
|
|
7543
7528
|
backgroundSize: "cover",
|
|
7544
7529
|
backgroundPosition: "center",
|
|
7545
7530
|
backgroundRepeat: "no-repeat",
|
|
@@ -7859,7 +7844,7 @@
|
|
|
7859
7844
|
// What to display when variantSize === "small":
|
|
7860
7845
|
React__default['default'].createElement(Box, {
|
|
7861
7846
|
sx: {
|
|
7862
|
-
backgroundImage: "linear-gradient(".concat(cardColors ? cardColors[0] : "#000000", "7a, #0000004a), url(").concat(collection === null || collection === void 0 ? void 0 : (_collection$
|
|
7847
|
+
backgroundImage: "linear-gradient(".concat(cardColors ? cardColors[0] : "#000000", "7a, #0000004a), url(").concat(collection === null || collection === void 0 ? void 0 : (_collection$image3 = collection.image) === null || _collection$image3 === void 0 ? void 0 : (_collection$image3$or = _collection$image3.original) === null || _collection$image3$or === void 0 ? void 0 : _collection$image3$or.url, ")"),
|
|
7863
7848
|
backgroundSize: "cover",
|
|
7864
7849
|
backgroundPosition: "center",
|
|
7865
7850
|
backgroundRepeat: "no-repeat",
|
|
@@ -8258,7 +8243,7 @@
|
|
|
8258
8243
|
};
|
|
8259
8244
|
|
|
8260
8245
|
var UserProfileHeader = function UserProfileHeader(_ref) {
|
|
8261
|
-
var _userData$
|
|
8246
|
+
var _userData$headerImage, _userData$headerImage2, _userData$headerImage3, _userData$headerImage4, _userData$profileImag, _userData$profileImag2, _userData$socialLinks2;
|
|
8262
8247
|
|
|
8263
8248
|
var followUser = _ref.followUser,
|
|
8264
8249
|
isOwner = _ref.isOwner,
|
|
@@ -8268,8 +8253,8 @@
|
|
|
8268
8253
|
|
|
8269
8254
|
var _useState = React.useState(null),
|
|
8270
8255
|
_useState2 = _slicedToArray__default['default'](_useState, 2),
|
|
8271
|
-
profileColors = _useState2[0]
|
|
8272
|
-
|
|
8256
|
+
profileColors = _useState2[0];
|
|
8257
|
+
_useState2[1];
|
|
8273
8258
|
|
|
8274
8259
|
var size = useWindowSize();
|
|
8275
8260
|
|
|
@@ -8366,12 +8351,7 @@
|
|
|
8366
8351
|
});
|
|
8367
8352
|
};
|
|
8368
8353
|
|
|
8369
|
-
return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(
|
|
8370
|
-
src: userData === null || userData === void 0 ? void 0 : (_userData$profileImag = userData.profileImage) === null || _userData$profileImag === void 0 ? void 0 : (_userData$profileImag2 = _userData$profileImag.original) === null || _userData$profileImag2 === void 0 ? void 0 : _userData$profileImag2.url,
|
|
8371
|
-
getColors: function getColors(colors) {
|
|
8372
|
-
return setProfileColors(colors);
|
|
8373
|
-
}
|
|
8374
|
-
}), /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
8354
|
+
return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
8375
8355
|
width: "100%",
|
|
8376
8356
|
sx: {
|
|
8377
8357
|
height: "250px",
|
|
@@ -8461,7 +8441,7 @@
|
|
|
8461
8441
|
margin: "0 20px"
|
|
8462
8442
|
},
|
|
8463
8443
|
alt: "profile img",
|
|
8464
|
-
src: userData === null || userData === void 0 ? void 0 : (_userData$
|
|
8444
|
+
src: userData === null || userData === void 0 ? void 0 : (_userData$profileImag = userData.profileImage) === null || _userData$profileImag === void 0 ? void 0 : (_userData$profileImag2 = _userData$profileImag.original) === null || _userData$profileImag2 === void 0 ? void 0 : _userData$profileImag2.url
|
|
8465
8445
|
}), /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
8466
8446
|
marginLeft: "20px"
|
|
8467
8447
|
}, /*#__PURE__*/React__default['default'].createElement(Stack, {
|
package/package.json
CHANGED
|
@@ -1,25 +1,25 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@blerp/design",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.1",
|
|
4
4
|
"description": "Blerp UI",
|
|
5
5
|
"main": "dist/index.cjs.js",
|
|
6
6
|
"scripts": {
|
|
7
7
|
"build": "rollup -c"
|
|
8
8
|
},
|
|
9
9
|
"peerDependencies": {
|
|
10
|
-
"react": "
|
|
11
|
-
"react-dom": "
|
|
10
|
+
"react": "18.2.0",
|
|
11
|
+
"react-dom": "18.2.0"
|
|
12
12
|
},
|
|
13
13
|
"dependencies": {
|
|
14
14
|
"@babel/runtime": "^7.14.0",
|
|
15
|
-
"@mui/icons-material": "
|
|
16
|
-
"@mui/material": "
|
|
15
|
+
"@mui/icons-material": "5.10.16",
|
|
16
|
+
"@mui/material": "5.10.16",
|
|
17
17
|
"@mui/styled-engine": "npm:@mui/styled-engine-sc@latest",
|
|
18
|
-
"@mui/styled-engine-sc": "
|
|
18
|
+
"@mui/styled-engine-sc": "5.10.16",
|
|
19
19
|
"autoprefixer": "^10.3.4",
|
|
20
20
|
"react-avatar-editor": "13.0.0",
|
|
21
21
|
"react-color-extractor": "^1.1.2",
|
|
22
|
-
"react-dropzone": "
|
|
22
|
+
"react-dropzone": "14.2.3",
|
|
23
23
|
"react-lottie": "^1.2.3",
|
|
24
24
|
"react-palette": "^1.0.2",
|
|
25
25
|
"styled-components": "5.3.6"
|