@blerp/design 1.0.56 → 1.0.60

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/index.cjs.js +60 -8
  2. package/dist/index.esm.js +60 -9
  3. package/dist/index.umd.js +60 -8
  4. package/package.json +1 -1
package/dist/index.cjs.js CHANGED
@@ -913,6 +913,36 @@ var WindowsIcon = function WindowsIcon(_ref23) {
913
913
  d: "M3,5.5l7.4-1v7.1H3V5.5z M3,18.5l7.4,1v-7H3V18.5L3,18.5z M11.2,19.6L21,21v-8.5h-9.8V19.6z M11.2,4.4v7.2H21 V3L11.2,4.4z"
914
914
  }));
915
915
  };
916
+ var BroomIcon = function BroomIcon(_ref24) {
917
+ var sx = _ref24.sx;
918
+ return /*#__PURE__*/React__default['default'].createElement(material.SvgIcon, {
919
+ sx: sx
920
+ }, /*#__PURE__*/React__default['default'].createElement("g", {
921
+ id: "Layer_2"
922
+ }, /*#__PURE__*/React__default['default'].createElement("g", {
923
+ id: "Component_727_4",
924
+ transform: "translate(0.5)"
925
+ }, /*#__PURE__*/React__default['default'].createElement("g", {
926
+ id: "Union_53"
927
+ }, /*#__PURE__*/React__default['default'].createElement("path", {
928
+ d: "M7.1,20.2c1.9-1.2,3.1-2,3.1-2S8,19.5,7.1,19.9c-0.4,0.3-0.9,0.3-1.4,0.2c0,0,2.6-0.7,4.1-2.2c0.9-0.9,1.6-2,2.3-3 c0.3-0.4,0.7-0.7,1.1-0.9l2.5,1.3c0,0.6-0.2,1.2-0.5,1.7c-0.3,0.6-0.6,1.3-0.9,1.9c-0.9,1.2-1.6,1.1-1.6,1.1s0.1,0-0.8,0 c-0.1,0-0.2,0-0.5,0c-0.1,0-0.3,0-0.5,0c-0.2,0-0.5,0-0.8,0.1c-0.4,0-0.7,0.1-1.1,0c0.6-0.2,1.2-0.6,1.8-1 c0.4-0.4,0.7-0.9,0.9-1.5c-0.4,0.5-0.8,1-1.2,1.5c-0.6,0.5-1.4,0.8-2.2,1c-0.1,0-0.3,0-0.4,0c-0.1,0-0.3,0-0.4,0 C7.4,20.2,7.2,20.2,7.1,20.2z M13.4,13.7l0-1.2c0-0.1,0.1-0.2,0.2-0.2c0,0,0.1,0,0.1,0l1,0.5L19.4,4c0.1-0.2,0.3-0.2,0.4-0.1 L20.3,4c0.2,0.1,0.2,0.3,0.1,0.4c0,0,0,0,0,0l-4.5,8.8l1,0.5c0.1,0.1,0.2,0.2,0.1,0.3c0,0,0,0.1-0.1,0.1l-1,0.7L13.4,13.7z"
929
+ })), /*#__PURE__*/React__default['default'].createElement("g", {
930
+ id: "Group_28896",
931
+ transform: "translate(-45.5 3.636)"
932
+ }, /*#__PURE__*/React__default['default'].createElement("g", {
933
+ id: "Line_2285"
934
+ }, /*#__PURE__*/React__default['default'].createElement("path", {
935
+ d: "M53.9,13.8h-6c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h6c0.3,0,0.5,0.2,0.5,0.5S54.2,13.8,53.9,13.8z"
936
+ })), /*#__PURE__*/React__default['default'].createElement("g", {
937
+ id: "Path_16256"
938
+ }, /*#__PURE__*/React__default['default'].createElement("path", {
939
+ d: "M55.1,11.2h-3.9c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h3.9c0.3,0,0.5,0.2,0.5,0.5S55.4,11.2,55.1,11.2z"
940
+ })), /*#__PURE__*/React__default['default'].createElement("g", {
941
+ id: "Line_2287"
942
+ }, /*#__PURE__*/React__default['default'].createElement("path", {
943
+ d: "M56.8,8.6h-1.7c-0.3,0-0.5-0.2-0.5-0.5c0-0.3,0.2-0.5,0.5-0.5h1.7c0.3,0,0.5,0.2,0.5,0.5C57.3,8.4,57.1,8.6,56.8,8.6z"
944
+ }))))));
945
+ };
916
946
 
