@blerp/design 1.4.4 → 1.4.6
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/cjs/Blerp/BlerpImageRow.js +22 -15
- package/dist/cjs/Blerp/BlerpSavePopup.js +20 -11
- package/dist/cjs/Blerp/BlerpTitleRow.js +16 -10
- package/dist/cjs/Blerp/BlerpTopRow.js +32 -25
- package/dist/cjs/Blerp.js +8 -7
- package/dist/cjs/BlerpListViewPremium.js +24 -20
- package/dist/cjs/BlerpListViewSkeleton.js +6 -6
- package/dist/cjs/CollectionCard.js +29 -25
- package/dist/cjs/CollectionListViewPremium.js +16 -13
- package/dist/cjs/CollectionSkeleton.js +5 -5
- package/dist/cjs/Dropdown.js +27 -24
- package/dist/cjs/EllipsisLoader.js +4 -3
- package/dist/cjs/GroupCard.js +8 -7
- package/dist/cjs/ImageEditor.js +4 -1
- package/dist/cjs/ImageUpload.js +23 -16
- package/dist/cjs/NewBlerp.js +41 -37
- package/dist/cjs/NewCollectionModal.js +27 -22
- package/dist/cjs/PremiumCollectionCard.js +10 -8
- package/dist/cjs/PurchaseModals/CheckoutModal.js +7 -3
- package/dist/cjs/PurchaseModals/PremiumBlerpCheckoutModal.js +7 -3
- package/dist/cjs/PurchaseModals/PremiumCollectionCheckoutModal.js +7 -3
- package/dist/cjs/PurchaseModals/PremiumSubscriptionCheckoutModal.js +7 -3
- package/dist/cjs/ReactionButtons.js +10 -5
- package/dist/cjs/Theme.js +8 -27
- package/dist/cjs/Toggle.js +1 -1
- package/dist/cjs/UserCard.js +13 -12
- package/dist/cjs/UserPage/LibraryControls.js +40 -29
- package/dist/cjs/UserPage/UserLibraryHeader.js +14 -8
- package/dist/cjs/UserPage/UserProfileHeader.js +28 -19
- package/dist/cjs/UsernameWithPopout.js +6 -4
- package/dist/cjs/colors.js +2 -1
- package/dist/cjs/icons.js +4 -1
- package/dist/cjs/index.js +135 -216
- package/dist/cjs/neo-components/Navigation.js +0 -2
- package/dist/cjs/neo-components/withSx.js +0 -1
- package/dist/cjs/neo-utils/sxToStyle.js +0 -2
- package/dist/esm/Blerp/BlerpImageRow.js +8 -3
- package/dist/esm/Blerp/BlerpSavePopup.js +9 -2
- package/dist/esm/Blerp/BlerpTitleRow.js +9 -5
- package/dist/esm/Blerp/BlerpTopRow.js +10 -5
- package/dist/esm/Blerp.js +2 -1
- package/dist/esm/BlerpListViewPremium.js +9 -5
- package/dist/esm/BlerpListViewSkeleton.js +1 -1
- package/dist/esm/CollectionCard.js +10 -6
- package/dist/esm/CollectionListViewPremium.js +7 -4
- package/dist/esm/CollectionSkeleton.js +1 -1
- package/dist/esm/Dropdown.js +10 -7
- package/dist/esm/EllipsisLoader.js +3 -2
- package/dist/esm/GroupCard.js +4 -3
- package/dist/esm/ImageEditor.js +2 -1
- package/dist/esm/ImageUpload.js +11 -6
- package/dist/esm/NewBlerp.js +13 -9
- package/dist/esm/NewCollectionModal.js +16 -11
- package/dist/esm/PremiumCollectionCard.js +4 -2
- package/dist/esm/PurchaseModals/CheckoutModal.js +4 -2
- package/dist/esm/PurchaseModals/PremiumBlerpCheckoutModal.js +4 -2
- package/dist/esm/PurchaseModals/PremiumCollectionCheckoutModal.js +4 -2
- package/dist/esm/PurchaseModals/PremiumSubscriptionCheckoutModal.js +4 -2
- package/dist/esm/ReactionButtons.js +5 -2
- package/dist/esm/Theme.js +5 -24
- package/dist/esm/Toggle.js +1 -1
- package/dist/esm/UserCard.js +7 -6
- package/dist/esm/UserPage/LibraryControls.js +20 -11
- package/dist/esm/UserPage/UserLibraryHeader.js +6 -2
- package/dist/esm/UserPage/UserProfileHeader.js +12 -5
- package/dist/esm/UsernameWithPopout.js +4 -2
- package/dist/esm/colors.js +2 -1
- package/dist/esm/icons.js +2 -1
- package/dist/esm/index.js +44 -129
- package/dist/esm/neo-components/Navigation.js +0 -2
- package/dist/esm/neo-components/ThemeProvider.js +1 -1
- package/dist/esm/neo-components/withSx.js +0 -1
- package/dist/esm/neo-utils/sxToStyle.js +0 -2
- package/package.json +31 -9
|
@@ -1,14 +1,16 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
4
5
|
var React = require('react');
|
|
6
|
+
var Stack = require('../neo-components/Stack.js');
|
|
5
7
|
|
|
6
8
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
7
9
|
|
|
8
10
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
9
11
|
|
|
10
12
|
const NeedToReplace = props => {
|
|
11
|
-
return /*#__PURE__*/React__default["default"].createElement(
|
|
13
|
+
return /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
|
|
12
14
|
sx: {
|
|
13
15
|
backgroundColor: "white.main",
|
|
14
16
|
width: "900px",
|
|
@@ -36,4 +38,6 @@ const NeedToReplace = props => {
|
|
|
36
38
|
}, "Need to replace to remove payment dependencies");
|
|
37
39
|
};
|
|
38
40
|
|
|
39
|
-
|
|
41
|
+
var NeedToReplace$1 = NeedToReplace;
|
|
42
|
+
|
|
43
|
+
exports["default"] = NeedToReplace$1;
|
|
@@ -1,8 +1,11 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
3
5
|
var React = require('react');
|
|
4
|
-
var index = require('./index.js');
|
|
5
6
|
var Theme = require('./Theme.js');
|
|
7
|
+
var Grid = require('./neo-components/Grid.js');
|
|
8
|
+
var Misc = require('./neo-components/Misc.js');
|
|
6
9
|
|
|
7
10
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
8
11
|
|
|
@@ -26,7 +29,7 @@ const ReactionButtons = _ref => {
|
|
|
26
29
|
} = _ref;
|
|
27
30
|
const theme = Theme.useBlerpTheme();
|
|
28
31
|
const [hoveredReaction, setHoveredReaction] = React__default["default"].useState(null);
|
|
29
|
-
return /*#__PURE__*/React__default["default"].createElement(
|
|
32
|
+
return /*#__PURE__*/React__default["default"].createElement(Grid.Grid, {
|
|
30
33
|
display: "grid",
|
|
31
34
|
gridTemplateColumns: "repeat(4, 1fr)",
|
|
32
35
|
alignItems: "center",
|
|
@@ -37,12 +40,12 @@ const ReactionButtons = _ref => {
|
|
|
37
40
|
|
|
38
41
|
const isActive = bite === null || bite === void 0 ? void 0 : (_bite$userReactions = bite.userReactions) === null || _bite$userReactions === void 0 ? void 0 : (_bite$userReactions$r = _bite$userReactions.reactions) === null || _bite$userReactions$r === void 0 ? void 0 : _bite$userReactions$r.includes(reaction);
|
|
39
42
|
const isHovered = hoveredReaction === reaction;
|
|
40
|
-
return /*#__PURE__*/React__default["default"].createElement(
|
|
43
|
+
return /*#__PURE__*/React__default["default"].createElement(Grid.Grid, {
|
|
41
44
|
key: "".concat(reaction, "-button"),
|
|
42
45
|
gridColumn: "span 1",
|
|
43
46
|
display: "flex",
|
|
44
47
|
justifyContent: "center"
|
|
45
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
48
|
+
}, /*#__PURE__*/React__default["default"].createElement(Misc.Tooltip, {
|
|
46
49
|
title: reaction
|
|
47
50
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
48
51
|
style: {
|
|
@@ -75,4 +78,6 @@ const ReactionButtons = _ref => {
|
|
|
75
78
|
}));
|
|
76
79
|
};
|
|
77
80
|
|
|
78
|
-
|
|
81
|
+
var ReactionButtons$1 = ReactionButtons;
|
|
82
|
+
|
|
83
|
+
exports["default"] = ReactionButtons$1;
|
package/dist/cjs/Theme.js
CHANGED
|
@@ -8,27 +8,6 @@ var icons = require('./icons.js');
|
|
|
8
8
|
var colors = require('./colors.js');
|
|
9
9
|
var SnackbarContextProvider = require('./SnackbarContextProvider.js');
|
|
10
10
|
var ThemeProvider = require('./neo-components/ThemeProvider.js');
|
|
11
|
-
require('@babel/runtime/helpers/extends');
|
|
12
|
-
require('@babel/runtime/helpers/objectWithoutProperties');
|
|
13
|
-
require('./neo-components/Box.js');
|
|
14
|
-
require('./neo-components/Stack.js');
|
|
15
|
-
require('./neo-components/Grid.js');
|
|
16
|
-
require('./neo-components/Container.js');
|
|
17
|
-
require('./neo-components/Text.js');
|
|
18
|
-
require('./neo-components/Button.js');
|
|
19
|
-
require('./neo-components/IconButton.js');
|
|
20
|
-
require('./neo-components/Fab.js');
|
|
21
|
-
require('./neo-components/ToggleButton.js');
|
|
22
|
-
require('./neo-components/Input.js');
|
|
23
|
-
require('./neo-components/FormControls.js');
|
|
24
|
-
require('./neo-components/Autocomplete.js');
|
|
25
|
-
require('./neo-components/Paper.js');
|
|
26
|
-
require('./neo-components/Dialog.js');
|
|
27
|
-
require('./neo-components/Navigation.js');
|
|
28
|
-
require('./neo-components/BottomNavigation.js');
|
|
29
|
-
require('./neo-components/Stepper.js');
|
|
30
|
-
require('./neo-components/Misc.js');
|
|
31
|
-
require('./neo-components/Layout.js');
|
|
32
11
|
|
|
33
12
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
34
13
|
|
|
@@ -128,7 +107,7 @@ const lightThemeConfig = _objectSpread({
|
|
|
128
107
|
},
|
|
129
108
|
mode: "light",
|
|
130
109
|
colors: colors.lightColors,
|
|
131
|
-
icons: icons,
|
|
110
|
+
icons: icons["default"],
|
|
132
111
|
palette: colors.lightPalette
|
|
133
112
|
}, mainTheme);
|
|
134
113
|
const darkThemeConfig = _objectSpread({
|
|
@@ -137,7 +116,7 @@ const darkThemeConfig = _objectSpread({
|
|
|
137
116
|
},
|
|
138
117
|
mode: "dark",
|
|
139
118
|
colors: colors.darkColors,
|
|
140
|
-
icons: icons,
|
|
119
|
+
icons: icons["default"],
|
|
141
120
|
palette: colors.darkPalette
|
|
142
121
|
}, mainTheme); // MUI themes (only created if MUI is available)
|
|
143
122
|
|
|
@@ -248,7 +227,7 @@ const muiThemeConfig = {
|
|
|
248
227
|
const theme = createTheme ? createTheme(_objectSpread(_objectSpread({}, muiThemeConfig), {}, {
|
|
249
228
|
mode: "light",
|
|
250
229
|
colors: colors.lightColors,
|
|
251
|
-
icons: icons,
|
|
230
|
+
icons: icons["default"],
|
|
252
231
|
palette: colors.lightPalette
|
|
253
232
|
})) : lightThemeConfig;
|
|
254
233
|
const darkTheme = createTheme ? createTheme(_objectSpread(_objectSpread({}, muiThemeConfig), {}, {
|
|
@@ -319,7 +298,7 @@ const darkTheme = createTheme ? createTheme(_objectSpread(_objectSpread({}, muiT
|
|
|
319
298
|
}),
|
|
320
299
|
mode: "dark",
|
|
321
300
|
colors: colors.darkColors,
|
|
322
|
-
icons: icons,
|
|
301
|
+
icons: icons["default"],
|
|
323
302
|
palette: colors.darkPalette
|
|
324
303
|
})) : darkThemeConfig; // Create a context for theme access (legacy - for styled-components)
|
|
325
304
|
|
|
@@ -350,7 +329,7 @@ const BlerpTheme = _ref => {
|
|
|
350
329
|
const currentTheme = React.useMemo(() => mode === "dark" ? darkTheme : theme, [mode]); // Memoize the combined theme value (for legacy styled-components)
|
|
351
330
|
|
|
352
331
|
const themeValue = React.useMemo(() => _objectSpread(_objectSpread(_objectSpread({}, mainTheme), {}, {
|
|
353
|
-
icons,
|
|
332
|
+
icons: icons["default"],
|
|
354
333
|
mode: mode === "dark" ? "dark" : "light"
|
|
355
334
|
}, currentTheme), customColors), [mode, currentTheme, customColors]); // Build the inner content with SnackbarProvider
|
|
356
335
|
|
|
@@ -373,9 +352,11 @@ const BlerpTheme = _ref => {
|
|
|
373
352
|
}, withMuiTheme);
|
|
374
353
|
};
|
|
375
354
|
|
|
355
|
+
var BlerpTheme$1 = BlerpTheme; // Export fonts for manual injection if needed
|
|
356
|
+
|
|
376
357
|
exports.darkTheme = darkTheme;
|
|
377
358
|
exports.darkThemeConfig = darkThemeConfig;
|
|
378
|
-
exports["default"] = BlerpTheme;
|
|
359
|
+
exports["default"] = BlerpTheme$1;
|
|
379
360
|
exports.fonts = fonts;
|
|
380
361
|
exports.lightThemeConfig = lightThemeConfig;
|
|
381
362
|
exports.theme = theme;
|
package/dist/cjs/Toggle.js
CHANGED
|
@@ -52,7 +52,7 @@ const Toggle = _ref2 => {
|
|
|
52
52
|
flexDirection: "column",
|
|
53
53
|
justifyContent: "center"
|
|
54
54
|
}
|
|
55
|
-
}, /*#__PURE__*/React__default["default"].createElement(EllipsisLoader
|
|
55
|
+
}, /*#__PURE__*/React__default["default"].createElement(EllipsisLoader["default"], null)) : /*#__PURE__*/React__default["default"].createElement("div", {
|
|
56
56
|
role: "switch",
|
|
57
57
|
"aria-checked": isChecked,
|
|
58
58
|
tabIndex: disabled ? -1 : 0,
|
package/dist/cjs/UserCard.js
CHANGED
|
@@ -3,7 +3,8 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var React = require('react');
|
|
6
|
-
var
|
|
6
|
+
var Stack = require('./neo-components/Stack.js');
|
|
7
|
+
var Text = require('./neo-components/Text.js');
|
|
7
8
|
|
|
8
9
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
9
10
|
|
|
@@ -24,7 +25,7 @@ const UserCard = _ref => {
|
|
|
24
25
|
});
|
|
25
26
|
let 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);
|
|
26
27
|
let createdCount = formatter.format((user === null || user === void 0 ? void 0 : user.totalCreationCount) || 0);
|
|
27
|
-
return /*#__PURE__*/React__default["default"].createElement(
|
|
28
|
+
return /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
|
|
28
29
|
direction: "row",
|
|
29
30
|
sx: {
|
|
30
31
|
backgroundColor: "grey4.main",
|
|
@@ -39,7 +40,7 @@ const UserCard = _ref => {
|
|
|
39
40
|
border: "1px solid transparent",
|
|
40
41
|
borderColor: collapsed ? (user === null || user === void 0 ? void 0 : user.affiliateJourneyStatuss) === "CHAMPION" ? "#FFFFFF" : (user === null || user === void 0 ? void 0 : user.affiliateJourneyStatuss) === "AFFILIATE" ? "#27AAFF" : "transparent" : "transparent"
|
|
41
42
|
}
|
|
42
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
43
|
+
}, /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
|
|
43
44
|
sx: {
|
|
44
45
|
position: "relative"
|
|
45
46
|
}
|
|
@@ -60,12 +61,12 @@ const UserCard = _ref => {
|
|
|
60
61
|
|
|
61
62
|
e.target.src = "https://cdn.blerp.com/design/web/gamerblerpylarge.png";
|
|
62
63
|
}
|
|
63
|
-
})), /*#__PURE__*/React__default["default"].createElement(
|
|
64
|
+
})), /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
|
|
64
65
|
sx: {
|
|
65
66
|
flex: 1,
|
|
66
67
|
marginLeft: "20px"
|
|
67
68
|
}
|
|
68
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
69
|
+
}, /*#__PURE__*/React__default["default"].createElement(Text.Typography, {
|
|
69
70
|
sx: {
|
|
70
71
|
fontSize: "18px",
|
|
71
72
|
fontWeight: "300",
|
|
@@ -81,41 +82,41 @@ const UserCard = _ref => {
|
|
|
81
82
|
}
|
|
82
83
|
},
|
|
83
84
|
onClick: onUsernameClick
|
|
84
|
-
}, user === null || user === void 0 ? void 0 : user.username), !collapsed && /*#__PURE__*/React__default["default"].createElement(
|
|
85
|
+
}, user === null || user === void 0 ? void 0 : user.username), !collapsed && /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
|
|
85
86
|
direction: "row",
|
|
86
87
|
sx: {
|
|
87
88
|
alignItems: "center",
|
|
88
89
|
justifyContent: "space-around"
|
|
89
90
|
}
|
|
90
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
91
|
+
}, /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
|
|
91
92
|
alignItems: "center",
|
|
92
93
|
sx: {
|
|
93
94
|
cursor: "pointer"
|
|
94
95
|
},
|
|
95
96
|
onClick: onFollowerClick
|
|
96
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
97
|
+
}, /*#__PURE__*/React__default["default"].createElement(Text.Typography, {
|
|
97
98
|
sx: {
|
|
98
99
|
fontSize: "14px",
|
|
99
100
|
fontWeight: "400"
|
|
100
101
|
}
|
|
101
|
-
}, followerCount), /*#__PURE__*/React__default["default"].createElement(
|
|
102
|
+
}, followerCount), /*#__PURE__*/React__default["default"].createElement(Text.Typography, {
|
|
102
103
|
sx: {
|
|
103
104
|
fontSize: "12px",
|
|
104
105
|
fontWeight: "300",
|
|
105
106
|
color: "grey7.main"
|
|
106
107
|
}
|
|
107
|
-
}, "followers")), /*#__PURE__*/React__default["default"].createElement(
|
|
108
|
+
}, "followers")), /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
|
|
108
109
|
alignItems: "center",
|
|
109
110
|
sx: {
|
|
110
111
|
cursor: "pointer"
|
|
111
112
|
},
|
|
112
113
|
onClick: onCreatedClick
|
|
113
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
114
|
+
}, /*#__PURE__*/React__default["default"].createElement(Text.Typography, {
|
|
114
115
|
sx: {
|
|
115
116
|
fontSize: "14px",
|
|
116
117
|
fontWeight: "400"
|
|
117
118
|
}
|
|
118
|
-
}, createdCount), /*#__PURE__*/React__default["default"].createElement(
|
|
119
|
+
}, createdCount), /*#__PURE__*/React__default["default"].createElement(Text.Typography, {
|
|
119
120
|
sx: {
|
|
120
121
|
fontSize: "12px",
|
|
121
122
|
fontWeight: "300",
|
|
@@ -1,9 +1,18 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
3
5
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
4
|
-
var index = require('../index.js');
|
|
5
6
|
var React = require('react');
|
|
6
7
|
var ScreenSizeHook = require('../ScreenSizeHook.js');
|
|
8
|
+
var Stack = require('../neo-components/Stack.js');
|
|
9
|
+
var Text = require('../neo-components/Text.js');
|
|
10
|
+
var Box = require('../neo-components/Box.js');
|
|
11
|
+
var Input = require('../neo-components/Input.js');
|
|
12
|
+
var Button = require('../neo-components/Button.js');
|
|
13
|
+
var Navigation = require('../neo-components/Navigation.js');
|
|
14
|
+
var IconButton = require('../neo-components/IconButton.js');
|
|
15
|
+
var Misc = require('../neo-components/Misc.js');
|
|
7
16
|
|
|
8
17
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
9
18
|
|
|
@@ -159,19 +168,19 @@ const LibraryControls = _ref9 => {
|
|
|
159
168
|
|
|
160
169
|
const greyColor = "#888"; // grey6.main equivalent
|
|
161
170
|
|
|
162
|
-
return /*#__PURE__*/React__default["default"].createElement(
|
|
171
|
+
return /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
|
|
163
172
|
direction: "row",
|
|
164
173
|
alignItems: "center",
|
|
165
174
|
justifyContent: "space-around",
|
|
166
175
|
marginTop: size.width <= 675 && "20px"
|
|
167
176
|
}, activeBoard && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(IconPerson, {
|
|
168
177
|
color: iconColor
|
|
169
|
-
}), /*#__PURE__*/React__default["default"].createElement(
|
|
178
|
+
}), /*#__PURE__*/React__default["default"].createElement(Text.Typography, null, activeBoard === null || activeBoard === void 0 ? void 0 : (_activeBoard$ownerObj = activeBoard.ownerObject) === null || _activeBoard$ownerObj === void 0 ? void 0 : _activeBoard$ownerObj.username)), !hideSearch && /*#__PURE__*/React__default["default"].createElement(Box.Box, {
|
|
170
179
|
sx: {
|
|
171
180
|
display: "flex",
|
|
172
181
|
alignItems: "flex-end"
|
|
173
182
|
}
|
|
174
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
183
|
+
}, /*#__PURE__*/React__default["default"].createElement(Input.TextField, {
|
|
175
184
|
id: "user-library-search-input",
|
|
176
185
|
placeholder: "Search User Library",
|
|
177
186
|
variant: "standard",
|
|
@@ -203,12 +212,12 @@ const LibraryControls = _ref9 => {
|
|
|
203
212
|
color: "grey6.main",
|
|
204
213
|
borderColor: "grey6.main"
|
|
205
214
|
},
|
|
206
|
-
startAdornment: /*#__PURE__*/React__default["default"].createElement(
|
|
215
|
+
startAdornment: /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
|
|
207
216
|
position: "center"
|
|
208
217
|
}, /*#__PURE__*/React__default["default"].createElement(IconSearch, {
|
|
209
218
|
color: greyColor
|
|
210
219
|
})),
|
|
211
|
-
endAdornment: /*#__PURE__*/React__default["default"].createElement(
|
|
220
|
+
endAdornment: /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
|
|
212
221
|
position: "end"
|
|
213
222
|
}, inputValue && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(IconClose, {
|
|
214
223
|
color: greyColor,
|
|
@@ -217,13 +226,13 @@ const LibraryControls = _ref9 => {
|
|
|
217
226
|
setInputValue("");
|
|
218
227
|
setShowSearch(false);
|
|
219
228
|
}
|
|
220
|
-
}), /*#__PURE__*/React__default["default"].createElement(
|
|
229
|
+
}), /*#__PURE__*/React__default["default"].createElement(Button.Button, {
|
|
221
230
|
variant: "text",
|
|
222
231
|
color: "notBlack",
|
|
223
232
|
onClick: () => setShowSearch(true)
|
|
224
233
|
}, "Search")))
|
|
225
234
|
}
|
|
226
|
-
})), /*#__PURE__*/React__default["default"].createElement(
|
|
235
|
+
})), /*#__PURE__*/React__default["default"].createElement(Navigation.Popover, {
|
|
227
236
|
id: "library-controls-popover",
|
|
228
237
|
open: openFilter,
|
|
229
238
|
onClose: () => {
|
|
@@ -251,7 +260,7 @@ const LibraryControls = _ref9 => {
|
|
|
251
260
|
vertical: "top",
|
|
252
261
|
horizontal: "center"
|
|
253
262
|
}
|
|
254
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
263
|
+
}, /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
|
|
255
264
|
direction: "row",
|
|
256
265
|
onClick: () => setSort("TITLE_ASC"),
|
|
257
266
|
sx: {
|
|
@@ -262,10 +271,10 @@ const LibraryControls = _ref9 => {
|
|
|
262
271
|
color: "white.override"
|
|
263
272
|
}
|
|
264
273
|
}
|
|
265
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
274
|
+
}, /*#__PURE__*/React__default["default"].createElement(Text.Typography, {
|
|
266
275
|
margin: "0 15px",
|
|
267
276
|
fontSize: "18px"
|
|
268
|
-
}, "Alphabetical")), /*#__PURE__*/React__default["default"].createElement(
|
|
277
|
+
}, "Alphabetical")), /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
|
|
269
278
|
direction: "row",
|
|
270
279
|
onClick: () => setSort("CREATEDAT_DESC"),
|
|
271
280
|
sx: {
|
|
@@ -276,10 +285,10 @@ const LibraryControls = _ref9 => {
|
|
|
276
285
|
color: "white.override"
|
|
277
286
|
}
|
|
278
287
|
}
|
|
279
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
288
|
+
}, /*#__PURE__*/React__default["default"].createElement(Text.Typography, {
|
|
280
289
|
margin: "0 15px",
|
|
281
290
|
fontSize: "18px"
|
|
282
|
-
}, "Newest")), /*#__PURE__*/React__default["default"].createElement(
|
|
291
|
+
}, "Newest")), /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
|
|
283
292
|
direction: "row",
|
|
284
293
|
onClick: () => setSort("CREATEDAT_ASC"),
|
|
285
294
|
sx: {
|
|
@@ -290,25 +299,25 @@ const LibraryControls = _ref9 => {
|
|
|
290
299
|
color: "white.override"
|
|
291
300
|
}
|
|
292
301
|
}
|
|
293
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
302
|
+
}, /*#__PURE__*/React__default["default"].createElement(Text.Typography, {
|
|
294
303
|
margin: "0 15px",
|
|
295
304
|
fontSize: "18px"
|
|
296
|
-
}, "Oldest"))), !hideLayoutButtons && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, size.width >= 1000 ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, !activeBoard && /*#__PURE__*/React__default["default"].createElement(
|
|
305
|
+
}, "Oldest"))), !hideLayoutButtons && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, size.width >= 1000 ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, !activeBoard && /*#__PURE__*/React__default["default"].createElement(Button.Button, {
|
|
297
306
|
color: "notBlack",
|
|
298
307
|
ref: filterRef,
|
|
299
308
|
onClick: () => setFilterAnchor(filterRef.current)
|
|
300
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
309
|
+
}, /*#__PURE__*/React__default["default"].createElement(Text.Typography, null, "Sort"), /*#__PURE__*/React__default["default"].createElement(IconSort, {
|
|
301
310
|
color: iconColor
|
|
302
|
-
})), /*#__PURE__*/React__default["default"].createElement(
|
|
311
|
+
})), /*#__PURE__*/React__default["default"].createElement(IconButton.IconButton, null, /*#__PURE__*/React__default["default"].createElement(IconMenu, {
|
|
303
312
|
color: iconColor
|
|
304
|
-
})), /*#__PURE__*/React__default["default"].createElement(
|
|
313
|
+
})), /*#__PURE__*/React__default["default"].createElement(IconButton.IconButton, null, /*#__PURE__*/React__default["default"].createElement(IconGrid, {
|
|
305
314
|
color: iconColor
|
|
306
|
-
}))) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(
|
|
315
|
+
}))) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(IconButton.IconButton, {
|
|
307
316
|
ref: divRef,
|
|
308
317
|
onClick: () => setAnchor(divRef.current)
|
|
309
318
|
}, /*#__PURE__*/React__default["default"].createElement(IconMoreHoriz, {
|
|
310
319
|
color: iconColor
|
|
311
|
-
})), /*#__PURE__*/React__default["default"].createElement(
|
|
320
|
+
})), /*#__PURE__*/React__default["default"].createElement(Navigation.Popover, {
|
|
312
321
|
id: "library-controls-popover",
|
|
313
322
|
open: open,
|
|
314
323
|
onClose: () => {
|
|
@@ -336,7 +345,7 @@ const LibraryControls = _ref9 => {
|
|
|
336
345
|
vertical: "top",
|
|
337
346
|
horizontal: "center"
|
|
338
347
|
}
|
|
339
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
348
|
+
}, /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
|
|
340
349
|
direction: "row",
|
|
341
350
|
alignItems: "center",
|
|
342
351
|
sx: {
|
|
@@ -349,11 +358,11 @@ const LibraryControls = _ref9 => {
|
|
|
349
358
|
}
|
|
350
359
|
}, /*#__PURE__*/React__default["default"].createElement(IconMenu, {
|
|
351
360
|
color: iconColor
|
|
352
|
-
}), /*#__PURE__*/React__default["default"].createElement(
|
|
361
|
+
}), /*#__PURE__*/React__default["default"].createElement(Text.Typography, {
|
|
353
362
|
color: "notBlack.main",
|
|
354
363
|
margin: "0 15px",
|
|
355
364
|
fontSize: "18px"
|
|
356
|
-
}, "List View")), /*#__PURE__*/React__default["default"].createElement(
|
|
365
|
+
}, "List View")), /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
|
|
357
366
|
direction: "row",
|
|
358
367
|
alignItems: "center",
|
|
359
368
|
sx: {
|
|
@@ -366,13 +375,13 @@ const LibraryControls = _ref9 => {
|
|
|
366
375
|
}
|
|
367
376
|
}, /*#__PURE__*/React__default["default"].createElement(IconGrid, {
|
|
368
377
|
color: iconColor
|
|
369
|
-
}), /*#__PURE__*/React__default["default"].createElement(
|
|
378
|
+
}), /*#__PURE__*/React__default["default"].createElement(Text.Typography, {
|
|
370
379
|
color: "notBlack.main",
|
|
371
380
|
margin: "0 15px",
|
|
372
381
|
fontSize: "18px"
|
|
373
|
-
}, "Grid View")), /*#__PURE__*/React__default["default"].createElement(
|
|
382
|
+
}, "Grid View")), /*#__PURE__*/React__default["default"].createElement(Misc.Divider, {
|
|
374
383
|
variant: "middle"
|
|
375
|
-
}), /*#__PURE__*/React__default["default"].createElement(
|
|
384
|
+
}), /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
|
|
376
385
|
ref: filterRef,
|
|
377
386
|
onClick: () => setFilterAnchor(filterRef.current),
|
|
378
387
|
direction: "row",
|
|
@@ -386,11 +395,11 @@ const LibraryControls = _ref9 => {
|
|
|
386
395
|
backgroundColor: "grey2.main"
|
|
387
396
|
}
|
|
388
397
|
}
|
|
389
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
398
|
+
}, /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
|
|
390
399
|
direction: "row"
|
|
391
400
|
}, /*#__PURE__*/React__default["default"].createElement(IconSort, {
|
|
392
401
|
color: iconColor
|
|
393
|
-
}), /*#__PURE__*/React__default["default"].createElement(
|
|
402
|
+
}), /*#__PURE__*/React__default["default"].createElement(Text.Typography, {
|
|
394
403
|
fontSize: "18px",
|
|
395
404
|
color: "notBlack.main",
|
|
396
405
|
margin: "0 15px"
|
|
@@ -399,4 +408,6 @@ const LibraryControls = _ref9 => {
|
|
|
399
408
|
}))))));
|
|
400
409
|
};
|
|
401
410
|
|
|
402
|
-
|
|
411
|
+
var LibraryControls$1 = LibraryControls;
|
|
412
|
+
|
|
413
|
+
exports["default"] = LibraryControls$1;
|
|
@@ -1,10 +1,14 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
3
5
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
4
6
|
var React = require('react');
|
|
5
|
-
var index = require('../index.js');
|
|
6
7
|
var ScreenSizeHook = require('../ScreenSizeHook.js');
|
|
7
8
|
var LibraryControls = require('./LibraryControls.js');
|
|
9
|
+
var Box = require('../neo-components/Box.js');
|
|
10
|
+
var Stack = require('../neo-components/Stack.js');
|
|
11
|
+
var Button = require('../neo-components/Button.js');
|
|
8
12
|
|
|
9
13
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
10
14
|
|
|
@@ -31,14 +35,14 @@ const UserLibraryHeader = _ref => {
|
|
|
31
35
|
hideLayoutButtons
|
|
32
36
|
} = _ref;
|
|
33
37
|
const size = ScreenSizeHook.useWindowSize();
|
|
34
|
-
return /*#__PURE__*/React__default["default"].createElement(
|
|
38
|
+
return /*#__PURE__*/React__default["default"].createElement(Box.Box, {
|
|
35
39
|
sx: _objectSpread({
|
|
36
40
|
backgroundColor: "grey2.main",
|
|
37
41
|
position: "sticky",
|
|
38
42
|
top: size.width >= 1000 ? "80px" : "110px",
|
|
39
43
|
zIndex: "5"
|
|
40
44
|
}, sx)
|
|
41
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
45
|
+
}, /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
|
|
42
46
|
direction: "row",
|
|
43
47
|
style: {
|
|
44
48
|
padding: "20px 10px",
|
|
@@ -46,16 +50,16 @@ const UserLibraryHeader = _ref => {
|
|
|
46
50
|
margin: "0 auto",
|
|
47
51
|
width: "95%"
|
|
48
52
|
}
|
|
49
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
53
|
+
}, /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
|
|
50
54
|
direction: "row",
|
|
51
55
|
width: "100%",
|
|
52
56
|
justifyContent: size.width <= 675 ? "center" : "space-between",
|
|
53
57
|
alignItems: "center",
|
|
54
58
|
flexWrap: "wrap"
|
|
55
|
-
}, /*#__PURE__*/React__default["default"].createElement(
|
|
59
|
+
}, /*#__PURE__*/React__default["default"].createElement(Stack.Stack, {
|
|
56
60
|
direction: "row",
|
|
57
61
|
flexWrap: "inherit"
|
|
58
|
-
}, tabs === null || tabs === void 0 ? void 0 : tabs.map(tab => /*#__PURE__*/React__default["default"].createElement(
|
|
62
|
+
}, tabs === null || tabs === void 0 ? void 0 : tabs.map(tab => /*#__PURE__*/React__default["default"].createElement(Button.Button, {
|
|
59
63
|
key: "tab-".concat(tab),
|
|
60
64
|
onClick: () => {
|
|
61
65
|
setActiveBoard(null);
|
|
@@ -85,7 +89,7 @@ const UserLibraryHeader = _ref => {
|
|
|
85
89
|
},
|
|
86
90
|
color: tabSelection.includes(tab) ? "grey3" : "notBlack",
|
|
87
91
|
disableElevation: true
|
|
88
|
-
}, tab))), /*#__PURE__*/React__default["default"].createElement(LibraryControls, {
|
|
92
|
+
}, tab))), /*#__PURE__*/React__default["default"].createElement(LibraryControls["default"], {
|
|
89
93
|
currentSort: sort,
|
|
90
94
|
setActiveBoard: setActiveBoard,
|
|
91
95
|
setSort: value => {
|
|
@@ -99,4 +103,6 @@ const UserLibraryHeader = _ref => {
|
|
|
99
103
|
}))));
|
|
100
104
|
};
|
|
101
105
|
|
|
102
|
-
|
|
106
|
+
var UserLibraryHeader$1 = UserLibraryHeader;
|
|
107
|
+
|
|
108
|
+
exports["default"] = UserLibraryHeader$1;
|