@ntbjs/react-components 1.1.22 → 1.1.24
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/{ActionButton-607bc22f.js → ActionButton-5bc79370.js} +1 -1
- package/{Alert-7bbe87f3.js → Alert-edd9f6a7.js} +1 -1
- package/{AssetAction-7afc83d9.js → AssetAction-790fe46c.js} +71 -69
- package/{AssetPreviewTopBar-14bd42d0.js → AssetPreviewTopBar-6eaa7df8.js} +1 -1
- package/{Badge-dc50d116.js → Badge-00b2f311.js} +1 -1
- package/{Button-86626421.js → Button-82e91acb.js} +26 -26
- package/{Checkbox-876f71f0.js → Checkbox-c441fdba.js} +3 -3
- package/{CompactAutocompleteSelect-32a19c92.js → CompactAutocompleteSelect-a8ccfcad.js} +40 -40
- package/{CompactStarRating-ddbeaf93.js → CompactStarRating-3fa89ec7.js} +22 -22
- package/{CompactTextInput-337b6320.js → CompactTextInput-483d7ff1.js} +36 -26
- package/{ContextMenu-b6ba7a22.js → ContextMenu-9645746f.js} +1 -1
- package/{ContextMenuItem-30f7d64d.js → ContextMenuItem-ae252503.js} +1 -1
- package/InfoCard-005063b4.js +86 -0
- package/{InputGroup-d25c66ad.js → InputGroup-3598e37c.js} +1 -1
- package/{Instructions-dd2880ae.js → Instructions-2c2537ff.js} +13 -13
- package/{MultiLevelCheckboxSelect-cd1ced5d.js → MultiLevelCheckboxSelect-375c4785.js} +15 -15
- package/{MultiSelect-0cfc8d6c.js → MultiSelect-0bdad346.js} +24 -24
- package/{Popover-5e9ab515.js → Popover-f00121a3.js} +2 -2
- package/ProgressBar-7d31fd95.js +154 -0
- package/{Radio-8282d0d6.js → Radio-758fd8f3.js} +1 -1
- package/{SectionSeparator-c9ec6fac.js → SectionSeparator-43e1647d.js} +1 -1
- package/{Switch-57f729bb.js → Switch-26547abb.js} +1 -1
- package/{Tab-572141e4.js → Tab-d3ee0a3b.js} +1 -1
- package/{Tabs-9dbd5b85.js → Tabs-243c5e0b.js} +5 -5
- package/{TextArea-a125b7b3.js → TextArea-9c459b6e.js} +84 -60
- package/{TextInput-9e62ab60.js → TextInput-70cb3df7.js} +18 -18
- package/{Tooltip-5bbe5971.js → Tooltip-7dc4676b.js} +2 -2
- package/{VerificationStatusIcon-10460fe7.js → VerificationStatusIcon-f3c44ef8.js} +1 -1
- package/arrow-forward-d7c77ae3.js +37 -0
- package/data/Alert/index.js +2 -2
- package/data/Badge/index.js +2 -2
- package/data/Popover/index.js +3 -3
- package/data/Tab/index.js +2 -2
- package/data/Tabs/index.js +3 -3
- package/data/Tooltip/index.js +3 -3
- package/data/index.js +9 -9
- package/{defaultTheme-06b819a9.js → defaultTheme-24ea5c47.js} +1 -1
- package/icons/arrow-forward.svg +3 -0
- package/icons/index.js +2 -0
- package/inputs/ActionButton/index.js +2 -2
- package/inputs/Button/index.js +5 -5
- package/inputs/Checkbox/index.js +2 -2
- package/inputs/CompactAutocompleteSelect/index.js +11 -11
- package/inputs/CompactStarRating/index.js +10 -10
- package/inputs/CompactTextInput/index.js +10 -10
- package/inputs/MultiSelect/index.js +3 -3
- package/inputs/Radio/index.js +2 -2
- package/inputs/Switch/index.js +2 -2
- package/inputs/TextArea/index.js +10 -10
- package/inputs/TextInput/index.js +2 -2
- package/inputs/index.js +25 -25
- package/layout/InputGroup/index.js +2 -2
- package/layout/SectionSeparator/index.js +2 -2
- package/layout/index.js +3 -3
- package/package.json +2 -1
- package/{react-select-creatable.esm-3c7b7450.js → react-select-creatable.esm-09b1be95.js} +17 -12
- package/{shift-away-subtle-16a9f31b.js → shift-away-subtle-dce50395.js} +1 -1
- package/styles/config.scss +2 -0
- package/widgets/AssetGallery/index.js +32 -29
- package/widgets/AssetPreview/AssetPreviewTopBar/index.js +2 -2
- package/widgets/ContextMenu/ContextMenuItem/index.js +2 -2
- package/widgets/ContextMenu/ContextMenuItemsGroup/index.js +1 -1
- package/widgets/ContextMenu/index.js +2 -2
- package/widgets/InfoCard/index.js +11 -0
- package/widgets/Instructions/index.js +13 -13
- package/widgets/ProgressBar/index.js +11 -0
- package/widgets/index.js +34 -29
|
@@ -1,37 +1,39 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var defaultTheme = require('./defaultTheme-
|
|
3
|
+
var defaultTheme = require('./defaultTheme-24ea5c47.js');
|
|
4
4
|
var lodash = require('lodash');
|
|
5
5
|
var React = require('react');
|
|
6
6
|
var useMergedRefs = require('./useMergedRefs-b6d2f8fc.js');
|
|
7
7
|
var ResizeObserver = require('resize-observer-polyfill');
|
|
8
|
-
var MultiLevelCheckboxSelect = require('./MultiLevelCheckboxSelect-
|
|
8
|
+
var MultiLevelCheckboxSelect = require('./MultiLevelCheckboxSelect-375c4785.js');
|
|
9
9
|
var styled = require('styled-components');
|
|
10
10
|
var reactLazyLoadImageComponent = require('react-lazy-load-image-component');
|
|
11
|
-
var Instructions = require('./Instructions-
|
|
12
|
-
var Alert = require('./Alert-
|
|
13
|
-
var Badge = require('./Badge-
|
|
14
|
-
var Popover = require('./Popover-
|
|
15
|
-
require('./Tab-
|
|
16
|
-
require('./Tabs-
|
|
17
|
-
var Tooltip = require('./Tooltip-
|
|
18
|
-
require('./VerificationStatusIcon-
|
|
11
|
+
var Instructions = require('./Instructions-2c2537ff.js');
|
|
12
|
+
var Alert = require('./Alert-edd9f6a7.js');
|
|
13
|
+
var Badge = require('./Badge-00b2f311.js');
|
|
14
|
+
var Popover = require('./Popover-f00121a3.js');
|
|
15
|
+
require('./Tab-d3ee0a3b.js');
|
|
16
|
+
require('./Tabs-243c5e0b.js');
|
|
17
|
+
var Tooltip = require('./Tooltip-7dc4676b.js');
|
|
18
|
+
require('./VerificationStatusIcon-f3c44ef8.js');
|
|
19
19
|
var react = require('@floating-ui/react');
|
|
20
20
|
var polished = require('polished');
|
|
21
|
-
var ContextMenu = require('./ContextMenu-
|
|
22
|
-
require('./AssetPreviewTopBar-
|
|
23
|
-
|
|
24
|
-
require('./
|
|
25
|
-
require('./
|
|
26
|
-
require('./
|
|
27
|
-
require('./
|
|
28
|
-
require('./
|
|
29
|
-
require('./
|
|
30
|
-
require('./
|
|
31
|
-
require('./
|
|
32
|
-
require('./
|
|
33
|
-
require('./
|
|
34
|
-
|
|
21
|
+
var ContextMenu = require('./ContextMenu-9645746f.js');
|
|
22
|
+
require('./AssetPreviewTopBar-6eaa7df8.js');
|
|
23
|
+
require('./ProgressBar-7d31fd95.js');
|
|
24
|
+
require('./InfoCard-005063b4.js');
|
|
25
|
+
var ActionButton = require('./ActionButton-5bc79370.js');
|
|
26
|
+
require('./Button-82e91acb.js');
|
|
27
|
+
require('./Checkbox-c441fdba.js');
|
|
28
|
+
require('./CompactAutocompleteSelect-a8ccfcad.js');
|
|
29
|
+
require('./CompactStarRating-3fa89ec7.js');
|
|
30
|
+
require('./CompactTextInput-483d7ff1.js');
|
|
31
|
+
require('./MultiSelect-0bdad346.js');
|
|
32
|
+
require('./Radio-758fd8f3.js');
|
|
33
|
+
require('./TextArea-9c459b6e.js');
|
|
34
|
+
require('./TextInput-70cb3df7.js');
|
|
35
|
+
require('./Switch-26547abb.js');
|
|
36
|
+
var ContextMenuItem = require('./ContextMenuItem-ae252503.js');
|
|
35
37
|
|
|
36
38
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
37
39
|
|
|
@@ -182,7 +184,7 @@ var convertMsToHMS = function convertMsToHMS(ms) {
|
|
|
182
184
|
return hmsString;
|
|
183
185
|
};
|
|
184
186
|
|
|
185
|
-
var _templateObject$4, _templateObject2$3, _templateObject3$3, _templateObject4$3, _templateObject5$3, _templateObject6$2, _templateObject7$2, _templateObject8$2, _templateObject9$2,
|
|
187
|
+
var _templateObject$4, _templateObject2$3, _templateObject3$3, _templateObject4$3, _templateObject5$3, _templateObject6$2, _templateObject7$2, _templateObject8$2, _templateObject9$2, _templateObject0$2, _templateObject1$2, _templateObject10$2, _templateObject11$2, _templateObject12$2;
|
|
186
188
|
var SummaryCard$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject$4 || (_templateObject$4 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n border-radius: 4px;\n width: ", ";\n ", ";\n\n ", "\n"])), function (props) {
|
|
187
189
|
return props.width ? "".concat(props.width, "px") : '100%';
|
|
188
190
|
}, function (props) {
|
|
@@ -208,11 +210,11 @@ var Title = styled__default["default"].span.attrs(defaultTheme.applyDefaultTheme
|
|
|
208
210
|
var Description = styled__default["default"].span.attrs(defaultTheme.applyDefaultTheme)(_templateObject9$2 || (_templateObject9$2 = defaultTheme._taggedTemplateLiteral(["\n padding: 0 16px;\n text-align: left;\n font: normal normal normal 12px/16px Roboto;\n letter-spacing: 0.24px;\n display: -webkit-box;\n -webkit-line-clamp: 3;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n box-sizing: border-box;\n\n ", ";\n"])), function (props) {
|
|
209
211
|
return props.theme.themeProp('color', props.theme.getColor('white'), props.theme.getColor('gray-700'));
|
|
210
212
|
});
|
|
211
|
-
var Instruction = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
212
|
-
var Footer = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
213
|
-
var FooterLeft = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
214
|
-
var FooterRight = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
215
|
-
styled__default["default"](react.FloatingArrow).attrs(defaultTheme.applyDefaultTheme)(
|
|
213
|
+
var Instruction = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject0$2 || (_templateObject0$2 = defaultTheme._taggedTemplateLiteral([""])));
|
|
214
|
+
var Footer = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject1$2 || (_templateObject1$2 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0 16px;\n"])));
|
|
215
|
+
var FooterLeft = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject10$2 || (_templateObject10$2 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n justify-content: flex-start;\n\n > * {\n margin-right: 4px;\n }\n"])));
|
|
216
|
+
var FooterRight = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject11$2 || (_templateObject11$2 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n justify-content: flex-end;\n\n > * {\n margin-left: 4px;\n }\n"])));
|
|
217
|
+
styled__default["default"](react.FloatingArrow).attrs(defaultTheme.applyDefaultTheme)(_templateObject12$2 || (_templateObject12$2 = defaultTheme._taggedTemplateLiteral(["\n ", "\n"])), function (props) {
|
|
216
218
|
return props.theme.themeProp('fill', props.theme.getColor('gray-700'), props.theme.getColor('white'));
|
|
217
219
|
});
|
|
218
220
|
|
|
@@ -293,7 +295,7 @@ SummaryCard.defaultProps = {
|
|
|
293
295
|
activeSummaryCard: false
|
|
294
296
|
};
|
|
295
297
|
|
|
296
|
-
var _templateObject$3, _templateObject2$2, _templateObject3$2, _templateObject4$2, _templateObject5$2, _templateObject6$1, _templateObject7$1, _templateObject8$1, _templateObject9$1, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15$1, _templateObject16$1, _templateObject17$1, _templateObject18$1, _templateObject19$1, _templateObject20$1, _templateObject21$1, _templateObject22$1, _templateObject23$1, _templateObject24$1, _templateObject25
|
|
298
|
+
var _templateObject$3, _templateObject2$2, _templateObject3$2, _templateObject4$2, _templateObject5$2, _templateObject6$1, _templateObject7$1, _templateObject8$1, _templateObject9$1, _templateObject0$1, _templateObject1$1, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14$1, _templateObject15$1, _templateObject16$1, _templateObject17$1, _templateObject18$1, _templateObject19$1, _templateObject20$1, _templateObject21$1, _templateObject22$1, _templateObject23$1, _templateObject24$1, _templateObject25, _templateObject26, _templateObject27;
|
|
297
299
|
var AssetGalleryWrapper$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject$3 || (_templateObject$3 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n"])), function (props) {
|
|
298
300
|
return props.disabled && styled.css(_templateObject2$2 || (_templateObject2$2 = defaultTheme._taggedTemplateLiteral(["\n cursor: not-allowed;\n "])));
|
|
299
301
|
});
|
|
@@ -316,29 +318,29 @@ var AssetGalleryCompactCard$2 = styled__default["default"].div.attrs(defaultThem
|
|
|
316
318
|
var Figure$1 = styled__default["default"].figure(_templateObject7$1 || (_templateObject7$1 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n flex-direction: row;\n flex-wrap: nowrap;\n justify-content: center;\n align-items: center;\n position: relative;\n margin: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n\n .lazy-load-image-background {\n display: block !important;\n }\n\n img {\n display: block;\n height: 100%;\n width: 100%;\n ", "\n }\n"])), function (props) {
|
|
317
319
|
return props.hasHeightAndWidth ? styled.css(_templateObject8$1 || (_templateObject8$1 = defaultTheme._taggedTemplateLiteral(["\n object-fit: cover;\n "]))) : styled.css(_templateObject9$1 || (_templateObject9$1 = defaultTheme._taggedTemplateLiteral(["\n object-fit: contain;\n "])));
|
|
318
320
|
});
|
|
319
|
-
var FigureOverlayBackdrop$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
321
|
+
var FigureOverlayBackdrop$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject0$1 || (_templateObject0$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n inset: 0;\n opacity: ", ";\n background-color: ", ";\n"])), function (props) {
|
|
320
322
|
return props.selected ? 0.6 : 0;
|
|
321
323
|
}, function (props) {
|
|
322
324
|
return props.selected ? '#ACCEF7' : 'transparent';
|
|
323
325
|
});
|
|
324
|
-
var Overlay$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
325
|
-
var OverlayBackdrop$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
326
|
-
return !props.selected ? styled.css(
|
|
326
|
+
var Overlay$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject1$1 || (_templateObject1$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n"])));
|
|
327
|
+
var OverlayBackdrop$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject10$1 || (_templateObject10$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n opacity: 0;\n transition: opacity 220ms;\n\n ", "\n ", "\n ", ":hover & {\n opacity: 1;\n }\n"])), function (props) {
|
|
328
|
+
return !props.selected ? styled.css(_templateObject11$1 || (_templateObject11$1 = defaultTheme._taggedTemplateLiteral(["\n background: radial-gradient(\n ellipse at center,\n rgba(0, 0, 0, 0.3) 27%,\n rgba(0, 0, 0, 0.5) 60%,\n rgba(0, 0, 0, 0.7) 90%\n );\n "]))) : null;
|
|
327
329
|
}, function (props) {
|
|
328
|
-
return (props.selected || props.softSelected) && styled.css(
|
|
330
|
+
return (props.selected || props.softSelected) && styled.css(_templateObject12$1 || (_templateObject12$1 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\n "])));
|
|
329
331
|
}, Overlay$1);
|
|
330
|
-
var OverlayInfo$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
332
|
+
var OverlayInfo$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject13$1 || (_templateObject13$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n padding: 15px 50px 10px 12px;\n color: ", ";\n & span {\n overflow: hidden;\n word-wrap: break-word;\n }\n"])), function (props) {
|
|
331
333
|
return props.theme.getColor('gray-100');
|
|
332
334
|
});
|
|
333
|
-
var OverlayCompleted = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
335
|
+
var OverlayCompleted = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject14$1 || (_templateObject14$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n pointer-events: none;\n transition: border-color 120ms;\n border: 3px solid;\n ", ";\n"])), function (props) {
|
|
334
336
|
if (props.softSelected) return null;
|
|
335
337
|
return props.theme.themeProp('border-color', props.theme.getColor('emerald-500'), polished.rgba(props.theme.getColor('emerald-500'), 0.7));
|
|
336
338
|
});
|
|
337
|
-
var OverlayHasError = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
339
|
+
var OverlayHasError = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject15$1 || (_templateObject15$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n pointer-events: none;\n transition: border-color 120ms;\n border: 3px solid;\n ", "\n"])), function (props) {
|
|
338
340
|
if (props.softSelected) return null;
|
|
339
341
|
return props.theme.themeProp('border-color', props.theme.getColor('red-600'), polished.rgba(props.theme.getColor('red-500'), 0.7));
|
|
340
342
|
});
|
|
341
|
-
var OverlaySelected$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
343
|
+
var OverlaySelected$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject16$1 || (_templateObject16$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n pointer-events: none;\n transition: border-color 120ms;\n border-style: solid;\n border-width: 3px;\n\n ", ";\n"])), function (props) {
|
|
342
344
|
if (props.softSelected) {
|
|
343
345
|
return props.theme.themeProp('border-color', polished.rgba(props.theme.getColor('gray-100'), 0.5), polished.rgba(props.theme.getColor('gray-700'), 0.5));
|
|
344
346
|
}
|
|
@@ -347,35 +349,35 @@ var OverlaySelected$1 = styled__default["default"].div.attrs(defaultTheme.applyD
|
|
|
347
349
|
}
|
|
348
350
|
return props.theme.themeProp('border-color', 'transparent', 'transparent');
|
|
349
351
|
});
|
|
350
|
-
var OverlayInfoTop$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
351
|
-
var OverlayInfoTopActions$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
352
|
+
var OverlayInfoTop$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject17$1 || (_templateObject17$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n padding: 8px;\n display: flex;\n"])));
|
|
353
|
+
var OverlayInfoTopActions$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject18$1 || (_templateObject18$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n right: 0;\n padding: 4px;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n transition: opacity 220ms;\n z-index: 99999;\n ", "\n\n opacity: ", ";\n"])), function (props) {
|
|
352
354
|
return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-700'));
|
|
353
355
|
}, function (props) {
|
|
354
356
|
return props.isOverlayHovered ? 1 : 0;
|
|
355
357
|
});
|
|
356
|
-
var OverlayInfoTopLeft = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
358
|
+
var OverlayInfoTopLeft = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject19$1 || (_templateObject19$1 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\n display: ", ";\n\n ", ":hover & {\n opacity: 0;\n }\n"])), function (props) {
|
|
357
359
|
return props !== null && props !== void 0 && props.collapseExtraInfo ? 'none' : 'block';
|
|
358
360
|
}, Overlay$1);
|
|
359
|
-
var OverlayInfoTopWarning$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
361
|
+
var OverlayInfoTopWarning$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject20$1 || (_templateObject20$1 = defaultTheme._taggedTemplateLiteral(["\n margin-left: auto;\n height: 24px;\n width: 24px;\n border-radius: 50%;\n box-sizing: border-box;\n padding: ", ";\n background-color: ", ";\n opacity: 1;\n\n svg {\n width: 100%;\n color: ", ";\n }\n\n ", ":hover & {\n opacity: 0;\n }\n"])), function (props) {
|
|
360
362
|
return props.type === 'error' ? 0 : '3px 4px';
|
|
361
363
|
}, function (props) {
|
|
362
364
|
return props.type === 'error' ? props.theme.getColor('red-500') : props.theme.getColor('gray-100');
|
|
363
365
|
}, function (props) {
|
|
364
366
|
return props.type === 'error' ? props.theme.getColor('gray-100') : props.theme.getColor('gray-700');
|
|
365
367
|
}, Overlay$1);
|
|
366
|
-
var OverlayInfoBottom$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
367
|
-
var OverlayInfoBottomSelectButton$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
368
|
+
var OverlayInfoBottom$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject21$1 || (_templateObject21$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n padding: 8px;\n display: flex;\n"])));
|
|
369
|
+
var OverlayInfoBottomSelectButton$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject22$1 || (_templateObject22$1 = defaultTheme._taggedTemplateLiteral(["\n opacity: ", ";\n flex-shrink: 0;\n cursor: pointer;\n transition: opacity 220ms;\n height: 24px;\n\n > svg {\n width: 24px;\n height: 24px;\n transition: opacity 120ms;\n opacity: ", ";\n }\n\n ", ":hover & {\n opacity: 1;\n }\n"])), function (props) {
|
|
368
370
|
return props.selected ? 1 : 0;
|
|
369
371
|
}, function (props) {
|
|
370
372
|
return props.selected ? 1 : 0.5;
|
|
371
373
|
}, Overlay$1);
|
|
372
|
-
var OverlayInfoBottomMediaIcon$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
373
|
-
var ConsumerDefinedOverlay$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
374
|
-
styled__default["default"].div(
|
|
375
|
-
styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
374
|
+
var OverlayInfoBottomMediaIcon$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject23$1 || (_templateObject23$1 = defaultTheme._taggedTemplateLiteral(["\n margin-left: auto;\n opacity: 1;\n\n ", ":hover & {\n opacity: 0;\n }\n"])), Overlay$1);
|
|
375
|
+
var ConsumerDefinedOverlay$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject24$1 || (_templateObject24$1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n pointer-events: none;\n"])));
|
|
376
|
+
styled__default["default"].div(_templateObject25 || (_templateObject25 = defaultTheme._taggedTemplateLiteral(["\n margin: 4px;\n"])));
|
|
377
|
+
styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject26 || (_templateObject26 = defaultTheme._taggedTemplateLiteral(["\n ", "\n padding: 4px 8px;\n border-radius: 4px;\n"])), function (props) {
|
|
376
378
|
return props.theme.themeProp('background', props.theme.getColor('gray-700'), props.theme.getColor('white'));
|
|
377
379
|
});
|
|
378
|
-
var StyledFloatingArrow$1 = styled__default["default"](react.FloatingArrow).attrs(defaultTheme.applyDefaultTheme)(
|
|
380
|
+
var StyledFloatingArrow$1 = styled__default["default"](react.FloatingArrow).attrs(defaultTheme.applyDefaultTheme)(_templateObject27 || (_templateObject27 = defaultTheme._taggedTemplateLiteral(["\n ", "\n"])), function (props) {
|
|
379
381
|
return props.theme.themeProp('fill', props.theme.getColor('gray-700'), props.theme.getColor('white'));
|
|
380
382
|
});
|
|
381
383
|
|
|
@@ -798,7 +800,7 @@ var AssetGalleryCompactCard$1 = reactLazyLoadImageComponent.trackWindowScroll(Re
|
|
|
798
800
|
});
|
|
799
801
|
}));
|
|
800
802
|
|
|
801
|
-
var _templateObject$1, _templateObject2$1, _templateObject3$1, _templateObject4$1, _templateObject5$1, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24
|
|
803
|
+
var _templateObject$1, _templateObject2$1, _templateObject3$1, _templateObject4$1, _templateObject5$1, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0, _templateObject1, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24;
|
|
802
804
|
var AssetGalleryWrapper = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject$1 || (_templateObject$1 = defaultTheme._taggedTemplateLiteral(["\n ", ";\n"])), function (props) {
|
|
803
805
|
return props.disabled && styled.css(_templateObject2$1 || (_templateObject2$1 = defaultTheme._taggedTemplateLiteral(["\n cursor: not-allowed;\n "])));
|
|
804
806
|
});
|
|
@@ -834,46 +836,46 @@ var ContentWrapper = styled__default["default"].div.attrs(defaultTheme.applyDefa
|
|
|
834
836
|
});
|
|
835
837
|
var Asset = styled__default["default"].div(_templateObject7 || (_templateObject7 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: flex-start;\n position: relative;\n padding: 0 36px;\n min-height: 200px;\n box-sizing: border-box;\n\n video {\n display: block;\n }\n\n .audio {\n display: flex;\n justify-content: center;\n svg {\n width: 25%;\n }\n }\n"])));
|
|
836
838
|
var Figure = styled__default["default"].figure(_templateObject8 || (_templateObject8 = defaultTheme._taggedTemplateLiteral(["\n position: relative;\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n margin: 0;\n\n img,\n video,\n .audio {\n display: block;\n max-height: 200px;\n width: 100%;\n box-sizing: border-box;\n\n ", "\n }\n\n .audio {\n display: flex;\n height: 200px;\n justify-content: center;\n svg {\n width: 25%;\n }\n }\n"])), function (props) {
|
|
837
|
-
return props.hasHeightAndWidth ? styled.css(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n object-fit: cover;\n "]))) : styled.css(
|
|
839
|
+
return props.hasHeightAndWidth ? styled.css(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n object-fit: cover;\n "]))) : styled.css(_templateObject0 || (_templateObject0 = defaultTheme._taggedTemplateLiteral(["\n object-fit: contain;\n "])));
|
|
838
840
|
});
|
|
839
|
-
var FigureOverlayBackdrop = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
841
|
+
var FigureOverlayBackdrop = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject1 || (_templateObject1 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n inset: 0;\n opacity: ", ";\n background-color: ", ";\n"])), function (props) {
|
|
840
842
|
return props.selected ? 0.6 : 0;
|
|
841
843
|
}, function (props) {
|
|
842
844
|
return props.selected ? '#ACCEF7' : 'transparent';
|
|
843
845
|
});
|
|
844
|
-
var Overlay = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
845
|
-
var OverlayBackdrop = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
846
|
-
return !props.selected ? styled.css(
|
|
846
|
+
var Overlay = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject10 || (_templateObject10 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n"])));
|
|
847
|
+
var OverlayBackdrop = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject11 || (_templateObject11 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n opacity: 0;\n transition: opacity 220ms;\n ", "\n\n ", "\n\n ", ":hover & {\n opacity: 1;\n }\n\n ", ":hover & {\n opacity: 1;\n }\n"])), function (props) {
|
|
848
|
+
return !props.selected ? styled.css(_templateObject12 || (_templateObject12 = defaultTheme._taggedTemplateLiteral(["\n background: radial-gradient(\n ellipse at center,\n rgba(0, 0, 0, 0.3) 27%,\n rgba(0, 0, 0, 0.5) 60%,\n rgba(0, 0, 0, 0.7) 90%\n );\n "]))) : null;
|
|
847
849
|
}, function (props) {
|
|
848
|
-
return (props.selected || props.softSelected) && styled.css(
|
|
850
|
+
return (props.selected || props.softSelected) && styled.css(_templateObject13 || (_templateObject13 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\n "])));
|
|
849
851
|
}, Overlay, AssetGalleryGridCard$2);
|
|
850
|
-
var OverlayInfo = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
852
|
+
var OverlayInfo = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject14 || (_templateObject14 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n padding: 15px 12px 10px;\n color: ", ";\n"])), function (props) {
|
|
851
853
|
return props.theme.getColor('gray-100');
|
|
852
854
|
});
|
|
853
|
-
var OverlaySelected = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
854
|
-
var OverlayInfoTop = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
855
|
-
var OverlayInfoTopVersions = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
856
|
-
var OverlayInfoTopWarning = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
855
|
+
var OverlaySelected = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject15 || (_templateObject15 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n pointer-events: none;\n"])));
|
|
856
|
+
var OverlayInfoTop = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject16 || (_templateObject16 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n padding: 8px;\n display: flex;\n"])));
|
|
857
|
+
var OverlayInfoTopVersions = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject17 || (_templateObject17 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\n\n ", ":hover & {\n opacity: 0;\n }\n"])), AssetGalleryGridCard$2);
|
|
858
|
+
var OverlayInfoTopWarning = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject18 || (_templateObject18 = defaultTheme._taggedTemplateLiteral(["\n margin-left: auto;\n height: 24px;\n width: 24px;\n border-radius: 50%;\n box-sizing: border-box;\n padding: ", ";\n background-color: ", ";\n opacity: 1;\n\n svg {\n width: 100%;\n color: ", ";\n }\n\n ", ":hover & {\n opacity: 0;\n }\n"])), function (props) {
|
|
857
859
|
return props.type === 'error' ? 0 : '4px';
|
|
858
860
|
}, function (props) {
|
|
859
861
|
return props.type === 'error' ? props.theme.getColor('red-500') : props.theme.getColor('gray-100');
|
|
860
862
|
}, function (props) {
|
|
861
863
|
return props.type === 'error' ? props.theme.getColor('gray-100') : props.theme.getColor('gray-700');
|
|
862
864
|
}, AssetGalleryGridCard$2);
|
|
863
|
-
var OverlayInfoTopActions = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
865
|
+
var OverlayInfoTopActions = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject19 || (_templateObject19 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n right: 0;\n padding: 4px;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n transition: opacity 220ms;\n z-index: 99999;\n ", "\n\n opacity: ", ";\n"])), function (props) {
|
|
864
866
|
return props.theme.themeProp('color', props.theme.getColor('gray-300'), props.theme.getColor('gray-700'));
|
|
865
867
|
}, function (props) {
|
|
866
868
|
return props.isCardHovered ? 1 : 0;
|
|
867
869
|
});
|
|
868
|
-
var OverlayInfoBottom = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
869
|
-
var OverlayInfoBottomSelectButton = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
870
|
+
var OverlayInfoBottom = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject20 || (_templateObject20 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n padding: 8px;\n display: flex;\n"])));
|
|
871
|
+
var OverlayInfoBottomSelectButton = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject21 || (_templateObject21 = defaultTheme._taggedTemplateLiteral(["\n opacity: ", ";\n flex-shrink: 0;\n cursor: pointer;\n transition: opacity 220ms;\n\n > svg {\n width: 23px;\n height: 100%;\n transition: opacity 120ms;\n opacity: ", ";\n }\n\n ", ":hover & {\n opacity: 1;\n }\n\n ", ":hover & {\n opacity: 1;\n }\n"])), function (props) {
|
|
870
872
|
return props.selected ? 1 : 0;
|
|
871
873
|
}, function (props) {
|
|
872
874
|
return props.selected ? 1 : 0.5;
|
|
873
875
|
}, Overlay, AssetGalleryGridCard$2);
|
|
874
|
-
var OverlayInfoBottomMediaIcon = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
875
|
-
var ConsumerDefinedOverlay = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
876
|
-
var Fragment = styled__default["default"].div(
|
|
876
|
+
var OverlayInfoBottomMediaIcon = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject22 || (_templateObject22 = defaultTheme._taggedTemplateLiteral(["\n margin-left: auto;\n opacity: 1;\n ", ":hover & {\n opacity: 0;\n }\n"])), AssetGalleryGridCard$2);
|
|
877
|
+
var ConsumerDefinedOverlay = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n pointer-events: none;\n"])));
|
|
878
|
+
var Fragment = styled__default["default"].div(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n margin: 4px;\n"])));
|
|
877
879
|
|
|
878
880
|
var _excluded$3 = ["component", "asset"],
|
|
879
881
|
_excluded2 = ["component", "className", "subActions", "isSubActionsOpened"];
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var defaultTheme = require('./defaultTheme-
|
|
3
|
+
var defaultTheme = require('./defaultTheme-24ea5c47.js');
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var styled = require('styled-components');
|
|
6
|
-
var Popover = require('./Popover-
|
|
7
|
-
var ContextMenu = require('./ContextMenu-
|
|
6
|
+
var Popover = require('./Popover-f00121a3.js');
|
|
7
|
+
var ContextMenu = require('./ContextMenu-9645746f.js');
|
|
8
8
|
var expandMore = require('./expand-more-d74e2bd2.js');
|
|
9
9
|
|
|
10
10
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
@@ -12,7 +12,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
12
12
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
13
13
|
var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
|
|
14
14
|
|
|
15
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29
|
|
15
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0, _templateObject1, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24, _templateObject25, _templateObject26, _templateObject27, _templateObject28, _templateObject29;
|
|
16
16
|
var Button$1 = styled__default["default"].button.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n position: relative;\n border-radius: 3px;\n font-family: inherit;\n font-size: 0.875rem;\n font-weight: 400;\n padding: 12px 16px;\n cursor: pointer;\n background: ", ";\n border: 2px solid ", ";\n transition: all 250ms, opacity 200ms;\n\n &:hover,\n &.dropdown-is-active {\n background: #296c58;\n border-color: #296c58;\n }\n\n ", "\n\n && {\n ", ";\n }\n\n && {\n ", ";\n }\n\n && {\n ", ";\n }\n\n && {\n ", ";\n }\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n\n ", ";\n"])), function (props) {
|
|
17
17
|
return props.theme.getColor('emerald-500');
|
|
18
18
|
}, function (props) {
|
|
@@ -44,41 +44,41 @@ var Button$1 = styled__default["default"].button.attrs(defaultTheme.applyDefault
|
|
|
44
44
|
}, function (props) {
|
|
45
45
|
return props.size === 'small' && styled.css(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n padding: 6px 16px;\n "])));
|
|
46
46
|
}, function (props) {
|
|
47
|
-
return props.size === 'large' && styled.css(
|
|
47
|
+
return props.size === 'large' && styled.css(_templateObject0 || (_templateObject0 = defaultTheme._taggedTemplateLiteral(["\n padding: 16px 16px;\n "])));
|
|
48
48
|
}, function (props) {
|
|
49
|
-
return props.singleAction && styled.css(
|
|
49
|
+
return props.singleAction && styled.css(_templateObject1 || (_templateObject1 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n gap: ", "px;\n border-radius: 3px !important;\n transition: all 250ms, opacity 200ms;\n "])), props.singleActionGap);
|
|
50
50
|
}, function (props) {
|
|
51
|
-
return props.width && styled.css(
|
|
51
|
+
return props.width && styled.css(_templateObject10 || (_templateObject10 = defaultTheme._taggedTemplateLiteral(["\n min-width: ", "px;\n justify-content: center;\n "])), props.width);
|
|
52
52
|
});
|
|
53
|
-
var ButtonContent = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
54
|
-
return props.size === 'small' && styled.css(
|
|
53
|
+
var ButtonContent = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject11 || (_templateObject11 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n justify-content: center;\n align-items: center;\n transform: scale(1);\n opacity: 1;\n transition: all 200ms;\n\n > svg {\n width: 100%;\n max-width: 16px;\n max-height: 16px;\n margin-right: 8px;\n\n ", ";\n\n ", ";\n }\n\n ", "\n\n ", ";\n"])), function (props) {
|
|
54
|
+
return props.size === 'small' && styled.css(_templateObject12 || (_templateObject12 = defaultTheme._taggedTemplateLiteral(["\n max-width: 13px;\n max-height: 13px;\n "])));
|
|
55
55
|
}, function (props) {
|
|
56
|
-
return props.size === 'x-small' && styled.css(
|
|
56
|
+
return props.size === 'x-small' && styled.css(_templateObject13 || (_templateObject13 = defaultTheme._taggedTemplateLiteral(["\n max-width: 11px;\n max-height: 11px;\n "])));
|
|
57
57
|
}, function (props) {
|
|
58
|
-
return props.$loading && styled.css(
|
|
58
|
+
return props.$loading && styled.css(_templateObject14 || (_templateObject14 = defaultTheme._taggedTemplateLiteral(["\n transform: scale(0.95);\n opacity: 0;\n "])));
|
|
59
59
|
}, function (props) {
|
|
60
|
-
return props.singleAction && styled.css(
|
|
60
|
+
return props.singleAction && styled.css(_templateObject15 || (_templateObject15 = defaultTheme._taggedTemplateLiteral(["\n svg {\n width: 100% !important;\n height: 100% !important;\n margin-right: 24px;\n }\n "])));
|
|
61
61
|
});
|
|
62
|
-
var LoadingIndicator = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
63
|
-
return props.$loading && styled.css(
|
|
62
|
+
var LoadingIndicator = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject16 || (_templateObject16 = defaultTheme._taggedTemplateLiteral(["\n position: absolute;\n height: 100%;\n width: 100%;\n top: 0;\n left: 0;\n padding: 4px;\n background: inherit;\n opacity: 0;\n transition: opacity 200ms;\n box-sizing: border-box;\n\n ", "\n"])), function (props) {
|
|
63
|
+
return props.$loading && styled.css(_templateObject17 || (_templateObject17 = defaultTheme._taggedTemplateLiteral(["\n opacity: 1;\n "])));
|
|
64
64
|
});
|
|
65
|
-
var LoadingIndicatorSvg = styled__default["default"].svg.attrs(defaultTheme.applyDefaultTheme)(
|
|
66
|
-
var LoadingIndicatorSvgCircle = styled__default["default"].circle.attrs(defaultTheme.applyDefaultTheme)(
|
|
67
|
-
var ButtonWrapper = styled__default["default"].span.attrs(defaultTheme.applyDefaultTheme)(
|
|
68
|
-
var MainButtonWrapper = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
69
|
-
return (props.activeDropdown || props.dropdownItems) && !props.outlined && styled.css(
|
|
65
|
+
var LoadingIndicatorSvg = styled__default["default"].svg.attrs(defaultTheme.applyDefaultTheme)(_templateObject18 || (_templateObject18 = defaultTheme._taggedTemplateLiteral(["\n height: 100%;\n color: inherit;\n transform: rotate(-88deg);\n"])));
|
|
66
|
+
var LoadingIndicatorSvgCircle = styled__default["default"].circle.attrs(defaultTheme.applyDefaultTheme)(_templateObject19 || (_templateObject19 = defaultTheme._taggedTemplateLiteral(["\n transition: stroke-dashoffset 300ms linear;\n stroke-dasharray: 113;\n"])));
|
|
67
|
+
var ButtonWrapper = styled__default["default"].span.attrs(defaultTheme.applyDefaultTheme)(_templateObject20 || (_templateObject20 = defaultTheme._taggedTemplateLiteral(["\n white-space: nowrap;\n display: flex;\n"])));
|
|
68
|
+
var MainButtonWrapper = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject21 || (_templateObject21 = defaultTheme._taggedTemplateLiteral(["\n border-radius: 3px;\n ", ";\n"])), function (props) {
|
|
69
|
+
return (props.activeDropdown || props.dropdownItems) && !props.outlined && styled.css(_templateObject22 || (_templateObject22 = defaultTheme._taggedTemplateLiteral(["\n background: ", ";\n "])), props.secondary ? props.theme.getColor('gray-200') : props.theme.getColor('emerald-500'));
|
|
70
70
|
});
|
|
71
|
-
var MainButtonContainer = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
72
|
-
return (props.activeDropdown || props.dropdownItems) && styled.css(
|
|
71
|
+
var MainButtonContainer = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject23 || (_templateObject23 = defaultTheme._taggedTemplateLiteral(["\n display: inline-block;\n button {\n ", ";\n\n ", ";\n }\n"])), function (props) {
|
|
72
|
+
return (props.activeDropdown || props.dropdownItems) && styled.css(_templateObject24 || (_templateObject24 = defaultTheme._taggedTemplateLiteral(["\n border-bottom-right-radius: 0;\n border-top-right-radius: 0;\n "])));
|
|
73
73
|
}, function (props) {
|
|
74
|
-
return (props.activeDropdown || props.dropdownItems) && props.outlined && styled.css(
|
|
74
|
+
return (props.activeDropdown || props.dropdownItems) && props.outlined && styled.css(_templateObject25 || (_templateObject25 = defaultTheme._taggedTemplateLiteral(["\n border-right: none;\n "])));
|
|
75
75
|
});
|
|
76
|
-
var MainButtonContainerSingle = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
77
|
-
return props.singleAction && styled.css(
|
|
76
|
+
var MainButtonContainerSingle = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject26 || (_templateObject26 = defaultTheme._taggedTemplateLiteral(["\n display: inline-block;\n width: 100%;\n ", ";\n\n button {\n ", ";\n }\n"])), function (props) {
|
|
77
|
+
return props.singleAction && styled.css(_templateObject27 || (_templateObject27 = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n border-radius: 3px !important;\n transition: all 250ms, opacity 200ms;\n "])));
|
|
78
78
|
}, function (props) {
|
|
79
|
-
return (props.activeDropdown || props.dropdownItems) && styled.css(
|
|
79
|
+
return (props.activeDropdown || props.dropdownItems) && styled.css(_templateObject28 || (_templateObject28 = defaultTheme._taggedTemplateLiteral(["\n border-bottom-right-radius: 0;\n border-top-right-radius: 0;\n "])));
|
|
80
80
|
});
|
|
81
|
-
var DropdownButtonContainer = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(
|
|
81
|
+
var DropdownButtonContainer = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject29 || (_templateObject29 = defaultTheme._taggedTemplateLiteral(["\n display: inline-block;\n\n button {\n border-bottom-left-radius: 0;\n border-top-left-radius: 0;\n\n ", ";\n }\n\n svg {\n color: inherit;\n height: 7px;\n width: 12px;\n\n ", ";\n }\n"])), function (props) {
|
|
82
82
|
return !props.singleAction && 'border-left: none';
|
|
83
83
|
}, function (props) {
|
|
84
84
|
return !props.singleAction && 'margin-bottom: 1px';
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var defaultTheme = require('./defaultTheme-
|
|
3
|
+
var defaultTheme = require('./defaultTheme-24ea5c47.js');
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var nanoid = require('nanoid');
|
|
6
6
|
var lodash = require('lodash');
|
|
@@ -11,7 +11,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
11
11
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
12
12
|
var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
|
|
13
13
|
|
|
14
|
-
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9,
|
|
14
|
+
var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject0;
|
|
15
15
|
var checkboxSize = '18px';
|
|
16
16
|
var Checkbox$1 = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject || (_templateObject = defaultTheme._taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n"])));
|
|
17
17
|
var CheckIcon = styled__default["default"].div.attrs(defaultTheme.applyDefaultTheme)(_templateObject2 || (_templateObject2 = defaultTheme._taggedTemplateLiteral(["\n opacity: 0;\n transform: scale(0.1);\n transition: all 200ms;\n position: absolute;\n width: 12px;\n top: 4px;\n left: 3px;\n color: ", ";\n\n svg {\n width: 100%;\n display: block;\n }\n"])), function (props) {
|
|
@@ -39,7 +39,7 @@ var CheckboxVisualLabel = styled__default["default"].div.attrs(defaultTheme.appl
|
|
|
39
39
|
var Description = styled__default["default"].p.attrs(defaultTheme.applyDefaultTheme)(_templateObject9 || (_templateObject9 = defaultTheme._taggedTemplateLiteral(["\n margin: 0.375rem 0 0 0;\n font-size: 0.75rem;\n line-height: 1.333;\n\n ", ";\n\n ", "\n"])), function (props) {
|
|
40
40
|
return props.theme.themeProp('color', props.theme.getColor('gray-400'), props.theme.getColor('gray-500'));
|
|
41
41
|
}, function (props) {
|
|
42
|
-
return props.error && styled.css(
|
|
42
|
+
return props.error && styled.css(_templateObject0 || (_templateObject0 = defaultTheme._taggedTemplateLiteral(["\n content: 'error';\n ", "\n "])), props.theme.themeProp('color', props.theme.getColor('red-200'), props.theme.getColor('red-500')));
|
|
43
43
|
});
|
|
44
44
|
|
|
45
45
|
var Checkbox = React__default["default"].forwardRef(function Checkbox(_ref, forwardedRef) {
|