917
947
  var BlerpTopRow = function BlerpTopRow(_ref) {
918
948
  var _bite$topReactions, _bite$topReactions2, _bite$topReactions3;
@@ -7104,7 +7134,7 @@ var _templateObject$4, _templateObject2, _templateObject3, _templateObject4, _te
7104
7134
  var YellowHoverBorder = styled__default['default'].div(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteral__default['default'](["\n position: absolute;\n height: 105%;\n width: 105%;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n border: 4px solid rgb(255, 225, 76);\n border-radius: 20px;\n transition: opacity 0.3s ease-in-out;\n /* Opacity should be changed to \"1\" onHover of this component's parent */\n opacity: 0;\n"])));
7105
7135
  var LineClamp$1 = styled__default['default'].div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral__default['default'](["\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n margin: 5px 0;\n"])));
7106
7136
  var TopPill = styled__default['default'].div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral__default['default'](["\n display: flex;\n justify-content: center;\n align-items: center;\n height: 32px;\n width: ", ";\n position: absolute;\n top: 8px;\n left: 8px;\n border-radius: 20px;\n overflow: hidden;\n transition: width 0.3s ease-in-out;\n"])), function (props) {
7107
- return props.isLocked ? props.collectionHovered ? "90%" : "65%" : "45%";
7137
+ return props.isLocked ? props.collectionHovered ? "90%" : "70%" : "45%";
7108
7138
  });
7109
7139
  var TopPillBackground = styled__default['default'].div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral__default['default'](["\n height: 32px;\n width: 100%;\n position: absolute;\n background-color: ", ";\n opacity: 0.5;\n"])), function (props) {
7110
7140
  return props.theme.colors.notBlack;
@@ -7135,7 +7165,11 @@ var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
7135
7165
  fluid = _ref.fluid,
7136
7166
  fontSize = _ref.fontSize,
7137
7167
  isLink = _ref.isLink,
7138
- isLocked = _ref.isLocked;
7168
+ isLocked = _ref.isLocked,
7169
+ overrideViewText = _ref.overrideViewText,
7170
+ hideUnlockPlatformText = _ref.hideUnlockPlatformText,
7171
+ hidePremiumLockIcon = _ref.hidePremiumLockIcon,
7172
+ unlockPlatformText = _ref.unlockPlatformText;
7139
7173
 
7140
7174
  var _useState = React.useState(null),
7141
7175
  _useState2 = _slicedToArray__default['default'](_useState, 2),
@@ -7380,13 +7414,14 @@ var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
7380
7414
  fontWeight: "lighter",
7381
7415
  fontSize: ".8em"
7382
7416
  }
