oolib 2.107.0 → 2.108.0
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.
|
@@ -54,6 +54,8 @@ var getBlockLabelProps_1 = require("../../utils/getBlockLabelProps");
|
|
|
54
54
|
var ResourceDisplayBlock_1 = require("./comp/ResourceDisplayBlock");
|
|
55
55
|
var styled_1 = require("./styled");
|
|
56
56
|
var useFakeUploadImpression_1 = require("../../utilsOolib/useFakeUploadImpression");
|
|
57
|
+
var utilsOolib_1 = require("../../utilsOolib");
|
|
58
|
+
var themes_1 = require("../../themes");
|
|
57
59
|
var Plus = icons_1.icons.Plus;
|
|
58
60
|
var ResourceInput = function (props) {
|
|
59
61
|
var parentOnChange = props.onChange, comp_id = props.id, _a = props.folderName, folderName = _a === void 0 ? "media" : _a, value = props.value, _b = props.multiple, multiple = _b === void 0 ? true : _b, uploadBtnText = props.uploadBtnText, readOnly = props.readOnly, invert = props.invert;
|
|
@@ -112,9 +114,9 @@ var ResourceInput = function (props) {
|
|
|
112
114
|
react_1.default.createElement(styled_1.StyledWrapper, null,
|
|
113
115
|
react_1.default.createElement(ResourceDisplayBlock_1.ResourceDisplayBlock, { resources: resources, filesLength: filesLength, uploadProgress: uploadProgress, invert: invert, removeResource: function (id) { return removeResource(id); } }),
|
|
114
116
|
!readOnly &&
|
|
115
|
-
react_1.default.createElement(styled_1.StyledUploadButton, { onClick: function () { return inputRef.current.click(); }, invert: invert },
|
|
116
|
-
react_1.default.createElement(Plus, {
|
|
117
|
-
react_1.default.createElement(Typo_1.
|
|
117
|
+
react_1.default.createElement(styled_1.StyledUploadButton, { onClick: function () { return inputRef.current.click(); }, invert: invert, theme: theme },
|
|
118
|
+
react_1.default.createElement(Plus, { color: invert ? (0, utilsOolib_1.getPrimaryColor40)(themes_1.colors) : (0, utilsOolib_1.getPrimaryColorText)(themes_1.colors), size: 20, weight: 'bold', "style-": { border: 'none' } }),
|
|
119
|
+
react_1.default.createElement(Typo_1.SANS_3, { semibold: true, style: { marginTop: '0.5rem' } }, uploadBtnText || "Add Resource"))),
|
|
118
120
|
react_1.default.createElement("input", { id: "".concat(comp_id, "_resources_uploader"), type: "file", multiple: multiple, style: { display: 'none' }, ref: inputRef, onChange: function (v) { return handleUpload(v.target.files); } })));
|
|
119
121
|
};
|
|
120
122
|
exports.ResourceInput = ResourceInput;
|
|
@@ -12,18 +12,23 @@ var styled_components_1 = __importDefault(require("styled-components"));
|
|
|
12
12
|
var colors_1 = require("../../themes/colors");
|
|
13
13
|
var mixins_1 = require("../../themes/mixins");
|
|
14
14
|
var utilsOolib_1 = require("../../utilsOolib");
|
|
15
|
-
|
|
15
|
+
var white = colors_1.colors.white, greyColor100 = colors_1.colors.greyColor100, greyColor80 = colors_1.colors.greyColor80;
|
|
16
|
+
exports.StyledUploadButton = styled_components_1.default.button(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border: none;\n width: 14rem;\n height: 14rem;\n\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n cursor: pointer;\n color: ", ";;\n text-align: center;\n \n border: 2px solid ", ";\n\n background-color: ", "; \n\n &:hover {\n\n background-color: ", ";\n\n } \n\n ", "\n\n\n &:active {\n transform: scale(0.98);\n }\n\n &:focus {\n outline: none;\n }\n\n"], ["\n border: none;\n width: 14rem;\n height: 14rem;\n\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n cursor: pointer;\n color: ", ";;\n text-align: center;\n \n border: 2px solid ", ";\n\n background-color: ", "; \n\n &:hover {\n\n background-color: ", ";\n\n } \n\n ", "\n\n\n &:active {\n transform: scale(0.98);\n }\n\n &:focus {\n outline: none;\n }\n\n"])), function (_a) {
|
|
16
17
|
var invert = _a.invert;
|
|
17
|
-
return invert ? colors_1.colors
|
|
18
|
+
return invert ? (0, utilsOolib_1.getPrimaryColor40)(colors_1.colors) : (0, utilsOolib_1.getPrimaryColorText)(colors_1.colors);
|
|
18
19
|
}, function (_a) {
|
|
19
|
-
var invert = _a.invert;
|
|
20
|
-
return invert
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
return invert ? (0, utilsOolib_1.getPrimaryColor10)(colors_1.colors) : (0, utilsOolib_1.getPrimaryColor40)(colors_1.colors);
|
|
20
|
+
var invert = _a.invert, colors = _a.theme.colors;
|
|
21
|
+
return invert
|
|
22
|
+
? (0, utilsOolib_1.getPrimaryColor40)(colors)
|
|
23
|
+
: (0, utilsOolib_1.getPrimaryColor100)(colors);
|
|
24
24
|
}, function (_a) {
|
|
25
25
|
var invert = _a.invert;
|
|
26
|
-
return invert ?
|
|
27
|
-
})
|
|
26
|
+
return invert ? greyColor100 : white;
|
|
27
|
+
}, function (_a) {
|
|
28
|
+
var invert = _a.invert, colors = _a.theme.colors;
|
|
29
|
+
return invert
|
|
30
|
+
? greyColor80
|
|
31
|
+
: (0, utilsOolib_1.getPrimaryColor40)(colors);
|
|
32
|
+
}, (0, mixins_1.transition)('background-color'));
|
|
28
33
|
exports.StyledWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n flex-wrap: wrap;\n gap: 1rem;\n \n"], ["\n display: flex;\n flex-wrap: wrap;\n gap: 1rem;\n \n"])));
|
|
29
34
|
var templateObject_1, templateObject_2;
|