@blerp/design 1.2.0 → 1.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs.js +134 -2
- package/dist/index.esm.js +134 -3
- package/dist/index.umd.js +134 -2
- package/package.json +1 -1
package/dist/index.cjs.js
CHANGED
|
@@ -3185,7 +3185,7 @@ function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) {
|
|
|
3185
3185
|
// }
|
|
3186
3186
|
// `;
|
|
3187
3187
|
|
|
3188
|
-
var
|
|
3188
|
+
var NewDropdown$1 = function NewDropdown(_ref) {
|
|
3189
3189
|
var buttonTitle = _ref.buttonTitle,
|
|
3190
3190
|
buttonLabel = _ref.buttonLabel,
|
|
3191
3191
|
buttonStyle = _ref.buttonStyle,
|
|
@@ -3230,7 +3230,7 @@ var Dropdown$1 = function Dropdown(_ref) {
|
|
|
3230
3230
|
noWrap: true,
|
|
3231
3231
|
fontSize: "0.75em",
|
|
3232
3232
|
color: "grey4.main",
|
|
3233
|
-
fontWeight: "
|
|
3233
|
+
fontWeight: "400",
|
|
3234
3234
|
sx: {
|
|
3235
3235
|
position: "absolute",
|
|
3236
3236
|
top: "-9px",
|
|
@@ -3321,6 +3321,136 @@ var Dropdown$1 = function Dropdown(_ref) {
|
|
|
3321
3321
|
}, option.name), option.endImageIcon ? option.endImageIcon : /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null));
|
|
3322
3322
|
})));
|
|
3323
3323
|
};
|
|
3324
|
+
var Dropdown$1 = function Dropdown(_ref2) {
|
|
3325
|
+
var buttonTitle = _ref2.buttonTitle,
|
|
3326
|
+
buttonLabel = _ref2.buttonLabel,
|
|
3327
|
+
buttonStyle = _ref2.buttonStyle,
|
|
3328
|
+
paperStyle = _ref2.paperStyle;
|
|
3329
|
+
_ref2.buttonVariant;
|
|
3330
|
+
var handleOptionClicked = _ref2.handleOptionClicked,
|
|
3331
|
+
startIcon = _ref2.startIcon,
|
|
3332
|
+
endIcon = _ref2.endIcon,
|
|
3333
|
+
options = _ref2.options;
|
|
3334
|
+
|
|
3335
|
+
var _useState3 = React.useState(null),
|
|
3336
|
+
_useState4 = _slicedToArray__default['default'](_useState3, 2),
|
|
3337
|
+
anchorEl = _useState4[0],
|
|
3338
|
+
setAnchorEl = _useState4[1];
|
|
3339
|
+
|
|
3340
|
+
var open = Boolean(anchorEl);
|
|
3341
|
+
|
|
3342
|
+
var handleClick = function handleClick(event) {
|
|
3343
|
+
// console.log(options);
|
|
3344
|
+
setAnchorEl(event.currentTarget);
|
|
3345
|
+
};
|
|
3346
|
+
|
|
3347
|
+
var handleClose = function handleClose() {
|
|
3348
|
+
setAnchorEl(null);
|
|
3349
|
+
};
|
|
3350
|
+
|
|
3351
|
+
return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(Button, {
|
|
3352
|
+
onClick: function onClick(e) {
|
|
3353
|
+
return handleClick(e);
|
|
3354
|
+
},
|
|
3355
|
+
variant: "contained",
|
|
3356
|
+
color: "waxwing",
|
|
3357
|
+
icon: true,
|
|
3358
|
+
disableElevation: true,
|
|
3359
|
+
sx: _objectSpread$3({
|
|
3360
|
+
borderRadius: "4px",
|
|
3361
|
+
color: "notBlack.main",
|
|
3362
|
+
paddingRight: "4px",
|
|
3363
|
+
paddingLeft: "4px"
|
|
3364
|
+
}, buttonStyle)
|
|
3365
|
+
}, /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
3366
|
+
direction: "row",
|
|
3367
|
+
justifyContent: "space-between",
|
|
3368
|
+
alignItems: "center",
|
|
3369
|
+
width: "100%"
|
|
3370
|
+
}, /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
3371
|
+
direction: "row",
|
|
3372
|
+
alignItems: "center",
|
|
3373
|
+
overflow: "hidden",
|
|
3374
|
+
width: "".concat(anchorEl === null || anchorEl === void 0 ? void 0 : anchorEl.getBoundingClientRect().width, "px")
|
|
3375
|
+
}, startIcon, /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
3376
|
+
alignItems: "flex-start",
|
|
3377
|
+
marginLeft: "12px"
|
|
3378
|
+
}, buttonLabel && /*#__PURE__*/React__default['default'].createElement(Text, {
|
|
3379
|
+
noWrap: true,
|
|
3380
|
+
fontSize: "8px",
|
|
3381
|
+
color: "grey4.main",
|
|
3382
|
+
fontWeight: "light"
|
|
3383
|
+
}, buttonLabel), /*#__PURE__*/React__default['default'].createElement(Text, {
|
|
3384
|
+
noWrap: true,
|
|
3385
|
+
fontSize: "14px",
|
|
3386
|
+
color: "grey5.main",
|
|
3387
|
+
marginRight: "16px"
|
|
3388
|
+
}, buttonTitle))), endIcon ? endIcon : /*#__PURE__*/React__default['default'].createElement(KeyboardArrowDownRoundedIcon__default['default'], {
|
|
3389
|
+
sx: {
|
|
3390
|
+
color: "grey5.main"
|
|
3391
|
+
},
|
|
3392
|
+
fontSize: "medium"
|
|
3393
|
+
}))), /*#__PURE__*/React__default['default'].createElement(Menu, {
|
|
3394
|
+
id: "demo-customized-menu",
|
|
3395
|
+
MenuListProps: {
|
|
3396
|
+
"aria-labelledby": "demo-customized-button"
|
|
3397
|
+
},
|
|
3398
|
+
anchorEl: anchorEl,
|
|
3399
|
+
open: open,
|
|
3400
|
+
onClose: handleClose,
|
|
3401
|
+
elevation: 0,
|
|
3402
|
+
sx: {
|
|
3403
|
+
top: "10px"
|
|
3404
|
+
},
|
|
3405
|
+
anchorOrigin: {
|
|
3406
|
+
vertical: "bottom",
|
|
3407
|
+
horizontal: "left"
|
|
3408
|
+
},
|
|
3409
|
+
transformOrigin: {
|
|
3410
|
+
vertical: "top",
|
|
3411
|
+
horizontal: "left"
|
|
3412
|
+
},
|
|
3413
|
+
PaperProps: {
|
|
3414
|
+
sx: _objectSpread$3({
|
|
3415
|
+
"& ul": {
|
|
3416
|
+
padding: "0"
|
|
3417
|
+
},
|
|
3418
|
+
width: anchorEl === null || anchorEl === void 0 ? void 0 : anchorEl.getBoundingClientRect().width,
|
|
3419
|
+
backgroundColor: "waxwing.main",
|
|
3420
|
+
boxShadow: "0px 0px 20px #0000001a;"
|
|
3421
|
+
}, paperStyle)
|
|
3422
|
+
}
|
|
3423
|
+
}, options === null || options === void 0 ? void 0 : options.map(function (option) {
|
|
3424
|
+
return /*#__PURE__*/React__default['default'].createElement(MenuItem, {
|
|
3425
|
+
key: "dropdown-".concat(option.name),
|
|
3426
|
+
selected: buttonTitle === option.name,
|
|
3427
|
+
sx: {
|
|
3428
|
+
borderRadius: "4px",
|
|
3429
|
+
"&.Mui-selected": {
|
|
3430
|
+
backgroundColor: "ibisRed.main"
|
|
3431
|
+
},
|
|
3432
|
+
":hover": {
|
|
3433
|
+
backgroundColor: "ibisRed.main"
|
|
3434
|
+
},
|
|
3435
|
+
":hover p": {
|
|
3436
|
+
color: "white.override"
|
|
3437
|
+
},
|
|
3438
|
+
"&.Mui-selected:hover": {
|
|
3439
|
+
backgroundColor: "ibisRed.main"
|
|
3440
|
+
},
|
|
3441
|
+
"&.Mui-selected p": {
|
|
3442
|
+
color: "white.override"
|
|
3443
|
+
}
|
|
3444
|
+
},
|
|
3445
|
+
onClick: function onClick() {
|
|
3446
|
+
handleOptionClicked(option);
|
|
3447
|
+
handleClose();
|
|
3448
|
+
}
|
|
3449
|
+
}, option.startImageIcon ? option.startImageIcon : /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null), /*#__PURE__*/React__default['default'].createElement(Text, {
|
|
3450
|
+
noWrap: true
|
|
3451
|
+
}, option.name), option.endImageIcon ? option.endImageIcon : /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null));
|
|
3452
|
+
})));
|
|
3453
|
+
};
|
|
3324
3454
|
|
|
3325
3455
|
var _templateObject$9, _templateObject2$4;
|
|
3326
3456
|
var Slider$1 = styled__default['default'].input(_templateObject$9 || (_templateObject$9 = _taggedTemplateLiteral__default['default'](["\n -webkit-appearance: none;\n align-self: center;\n width: 80%;\n height: 5px;\n border-radius: 5px;\n background: #d3d3d3;\n outline: none;\n opacity: 0.7;\n -webkit-transition: 0.2s;\n transition: opacity 0.2s;\n\n &:focus {\n border: 0px !important;\n }\n\n &:hover {\n opacity: 1;\n }\n\n &::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 25px;\n height: 25px;\n border-radius: 50%;\n background: ", ";\n border: 2px solid ", ";\n cursor: pointer;\n }\n\n &::-moz-range-thumb {\n width: 25px;\n height: 25px;\n border-radius: 50%;\n background: ", ";\n border: 2px solid ", ";\n cursor: pointer;\n }\n"])), function (props) {
|
|
@@ -90151,6 +90281,7 @@ var Blerp = Blerp$1;
|
|
|
90151
90281
|
var IconButton = material.IconButton;
|
|
90152
90282
|
var Toggle = Toggle$1;
|
|
90153
90283
|
var Dropdown = Dropdown$1;
|
|
90284
|
+
var NewDropdown = NewDropdown$1;
|
|
90154
90285
|
var MenuItem = material.MenuItem;
|
|
90155
90286
|
var NewCollectionModal = NewCollectionModal$1;
|
|
90156
90287
|
var CollectionCard = CollectionCard$1;
|
|
@@ -90454,6 +90585,7 @@ exports.MenuItem = MenuItem;
|
|
|
90454
90585
|
exports.Modal = Modal;
|
|
90455
90586
|
exports.NewCollectionModal = NewCollectionModal;
|
|
90456
90587
|
exports.NewDiscordIcon = NewDiscordIcon;
|
|
90588
|
+
exports.NewDropdown = NewDropdown;
|
|
90457
90589
|
exports.OpenLockIcon = OpenLockIcon;
|
|
90458
90590
|
exports.Pagination = Pagination;
|
|
90459
90591
|
exports.Paper = Paper;
|
package/dist/index.esm.js
CHANGED
|
@@ -3116,7 +3116,7 @@ function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) {
|
|
|
3116
3116
|
// }
|
|
3117
3117
|
// `;
|
|
3118
3118
|
|
|
3119
|
-
var
|
|
3119
|
+
var NewDropdown$1 = function NewDropdown(_ref) {
|
|
3120
3120
|
var buttonTitle = _ref.buttonTitle,
|
|
3121
3121
|
buttonLabel = _ref.buttonLabel,
|
|
3122
3122
|
buttonStyle = _ref.buttonStyle,
|
|
@@ -3161,7 +3161,7 @@ var Dropdown$1 = function Dropdown(_ref) {
|
|
|
3161
3161
|
noWrap: true,
|
|
3162
3162
|
fontSize: "0.75em",
|
|
3163
3163
|
color: "grey4.main",
|
|
3164
|
-
fontWeight: "
|
|
3164
|
+
fontWeight: "400",
|
|
3165
3165
|
sx: {
|
|
3166
3166
|
position: "absolute",
|
|
3167
3167
|
top: "-9px",
|
|
@@ -3252,6 +3252,136 @@ var Dropdown$1 = function Dropdown(_ref) {
|
|
|
3252
3252
|
}, option.name), option.endImageIcon ? option.endImageIcon : /*#__PURE__*/React__default.createElement(React__default.Fragment, null));
|
|
3253
3253
|
})));
|
|
3254
3254
|
};
|
|
3255
|
+
var Dropdown$1 = function Dropdown(_ref2) {
|
|
3256
|
+
var buttonTitle = _ref2.buttonTitle,
|
|
3257
|
+
buttonLabel = _ref2.buttonLabel,
|
|
3258
|
+
buttonStyle = _ref2.buttonStyle,
|
|
3259
|
+
paperStyle = _ref2.paperStyle;
|
|
3260
|
+
_ref2.buttonVariant;
|
|
3261
|
+
var handleOptionClicked = _ref2.handleOptionClicked,
|
|
3262
|
+
startIcon = _ref2.startIcon,
|
|
3263
|
+
endIcon = _ref2.endIcon,
|
|
3264
|
+
options = _ref2.options;
|
|
3265
|
+
|
|
3266
|
+
var _useState3 = useState(null),
|
|
3267
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
3268
|
+
anchorEl = _useState4[0],
|
|
3269
|
+
setAnchorEl = _useState4[1];
|
|
3270
|
+
|
|
3271
|
+
var open = Boolean(anchorEl);
|
|
3272
|
+
|
|
3273
|
+
var handleClick = function handleClick(event) {
|
|
3274
|
+
// console.log(options);
|
|
3275
|
+
setAnchorEl(event.currentTarget);
|
|
3276
|
+
};
|
|
3277
|
+
|
|
3278
|
+
var handleClose = function handleClose() {
|
|
3279
|
+
setAnchorEl(null);
|
|
3280
|
+
};
|
|
3281
|
+
|
|
3282
|
+
return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Button, {
|
|
3283
|
+
onClick: function onClick(e) {
|
|
3284
|
+
return handleClick(e);
|
|
3285
|
+
},
|
|
3286
|
+
variant: "contained",
|
|
3287
|
+
color: "waxwing",
|
|
3288
|
+
icon: true,
|
|
3289
|
+
disableElevation: true,
|
|
3290
|
+
sx: _objectSpread$3({
|
|
3291
|
+
borderRadius: "4px",
|
|
3292
|
+
color: "notBlack.main",
|
|
3293
|
+
paddingRight: "4px",
|
|
3294
|
+
paddingLeft: "4px"
|
|
3295
|
+
}, buttonStyle)
|
|
3296
|
+
}, /*#__PURE__*/React__default.createElement(Stack, {
|
|
3297
|
+
direction: "row",
|
|
3298
|
+
justifyContent: "space-between",
|
|
3299
|
+
alignItems: "center",
|
|
3300
|
+
width: "100%"
|
|
3301
|
+
}, /*#__PURE__*/React__default.createElement(Stack, {
|
|
3302
|
+
direction: "row",
|
|
3303
|
+
alignItems: "center",
|
|
3304
|
+
overflow: "hidden",
|
|
3305
|
+
width: "".concat(anchorEl === null || anchorEl === void 0 ? void 0 : anchorEl.getBoundingClientRect().width, "px")
|
|
3306
|
+
}, startIcon, /*#__PURE__*/React__default.createElement(Stack, {
|
|
3307
|
+
alignItems: "flex-start",
|
|
3308
|
+
marginLeft: "12px"
|
|
3309
|
+
}, buttonLabel && /*#__PURE__*/React__default.createElement(Text, {
|
|
3310
|
+
noWrap: true,
|
|
3311
|
+
fontSize: "8px",
|
|
3312
|
+
color: "grey4.main",
|
|
3313
|
+
fontWeight: "light"
|
|
3314
|
+
}, buttonLabel), /*#__PURE__*/React__default.createElement(Text, {
|
|
3315
|
+
noWrap: true,
|
|
3316
|
+
fontSize: "14px",
|
|
3317
|
+
color: "grey5.main",
|
|
3318
|
+
marginRight: "16px"
|
|
3319
|
+
}, buttonTitle))), endIcon ? endIcon : /*#__PURE__*/React__default.createElement(KeyboardArrowDownRoundedIcon, {
|
|
3320
|
+
sx: {
|
|
3321
|
+
color: "grey5.main"
|
|
3322
|
+
},
|
|
3323
|
+
fontSize: "medium"
|
|
3324
|
+
}))), /*#__PURE__*/React__default.createElement(Menu, {
|
|
3325
|
+
id: "demo-customized-menu",
|
|
3326
|
+
MenuListProps: {
|
|
3327
|
+
"aria-labelledby": "demo-customized-button"
|
|
3328
|
+
},
|
|
3329
|
+
anchorEl: anchorEl,
|
|
3330
|
+
open: open,
|
|
3331
|
+
onClose: handleClose,
|
|
3332
|
+
elevation: 0,
|
|
3333
|
+
sx: {
|
|
3334
|
+
top: "10px"
|
|
3335
|
+
},
|
|
3336
|
+
anchorOrigin: {
|
|
3337
|
+
vertical: "bottom",
|
|
3338
|
+
horizontal: "left"
|
|
3339
|
+
},
|
|
3340
|
+
transformOrigin: {
|
|
3341
|
+
vertical: "top",
|
|
3342
|
+
horizontal: "left"
|
|
3343
|
+
},
|
|
3344
|
+
PaperProps: {
|
|
3345
|
+
sx: _objectSpread$3({
|
|
3346
|
+
"& ul": {
|
|
3347
|
+
padding: "0"
|
|
3348
|
+
},
|
|
3349
|
+
width: anchorEl === null || anchorEl === void 0 ? void 0 : anchorEl.getBoundingClientRect().width,
|
|
3350
|
+
backgroundColor: "waxwing.main",
|
|
3351
|
+
boxShadow: "0px 0px 20px #0000001a;"
|
|
3352
|
+
}, paperStyle)
|
|
3353
|
+
}
|
|
3354
|
+
}, options === null || options === void 0 ? void 0 : options.map(function (option) {
|
|
3355
|
+
return /*#__PURE__*/React__default.createElement(MenuItem, {
|
|
3356
|
+
key: "dropdown-".concat(option.name),
|
|
3357
|
+
selected: buttonTitle === option.name,
|
|
3358
|
+
sx: {
|
|
3359
|
+
borderRadius: "4px",
|
|
3360
|
+
"&.Mui-selected": {
|
|
3361
|
+
backgroundColor: "ibisRed.main"
|
|
3362
|
+
},
|
|
3363
|
+
":hover": {
|
|
3364
|
+
backgroundColor: "ibisRed.main"
|
|
3365
|
+
},
|
|
3366
|
+
":hover p": {
|
|
3367
|
+
color: "white.override"
|
|
3368
|
+
},
|
|
3369
|
+
"&.Mui-selected:hover": {
|
|
3370
|
+
backgroundColor: "ibisRed.main"
|
|
3371
|
+
},
|
|
3372
|
+
"&.Mui-selected p": {
|
|
3373
|
+
color: "white.override"
|
|
3374
|
+
}
|
|
3375
|
+
},
|
|
3376
|
+
onClick: function onClick() {
|
|
3377
|
+
handleOptionClicked(option);
|
|
3378
|
+
handleClose();
|
|
3379
|
+
}
|
|
3380
|
+
}, option.startImageIcon ? option.startImageIcon : /*#__PURE__*/React__default.createElement(React__default.Fragment, null), /*#__PURE__*/React__default.createElement(Text, {
|
|
3381
|
+
noWrap: true
|
|
3382
|
+
}, option.name), option.endImageIcon ? option.endImageIcon : /*#__PURE__*/React__default.createElement(React__default.Fragment, null));
|
|
3383
|
+
})));
|
|
3384
|
+
};
|
|
3255
3385
|
|
|
3256
3386
|
var _templateObject$9, _templateObject2$4;
|
|
3257
3387
|
var Slider$1 = styled.input(_templateObject$9 || (_templateObject$9 = _taggedTemplateLiteral(["\n -webkit-appearance: none;\n align-self: center;\n width: 80%;\n height: 5px;\n border-radius: 5px;\n background: #d3d3d3;\n outline: none;\n opacity: 0.7;\n -webkit-transition: 0.2s;\n transition: opacity 0.2s;\n\n &:focus {\n border: 0px !important;\n }\n\n &:hover {\n opacity: 1;\n }\n\n &::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 25px;\n height: 25px;\n border-radius: 50%;\n background: ", ";\n border: 2px solid ", ";\n cursor: pointer;\n }\n\n &::-moz-range-thumb {\n width: 25px;\n height: 25px;\n border-radius: 50%;\n background: ", ";\n border: 2px solid ", ";\n cursor: pointer;\n }\n"])), function (props) {
|
|
@@ -90082,6 +90212,7 @@ var Blerp = Blerp$1;
|
|
|
90082
90212
|
var IconButton = IconButton$1;
|
|
90083
90213
|
var Toggle = Toggle$1;
|
|
90084
90214
|
var Dropdown = Dropdown$1;
|
|
90215
|
+
var NewDropdown = NewDropdown$1;
|
|
90085
90216
|
var MenuItem = MenuItem$1;
|
|
90086
90217
|
var NewCollectionModal = NewCollectionModal$1;
|
|
90087
90218
|
var CollectionCard = CollectionCard$1;
|
|
@@ -90329,4 +90460,4 @@ var Themes = {
|
|
|
90329
90460
|
// };
|
|
90330
90461
|
// export default returnLibrary();
|
|
90331
90462
|
|
|
90332
|
-
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, NewDiscordIcon, OpenLockIcon, Pagination, Paper, PlayOutlineIcon, PlaySolidIcon, PointerFingerIcon, Popover, PremiumBlerpCheckoutModal, PremiumCollectionCheckoutModal, PremiumSubscriptionCheckoutModal, PresentGiftIcon, RadarDishIcon, RadioButton, Rating, ReactionButtons, Select, ShortcutIcon, Skeleton, Slider, Snackbar, SnackbarContext, SnackbarProvider, SparkleGiftIcon, SpeedDial, Stack, Stepper, Switch, Tab, Table, Tabs, Text, Theme, Themes, TikTokIcon, Toggle, Toolbar, Tooltip, TwitchBitIcon, TwitchIcon, UnsafeIcon, UserLibraryHeader, UserProfileHeader, WalkonIcon, WindowsIcon, darkThemeV1, lightThemeV1, mainTheme };
|
|
90463
|
+
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, NewDiscordIcon, NewDropdown, OpenLockIcon, Pagination, Paper, PlayOutlineIcon, PlaySolidIcon, PointerFingerIcon, Popover, PremiumBlerpCheckoutModal, PremiumCollectionCheckoutModal, PremiumSubscriptionCheckoutModal, PresentGiftIcon, RadarDishIcon, RadioButton, Rating, ReactionButtons, Select, ShortcutIcon, Skeleton, Slider, Snackbar, SnackbarContext, SnackbarProvider, SparkleGiftIcon, SpeedDial, Stack, Stepper, Switch, Tab, Table, Tabs, Text, Theme, Themes, TikTokIcon, Toggle, Toolbar, Tooltip, TwitchBitIcon, TwitchIcon, UnsafeIcon, UserLibraryHeader, UserProfileHeader, WalkonIcon, WindowsIcon, darkThemeV1, lightThemeV1, mainTheme };
|
package/dist/index.umd.js
CHANGED
|
@@ -3137,7 +3137,7 @@
|
|
|
3137
3137
|
// }
|
|
3138
3138
|
// `;
|
|
3139
3139
|
|
|
3140
|
-
var
|
|
3140
|
+
var NewDropdown$1 = function NewDropdown(_ref) {
|
|
3141
3141
|
var buttonTitle = _ref.buttonTitle,
|
|
3142
3142
|
buttonLabel = _ref.buttonLabel,
|
|
3143
3143
|
buttonStyle = _ref.buttonStyle,
|
|
@@ -3182,7 +3182,7 @@
|
|
|
3182
3182
|
noWrap: true,
|
|
3183
3183
|
fontSize: "0.75em",
|
|
3184
3184
|
color: "grey4.main",
|
|
3185
|
-
fontWeight: "
|
|
3185
|
+
fontWeight: "400",
|
|
3186
3186
|
sx: {
|
|
3187
3187
|
position: "absolute",
|
|
3188
3188
|
top: "-9px",
|
|
@@ -3273,6 +3273,136 @@
|
|
|
3273
3273
|
}, option.name), option.endImageIcon ? option.endImageIcon : /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null));
|
|
3274
3274
|
})));
|
|
3275
3275
|
};
|
|
3276
|
+
var Dropdown$1 = function Dropdown(_ref2) {
|
|
3277
|
+
var buttonTitle = _ref2.buttonTitle,
|
|
3278
|
+
buttonLabel = _ref2.buttonLabel,
|
|
3279
|
+
buttonStyle = _ref2.buttonStyle,
|
|
3280
|
+
paperStyle = _ref2.paperStyle;
|
|
3281
|
+
_ref2.buttonVariant;
|
|
3282
|
+
var handleOptionClicked = _ref2.handleOptionClicked,
|
|
3283
|
+
startIcon = _ref2.startIcon,
|
|
3284
|
+
endIcon = _ref2.endIcon,
|
|
3285
|
+
options = _ref2.options;
|
|
3286
|
+
|
|
3287
|
+
var _useState3 = React.useState(null),
|
|
3288
|
+
_useState4 = _slicedToArray__default['default'](_useState3, 2),
|
|
3289
|
+
anchorEl = _useState4[0],
|
|
3290
|
+
setAnchorEl = _useState4[1];
|
|
3291
|
+
|
|
3292
|
+
var open = Boolean(anchorEl);
|
|
3293
|
+
|
|
3294
|
+
var handleClick = function handleClick(event) {
|
|
3295
|
+
// console.log(options);
|
|
3296
|
+
setAnchorEl(event.currentTarget);
|
|
3297
|
+
};
|
|
3298
|
+
|
|
3299
|
+
var handleClose = function handleClose() {
|
|
3300
|
+
setAnchorEl(null);
|
|
3301
|
+
};
|
|
3302
|
+
|
|
3303
|
+
return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(Button, {
|
|
3304
|
+
onClick: function onClick(e) {
|
|
3305
|
+
return handleClick(e);
|
|
3306
|
+
},
|
|
3307
|
+
variant: "contained",
|
|
3308
|
+
color: "waxwing",
|
|
3309
|
+
icon: true,
|
|
3310
|
+
disableElevation: true,
|
|
3311
|
+
sx: _objectSpread$3({
|
|
3312
|
+
borderRadius: "4px",
|
|
3313
|
+
color: "notBlack.main",
|
|
3314
|
+
paddingRight: "4px",
|
|
3315
|
+
paddingLeft: "4px"
|
|
3316
|
+
}, buttonStyle)
|
|
3317
|
+
}, /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
3318
|
+
direction: "row",
|
|
3319
|
+
justifyContent: "space-between",
|
|
3320
|
+
alignItems: "center",
|
|
3321
|
+
width: "100%"
|
|
3322
|
+
}, /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
3323
|
+
direction: "row",
|
|
3324
|
+
alignItems: "center",
|
|
3325
|
+
overflow: "hidden",
|
|
3326
|
+
width: "".concat(anchorEl === null || anchorEl === void 0 ? void 0 : anchorEl.getBoundingClientRect().width, "px")
|
|
3327
|
+
}, startIcon, /*#__PURE__*/React__default['default'].createElement(Stack, {
|
|
3328
|
+
alignItems: "flex-start",
|
|
3329
|
+
marginLeft: "12px"
|
|
3330
|
+
}, buttonLabel && /*#__PURE__*/React__default['default'].createElement(Text, {
|
|
3331
|
+
noWrap: true,
|
|
3332
|
+
fontSize: "8px",
|
|
3333
|
+
color: "grey4.main",
|
|
3334
|
+
fontWeight: "light"
|
|
3335
|
+
}, buttonLabel), /*#__PURE__*/React__default['default'].createElement(Text, {
|
|
3336
|
+
noWrap: true,
|
|
3337
|
+
fontSize: "14px",
|
|
3338
|
+
color: "grey5.main",
|
|
3339
|
+
marginRight: "16px"
|
|
3340
|
+
}, buttonTitle))), endIcon ? endIcon : /*#__PURE__*/React__default['default'].createElement(KeyboardArrowDownRoundedIcon__default['default'], {
|
|
3341
|
+
sx: {
|
|
3342
|
+
color: "grey5.main"
|
|
3343
|
+
},
|
|
3344
|
+
fontSize: "medium"
|
|
3345
|
+
}))), /*#__PURE__*/React__default['default'].createElement(Menu, {
|
|
3346
|
+
id: "demo-customized-menu",
|
|
3347
|
+
MenuListProps: {
|
|
3348
|
+
"aria-labelledby": "demo-customized-button"
|
|
3349
|
+
},
|
|
3350
|
+
anchorEl: anchorEl,
|
|
3351
|
+
open: open,
|
|
3352
|
+
onClose: handleClose,
|
|
3353
|
+
elevation: 0,
|
|
3354
|
+
sx: {
|
|
3355
|
+
top: "10px"
|
|
3356
|
+
},
|
|
3357
|
+
anchorOrigin: {
|
|
3358
|
+
vertical: "bottom",
|
|
3359
|
+
horizontal: "left"
|
|
3360
|
+
},
|
|
3361
|
+
transformOrigin: {
|
|
3362
|
+
vertical: "top",
|
|
3363
|
+
horizontal: "left"
|
|
3364
|
+
},
|
|
3365
|
+
PaperProps: {
|
|
3366
|
+
sx: _objectSpread$3({
|
|
3367
|
+
"& ul": {
|
|
3368
|
+
padding: "0"
|
|
3369
|
+
},
|
|
3370
|
+
width: anchorEl === null || anchorEl === void 0 ? void 0 : anchorEl.getBoundingClientRect().width,
|
|
3371
|
+
backgroundColor: "waxwing.main",
|
|
3372
|
+
boxShadow: "0px 0px 20px #0000001a;"
|
|
3373
|
+
}, paperStyle)
|
|
3374
|
+
}
|
|
3375
|
+
}, options === null || options === void 0 ? void 0 : options.map(function (option) {
|
|
3376
|
+
return /*#__PURE__*/React__default['default'].createElement(MenuItem, {
|
|
3377
|
+
key: "dropdown-".concat(option.name),
|
|
3378
|
+
selected: buttonTitle === option.name,
|
|
3379
|
+
sx: {
|
|
3380
|
+
borderRadius: "4px",
|
|
3381
|
+
"&.Mui-selected": {
|
|
3382
|
+
backgroundColor: "ibisRed.main"
|
|
3383
|
+
},
|
|
3384
|
+
":hover": {
|
|
3385
|
+
backgroundColor: "ibisRed.main"
|
|
3386
|
+
},
|
|
3387
|
+
":hover p": {
|
|
3388
|
+
color: "white.override"
|
|
3389
|
+
},
|
|
3390
|
+
"&.Mui-selected:hover": {
|
|
3391
|
+
backgroundColor: "ibisRed.main"
|
|
3392
|
+
},
|
|
3393
|
+
"&.Mui-selected p": {
|
|
3394
|
+
color: "white.override"
|
|
3395
|
+
}
|
|
3396
|
+
},
|
|
3397
|
+
onClick: function onClick() {
|
|
3398
|
+
handleOptionClicked(option);
|
|
3399
|
+
handleClose();
|
|
3400
|
+
}
|
|
3401
|
+
}, option.startImageIcon ? option.startImageIcon : /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null), /*#__PURE__*/React__default['default'].createElement(Text, {
|
|
3402
|
+
noWrap: true
|
|
3403
|
+
}, option.name), option.endImageIcon ? option.endImageIcon : /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null));
|
|
3404
|
+
})));
|
|
3405
|
+
};
|
|
3276
3406
|
|
|
3277
3407
|
var _templateObject$9, _templateObject2$4;
|
|
3278
3408
|
var Slider$1 = styled__default['default'].input(_templateObject$9 || (_templateObject$9 = _taggedTemplateLiteral__default['default'](["\n -webkit-appearance: none;\n align-self: center;\n width: 80%;\n height: 5px;\n border-radius: 5px;\n background: #d3d3d3;\n outline: none;\n opacity: 0.7;\n -webkit-transition: 0.2s;\n transition: opacity 0.2s;\n\n &:focus {\n border: 0px !important;\n }\n\n &:hover {\n opacity: 1;\n }\n\n &::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 25px;\n height: 25px;\n border-radius: 50%;\n background: ", ";\n border: 2px solid ", ";\n cursor: pointer;\n }\n\n &::-moz-range-thumb {\n width: 25px;\n height: 25px;\n border-radius: 50%;\n background: ", ";\n border: 2px solid ", ";\n cursor: pointer;\n }\n"])), function (props) {
|
|
@@ -90103,6 +90233,7 @@
|
|
|
90103
90233
|
var IconButton = material.IconButton;
|
|
90104
90234
|
var Toggle = Toggle$1;
|
|
90105
90235
|
var Dropdown = Dropdown$1;
|
|
90236
|
+
var NewDropdown = NewDropdown$1;
|
|
90106
90237
|
var MenuItem = material.MenuItem;
|
|
90107
90238
|
var NewCollectionModal = NewCollectionModal$1;
|
|
90108
90239
|
var CollectionCard = CollectionCard$1;
|
|
@@ -90406,6 +90537,7 @@
|
|
|
90406
90537
|
exports.Modal = Modal;
|
|
90407
90538
|
exports.NewCollectionModal = NewCollectionModal;
|
|
90408
90539
|
exports.NewDiscordIcon = NewDiscordIcon;
|
|
90540
|
+
exports.NewDropdown = NewDropdown;
|
|
90409
90541
|
exports.OpenLockIcon = OpenLockIcon;
|
|
90410
90542
|
exports.Pagination = Pagination;
|
|
90411
90543
|
exports.Paper = Paper;
|