7383
- }, "Premium")), /*#__PURE__*/React__default['default'].createElement(Stack, null, /*#__PURE__*/React__default['default'].createElement(LockRoundedIcon__default['default'], {
7417
+ }, "Premium")), !hidePremiumLockIcon && /*#__PURE__*/React__default['default'].createElement(Stack, null, /*#__PURE__*/React__default['default'].createElement(LockRoundedIcon__default['default'], {
7384
7418
  sx: {
7385
7419
  position: "absolute",
7386
7420
  top: "8px",
7387
7421
  right: "5px",
7388
7422
  height: ".6em",
7389
7423
  color: "white.main",
7424
+ paddingRight: "8px",
7390
7425
  opacity: isLocked ? collectionHovered ? "0" : "1" : "0",
7391
7426
  transition: "opacity .2s ease-in-out"
7392
7427
  },
@@ -7481,7 +7516,7 @@ var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
7481
7516
  style: {
7482
7517
  margin: "0px -64px"
7483
7518
  }
7484
- })), /*#__PURE__*/React__default['default'].createElement(Text, {
7519
+ })), !hideUnlockPlatformText && (unlockPlatformText ? /*#__PURE__*/React__default['default'].createElement(Text, {
7485
7520
  sx: {
7486
7521
  color: "white.override",
7487
7522
  textAlign: "center",
@@ -7490,7 +7525,16 @@ var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
7490
7525
  zIndex: "3",
7491
7526
  fontSize: ".8rem"
7492
7527
  }
7493
- }, "Unlock to share ", /*#__PURE__*/React__default['default'].createElement("br", null), "across platforms"), /*#__PURE__*/React__default['default'].createElement(Button, {
7528
+ }, unlockPlatformText) : /*#__PURE__*/React__default['default'].createElement(Text, {
7529
+ sx: {
7530
+ color: "white.override",
7531
+ textAlign: "center",
7532
+ lineHeight: "1",
7533
+ margin: "4px 0",
7534
+ zIndex: "3",
7535
+ fontSize: ".8rem"
7536
+ }
7537
+ }, "Unlock to share ", /*#__PURE__*/React__default['default'].createElement("br", null), "across platforms")), handleClickView && /*#__PURE__*/React__default['default'].createElement(Button, {
7494
7538
  disabled: !collectionHovered,
7495
7539
  onClick: function onClick(e) {
7496
7540
  e.stopPropagation();
@@ -7503,7 +7547,7 @@ var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
7503
7547
  padding: "4px 8px",
7504
7548
  margin: "4px 0"
7505
7549
  }
7506
- }, "VIEW SOUNDPACK"), /*#__PURE__*/React__default['default'].createElement(Button, {
7550
+ }, overrideViewText || "VIEW SOUNDPACK"), handleClickUnlock && /*#__PURE__*/React__default['default'].createElement(Button, {
7507
7551
  disabled: !collectionHovered,
7508
7552
  onClick: function onClick(e) {
7509
7553
  e.stopPropagation();
@@ -7571,7 +7615,11 @@ var CollectionCard$1 = function CollectionCard(_ref) {
7571
7615
  isLink = _ref.isLink,
7572
7616
  isPremium = _ref.isPremium,
7573
7617
  isLocked = _ref.isLocked,
7574
- isOwner = _ref.isOwner;
7618
+ isOwner = _ref.isOwner,
7619
+ overrideViewText = _ref.overrideViewText,
7620
+ hideUnlockPlatformText = _ref.hideUnlockPlatformText,
7621
+ hidePremiumLockIcon = _ref.hidePremiumLockIcon;
7622
+ _ref.unlockPlatformText;
7575
7623
 
7576
7624
  var _useState = React.useState(null),
7577
7625
  _useState2 = _slicedToArray__default['default'](_useState, 2),
@@ -7695,7 +7743,10 @@ var CollectionCard$1 = function CollectionCard(_ref) {
7695
7743
  fontSize: fontSize,
7696
7744
  isLink: isLink,
7697
7745
  isPremium: isPremium,
7698
- isLocked: isLocked
7746
+ isLocked: isLocked,
7747
+ overrideViewText: overrideViewText,
7748
+ hideUnlockPlatformText: hideUnlockPlatformText,
7749
+ hidePremiumLockIcon: hidePremiumLockIcon
7699
7750
  });
7700
7751
  }
7701
7752
 
@@ -89938,6 +89989,7 @@ exports.BookmarkAddRounded = BookmarkAddRounded;
89938
89989
  exports.BottomNavigation = BottomNavigation;
89939
89990
  exports.Box = Box;
89940
89991
  exports.Breadcrumbs = Breadcrumbs;
89992
+ exports.BroomIcon = BroomIcon;
89941
89993
  exports.Button = Button;
89942
89994
  exports.ButtonGroup = ButtonGroup;
89943
89995
  exports.Card = Card;
package/dist/index.esm.js CHANGED
@@ -845,6 +845,36 @@ var WindowsIcon = function WindowsIcon(_ref23) {
845
845
  d: "M3,5.5l7.4-1v7.1H3V5.5z M3,18.5l7.4,1v-7H3V18.5L3,18.5z M11.2,19.6L21,21v-8.5h-9.8V19.6z M11.2,4.4v7.2H21 V3L11.2,4.4z"
846
846
  }));
847
847
  };
848
+ var BroomIcon = function BroomIcon(_ref24) {
849
+ var sx = _ref24.sx;
850
+ return /*#__PURE__*/React__default.createElement(SvgIcon, {
851
+ sx: sx
852
+ }, /*#__PURE__*/React__default.createElement("g", {
853
+ id: "Layer_2"
854
+ }, /*#__PURE__*/React__default.createElement("g", {
855
+ id: "Component_727_4",
856
+ transform: "translate(0.5)"
857
+ }, /*#__PURE__*/React__default.createElement("g", {
858
+ id: "Union_53"
859
+ }, /*#__PURE__*/React__default.createElement("path", {
860
+ d: "M7.1,20.2c1.9-1.2,3.1-2,3.1-2S8,19.5,7.1,19.9c-0.4,0.3-0.9,0.3-1.4,0.2c0,0,2.6-0.7,4.1-2.2c0.9-0.9,1.6-2,2.3-3 c0.3-0.4,0.7-0.7,1.1-0.9l2.5,1.3c0,0.6-0.2,1.2-0.5,1.7c-0.3,0.6-0.6,1.3-0.9,1.9c-0.9,1.2-1.6,1.1-1.6,1.1s0.1,0-0.8,0 c-0.1,0-0.2,0-0.5,0c-0.1,0-0.3,0-0.5,0c-0.2,0-0.5,0-0.8,0.1c-0.4,0-0.7,0.1-1.1,0c0.6-0.2,1.2-0.6,1.8-1 c0.4-0.4,0.7-0.9,0.9-1.5c-0.4,0.5-0.8,1-1.2,1.5c-0.6,0.5-1.4,0.8-2.2,1c-0.1,0-0.3,0-0.4,0c-0.1,0-0.3,0-0.4,0 C7.4,20.2,7.2,20.2,7.1,20.2z M13.4,13.7l0-1.2c0-0.1,0.1-0.2,0.2-0.2c0,0,0.1,0,0.1,0l1,0.5L19.4,4c0.1-0.2,0.3-0.2,0.4-0.1 L20.3,4c0.2,0.1,0.2,0.3,0.1,0.4c0,0,0,0,0,0l-4.5,8.8l1,0.5c0.1,0.1,0.2,0.2,0.1,0.3c0,0,0,0.1-0.1,0.1l-1,0.7L13.4,13.7z"
861
+ })), /*#__PURE__*/React__default.createElement("g", {
862
+ id: "Group_28896",
863
+ transform: "translate(-45.5 3.636)"
864
+ }, /*#__PURE__*/React__default.createElement("g", {
865
+ id: "Line_2285"
866
+ }, /*#__PURE__*/React__default.createElement("path", {
867
+ d: "M53.9,13.8h-6c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h6c0.3,0,0.5,0.2,0.5,0.5S54.2,13.8,53.9,13.8z"
868
+ })), /*#__PURE__*/React__default.createElement("g", {
869
+ id: "Path_16256"
870
+ }, /*#__PURE__*/React__default.createElement("path", {
871
+ d: "M55.1,11.2h-3.9c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h3.9c0.3,0,0.5,0.2,0.5,0.5S55.4,11.2,55.1,11.2z"
872
+ })), /*#__PURE__*/React__default.createElement("g", {
873
+ id: "Line_2287"
874
+ }, /*#__PURE__*/React__default.createElement("path", {
875
+ d: "M56.8,8.6h-1.7c-0.3,0-0.5-0.2-0.5-0.5c0-0.3,0.2-0.5,0.5-0.5h1.7c0.3,0,0.5,0.2,0.5,0.5C57.3,8.4,57.1,8.6,56.8,8.6z"
876
+ }))))));
877
+ };
848
878
 
