@blerp/design 1.2.48 → 1.2.50
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 +96 -38
- package/dist/index.esm.js +94 -37
- package/dist/index.umd.js +98 -41
- package/package.json +1 -1
package/dist/index.cjs.js
CHANGED
|
@@ -18,6 +18,8 @@ var FavoriteBorderIcon = require('@mui/icons-material/FavoriteBorder');
|
|
|
18
18
|
var PauseRoundedIcon = require('@mui/icons-material/PauseRounded');
|
|
19
19
|
var PlayArrowRoundedIcon = require('@mui/icons-material/PlayArrowRounded');
|
|
20
20
|
var WarningRoundedIcon = require('@mui/icons-material/WarningRounded');
|
|
21
|
+
var VisibilityOffRoundedIcon = require('@mui/icons-material/VisibilityOffRounded');
|
|
22
|
+
var VisibilityRoundedIcon = require('@mui/icons-material/VisibilityRounded');
|
|
21
23
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
22
24
|
var _asyncToGenerator = require('@babel/runtime/helpers/asyncToGenerator');
|
|
23
25
|
var _regeneratorRuntime = require('@babel/runtime/regenerator');
|
|
@@ -56,7 +58,6 @@ var ChevronRightRoundedIcon = require('@mui/icons-material/ChevronRightRounded')
|
|
|
56
58
|
var PersonRoundedIcon = require('@mui/icons-material/PersonRounded');
|
|
57
59
|
var SearchRoundedIcon = require('@mui/icons-material/SearchRounded');
|
|
58
60
|
var BookmarkRemoveOutlinedIcon = require('@mui/icons-material/BookmarkRemoveOutlined');
|
|
59
|
-
var VisibilityOffRoundedIcon = require('@mui/icons-material/VisibilityOffRounded');
|
|
60
61
|
|
|
61
62
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
62
63
|
|
|
@@ -94,6 +95,8 @@ var FavoriteBorderIcon__default = /*#__PURE__*/_interopDefaultLegacy(FavoriteBor
|
|
|
94
95
|
var PauseRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(PauseRoundedIcon);
|
|
95
96
|
var PlayArrowRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(PlayArrowRoundedIcon);
|
|
96
97
|
var WarningRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(WarningRoundedIcon);
|
|
98
|
+
var VisibilityOffRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(VisibilityOffRoundedIcon);
|
|
99
|
+
var VisibilityRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(VisibilityRoundedIcon);
|
|
97
100
|
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
98
101
|
var _asyncToGenerator__default = /*#__PURE__*/_interopDefaultLegacy(_asyncToGenerator);
|
|
99
102
|
var _regeneratorRuntime__default = /*#__PURE__*/_interopDefaultLegacy(_regeneratorRuntime);
|
|
@@ -128,7 +131,6 @@ var ChevronRightRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(Chevro
|
|
|
128
131
|
var PersonRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(PersonRoundedIcon);
|
|
129
132
|
var SearchRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(SearchRoundedIcon);
|
|
130
133
|
var BookmarkRemoveOutlinedIcon__default = /*#__PURE__*/_interopDefaultLegacy(BookmarkRemoveOutlinedIcon);
|
|
131
|
-
var VisibilityOffRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(VisibilityOffRoundedIcon);
|
|
132
134
|
|
|
133
135
|
var _templateObject$j, _templateObject2$b, _templateObject3$9, _templateObject4$7;
|
|
134
136
|
var BlerpImage$3 = styled__default['default'].div(_templateObject$j || (_templateObject$j = _taggedTemplateLiteral__default['default'](["\n height: 150px;\n width: 150px;\n background-image: url(", ");\n background-size: cover;\n border-radius: 50%;\n position: relative;\n transition: 0.2s;\n\n &:hover {\n transform: scale(1.1);\n }\n"])), function (props) {
|
|
@@ -1570,13 +1572,18 @@ Blerp$1.propTypes = {
|
|
|
1570
1572
|
};
|
|
1571
1573
|
|
|
1572
1574
|
var UserCard$1 = function UserCard(_ref) {
|
|
1573
|
-
var _user$twitchChannelIn, _user$twitchChannelIn2, _user$twitchChannelIn3, _user$twitchChannelIn4, _user$
|
|
1575
|
+
var _user$twitchChannelIn, _user$twitchChannelIn2, _user$twitchChannelIn3, _user$twitchChannelIn4, _user$twitchChannelIn5, _user$profileImage, _user$profileImage$or, _user$twitchChannelIn6;
|
|
1574
1576
|
|
|
1575
1577
|
var user = _ref.user,
|
|
1576
1578
|
onUsernameClick = _ref.onUsernameClick,
|
|
1577
1579
|
onFollowerClick = _ref.onFollowerClick,
|
|
1578
1580
|
onCreatedClick = _ref.onCreatedClick,
|
|
1579
1581
|
collapsed = _ref.collapsed;
|
|
1582
|
+
var formatter = Intl.NumberFormat("en", {
|
|
1583
|
+
notation: "compact"
|
|
1584
|
+
});
|
|
1585
|
+
var followerCount = formatter.format((user === null || user === void 0 ? void 0 : (_user$twitchChannelIn = user.twitchChannelInfo) === null || _user$twitchChannelIn === void 0 ? void 0 : _user$twitchChannelIn.followerCount) || 0);
|
|
1586
|
+
var createdCount = formatter.format((user === null || user === void 0 ? void 0 : user.totalCreationCount) || 0);
|
|
1580
1587
|
return /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
1581
1588
|
direction: "row",
|
|
1582
1589
|
sx: {
|
|
@@ -1590,7 +1597,7 @@ var UserCard$1 = function UserCard(_ref) {
|
|
|
1590
1597
|
boxSizing: "border-box",
|
|
1591
1598
|
justifyContent: "space-around",
|
|
1592
1599
|
border: "1px solid transparent",
|
|
1593
|
-
borderColor: collapsed ? (user === null || user === void 0 ? void 0 : (_user$
|
|
1600
|
+
borderColor: collapsed ? (user === null || user === void 0 ? void 0 : (_user$twitchChannelIn2 = user.twitchChannelInfo) === null || _user$twitchChannelIn2 === void 0 ? void 0 : _user$twitchChannelIn2.twitchJourneyStatus) === "CHAMPION" ? "#FFFFFF" : (user === null || user === void 0 ? void 0 : (_user$twitchChannelIn3 = user.twitchChannelInfo) === null || _user$twitchChannelIn3 === void 0 ? void 0 : _user$twitchChannelIn3.twitchJourneyStatus) === "AFFILIATE" ? "#27AAFF" : "transparent" : "transparent"
|
|
1594
1601
|
}
|
|
1595
1602
|
}, /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
1596
1603
|
sx: {
|
|
@@ -1602,13 +1609,13 @@ var UserCard$1 = function UserCard(_ref) {
|
|
|
1602
1609
|
height: collapsed ? "49px" : "89px",
|
|
1603
1610
|
borderRadius: "50%",
|
|
1604
1611
|
border: "2px solid transparent",
|
|
1605
|
-
borderColor: collapsed ? "transparent" : (user === null || user === void 0 ? void 0 : (_user$
|
|
1612
|
+
borderColor: collapsed ? "transparent" : (user === null || user === void 0 ? void 0 : (_user$twitchChannelIn4 = user.twitchChannelInfo) === null || _user$twitchChannelIn4 === void 0 ? void 0 : _user$twitchChannelIn4.twitchJourneyStatus) === "CHAMPION" ? "#FFFFFF" : (user === null || user === void 0 ? void 0 : (_user$twitchChannelIn5 = user.twitchChannelInfo) === null || _user$twitchChannelIn5 === void 0 ? void 0 : _user$twitchChannelIn5.twitchJourneyStatus) === "AFFILIATE" ? "#27AAFF" : "transparent",
|
|
1606
1613
|
padding: collapsed ? "3px" : "6px",
|
|
1607
1614
|
boxSizing: "border-box"
|
|
1608
1615
|
},
|
|
1609
1616
|
src: (user === null || user === void 0 ? void 0 : (_user$profileImage = user.profileImage) === null || _user$profileImage === void 0 ? void 0 : (_user$profileImage$or = _user$profileImage.original) === null || _user$profileImage$or === void 0 ? void 0 : _user$profileImage$or.url) || "https://cdn.blerp.com/blerp_products/Icons/Account-White.svg",
|
|
1610
1617
|
alt: "profile"
|
|
1611
|
-
}), (user === null || user === void 0 ? void 0 : (_user$
|
|
1618
|
+
}), (user === null || user === void 0 ? void 0 : (_user$twitchChannelIn6 = user.twitchChannelInfo) === null || _user$twitchChannelIn6 === void 0 ? void 0 : _user$twitchChannelIn6.broadcasterType) === "partner" && /*#__PURE__*/React__default['default'].createElement(iconsMaterial.VerifiedRounded, {
|
|
1612
1619
|
sx: {
|
|
1613
1620
|
position: "absolute",
|
|
1614
1621
|
bottom: collapsed ? "0" : "5px",
|
|
@@ -1656,48 +1663,36 @@ var UserCard$1 = function UserCard(_ref) {
|
|
|
1656
1663
|
}, /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
1657
1664
|
alignItems: "center",
|
|
1658
1665
|
sx: {
|
|
1659
|
-
cursor: "
|
|
1660
|
-
transition: "0.3s",
|
|
1661
|
-
"&:hover": {
|
|
1662
|
-
textDecoration: "underline"
|
|
1663
|
-
}
|
|
1666
|
+
cursor: "pointer"
|
|
1664
1667
|
},
|
|
1665
1668
|
onClick: onFollowerClick
|
|
1666
1669
|
}, /*#__PURE__*/React__default['default'].createElement(Text, {
|
|
1667
1670
|
sx: {
|
|
1668
1671
|
fontSize: "14px",
|
|
1669
|
-
fontWeight: "400"
|
|
1670
|
-
cursor: "inherit"
|
|
1672
|
+
fontWeight: "400"
|
|
1671
1673
|
}
|
|
1672
|
-
},
|
|
1674
|
+
}, followerCount), /*#__PURE__*/React__default['default'].createElement(Text, {
|
|
1673
1675
|
sx: {
|
|
1674
1676
|
fontSize: "12px",
|
|
1675
1677
|
fontWeight: "300",
|
|
1676
|
-
color: "grey7.main"
|
|
1677
|
-
cursor: "inherit"
|
|
1678
|
+
color: "grey7.main"
|
|
1678
1679
|
}
|
|
1679
1680
|
}, "followers")), /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
1680
1681
|
alignItems: "center",
|
|
1681
1682
|
sx: {
|
|
1682
|
-
cursor: "
|
|
1683
|
-
transition: "0.3s",
|
|
1684
|
-
"&:hover": {
|
|
1685
|
-
textDecoration: "underline"
|
|
1686
|
-
}
|
|
1683
|
+
cursor: "pointer"
|
|
1687
1684
|
},
|
|
1688
1685
|
onClick: onCreatedClick
|
|
1689
1686
|
}, /*#__PURE__*/React__default['default'].createElement(Text, {
|
|
1690
1687
|
sx: {
|
|
1691
1688
|
fontSize: "14px",
|
|
1692
|
-
fontWeight: "400"
|
|
1693
|
-
cursor: "inherit"
|
|
1689
|
+
fontWeight: "400"
|
|
1694
1690
|
}
|
|
1695
|
-
},
|
|
1691
|
+
}, createdCount), /*#__PURE__*/React__default['default'].createElement(Text, {
|
|
1696
1692
|
sx: {
|
|
1697
1693
|
fontSize: "12px",
|
|
1698
1694
|
fontWeight: "300",
|
|
1699
|
-
color: "grey7.main"
|
|
1700
|
-
cursor: "inherit"
|
|
1695
|
+
color: "grey7.main"
|
|
1701
1696
|
}
|
|
1702
1697
|
}, "created")))));
|
|
1703
1698
|
};
|
|
@@ -1710,7 +1705,9 @@ var UsernameWithPopout$1 = function UsernameWithPopout(_ref) {
|
|
|
1710
1705
|
onUsernameClick = _ref.onUsernameClick,
|
|
1711
1706
|
onFollowerClick = _ref.onFollowerClick,
|
|
1712
1707
|
onCreatedClick = _ref.onCreatedClick,
|
|
1713
|
-
textStyle = _ref.textStyle
|
|
1708
|
+
textStyle = _ref.textStyle,
|
|
1709
|
+
_ref$collapsed = _ref.collapsed,
|
|
1710
|
+
collapsed = _ref$collapsed === void 0 ? true : _ref$collapsed;
|
|
1714
1711
|
|
|
1715
1712
|
var _useState = React.useState(null),
|
|
1716
1713
|
_useState2 = _slicedToArray__default['default'](_useState, 2),
|
|
@@ -1767,7 +1764,7 @@ var UsernameWithPopout$1 = function UsernameWithPopout(_ref) {
|
|
|
1767
1764
|
onUsernameClick: onUsernameClick,
|
|
1768
1765
|
onFollowerClick: onFollowerClick,
|
|
1769
1766
|
onCreatedClick: onCreatedClick,
|
|
1770
|
-
collapsed:
|
|
1767
|
+
collapsed: collapsed,
|
|
1771
1768
|
user: user
|
|
1772
1769
|
})), /*#__PURE__*/React__default['default'].createElement(Text, {
|
|
1773
1770
|
sx: _objectSpread$6({
|
|
@@ -1814,8 +1811,9 @@ var FavoriteIconWithCounter = function FavoriteIconWithCounter(_ref) {
|
|
|
1814
1811
|
marginRight: "6px",
|
|
1815
1812
|
transition: "0.3s",
|
|
1816
1813
|
cursor: "pointer",
|
|
1814
|
+
opacity: 0.5,
|
|
1817
1815
|
"&:hover": {
|
|
1818
|
-
opacity:
|
|
1816
|
+
opacity: 1
|
|
1819
1817
|
}
|
|
1820
1818
|
}
|
|
1821
1819
|
}) : /*#__PURE__*/React__default['default'].createElement(FavoriteBorderIcon__default['default'], {
|
|
@@ -1824,8 +1822,9 @@ var FavoriteIconWithCounter = function FavoriteIconWithCounter(_ref) {
|
|
|
1824
1822
|
marginRight: "6px",
|
|
1825
1823
|
transition: "0.3s",
|
|
1826
1824
|
cursor: "pointer",
|
|
1825
|
+
opacity: 0.5,
|
|
1827
1826
|
"&:hover": {
|
|
1828
|
-
opacity:
|
|
1827
|
+
opacity: 1
|
|
1829
1828
|
}
|
|
1830
1829
|
}
|
|
1831
1830
|
}), /*#__PURE__*/React__default['default'].createElement(Text, {
|
|
@@ -1921,7 +1920,33 @@ var RatingInfo = function RatingInfo(_ref4) {
|
|
|
1921
1920
|
return /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
1922
1921
|
direction: "row",
|
|
1923
1922
|
alignItems: "center"
|
|
1924
|
-
}, bite === null || bite === void 0 ? void 0 :
|
|
1923
|
+
}, (bite === null || bite === void 0 ? void 0 : bite.visibility) === "PRIVATE" && /*#__PURE__*/React__default['default'].createElement(Tooltip, {
|
|
1924
|
+
title: "Private"
|
|
1925
|
+
}, /*#__PURE__*/React__default['default'].createElement(VisibilityOffRoundedIcon__default['default'], {
|
|
1926
|
+
sx: {
|
|
1927
|
+
fontSize: "15px",
|
|
1928
|
+
fontWeight: "600",
|
|
1929
|
+
backgroundColor: "#585858a3",
|
|
1930
|
+
border: "4px solid transparent",
|
|
1931
|
+
borderColor: "#585858a3",
|
|
1932
|
+
borderRadius: "4px",
|
|
1933
|
+
color: "whiteOverride.main",
|
|
1934
|
+
marginBottom: "12px"
|
|
1935
|
+
}
|
|
1936
|
+
})), (bite === null || bite === void 0 ? void 0 : bite.visibility) === "UNLISTED" && /*#__PURE__*/React__default['default'].createElement(Tooltip, {
|
|
1937
|
+
title: "Unlisted"
|
|
1938
|
+
}, /*#__PURE__*/React__default['default'].createElement(VisibilityRoundedIcon__default['default'], {
|
|
1939
|
+
sx: {
|
|
1940
|
+
fontSize: "15px",
|
|
1941
|
+
fontWeight: "600",
|
|
1942
|
+
backgroundColor: "#585858a3",
|
|
1943
|
+
border: "4px solid transparent",
|
|
1944
|
+
borderColor: "#585858a3",
|
|
1945
|
+
borderRadius: "4px",
|
|
1946
|
+
color: "whiteOverride.main",
|
|
1947
|
+
marginBottom: "12px"
|
|
1948
|
+
}
|
|
1949
|
+
})), bite === null || bite === void 0 ? void 0 : (_bite$newAudienceRati2 = bite.newAudienceRating) === null || _bite$newAudienceRati2 === void 0 ? void 0 : _bite$newAudienceRati2.map(function (rating) {
|
|
1925
1950
|
if (rating === "SAFE") {
|
|
1926
1951
|
// nothing
|
|
1927
1952
|
return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null);
|
|
@@ -1965,10 +1990,39 @@ var RatingInfo = function RatingInfo(_ref4) {
|
|
|
1965
1990
|
}
|
|
1966
1991
|
|
|
1967
1992
|
if (!ratingText.tooltipText) return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null);
|
|
1968
|
-
return /*#__PURE__*/React__default['default'].createElement(
|
|
1993
|
+
return /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
1994
|
+
direction: "row",
|
|
1995
|
+
alignItems: "center"
|
|
1996
|
+
}, (bite === null || bite === void 0 ? void 0 : bite.visibility) === "PRIVATE" && /*#__PURE__*/React__default['default'].createElement(Tooltip, {
|
|
1997
|
+
title: "Private"
|
|
1998
|
+
}, /*#__PURE__*/React__default['default'].createElement(VisibilityOffRoundedIcon__default['default'], {
|
|
1999
|
+
sx: {
|
|
2000
|
+
fontSize: "15px",
|
|
2001
|
+
fontWeight: "600",
|
|
2002
|
+
backgroundColor: "#585858a3",
|
|
2003
|
+
border: "4px solid transparent",
|
|
2004
|
+
borderColor: "#585858a3",
|
|
2005
|
+
borderRadius: "4px",
|
|
2006
|
+
color: "whiteOverride.main",
|
|
2007
|
+
marginBottom: "12px"
|
|
2008
|
+
}
|
|
2009
|
+
})), (bite === null || bite === void 0 ? void 0 : bite.visibility) === "UNLISTED" && /*#__PURE__*/React__default['default'].createElement(Tooltip, {
|
|
2010
|
+
title: "Unlisted"
|
|
2011
|
+
}, /*#__PURE__*/React__default['default'].createElement(VisibilityRoundedIcon__default['default'], {
|
|
2012
|
+
sx: {
|
|
2013
|
+
fontSize: "15px",
|
|
2014
|
+
fontWeight: "600",
|
|
2015
|
+
backgroundColor: "#585858a3",
|
|
2016
|
+
border: "4px solid transparent",
|
|
2017
|
+
borderColor: "#585858a3",
|
|
2018
|
+
borderRadius: "4px",
|
|
2019
|
+
color: "whiteOverride.main",
|
|
2020
|
+
marginBottom: "12px"
|
|
2021
|
+
}
|
|
2022
|
+
})), /*#__PURE__*/React__default['default'].createElement(RatingInfoItem, {
|
|
1969
2023
|
tooltipText: ratingText.tooltipText,
|
|
1970
2024
|
displayText: ratingText.text
|
|
1971
|
-
});
|
|
2025
|
+
}));
|
|
1972
2026
|
};
|
|
1973
2027
|
|
|
1974
2028
|
var ReportedWarning = function ReportedWarning(_ref5) {
|
|
@@ -2347,14 +2401,15 @@ var NewBlerp$1 = function NewBlerp(_ref7) {
|
|
|
2347
2401
|
display: "flex",
|
|
2348
2402
|
alignItems: "flex-end",
|
|
2349
2403
|
justifyContent: "center",
|
|
2350
|
-
background: "linear-gradient(270deg, rgba(40,50,51,1) 40%, rgba(0,0,0,0) 100%)"
|
|
2404
|
+
background: bite !== null && bite !== void 0 && bite.isPremium ? "linear-gradient(270deg, rgb(49 62 65) 40%, rgba(0,0,0,0) 100%)" : "linear-gradient(270deg, rgba(40,50,51,1) 40%, rgba(0,0,0,0) 100%)"
|
|
2351
2405
|
}
|
|
2352
2406
|
}, renderThreeDot())), /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
2353
2407
|
direction: "row",
|
|
2354
2408
|
alignItems: "center",
|
|
2355
2409
|
sx: {
|
|
2356
2410
|
width: "100%",
|
|
2357
|
-
justifyContent: "start"
|
|
2411
|
+
justifyContent: "start",
|
|
2412
|
+
postion: "relative"
|
|
2358
2413
|
}
|
|
2359
2414
|
}, (bite === null || bite === void 0 ? void 0 : bite.isPremium) && /*#__PURE__*/React__default['default'].createElement(DiamondIcon, {
|
|
2360
2415
|
sx: {
|
|
@@ -2421,14 +2476,17 @@ var NewBlerp$1 = function NewBlerp(_ref7) {
|
|
|
2421
2476
|
onClick: onFavoriteClick
|
|
2422
2477
|
}), /*#__PURE__*/React__default['default'].createElement(UsernameWithPopout$1, {
|
|
2423
2478
|
onUsernameClick: onUsernameClick,
|
|
2424
|
-
user: bite === null || bite === void 0 ? void 0 : bite.ownerObject
|
|
2479
|
+
user: bite === null || bite === void 0 ? void 0 : bite.ownerObject,
|
|
2480
|
+
collapsed: false
|
|
2425
2481
|
}), /*#__PURE__*/React__default['default'].createElement(Text, {
|
|
2426
2482
|
sx: {
|
|
2427
2483
|
fontWeight: "300",
|
|
2428
2484
|
fontSize: "12px",
|
|
2429
|
-
color: "grey7.main"
|
|
2485
|
+
color: "grey7.main",
|
|
2486
|
+
position: "absolute",
|
|
2487
|
+
right: "12px"
|
|
2430
2488
|
}
|
|
2431
|
-
}, ((bite === null || bite === void 0 ? void 0 : bite.audioDuration) / 1000).toFixed(0), "s")))));
|
|
2489
|
+
}, (((bite === null || bite === void 0 ? void 0 : bite.audioDuration) || 1) / 1000).toFixed(0), "s")))));
|
|
2432
2490
|
};
|
|
2433
2491
|
|
|
2434
2492
|
var _templateObject$f;
|
package/dist/index.esm.js
CHANGED
|
@@ -15,6 +15,8 @@ import FavoriteBorderIcon from '@mui/icons-material/FavoriteBorder';
|
|
|
15
15
|
import PauseRoundedIcon from '@mui/icons-material/PauseRounded';
|
|
16
16
|
import PlayArrowRoundedIcon from '@mui/icons-material/PlayArrowRounded';
|
|
17
17
|
import WarningRoundedIcon from '@mui/icons-material/WarningRounded';
|
|
18
|
+
import VisibilityOffRoundedIcon from '@mui/icons-material/VisibilityOffRounded';
|
|
19
|
+
import VisibilityRoundedIcon from '@mui/icons-material/VisibilityRounded';
|
|
18
20
|
import _defineProperty from '@babel/runtime/helpers/defineProperty';
|
|
19
21
|
import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
|
|
20
22
|
import _regeneratorRuntime from '@babel/runtime/regenerator';
|
|
@@ -53,7 +55,6 @@ import ChevronRightRoundedIcon from '@mui/icons-material/ChevronRightRounded';
|
|
|
53
55
|
import PersonRoundedIcon from '@mui/icons-material/PersonRounded';
|
|
54
56
|
import SearchRoundedIcon from '@mui/icons-material/SearchRounded';
|
|
55
57
|
import BookmarkRemoveOutlinedIcon from '@mui/icons-material/BookmarkRemoveOutlined';
|
|
56
|
-
import VisibilityOffRoundedIcon from '@mui/icons-material/VisibilityOffRounded';
|
|
57
58
|
|
|
58
59
|
var _templateObject$j, _templateObject2$b, _templateObject3$9, _templateObject4$7;
|
|
59
60
|
var BlerpImage$3 = styled.div(_templateObject$j || (_templateObject$j = _taggedTemplateLiteral(["\n height: 150px;\n width: 150px;\n background-image: url(", ");\n background-size: cover;\n border-radius: 50%;\n position: relative;\n transition: 0.2s;\n\n &:hover {\n transform: scale(1.1);\n }\n"])), function (props) {
|
|
@@ -1495,13 +1496,18 @@ Blerp$1.propTypes = {
|
|
|
1495
1496
|
};
|
|
1496
1497
|
|
|
1497
1498
|
var UserCard$1 = function UserCard(_ref) {
|
|
1498
|
-
var _user$twitchChannelIn, _user$twitchChannelIn2, _user$twitchChannelIn3, _user$twitchChannelIn4, _user$
|
|
1499
|
+
var _user$twitchChannelIn, _user$twitchChannelIn2, _user$twitchChannelIn3, _user$twitchChannelIn4, _user$twitchChannelIn5, _user$profileImage, _user$profileImage$or, _user$twitchChannelIn6;
|
|
1499
1500
|
|
|
1500
1501
|
var user = _ref.user,
|
|
1501
1502
|
onUsernameClick = _ref.onUsernameClick,
|
|
1502
1503
|
onFollowerClick = _ref.onFollowerClick,
|
|
1503
1504
|
onCreatedClick = _ref.onCreatedClick,
|
|
1504
1505
|
collapsed = _ref.collapsed;
|
|
1506
|
+
var formatter = Intl.NumberFormat("en", {
|
|
1507
|
+
notation: "compact"
|
|
1508
|
+
});
|
|
1509
|
+
var followerCount = formatter.format((user === null || user === void 0 ? void 0 : (_user$twitchChannelIn = user.twitchChannelInfo) === null || _user$twitchChannelIn === void 0 ? void 0 : _user$twitchChannelIn.followerCount) || 0);
|
|
1510
|
+
var createdCount = formatter.format((user === null || user === void 0 ? void 0 : user.totalCreationCount) || 0);
|
|
1505
1511
|
return /*#__PURE__*/React__default.createElement(Stack, {
|
|
1506
1512
|
direction: "row",
|
|
1507
1513
|
sx: {
|
|
@@ -1515,7 +1521,7 @@ var UserCard$1 = function UserCard(_ref) {
|
|
|
1515
1521
|
boxSizing: "border-box",
|
|
1516
1522
|
justifyContent: "space-around",
|
|
1517
1523
|
border: "1px solid transparent",
|
|
1518
|
-
borderColor: collapsed ? (user === null || user === void 0 ? void 0 : (_user$
|
|
1524
|
+
borderColor: collapsed ? (user === null || user === void 0 ? void 0 : (_user$twitchChannelIn2 = user.twitchChannelInfo) === null || _user$twitchChannelIn2 === void 0 ? void 0 : _user$twitchChannelIn2.twitchJourneyStatus) === "CHAMPION" ? "#FFFFFF" : (user === null || user === void 0 ? void 0 : (_user$twitchChannelIn3 = user.twitchChannelInfo) === null || _user$twitchChannelIn3 === void 0 ? void 0 : _user$twitchChannelIn3.twitchJourneyStatus) === "AFFILIATE" ? "#27AAFF" : "transparent" : "transparent"
|
|
1519
1525
|
}
|
|
1520
1526
|
}, /*#__PURE__*/React__default.createElement(Stack, {
|
|
1521
1527
|
sx: {
|
|
@@ -1527,13 +1533,13 @@ var UserCard$1 = function UserCard(_ref) {
|
|
|
1527
1533
|
height: collapsed ? "49px" : "89px",
|
|
1528
1534
|
borderRadius: "50%",
|
|
1529
1535
|
border: "2px solid transparent",
|
|
1530
|
-
borderColor: collapsed ? "transparent" : (user === null || user === void 0 ? void 0 : (_user$
|
|
1536
|
+
borderColor: collapsed ? "transparent" : (user === null || user === void 0 ? void 0 : (_user$twitchChannelIn4 = user.twitchChannelInfo) === null || _user$twitchChannelIn4 === void 0 ? void 0 : _user$twitchChannelIn4.twitchJourneyStatus) === "CHAMPION" ? "#FFFFFF" : (user === null || user === void 0 ? void 0 : (_user$twitchChannelIn5 = user.twitchChannelInfo) === null || _user$twitchChannelIn5 === void 0 ? void 0 : _user$twitchChannelIn5.twitchJourneyStatus) === "AFFILIATE" ? "#27AAFF" : "transparent",
|
|
1531
1537
|
padding: collapsed ? "3px" : "6px",
|
|
1532
1538
|
boxSizing: "border-box"
|
|
1533
1539
|
},
|
|
1534
1540
|
src: (user === null || user === void 0 ? void 0 : (_user$profileImage = user.profileImage) === null || _user$profileImage === void 0 ? void 0 : (_user$profileImage$or = _user$profileImage.original) === null || _user$profileImage$or === void 0 ? void 0 : _user$profileImage$or.url) || "https://cdn.blerp.com/blerp_products/Icons/Account-White.svg",
|
|
1535
1541
|
alt: "profile"
|
|
1536
|
-
}), (user === null || user === void 0 ? void 0 : (_user$
|
|
1542
|
+
}), (user === null || user === void 0 ? void 0 : (_user$twitchChannelIn6 = user.twitchChannelInfo) === null || _user$twitchChannelIn6 === void 0 ? void 0 : _user$twitchChannelIn6.broadcasterType) === "partner" && /*#__PURE__*/React__default.createElement(VerifiedRounded, {
|
|
1537
1543
|
sx: {
|
|
1538
1544
|
position: "absolute",
|
|
1539
1545
|
bottom: collapsed ? "0" : "5px",
|
|
@@ -1581,48 +1587,36 @@ var UserCard$1 = function UserCard(_ref) {
|
|
|
1581
1587
|
}, /*#__PURE__*/React__default.createElement(Stack, {
|
|
1582
1588
|
alignItems: "center",
|
|
1583
1589
|
sx: {
|
|
1584
|
-
cursor: "
|
|
1585
|
-
transition: "0.3s",
|
|
1586
|
-
"&:hover": {
|
|
1587
|
-
textDecoration: "underline"
|
|
1588
|
-
}
|
|
1590
|
+
cursor: "pointer"
|
|
1589
1591
|
},
|
|
1590
1592
|
onClick: onFollowerClick
|
|
1591
1593
|
}, /*#__PURE__*/React__default.createElement(Text, {
|
|
1592
1594
|
sx: {
|
|
1593
1595
|
fontSize: "14px",
|
|
1594
|
-
fontWeight: "400"
|
|
1595
|
-
cursor: "inherit"
|
|
1596
|
+
fontWeight: "400"
|
|
1596
1597
|
}
|
|
1597
|
-
},
|
|
1598
|
+
}, followerCount), /*#__PURE__*/React__default.createElement(Text, {
|
|
1598
1599
|
sx: {
|
|
1599
1600
|
fontSize: "12px",
|
|
1600
1601
|
fontWeight: "300",
|
|
1601
|
-
color: "grey7.main"
|
|
1602
|
-
cursor: "inherit"
|
|
1602
|
+
color: "grey7.main"
|
|
1603
1603
|
}
|
|
1604
1604
|
}, "followers")), /*#__PURE__*/React__default.createElement(Stack, {
|
|
1605
1605
|
alignItems: "center",
|
|
1606
1606
|
sx: {
|
|
1607
|
-
cursor: "
|
|
1608
|
-
transition: "0.3s",
|
|
1609
|
-
"&:hover": {
|
|
1610
|
-
textDecoration: "underline"
|
|
1611
|
-
}
|
|
1607
|
+
cursor: "pointer"
|
|
1612
1608
|
},
|
|
1613
1609
|
onClick: onCreatedClick
|
|
1614
1610
|
}, /*#__PURE__*/React__default.createElement(Text, {
|
|
1615
1611
|
sx: {
|
|
1616
1612
|
fontSize: "14px",
|
|
1617
|
-
fontWeight: "400"
|
|
1618
|
-
cursor: "inherit"
|
|
1613
|
+
fontWeight: "400"
|
|
1619
1614
|
}
|
|
1620
|
-
},
|
|
1615
|
+
}, createdCount), /*#__PURE__*/React__default.createElement(Text, {
|
|
1621
1616
|
sx: {
|
|
1622
1617
|
fontSize: "12px",
|
|
1623
1618
|
fontWeight: "300",
|
|
1624
|
-
color: "grey7.main"
|
|
1625
|
-
cursor: "inherit"
|
|
1619
|
+
color: "grey7.main"
|
|
1626
1620
|
}
|
|
1627
1621
|
}, "created")))));
|
|
1628
1622
|
};
|
|
@@ -1635,7 +1629,9 @@ var UsernameWithPopout$1 = function UsernameWithPopout(_ref) {
|
|
|
1635
1629
|
onUsernameClick = _ref.onUsernameClick,
|
|
1636
1630
|
onFollowerClick = _ref.onFollowerClick,
|
|
1637
1631
|
onCreatedClick = _ref.onCreatedClick,
|
|
1638
|
-
textStyle = _ref.textStyle
|
|
1632
|
+
textStyle = _ref.textStyle,
|
|
1633
|
+
_ref$collapsed = _ref.collapsed,
|
|
1634
|
+
collapsed = _ref$collapsed === void 0 ? true : _ref$collapsed;
|
|
1639
1635
|
|
|
1640
1636
|
var _useState = useState(null),
|
|
1641
1637
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -1692,7 +1688,7 @@ var UsernameWithPopout$1 = function UsernameWithPopout(_ref) {
|
|
|
1692
1688
|
onUsernameClick: onUsernameClick,
|
|
1693
1689
|
onFollowerClick: onFollowerClick,
|
|
1694
1690
|
onCreatedClick: onCreatedClick,
|
|
1695
|
-
collapsed:
|
|
1691
|
+
collapsed: collapsed,
|
|
1696
1692
|
user: user
|
|
1697
1693
|
})), /*#__PURE__*/React__default.createElement(Text, {
|
|
1698
1694
|
sx: _objectSpread$6({
|
|
@@ -1739,8 +1735,9 @@ var FavoriteIconWithCounter = function FavoriteIconWithCounter(_ref) {
|
|
|
1739
1735
|
marginRight: "6px",
|
|
1740
1736
|
transition: "0.3s",
|
|
1741
1737
|
cursor: "pointer",
|
|
1738
|
+
opacity: 0.5,
|
|
1742
1739
|
"&:hover": {
|
|
1743
|
-
opacity:
|
|
1740
|
+
opacity: 1
|
|
1744
1741
|
}
|
|
1745
1742
|
}
|
|
1746
1743
|
}) : /*#__PURE__*/React__default.createElement(FavoriteBorderIcon, {
|
|
@@ -1749,8 +1746,9 @@ var FavoriteIconWithCounter = function FavoriteIconWithCounter(_ref) {
|
|
|
1749
1746
|
marginRight: "6px",
|
|
1750
1747
|
transition: "0.3s",
|
|
1751
1748
|
cursor: "pointer",
|
|
1749
|
+
opacity: 0.5,
|
|
1752
1750
|
"&:hover": {
|
|
1753
|
-
opacity:
|
|
1751
|
+
opacity: 1
|
|
1754
1752
|
}
|
|
1755
1753
|
}
|
|
1756
1754
|
}), /*#__PURE__*/React__default.createElement(Text, {
|
|
@@ -1846,7 +1844,33 @@ var RatingInfo = function RatingInfo(_ref4) {
|
|
|
1846
1844
|
return /*#__PURE__*/React__default.createElement(Stack, {
|
|
1847
1845
|
direction: "row",
|
|
1848
1846
|
alignItems: "center"
|
|
1849
|
-
}, bite === null || bite === void 0 ? void 0 :
|
|
1847
|
+
}, (bite === null || bite === void 0 ? void 0 : bite.visibility) === "PRIVATE" && /*#__PURE__*/React__default.createElement(Tooltip, {
|
|
1848
|
+
title: "Private"
|
|
1849
|
+
}, /*#__PURE__*/React__default.createElement(VisibilityOffRoundedIcon, {
|
|
1850
|
+
sx: {
|
|
1851
|
+
fontSize: "15px",
|
|
1852
|
+
fontWeight: "600",
|
|
1853
|
+
backgroundColor: "#585858a3",
|
|
1854
|
+
border: "4px solid transparent",
|
|
1855
|
+
borderColor: "#585858a3",
|
|
1856
|
+
borderRadius: "4px",
|
|
1857
|
+
color: "whiteOverride.main",
|
|
1858
|
+
marginBottom: "12px"
|
|
1859
|
+
}
|
|
1860
|
+
})), (bite === null || bite === void 0 ? void 0 : bite.visibility) === "UNLISTED" && /*#__PURE__*/React__default.createElement(Tooltip, {
|
|
1861
|
+
title: "Unlisted"
|
|
1862
|
+
}, /*#__PURE__*/React__default.createElement(VisibilityRoundedIcon, {
|
|
1863
|
+
sx: {
|
|
1864
|
+
fontSize: "15px",
|
|
1865
|
+
fontWeight: "600",
|
|
1866
|
+
backgroundColor: "#585858a3",
|
|
1867
|
+
border: "4px solid transparent",
|
|
1868
|
+
borderColor: "#585858a3",
|
|
1869
|
+
borderRadius: "4px",
|
|
1870
|
+
color: "whiteOverride.main",
|
|
1871
|
+
marginBottom: "12px"
|
|
1872
|
+
}
|
|
1873
|
+
})), bite === null || bite === void 0 ? void 0 : (_bite$newAudienceRati2 = bite.newAudienceRating) === null || _bite$newAudienceRati2 === void 0 ? void 0 : _bite$newAudienceRati2.map(function (rating) {
|
|
1850
1874
|
if (rating === "SAFE") {
|
|
1851
1875
|
// nothing
|
|
1852
1876
|
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null);
|
|
@@ -1890,10 +1914,39 @@ var RatingInfo = function RatingInfo(_ref4) {
|
|
|
1890
1914
|
}
|
|
1891
1915
|
|
|
1892
1916
|
if (!ratingText.tooltipText) return /*#__PURE__*/React__default.createElement(React__default.Fragment, null);
|
|
1893
|
-
return /*#__PURE__*/React__default.createElement(
|
|
1917
|
+
return /*#__PURE__*/React__default.createElement(Stack, {
|
|
1918
|
+
direction: "row",
|
|
1919
|
+
alignItems: "center"
|
|
1920
|
+
}, (bite === null || bite === void 0 ? void 0 : bite.visibility) === "PRIVATE" && /*#__PURE__*/React__default.createElement(Tooltip, {
|
|
1921
|
+
title: "Private"
|
|
1922
|
+
}, /*#__PURE__*/React__default.createElement(VisibilityOffRoundedIcon, {
|
|
1923
|
+
sx: {
|
|
1924
|
+
fontSize: "15px",
|
|
1925
|
+
fontWeight: "600",
|
|
1926
|
+
backgroundColor: "#585858a3",
|
|
1927
|
+
border: "4px solid transparent",
|
|
1928
|
+
borderColor: "#585858a3",
|
|
1929
|
+
borderRadius: "4px",
|
|
1930
|
+
color: "whiteOverride.main",
|
|
1931
|
+
marginBottom: "12px"
|
|
1932
|
+
}
|
|
1933
|
+
})), (bite === null || bite === void 0 ? void 0 : bite.visibility) === "UNLISTED" && /*#__PURE__*/React__default.createElement(Tooltip, {
|
|
1934
|
+
title: "Unlisted"
|
|
1935
|
+
}, /*#__PURE__*/React__default.createElement(VisibilityRoundedIcon, {
|
|
1936
|
+
sx: {
|
|
1937
|
+
fontSize: "15px",
|
|
1938
|
+
fontWeight: "600",
|
|
1939
|
+
backgroundColor: "#585858a3",
|
|
1940
|
+
border: "4px solid transparent",
|
|
1941
|
+
borderColor: "#585858a3",
|
|
1942
|
+
borderRadius: "4px",
|
|
1943
|
+
color: "whiteOverride.main",
|
|
1944
|
+
marginBottom: "12px"
|
|
1945
|
+
}
|
|
1946
|
+
})), /*#__PURE__*/React__default.createElement(RatingInfoItem, {
|
|
1894
1947
|
tooltipText: ratingText.tooltipText,
|
|
1895
1948
|
displayText: ratingText.text
|
|
1896
|
-
});
|
|
1949
|
+
}));
|
|
1897
1950
|
};
|
|
1898
1951
|
|
|
1899
1952
|
var ReportedWarning = function ReportedWarning(_ref5) {
|
|
@@ -2272,14 +2325,15 @@ var NewBlerp$1 = function NewBlerp(_ref7) {
|
|
|
2272
2325
|
display: "flex",
|
|
2273
2326
|
alignItems: "flex-end",
|
|
2274
2327
|
justifyContent: "center",
|
|
2275
|
-
background: "linear-gradient(270deg, rgba(40,50,51,1) 40%, rgba(0,0,0,0) 100%)"
|
|
2328
|
+
background: bite !== null && bite !== void 0 && bite.isPremium ? "linear-gradient(270deg, rgb(49 62 65) 40%, rgba(0,0,0,0) 100%)" : "linear-gradient(270deg, rgba(40,50,51,1) 40%, rgba(0,0,0,0) 100%)"
|
|
2276
2329
|
}
|
|
2277
2330
|
}, renderThreeDot())), /*#__PURE__*/React__default.createElement(Stack, {
|
|
2278
2331
|
direction: "row",
|
|
2279
2332
|
alignItems: "center",
|
|
2280
2333
|
sx: {
|
|
2281
2334
|
width: "100%",
|
|
2282
|
-
justifyContent: "start"
|
|
2335
|
+
justifyContent: "start",
|
|
2336
|
+
postion: "relative"
|
|
2283
2337
|
}
|
|
2284
2338
|
}, (bite === null || bite === void 0 ? void 0 : bite.isPremium) && /*#__PURE__*/React__default.createElement(DiamondIcon, {
|
|
2285
2339
|
sx: {
|
|
@@ -2346,14 +2400,17 @@ var NewBlerp$1 = function NewBlerp(_ref7) {
|
|
|
2346
2400
|
onClick: onFavoriteClick
|
|
2347
2401
|
}), /*#__PURE__*/React__default.createElement(UsernameWithPopout$1, {
|
|
2348
2402
|
onUsernameClick: onUsernameClick,
|
|
2349
|
-
user: bite === null || bite === void 0 ? void 0 : bite.ownerObject
|
|
2403
|
+
user: bite === null || bite === void 0 ? void 0 : bite.ownerObject,
|
|
2404
|
+
collapsed: false
|
|
2350
2405
|
}), /*#__PURE__*/React__default.createElement(Text, {
|
|
2351
2406
|
sx: {
|
|
2352
2407
|
fontWeight: "300",
|
|
2353
2408
|
fontSize: "12px",
|
|
2354
|
-
color: "grey7.main"
|
|
2409
|
+
color: "grey7.main",
|
|
2410
|
+
position: "absolute",
|
|
2411
|
+
right: "12px"
|
|
2355
2412
|
}
|
|
2356
|
-
}, ((bite === null || bite === void 0 ? void 0 : bite.audioDuration) / 1000).toFixed(0), "s")))));
|
|
2413
|
+
}, (((bite === null || bite === void 0 ? void 0 : bite.audioDuration) || 1) / 1000).toFixed(0), "s")))));
|
|
2357
2414
|
};
|
|
2358
2415
|
|
|
2359
2416
|
var _templateObject$f;
|
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('react-color-extractor'), require('styled-components'), require('@babel/runtime/helpers/taggedTemplateLiteral'), require('@mui/icons-material'), require('@mui/icons-material/BookmarkOutlined'), require('@mui/icons-material/LockRounded'), require('@mui/icons-material/DoNotDisturbRounded'), require('@mui/icons-material/Favorite'), require('@mui/icons-material/FavoriteBorder'), require('@mui/icons-material/PauseRounded'), require('@mui/icons-material/PlayArrowRounded'), require('@mui/icons-material/WarningRounded'), require('@babel/runtime/helpers/defineProperty'), require('@babel/runtime/helpers/asyncToGenerator'), require('@babel/runtime/regenerator'), require('@mui/icons-material/BookmarkAddOutlined'), require('@mui/icons-material/MoreHorizRounded'), require('react-palette'), require('@babel/runtime/helpers/typeof'), require('@mui/icons-material/KeyboardArrowRightRounded'), require('@mui/icons-material/KeyboardArrowDownRounded'), require('@mui/icons-material/CloseRounded'), require('@mui/icons-material/FileUploadRounded'), require('@babel/runtime/helpers/extends'), 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')
|
|
3
|
-
typeof define === 'function' && define.amd ? define(['exports', '@mui/material', '@babel/runtime/helpers/slicedToArray', 'prop-types', 'react', 'react-color-extractor', 'styled-components', '@babel/runtime/helpers/taggedTemplateLiteral', '@mui/icons-material', '@mui/icons-material/BookmarkOutlined', '@mui/icons-material/LockRounded', '@mui/icons-material/DoNotDisturbRounded', '@mui/icons-material/Favorite', '@mui/icons-material/FavoriteBorder', '@mui/icons-material/PauseRounded', '@mui/icons-material/PlayArrowRounded', '@mui/icons-material/WarningRounded', '@babel/runtime/helpers/defineProperty', '@babel/runtime/helpers/asyncToGenerator', '@babel/runtime/regenerator', '@mui/icons-material/BookmarkAddOutlined', '@mui/icons-material/MoreHorizRounded', 'react-palette', '@babel/runtime/helpers/typeof', '@mui/icons-material/KeyboardArrowRightRounded', '@mui/icons-material/KeyboardArrowDownRounded', '@mui/icons-material/CloseRounded', '@mui/icons-material/FileUploadRounded', '@babel/runtime/helpers/extends', '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'
|
|
4
|
-
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global['react-awesome-buttons'] = {}, global.material, global._slicedToArray, global.PropTypes, global.React, global.reactColorExtractor, global.styled, global._taggedTemplateLiteral, global.iconsMaterial, global.BookmarkOutlinedIcon, global.LockRoundedIcon, global.DoNotDisturbRoundedIcon, global.FavoriteIcon, global.FavoriteBorderIcon, global.PauseRoundedIcon, global.PlayArrowRoundedIcon, global.WarningRoundedIcon, global._defineProperty, global._asyncToGenerator, global._regeneratorRuntime, global.BookmarkAddOutlinedIcon, global.MoreHorizRoundedIcon, global.reactPalette, global._typeof, global.KeyboardArrowRightRoundedIcon, global.KeyboardArrowDownRoundedIcon, global.CloseRoundedIcon, global.FileUploadRoundedIcon, global._extends, 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
|
|
5
|
-
}(this, (function (exports, material, _slicedToArray, PropTypes, React, reactColorExtractor, styled, _taggedTemplateLiteral, iconsMaterial, BookmarkOutlinedIcon, LockRoundedIcon, DoNotDisturbRoundedIcon, FavoriteIcon, FavoriteBorderIcon, PauseRoundedIcon, PlayArrowRoundedIcon, WarningRoundedIcon, _defineProperty, _asyncToGenerator, _regeneratorRuntime, BookmarkAddOutlinedIcon, MoreHorizRoundedIcon, reactPalette, _typeof, KeyboardArrowRightRoundedIcon, KeyboardArrowDownRoundedIcon, CloseRoundedIcon, FileUploadRoundedIcon, _extends, 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
|
|
2
|
+
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@mui/material'), require('@babel/runtime/helpers/slicedToArray'), require('prop-types'), require('react'), require('react-color-extractor'), require('styled-components'), require('@babel/runtime/helpers/taggedTemplateLiteral'), require('@mui/icons-material'), require('@mui/icons-material/BookmarkOutlined'), require('@mui/icons-material/LockRounded'), require('@mui/icons-material/DoNotDisturbRounded'), require('@mui/icons-material/Favorite'), require('@mui/icons-material/FavoriteBorder'), require('@mui/icons-material/PauseRounded'), require('@mui/icons-material/PlayArrowRounded'), require('@mui/icons-material/WarningRounded'), require('@mui/icons-material/VisibilityOffRounded'), require('@mui/icons-material/VisibilityRounded'), require('@babel/runtime/helpers/defineProperty'), require('@babel/runtime/helpers/asyncToGenerator'), require('@babel/runtime/regenerator'), require('@mui/icons-material/BookmarkAddOutlined'), require('@mui/icons-material/MoreHorizRounded'), require('react-palette'), require('@babel/runtime/helpers/typeof'), require('@mui/icons-material/KeyboardArrowRightRounded'), require('@mui/icons-material/KeyboardArrowDownRounded'), require('@mui/icons-material/CloseRounded'), require('@mui/icons-material/FileUploadRounded'), require('@babel/runtime/helpers/extends'), 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')) :
|
|
3
|
+
typeof define === 'function' && define.amd ? define(['exports', '@mui/material', '@babel/runtime/helpers/slicedToArray', 'prop-types', 'react', 'react-color-extractor', 'styled-components', '@babel/runtime/helpers/taggedTemplateLiteral', '@mui/icons-material', '@mui/icons-material/BookmarkOutlined', '@mui/icons-material/LockRounded', '@mui/icons-material/DoNotDisturbRounded', '@mui/icons-material/Favorite', '@mui/icons-material/FavoriteBorder', '@mui/icons-material/PauseRounded', '@mui/icons-material/PlayArrowRounded', '@mui/icons-material/WarningRounded', '@mui/icons-material/VisibilityOffRounded', '@mui/icons-material/VisibilityRounded', '@babel/runtime/helpers/defineProperty', '@babel/runtime/helpers/asyncToGenerator', '@babel/runtime/regenerator', '@mui/icons-material/BookmarkAddOutlined', '@mui/icons-material/MoreHorizRounded', 'react-palette', '@babel/runtime/helpers/typeof', '@mui/icons-material/KeyboardArrowRightRounded', '@mui/icons-material/KeyboardArrowDownRounded', '@mui/icons-material/CloseRounded', '@mui/icons-material/FileUploadRounded', '@babel/runtime/helpers/extends', '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'], factory) :
|
|
4
|
+
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global['react-awesome-buttons'] = {}, global.material, global._slicedToArray, global.PropTypes, global.React, global.reactColorExtractor, global.styled, global._taggedTemplateLiteral, global.iconsMaterial, global.BookmarkOutlinedIcon, global.LockRoundedIcon, global.DoNotDisturbRoundedIcon, global.FavoriteIcon, global.FavoriteBorderIcon, global.PauseRoundedIcon, global.PlayArrowRoundedIcon, global.WarningRoundedIcon, global.VisibilityOffRoundedIcon, global.VisibilityRoundedIcon, global._defineProperty, global._asyncToGenerator, global._regeneratorRuntime, global.BookmarkAddOutlinedIcon, global.MoreHorizRoundedIcon, global.reactPalette, global._typeof, global.KeyboardArrowRightRoundedIcon, global.KeyboardArrowDownRoundedIcon, global.CloseRoundedIcon, global.FileUploadRoundedIcon, global._extends, 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));
|
|
5
|
+
}(this, (function (exports, material, _slicedToArray, PropTypes, React, reactColorExtractor, styled, _taggedTemplateLiteral, iconsMaterial, BookmarkOutlinedIcon, LockRoundedIcon, DoNotDisturbRoundedIcon, FavoriteIcon, FavoriteBorderIcon, PauseRoundedIcon, PlayArrowRoundedIcon, WarningRoundedIcon, VisibilityOffRoundedIcon, VisibilityRoundedIcon, _defineProperty, _asyncToGenerator, _regeneratorRuntime, BookmarkAddOutlinedIcon, MoreHorizRoundedIcon, reactPalette, _typeof, KeyboardArrowRightRoundedIcon, KeyboardArrowDownRoundedIcon, CloseRoundedIcon, FileUploadRoundedIcon, _extends, 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) { 'use strict';
|
|
6
6
|
|
|
7
7
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
8
8
|
|
|
@@ -40,6 +40,8 @@
|
|
|
40
40
|
var PauseRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(PauseRoundedIcon);
|
|
41
41
|
var PlayArrowRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(PlayArrowRoundedIcon);
|
|
42
42
|
var WarningRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(WarningRoundedIcon);
|
|
43
|
+
var VisibilityOffRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(VisibilityOffRoundedIcon);
|
|
44
|
+
var VisibilityRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(VisibilityRoundedIcon);
|
|
43
45
|
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
44
46
|
var _asyncToGenerator__default = /*#__PURE__*/_interopDefaultLegacy(_asyncToGenerator);
|
|
45
47
|
var _regeneratorRuntime__default = /*#__PURE__*/_interopDefaultLegacy(_regeneratorRuntime);
|
|
@@ -74,7 +76,6 @@
|
|
|
74
76
|
var PersonRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(PersonRoundedIcon);
|
|
75
77
|
var SearchRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(SearchRoundedIcon);
|
|
76
78
|
var BookmarkRemoveOutlinedIcon__default = /*#__PURE__*/_interopDefaultLegacy(BookmarkRemoveOutlinedIcon);
|
|
77
|
-
var VisibilityOffRoundedIcon__default = /*#__PURE__*/_interopDefaultLegacy(VisibilityOffRoundedIcon);
|
|
78
79
|
|
|
79
80
|
var _templateObject$j, _templateObject2$b, _templateObject3$9, _templateObject4$7;
|
|
80
81
|
var BlerpImage$3 = styled__default['default'].div(_templateObject$j || (_templateObject$j = _taggedTemplateLiteral__default['default'](["\n height: 150px;\n width: 150px;\n background-image: url(", ");\n background-size: cover;\n border-radius: 50%;\n position: relative;\n transition: 0.2s;\n\n &:hover {\n transform: scale(1.1);\n }\n"])), function (props) {
|
|
@@ -1516,13 +1517,18 @@
|
|
|
1516
1517
|
};
|
|
1517
1518
|
|
|
1518
1519
|
var UserCard$1 = function UserCard(_ref) {
|
|
1519
|
-
var _user$twitchChannelIn, _user$twitchChannelIn2, _user$twitchChannelIn3, _user$twitchChannelIn4, _user$
|
|
1520
|
+
var _user$twitchChannelIn, _user$twitchChannelIn2, _user$twitchChannelIn3, _user$twitchChannelIn4, _user$twitchChannelIn5, _user$profileImage, _user$profileImage$or, _user$twitchChannelIn6;
|
|
1520
1521
|
|
|
1521
1522
|
var user = _ref.user,
|
|
1522
1523
|
onUsernameClick = _ref.onUsernameClick,
|
|
1523
1524
|
onFollowerClick = _ref.onFollowerClick,
|
|
1524
1525
|
onCreatedClick = _ref.onCreatedClick,
|
|
1525
1526
|
collapsed = _ref.collapsed;
|
|
1527
|
+
var formatter = Intl.NumberFormat("en", {
|
|
1528
|
+
notation: "compact"
|
|
1529
|
+
});
|
|
1530
|
+
var followerCount = formatter.format((user === null || user === void 0 ? void 0 : (_user$twitchChannelIn = user.twitchChannelInfo) === null || _user$twitchChannelIn === void 0 ? void 0 : _user$twitchChannelIn.followerCount) || 0);
|
|
1531
|
+
var createdCount = formatter.format((user === null || user === void 0 ? void 0 : user.totalCreationCount) || 0);
|
|
1526
1532
|
return /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
1527
1533
|
direction: "row",
|
|
1528
1534
|
sx: {
|
|
@@ -1536,7 +1542,7 @@
|
|
|
1536
1542
|
boxSizing: "border-box",
|
|
1537
1543
|
justifyContent: "space-around",
|
|
1538
1544
|
border: "1px solid transparent",
|
|
1539
|
-
borderColor: collapsed ? (user === null || user === void 0 ? void 0 : (_user$
|
|
1545
|
+
borderColor: collapsed ? (user === null || user === void 0 ? void 0 : (_user$twitchChannelIn2 = user.twitchChannelInfo) === null || _user$twitchChannelIn2 === void 0 ? void 0 : _user$twitchChannelIn2.twitchJourneyStatus) === "CHAMPION" ? "#FFFFFF" : (user === null || user === void 0 ? void 0 : (_user$twitchChannelIn3 = user.twitchChannelInfo) === null || _user$twitchChannelIn3 === void 0 ? void 0 : _user$twitchChannelIn3.twitchJourneyStatus) === "AFFILIATE" ? "#27AAFF" : "transparent" : "transparent"
|
|
1540
1546
|
}
|
|
1541
1547
|
}, /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
1542
1548
|
sx: {
|
|
@@ -1548,13 +1554,13 @@
|
|
|
1548
1554
|
height: collapsed ? "49px" : "89px",
|
|
1549
1555
|
borderRadius: "50%",
|
|
1550
1556
|
border: "2px solid transparent",
|
|
1551
|
-
borderColor: collapsed ? "transparent" : (user === null || user === void 0 ? void 0 : (_user$
|
|
1557
|
+
borderColor: collapsed ? "transparent" : (user === null || user === void 0 ? void 0 : (_user$twitchChannelIn4 = user.twitchChannelInfo) === null || _user$twitchChannelIn4 === void 0 ? void 0 : _user$twitchChannelIn4.twitchJourneyStatus) === "CHAMPION" ? "#FFFFFF" : (user === null || user === void 0 ? void 0 : (_user$twitchChannelIn5 = user.twitchChannelInfo) === null || _user$twitchChannelIn5 === void 0 ? void 0 : _user$twitchChannelIn5.twitchJourneyStatus) === "AFFILIATE" ? "#27AAFF" : "transparent",
|
|
1552
1558
|
padding: collapsed ? "3px" : "6px",
|
|
1553
1559
|
boxSizing: "border-box"
|
|
1554
1560
|
},
|
|
1555
1561
|
src: (user === null || user === void 0 ? void 0 : (_user$profileImage = user.profileImage) === null || _user$profileImage === void 0 ? void 0 : (_user$profileImage$or = _user$profileImage.original) === null || _user$profileImage$or === void 0 ? void 0 : _user$profileImage$or.url) || "https://cdn.blerp.com/blerp_products/Icons/Account-White.svg",
|
|
1556
1562
|
alt: "profile"
|
|
1557
|
-
}), (user === null || user === void 0 ? void 0 : (_user$
|
|
1563
|
+
}), (user === null || user === void 0 ? void 0 : (_user$twitchChannelIn6 = user.twitchChannelInfo) === null || _user$twitchChannelIn6 === void 0 ? void 0 : _user$twitchChannelIn6.broadcasterType) === "partner" && /*#__PURE__*/React__default['default'].createElement(iconsMaterial.VerifiedRounded, {
|
|
1558
1564
|
sx: {
|
|
1559
1565
|
position: "absolute",
|
|
1560
1566
|
bottom: collapsed ? "0" : "5px",
|
|
@@ -1602,48 +1608,36 @@
|
|
|
1602
1608
|
}, /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
1603
1609
|
alignItems: "center",
|
|
1604
1610
|
sx: {
|
|
1605
|
-
cursor: "
|
|
1606
|
-
transition: "0.3s",
|
|
1607
|
-
"&:hover": {
|
|
1608
|
-
textDecoration: "underline"
|
|
1609
|
-
}
|
|
1611
|
+
cursor: "pointer"
|
|
1610
1612
|
},
|
|
1611
1613
|
onClick: onFollowerClick
|
|
1612
1614
|
}, /*#__PURE__*/React__default['default'].createElement(Text, {
|
|
1613
1615
|
sx: {
|
|
1614
1616
|
fontSize: "14px",
|
|
1615
|
-
fontWeight: "400"
|
|
1616
|
-
cursor: "inherit"
|
|
1617
|
+
fontWeight: "400"
|
|
1617
1618
|
}
|
|
1618
|
-
},
|
|
1619
|
+
}, followerCount), /*#__PURE__*/React__default['default'].createElement(Text, {
|
|
1619
1620
|
sx: {
|
|
1620
1621
|
fontSize: "12px",
|
|
1621
1622
|
fontWeight: "300",
|
|
1622
|
-
color: "grey7.main"
|
|
1623
|
-
cursor: "inherit"
|
|
1623
|
+
color: "grey7.main"
|
|
1624
1624
|
}
|
|
1625
1625
|
}, "followers")), /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
1626
1626
|
alignItems: "center",
|
|
1627
1627
|
sx: {
|
|
1628
|
-
cursor: "
|
|
1629
|
-
transition: "0.3s",
|
|
1630
|
-
"&:hover": {
|
|
1631
|
-
textDecoration: "underline"
|
|
1632
|
-
}
|
|
1628
|
+
cursor: "pointer"
|
|
1633
1629
|
},
|
|
1634
1630
|
onClick: onCreatedClick
|
|
1635
1631
|
}, /*#__PURE__*/React__default['default'].createElement(Text, {
|
|
1636
1632
|
sx: {
|
|
1637
1633
|
fontSize: "14px",
|
|
1638
|
-
fontWeight: "400"
|
|
1639
|
-
cursor: "inherit"
|
|
1634
|
+
fontWeight: "400"
|
|
1640
1635
|
}
|
|
1641
|
-
},
|
|
1636
|
+
}, createdCount), /*#__PURE__*/React__default['default'].createElement(Text, {
|
|
1642
1637
|
sx: {
|
|
1643
1638
|
fontSize: "12px",
|
|
1644
1639
|
fontWeight: "300",
|
|
1645
|
-
color: "grey7.main"
|
|
1646
|
-
cursor: "inherit"
|
|
1640
|
+
color: "grey7.main"
|
|
1647
1641
|
}
|
|
1648
1642
|
}, "created")))));
|
|
1649
1643
|
};
|
|
@@ -1656,7 +1650,9 @@
|
|
|
1656
1650
|
onUsernameClick = _ref.onUsernameClick,
|
|
1657
1651
|
onFollowerClick = _ref.onFollowerClick,
|
|
1658
1652
|
onCreatedClick = _ref.onCreatedClick,
|
|
1659
|
-
textStyle = _ref.textStyle
|
|
1653
|
+
textStyle = _ref.textStyle,
|
|
1654
|
+
_ref$collapsed = _ref.collapsed,
|
|
1655
|
+
collapsed = _ref$collapsed === void 0 ? true : _ref$collapsed;
|
|
1660
1656
|
|
|
1661
1657
|
var _useState = React.useState(null),
|
|
1662
1658
|
_useState2 = _slicedToArray__default['default'](_useState, 2),
|
|
@@ -1713,7 +1709,7 @@
|
|
|
1713
1709
|
onUsernameClick: onUsernameClick,
|
|
1714
1710
|
onFollowerClick: onFollowerClick,
|
|
1715
1711
|
onCreatedClick: onCreatedClick,
|
|
1716
|
-
collapsed:
|
|
1712
|
+
collapsed: collapsed,
|
|
1717
1713
|
user: user
|
|
1718
1714
|
})), /*#__PURE__*/React__default['default'].createElement(Text, {
|
|
1719
1715
|
sx: _objectSpread$6({
|
|
@@ -1760,8 +1756,9 @@
|
|
|
1760
1756
|
marginRight: "6px",
|
|
1761
1757
|
transition: "0.3s",
|
|
1762
1758
|
cursor: "pointer",
|
|
1759
|
+
opacity: 0.5,
|
|
1763
1760
|
"&:hover": {
|
|
1764
|
-
opacity:
|
|
1761
|
+
opacity: 1
|
|
1765
1762
|
}
|
|
1766
1763
|
}
|
|
1767
1764
|
}) : /*#__PURE__*/React__default['default'].createElement(FavoriteBorderIcon__default['default'], {
|
|
@@ -1770,8 +1767,9 @@
|
|
|
1770
1767
|
marginRight: "6px",
|
|
1771
1768
|
transition: "0.3s",
|
|
1772
1769
|
cursor: "pointer",
|
|
1770
|
+
opacity: 0.5,
|
|
1773
1771
|
"&:hover": {
|
|
1774
|
-
opacity:
|
|
1772
|
+
opacity: 1
|
|
1775
1773
|
}
|
|
1776
1774
|
}
|
|
1777
1775
|
}), /*#__PURE__*/React__default['default'].createElement(Text, {
|
|
@@ -1867,7 +1865,33 @@
|
|
|
1867
1865
|
return /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
1868
1866
|
direction: "row",
|
|
1869
1867
|
alignItems: "center"
|
|
1870
|
-
}, bite === null || bite === void 0 ? void 0 :
|
|
1868
|
+
}, (bite === null || bite === void 0 ? void 0 : bite.visibility) === "PRIVATE" && /*#__PURE__*/React__default['default'].createElement(Tooltip, {
|
|
1869
|
+
title: "Private"
|
|
1870
|
+
}, /*#__PURE__*/React__default['default'].createElement(VisibilityOffRoundedIcon__default['default'], {
|
|
1871
|
+
sx: {
|
|
1872
|
+
fontSize: "15px",
|
|
1873
|
+
fontWeight: "600",
|
|
1874
|
+
backgroundColor: "#585858a3",
|
|
1875
|
+
border: "4px solid transparent",
|
|
1876
|
+
borderColor: "#585858a3",
|
|
1877
|
+
borderRadius: "4px",
|
|
1878
|
+
color: "whiteOverride.main",
|
|
1879
|
+
marginBottom: "12px"
|
|
1880
|
+
}
|
|
1881
|
+
})), (bite === null || bite === void 0 ? void 0 : bite.visibility) === "UNLISTED" && /*#__PURE__*/React__default['default'].createElement(Tooltip, {
|
|
1882
|
+
title: "Unlisted"
|
|
1883
|
+
}, /*#__PURE__*/React__default['default'].createElement(VisibilityRoundedIcon__default['default'], {
|
|
1884
|
+
sx: {
|
|
1885
|
+
fontSize: "15px",
|
|
1886
|
+
fontWeight: "600",
|
|
1887
|
+
backgroundColor: "#585858a3",
|
|
1888
|
+
border: "4px solid transparent",
|
|
1889
|
+
borderColor: "#585858a3",
|
|
1890
|
+
borderRadius: "4px",
|
|
1891
|
+
color: "whiteOverride.main",
|
|
1892
|
+
marginBottom: "12px"
|
|
1893
|
+
}
|
|
1894
|
+
})), bite === null || bite === void 0 ? void 0 : (_bite$newAudienceRati2 = bite.newAudienceRating) === null || _bite$newAudienceRati2 === void 0 ? void 0 : _bite$newAudienceRati2.map(function (rating) {
|
|
1871
1895
|
if (rating === "SAFE") {
|
|
1872
1896
|
// nothing
|
|
1873
1897
|
return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null);
|
|
@@ -1911,10 +1935,39 @@
|
|
|
1911
1935
|
}
|
|
1912
1936
|
|
|
1913
1937
|
if (!ratingText.tooltipText) return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null);
|
|
1914
|
-
return /*#__PURE__*/React__default['default'].createElement(
|
|
1938
|
+
return /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
1939
|
+
direction: "row",
|
|
1940
|
+
alignItems: "center"
|
|
1941
|
+
}, (bite === null || bite === void 0 ? void 0 : bite.visibility) === "PRIVATE" && /*#__PURE__*/React__default['default'].createElement(Tooltip, {
|
|
1942
|
+
title: "Private"
|
|
1943
|
+
}, /*#__PURE__*/React__default['default'].createElement(VisibilityOffRoundedIcon__default['default'], {
|
|
1944
|
+
sx: {
|
|
1945
|
+
fontSize: "15px",
|
|
1946
|
+
fontWeight: "600",
|
|
1947
|
+
backgroundColor: "#585858a3",
|
|
1948
|
+
border: "4px solid transparent",
|
|
1949
|
+
borderColor: "#585858a3",
|
|
1950
|
+
borderRadius: "4px",
|
|
1951
|
+
color: "whiteOverride.main",
|
|
1952
|
+
marginBottom: "12px"
|
|
1953
|
+
}
|
|
1954
|
+
})), (bite === null || bite === void 0 ? void 0 : bite.visibility) === "UNLISTED" && /*#__PURE__*/React__default['default'].createElement(Tooltip, {
|
|
1955
|
+
title: "Unlisted"
|
|
1956
|
+
}, /*#__PURE__*/React__default['default'].createElement(VisibilityRoundedIcon__default['default'], {
|
|
1957
|
+
sx: {
|
|
1958
|
+
fontSize: "15px",
|
|
1959
|
+
fontWeight: "600",
|
|
1960
|
+
backgroundColor: "#585858a3",
|
|
1961
|
+
border: "4px solid transparent",
|
|
1962
|
+
borderColor: "#585858a3",
|
|
1963
|
+
borderRadius: "4px",
|
|
1964
|
+
color: "whiteOverride.main",
|
|
1965
|
+
marginBottom: "12px"
|
|
1966
|
+
}
|
|
1967
|
+
})), /*#__PURE__*/React__default['default'].createElement(RatingInfoItem, {
|
|
1915
1968
|
tooltipText: ratingText.tooltipText,
|
|
1916
1969
|
displayText: ratingText.text
|
|
1917
|
-
});
|
|
1970
|
+
}));
|
|
1918
1971
|
};
|
|
1919
1972
|
|
|
1920
1973
|
var ReportedWarning = function ReportedWarning(_ref5) {
|
|
@@ -2293,14 +2346,15 @@
|
|
|
2293
2346
|
display: "flex",
|
|
2294
2347
|
alignItems: "flex-end",
|
|
2295
2348
|
justifyContent: "center",
|
|
2296
|
-
background: "linear-gradient(270deg, rgba(40,50,51,1) 40%, rgba(0,0,0,0) 100%)"
|
|
2349
|
+
background: bite !== null && bite !== void 0 && bite.isPremium ? "linear-gradient(270deg, rgb(49 62 65) 40%, rgba(0,0,0,0) 100%)" : "linear-gradient(270deg, rgba(40,50,51,1) 40%, rgba(0,0,0,0) 100%)"
|
|
2297
2350
|
}
|
|
2298
2351
|
}, renderThreeDot())), /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
2299
2352
|
direction: "row",
|
|
2300
2353
|
alignItems: "center",
|
|
2301
2354
|
sx: {
|
|
2302
2355
|
width: "100%",
|
|
2303
|
-
justifyContent: "start"
|
|
2356
|
+
justifyContent: "start",
|
|
2357
|
+
postion: "relative"
|
|
2304
2358
|
}
|
|
2305
2359
|
}, (bite === null || bite === void 0 ? void 0 : bite.isPremium) && /*#__PURE__*/React__default['default'].createElement(DiamondIcon, {
|
|
2306
2360
|
sx: {
|
|
@@ -2367,14 +2421,17 @@
|
|
|
2367
2421
|
onClick: onFavoriteClick
|
|
2368
2422
|
}), /*#__PURE__*/React__default['default'].createElement(UsernameWithPopout$1, {
|
|
2369
2423
|
onUsernameClick: onUsernameClick,
|
|
2370
|
-
user: bite === null || bite === void 0 ? void 0 : bite.ownerObject
|
|
2424
|
+
user: bite === null || bite === void 0 ? void 0 : bite.ownerObject,
|
|
2425
|
+
collapsed: false
|
|
2371
2426
|
}), /*#__PURE__*/React__default['default'].createElement(Text, {
|
|
2372
2427
|
sx: {
|
|
2373
2428
|
fontWeight: "300",
|
|
2374
2429
|
fontSize: "12px",
|
|
2375
|
-
color: "grey7.main"
|
|
2430
|
+
color: "grey7.main",
|
|
2431
|
+
position: "absolute",
|
|
2432
|
+
right: "12px"
|
|
2376
2433
|
}
|
|
2377
|
-
}, ((bite === null || bite === void 0 ? void 0 : bite.audioDuration) / 1000).toFixed(0), "s")))));
|
|
2434
|
+
}, (((bite === null || bite === void 0 ? void 0 : bite.audioDuration) || 1) / 1000).toFixed(0), "s")))));
|
|
2378
2435
|
};
|
|
2379
2436
|
|
|
2380
2437
|
var _templateObject$f;
|