849
879
  var BlerpTopRow = function BlerpTopRow(_ref) {
850
880
  var _bite$topReactions, _bite$topReactions2, _bite$topReactions3;
@@ -7036,7 +7066,7 @@ var _templateObject$4, _templateObject2, _templateObject3, _templateObject4, _te
7036
7066
  var YellowHoverBorder = styled.div(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteral(["\n position: absolute;\n height: 105%;\n width: 105%;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n border: 4px solid rgb(255, 225, 76);\n border-radius: 20px;\n transition: opacity 0.3s ease-in-out;\n /* Opacity should be changed to \"1\" onHover of this component's parent */\n opacity: 0;\n"])));
7037
7067
  var LineClamp$1 = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n margin: 5px 0;\n"])));
7038
7068
  var TopPill = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n display: flex;\n justify-content: center;\n align-items: center;\n height: 32px;\n width: ", ";\n position: absolute;\n top: 8px;\n left: 8px;\n border-radius: 20px;\n overflow: hidden;\n transition: width 0.3s ease-in-out;\n"])), function (props) {
7039
- return props.isLocked ? props.collectionHovered ? "90%" : "65%" : "45%";
7069
+ return props.isLocked ? props.collectionHovered ? "90%" : "70%" : "45%";
7040
7070
  });
7041
7071
  var TopPillBackground = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n height: 32px;\n width: 100%;\n position: absolute;\n background-color: ", ";\n opacity: 0.5;\n"])), function (props) {
7042
7072
  return props.theme.colors.notBlack;
@@ -7067,7 +7097,11 @@ var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
7067
7097
  fluid = _ref.fluid,
7068
7098
  fontSize = _ref.fontSize,
7069
7099
  isLink = _ref.isLink,
7070
- isLocked = _ref.isLocked;
7100
+ isLocked = _ref.isLocked,
7101
+ overrideViewText = _ref.overrideViewText,
7102
+ hideUnlockPlatformText = _ref.hideUnlockPlatformText,
7103
+ hidePremiumLockIcon = _ref.hidePremiumLockIcon,
7104
+ unlockPlatformText = _ref.unlockPlatformText;
7071
7105
 
7072
7106
  var _useState = useState(null),
7073
7107
  _useState2 = _slicedToArray(_useState, 2),
@@ -7312,13 +7346,14 @@ var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
7312
7346
  fontWeight: "lighter",
7313
7347
  fontSize: ".8em"
7314
7348
  }
7315
- }, "Premium")), /*#__PURE__*/React__default.createElement(Stack, null, /*#__PURE__*/React__default.createElement(LockRoundedIcon, {
7349
+ }, "Premium")), !hidePremiumLockIcon && /*#__PURE__*/React__default.createElement(Stack, null, /*#__PURE__*/React__default.createElement(LockRoundedIcon, {
7316
7350
  sx: {
7317
7351
  position: "absolute",
7318
7352
  top: "8px",
7319
7353
  right: "5px",
7320
7354
  height: ".6em",
7321
7355
  color: "white.main",
7356
+ paddingRight: "8px",
7322
7357
  opacity: isLocked ? collectionHovered ? "0" : "1" : "0",
7323
7358
  transition: "opacity .2s ease-in-out"
7324
7359
  },
@@ -7413,7 +7448,7 @@ var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
7413
7448
  style: {
7414
7449
  margin: "0px -64px"
7415
7450
  }
7416
- })), /*#__PURE__*/React__default.createElement(Text, {
7451
+ })), !hideUnlockPlatformText && (unlockPlatformText ? /*#__PURE__*/React__default.createElement(Text, {
7417
7452
  sx: {
7418
7453
  color: "white.override",
7419
7454
  textAlign: "center",
@@ -7422,7 +7457,16 @@ var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
7422
7457
  zIndex: "3",
7423
7458
  fontSize: ".8rem"
7424
7459
  }
7425
- }, "Unlock to share ", /*#__PURE__*/React__default.createElement("br", null), "across platforms"), /*#__PURE__*/React__default.createElement(Button, {
7460
+ }, unlockPlatformText) : /*#__PURE__*/React__default.createElement(Text, {
7461
+ sx: {
7462
+ color: "white.override",
7463
+ textAlign: "center",
7464
+ lineHeight: "1",
7465
+ margin: "4px 0",
7466
+ zIndex: "3",
7467
+ fontSize: ".8rem"
7468
+ }
7469
+ }, "Unlock to share ", /*#__PURE__*/React__default.createElement("br", null), "across platforms")), handleClickView && /*#__PURE__*/React__default.createElement(Button, {
7426
7470
  disabled: !collectionHovered,
7427
7471
  onClick: function onClick(e) {
7428
7472
  e.stopPropagation();
@@ -7435,7 +7479,7 @@ var PremiumCollectionCard = function PremiumCollectionCard(_ref) {
7435
7479
  padding: "4px 8px",
7436
7480
  margin: "4px 0"
7437
7481
  }
7438
- }, "VIEW SOUNDPACK"), /*#__PURE__*/React__default.createElement(Button, {
7482
+ }, overrideViewText || "VIEW SOUNDPACK"), handleClickUnlock && /*#__PURE__*/React__default.createElement(Button, {
7439
7483
  disabled: !collectionHovered,
7440
7484
  onClick: function onClick(e) {
7441
7485
  e.stopPropagation();
@@ -7503,7 +7547,11 @@ var CollectionCard$1 = function CollectionCard(_ref) {
7503
7547
  isLink = _ref.isLink,
7504
7548
  isPremium = _ref.isPremium,
7505
7549
  isLocked = _ref.isLocked,
7506
- isOwner = _ref.isOwner;
7550
+ isOwner = _ref.isOwner,
7551
+ overrideViewText = _ref.overrideViewText,
7552
+ hideUnlockPlatformText = _ref.hideUnlockPlatformText,
7553
+ hidePremiumLockIcon = _ref.hidePremiumLockIcon;
7554
+ _ref.unlockPlatformText;
7507
7555
 
7508
7556
  var _useState = useState(null),
7509
7557
  _useState2 = _slicedToArray(_useState, 2),
@@ -7627,7 +7675,10 @@ var CollectionCard$1 = function CollectionCard(_ref) {
7627
7675
  fontSize: fontSize,
7628
7676
  isLink: isLink,
7629
7677
  isPremium: isPremium,
7630
- isLocked: isLocked
7678
+ isLocked: isLocked,
7679
+ overrideViewText: overrideViewText,
7680
+ hideUnlockPlatformText: hideUnlockPlatformText,
7681
+ hidePremiumLockIcon: hidePremiumLockIcon
7631
7682
  });
7632
7683
  }
7633
7684
 
@@ -89851,4 +89902,4 @@ var Themes = {
89851
89902
  // };
89852
89903
  // export default returnLibrary();
89853
89904
 
89854
- export { Accordion, Alert, AppBar, Autocomplete, Avatar, Backdrop, Badge, Blerp, BlerpCardIcon, BlerpCoinsIcon, BlerpListView, BlerpListViewPremium, BlerpListViewSkeleton, BlerpSkeleton, BlerpyIcon, BookmarkAddRounded, BottomNavigation, Box, Breadcrumbs, Button, ButtonGroup, Card, ChannelPointsIcon, Checkbox, CheckoutModal, Chip, ClockIcon, CogIcon, CollectionCard, CollectionListViewPremium, CollectionSkeleton, Container, CrownIcon, Dialog, DiamondIcon, DiscordIcon, Divider, Drawer, Dropdown, FloatingActionButton, GiftIcon, Grid, IconButton, ImageList, Input, InputAdornment, LightbulbIcon, LinearProgress, Link, List, Menu, MenuItem, Modal, NewCollectionModal, OpenLockIcon, Pagination, Paper, PlayOutlineIcon, PlaySolidIcon, PointerFingerIcon, Popover, PremiumBlerpCheckoutModal, PremiumCollectionCheckoutModal, PremiumSubscriptionCheckoutModal, RadarDishIcon, RadioButton, Rating, ReactionButtons, Select, ShortcutIcon, Skeleton, Slider, Snackbar, SnackbarContext, SnackbarProvider, SpeedDial, Stack, Stepper, Switch, Table, Tabs, Text, Theme, Themes, Toggle, Toolbar, Tooltip, TwitchBitIcon, TwitchIcon, UnsafeIcon, UserLibraryHeader, UserProfileHeader, WalkonIcon, WindowsIcon, darkThemeV1, lightThemeV1, mainTheme };
89905
+ export { Accordion, Alert, AppBar, Autocomplete, Avatar, Backdrop, Badge, Blerp, BlerpCardIcon, BlerpCoinsIcon, BlerpListView, BlerpListViewPremium, BlerpListViewSkeleton, BlerpSkeleton, BlerpyIcon, BookmarkAddRounded, BottomNavigation, Box, Breadcrumbs, BroomIcon, Button, ButtonGroup, Card, ChannelPointsIcon, Checkbox, CheckoutModal, Chip, ClockIcon, CogIcon, CollectionCard, CollectionListViewPremium, CollectionSkeleton, Container, CrownIcon, Dialog, DiamondIcon, DiscordIcon, Divider, Drawer, Dropdown, FloatingActionButton, GiftIcon, Grid, IconButton, ImageList, Input, InputAdornment, LightbulbIcon, LinearProgress, Link, List, Menu, MenuItem, Modal, NewCollectionModal, OpenLockIcon, Pagination, Paper, PlayOutlineIcon, PlaySolidIcon, PointerFingerIcon, Popover, PremiumBlerpCheckoutModal, PremiumCollectionCheckoutModal, PremiumSubscriptionCheckoutModal, RadarDishIcon, RadioButton, Rating, ReactionButtons, Select, ShortcutIcon, Skeleton, Slider, Snackbar, SnackbarContext, SnackbarProvider, SpeedDial, Stack, Stepper, Switch, Table, Tabs, Text, Theme, Themes, Toggle, Toolbar, Tooltip, TwitchBitIcon, TwitchIcon, UnsafeIcon, UserLibraryHeader, UserProfileHeader, WalkonIcon, WindowsIcon, darkThemeV1, lightThemeV1, mainTheme };
package/dist/index.umd.js CHANGED
@@ -866,6 +866,36 @@
866
866
  d: "M3,5.5l7.4-1v7.1H3V5.5z M3,18.5l7.4,1v-7H3V18.5L3,18.5z M11.2,19.6L21,21v-8.5h-9.8V19.6z M11.2,4.4v7.2H21 V3L11.2,4.4z"
867
867
  }));
868
868
  };
869
+ var BroomIcon = function BroomIcon(_ref24) {
870
+ var sx = _ref24.sx;
871
+ return /*#__PURE__*/React__default['default'].createElement(material.SvgIcon, {
872
+ sx: sx
873
+ }, /*#__PURE__*/React__default['default'].createElement("g", {
874
+ id: "Layer_2"
875
+ }, /*#__PURE__*/React__default['default'].createElement("g", {
876
+ id: "Component_727_4",
877
+ transform: "translate(0.5)"
878
+ }, /*#__PURE__*/React__default['default'].createElement("g", {
879
+ id: "Union_53"
880
+ }, /*#__PURE__*/React__default['default'].createElement("path", {
881
+ d: "M7.1,20.2c1.9-1.2,3.1-2,3.1-2S8,19.5,7.1,19.9c-0.4,0.3-0.9,0.3-1.4,0.2c0,0,2.6-0.7,4.1-2.2c0.9-0.9,1.6-2,2.3-3 c0.3-0.4,0.7-0.7,1.1-0.9l2.5,1.3c0,0.6-0.2,1.2-0.5,1.7c-0.3,0.6-0.6,1.3-0.9,1.9c-0.9,1.2-1.6,1.1-1.6,1.1s0.1,0-0.8,0 c-0.1,0-0.2,0-0.5,0c-0.1,0-0.3,0-0.5,0c-0.2,0-0.5,0-0.8,0.1c-0.4,0-0.7,0.1-1.1,0c0.6-0.2,1.2-0.6,1.8-1 c0.4-0.4,0.7-0.9,0.9-1.5c-0.4,0.5-0.8,1-1.2,1.5c-0.6,0.5-1.4,0.8-2.2,1c-0.1,0-0.3,0-0.4,0c-0.1,0-0.3,0-0.4,0 C7.4,20.2,7.2,20.2,7.1,20.2z M13.4,13.7l0-1.2c0-0.1,0.1-0.2,0.2-0.2c0,0,0.1,0,0.1,0l1,0.5L19.4,4c0.1-0.2,0.3-0.2,0.4-0.1 L20.3,4c0.2,0.1,0.2,0.3,0.1,0.4c0,0,0,0,0,0l-4.5,8.8l1,0.5c0.1,0.1,0.2,0.2,0.1,0.3c0,0,0,0.1-0.1,0.1l-1,0.7L13.4,13.7z"
882
+ })), /*#__PURE__*/React__default['default'].createElement("g", {
883
+ id: "Group_28896",
884
+ transform: "translate(-45.5 3.636)"
885
+ }, /*#__PURE__*/React__default['default'].createElement("g", {
886
+ id: "Line_2285"
887
+ }, /*#__PURE__*/React__default['default'].createElement("path", {
888
+ d: "M53.9,13.8h-6c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h6c0.3,0,0.5,0.2,0.5,0.5S54.2,13.8,53.9,13.8z"
889
+ })), /*#__PURE__*/React__default['default'].createElement("g", {
890
+ id: "Path_16256"
891
+ }, /*#__PURE__*/React__default['default'].createElement("path", {
892
+ d: "M55.1,11.2h-3.9c-0.3,0-0.5-0.2-0.5-0.5s0.2-0.5,0.5-0.5h3.9c0.3,0,0.5,0.2,0.5,0.5S55.4,11.2,55.1,11.2z"
893
+ })), /*#__PURE__*/React__default['default'].createElement("g", {
894
+ id: "Line_2287"
895
+ }, /*#__PURE__*/React__default['default'].createElement("path", {
896
+ d: "M56.8,8.6h-1.7c-0.3,0-0.5-0.2-0.5-0.5c0-0.3,0.2-0.5,0.5-0.5h1.7c0.3,0,0.5,0.2,0.5,0.5C57.3,8.4,57.1,8.6,56.8,8.6z"
897
+ }))))));
898
+ };
869
899
 
870
900
  var BlerpTopRow = function BlerpTopRow(_ref) {
871
901
  var _bite$topReactions, _bite$topReactions2, _bite$topReactions3;
@@ -7057,7 +7087,7 @@
7057
7087
  var YellowHoverBorder = styled__default['default'].div(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteral__default['default'](["\n position: absolute;\n height: 105%;\n width: 105%;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n border: 4px solid rgb(255, 225, 76);\n border-radius: 20px;\n transition: opacity 0.3s ease-in-out;\n /* Opacity should be changed to \"1\" onHover of this component's parent */\n opacity: 0;\n"])));
7058
7088
  var LineClamp$1 = styled__default['default'].div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral__default['default'](["\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n margin: 5px 0;\n"])));
7059
7089
  var TopPill = styled__default['default'].div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral__default['default'](["\n display: flex;\n justify-content: center;\n align-items: center;\n height: 32px;\n width: ", ";\n position: absolute;\n top: 8px;\n left: 8px;\n border-radius: 20px;\n overflow: hidden;\n transition: width 0.3s ease-in-out;\n"])), function (props) {
7060
- return props.isLocked ? props.collectionHovered ? "90%" : "65%" : "45%";
7090
+ return props.isLocked ? props.collectionHovered ? "90%" : "70%" : "45%";
7061
7091
  });
7062
7092
  var TopPillBackground = styled__default['default'].div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral__default['default'](["\n height: 32px;\n width: 100%;\n position: absolute;\n background-color: ", ";\n opacity: 0.5;\n"])), function (props) {
7063
7093
  return props.theme.colors.notBlack;
@@ -7088,7 +7118,11 @@
7088
7118
  fluid = _ref.fluid,
7089
7119
  fontSize = _ref.fontSize,
7090
7120
  isLink = _ref.isLink,
7091
- isLocked = _ref.isLocked;
7121
+ isLocked = _ref.isLocked,
7122
+ overrideViewText = _ref.overrideViewText,
7123
+ hideUnlockPlatformText = _ref.hideUnlockPlatformText,
7124
+ hidePremiumLockIcon = _ref.hidePremiumLockIcon,
7125
+ unlockPlatformText = _ref.unlockPlatformText;
7092
7126
 
7093
7127
  var _useState = React.useState(null),
7094
7128
  _useState2 = _slicedToArray__default['default'](_useState, 2),
@@ -7333,13 +7367,14 @@
7333
7367
  fontWeight: "lighter",
7334
7368
  fontSize: ".8em"
7335
7369
  }
7336
- }, "Premium")), /*#__PURE__*/React__default['default'].createElement(Stack, null, /*#__PURE__*/React__default['default'].createElement(LockRoundedIcon__default['default'], {
7370
+ }, "Premium")), !hidePremiumLockIcon && /*#__PURE__*/React__default['default'].createElement(Stack, null, /*#__PURE__*/React__default['default'].createElement(LockRoundedIcon__default['default'], {
7337
7371
  sx: {
7338
7372
  position: "absolute",
7339
7373
  top: "8px",
7340
7374
  right: "5px",
7341
7375
  height: ".6em",
7342
7376
  color: "white.main",
7377
+ paddingRight: "8px",
7343
7378
  opacity: isLocked ? collectionHovered ? "0" : "1" : "0",
7344
7379
  transition: "opacity .2s ease-in-out"
7345
7380
  },
@@ -7434,7 +7469,7 @@
7434
7469
  style: {
7435
7470
  margin: "0px -64px"
7436
7471
  }
7437
- })), /*#__PURE__*/React__default['default'].createElement(Text, {
7472
+ })), !hideUnlockPlatformText && (unlockPlatformText ? /*#__PURE__*/React__default['default'].createElement(Text, {
7438
7473
  sx: {
7439
7474
  color: "white.override",
7440
7475
  textAlign: "center",
@@ -7443,7 +7478,16 @@
7443
7478
  zIndex: "3",
7444
7479
  fontSize: ".8rem"
7445
7480
  }
7446
- }, "Unlock to share ", /*#__PURE__*/React__default['default'].createElement("br", null), "across platforms"), /*#__PURE__*/React__default['default'].createElement(Button, {
7481
+ }, unlockPlatformText) : /*#__PURE__*/React__default['default'].createElement(Text, {
7482
+ sx: {
7483
+ color: "white.override",
7484
+ textAlign: "center",
7485
+ lineHeight: "1",
7486
+ margin: "4px 0",
7487
+ zIndex: "3",
7488
+ fontSize: ".8rem"
7489
+ }
7490
+ }, "Unlock to share ", /*#__PURE__*/React__default['default'].createElement("br", null), "across platforms")), handleClickView && /*#__PURE__*/React__default['default'].createElement(Button, {
7447
7491
  disabled: !collectionHovered,
7448
7492
  onClick: function onClick(e) {
7449
7493
  e.stopPropagation();
@@ -7456,7 +7500,7 @@
7456
7500
  padding: "4px 8px",
7457
7501
  margin: "4px 0"
7458
7502
  }
7459
- }, "VIEW SOUNDPACK"), /*#__PURE__*/React__default['default'].createElement(Button, {
7503
+ }, overrideViewText || "VIEW SOUNDPACK"), handleClickUnlock && /*#__PURE__*/React__default['default'].createElement(Button, {
7460
7504
  disabled: !collectionHovered,
7461
7505
  onClick: function onClick(e) {
7462
7506
  e.stopPropagation();
@@ -7524,7 +7568,11 @@
7524
7568
  isLink = _ref.isLink,
7525
7569
  isPremium = _ref.isPremium,
7526
7570
  isLocked = _ref.isLocked,
7527
- isOwner = _ref.isOwner;
7571
+ isOwner = _ref.isOwner,
7572
+ overrideViewText = _ref.overrideViewText,
7573
+ hideUnlockPlatformText = _ref.hideUnlockPlatformText,
7574
+ hidePremiumLockIcon = _ref.hidePremiumLockIcon;
7575
+ _ref.unlockPlatformText;
7528
7576
 
7529
7577
  var _useState = React.useState(null),
7530
7578
  _useState2 = _slicedToArray__default['default'](_useState, 2),
@@ -7648,7 +7696,10 @@
7648
7696
  fontSize: fontSize,
7649
7697
  isLink: isLink,
7650
7698
  isPremium: isPremium,
7651
- isLocked: isLocked
7699
+ isLocked: isLocked,
7700
+ overrideViewText: overrideViewText,
7701
+ hideUnlockPlatformText: hideUnlockPlatformText,
7702
+ hidePremiumLockIcon: hidePremiumLockIcon
7652
7703
  });
7653
7704
  }
7654
7705
 
@@ -89891,6 +89942,7 @@
89891
89942
  exports.BottomNavigation = BottomNavigation;
89892
89943
  exports.Box = Box;
89893
89944
  exports.Breadcrumbs = Breadcrumbs;
89945
+ exports.BroomIcon = BroomIcon;
89894
89946
  exports.Button = Button;
89895
89947
  exports.ButtonGroup = ButtonGroup;
89896
89948
  exports.Card = Card;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@blerp/design",
3
- "version": "1.0.56",
3
+ "version": "1.0.60",
4
4
  "description": "Blerp UI",
5
5
  "main": "dist/index.cjs.js",
6
6
  "scripts": {