oolib 2.23.0 → 2.24.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.
|
@@ -52,8 +52,7 @@ function RadioList(_a) {
|
|
|
52
52
|
var _e = (0, utils_1.genDisplayedOptions)({ injectOtherOption: injectOtherOption, options: options, valueProp: valueProp, saveValueAsString: saveValueAsString }), typicalOptions = _e.typicalOptions, injectedOtherOption = _e.injectedOtherOption;
|
|
53
53
|
var value = saveValueAsString ?
|
|
54
54
|
typicalOptions
|
|
55
|
-
.concat(injectedOtherOption)
|
|
56
|
-
.filter(Boolean)
|
|
55
|
+
.concat(injectedOtherOption || [])
|
|
57
56
|
.find(function (op) { var _a; return ((_a = op.display_desc) !== null && _a !== void 0 ? _a : op.value) === valueProp; })
|
|
58
57
|
: valueProp;
|
|
59
58
|
var correctOp = options.find(function (op) { return op.isCorrect; }); //
|
|
@@ -17,7 +17,7 @@ export function TagClear({ id, display, value, M, XS, invert, onClick, variant,
|
|
|
17
17
|
variant?: string;
|
|
18
18
|
grey: any;
|
|
19
19
|
}): JSX.Element;
|
|
20
|
-
export function TagSelect({ onClick, isSelected, display, value, M, XS, invert, style, onMouseDown }: {
|
|
20
|
+
export function TagSelect({ onClick, isSelected, display, value, M, XS, invert, disabled, style, onMouseDown }: {
|
|
21
21
|
onClick: any;
|
|
22
22
|
isSelected?: boolean;
|
|
23
23
|
display: any;
|
|
@@ -25,6 +25,7 @@ export function TagSelect({ onClick, isSelected, display, value, M, XS, invert,
|
|
|
25
25
|
M: any;
|
|
26
26
|
XS: any;
|
|
27
27
|
invert: any;
|
|
28
|
+
disabled: any;
|
|
28
29
|
style: any;
|
|
29
30
|
onMouseDown: any;
|
|
30
31
|
}): JSX.Element;
|
|
@@ -1,4 +1,15 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
2
13
|
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
14
|
if (k2 === undefined) k2 = k;
|
|
4
15
|
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
@@ -27,15 +38,9 @@ exports.TagLink = exports.TagSelect = exports.TagClear = exports.TagDisplay = vo
|
|
|
27
38
|
var react_1 = __importStar(require("react"));
|
|
28
39
|
var index_styled_1 = require("./index.styled");
|
|
29
40
|
var icons_1 = require("../../icons");
|
|
30
|
-
var getTypoComp = function (size) { return size === 'XS'
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
return react_1.default.createElement(index_styled_1.STYLED_ELLIPSIS_SANS_2, null, children);
|
|
34
|
-
}
|
|
35
|
-
: function (_a) {
|
|
36
|
-
var children = _a.children;
|
|
37
|
-
return react_1.default.createElement(index_styled_1.STYLED_ELLIPSIS_SANS_3, null, children);
|
|
38
|
-
}; };
|
|
41
|
+
var getTypoComp = function (size) { return size === 'XS' ?
|
|
42
|
+
function (props) { return react_1.default.createElement(index_styled_1.STYLED_ELLIPSIS_SANS_2, __assign({}, props)); }
|
|
43
|
+
: function (props) { return react_1.default.createElement(index_styled_1.STYLED_ELLIPSIS_SANS_3, __assign({}, props)); }; };
|
|
39
44
|
function TagDisplay(_a) {
|
|
40
45
|
var display = _a.display, style = _a.style, invert = _a.invert, M = _a.M, XS = _a.XS, _b = _a.variant, variant = _b === void 0 ? 'primary' : _b;
|
|
41
46
|
var size = M ? 'M' : XS ? 'XS' : 'S';
|
|
@@ -56,11 +61,11 @@ function TagClear(_a) {
|
|
|
56
61
|
}
|
|
57
62
|
exports.TagClear = TagClear;
|
|
58
63
|
function TagSelect(_a) {
|
|
59
|
-
var onClick = _a.onClick, _b = _a.isSelected, isSelected = _b === void 0 ? false : _b, display = _a.display, value = _a.value, M = _a.M, XS = _a.XS, invert = _a.invert, style = _a.style, onMouseDown = _a.onMouseDown;
|
|
64
|
+
var onClick = _a.onClick, _b = _a.isSelected, isSelected = _b === void 0 ? false : _b, display = _a.display, value = _a.value, M = _a.M, XS = _a.XS, invert = _a.invert, disabled = _a.disabled, style = _a.style, onMouseDown = _a.onMouseDown;
|
|
60
65
|
var _c = (0, react_1.useState)(isSelected), selected = _c[0], setSelected = _c[1];
|
|
61
66
|
var handleOnClick = function () {
|
|
62
67
|
setSelected(!selected);
|
|
63
|
-
onClick({ display: display, value: value });
|
|
68
|
+
onClick && onClick({ display: display, value: value });
|
|
64
69
|
};
|
|
65
70
|
(0, react_1.useLayoutEffect)(function () {
|
|
66
71
|
if (selected && !isSelected) {
|
|
@@ -69,8 +74,8 @@ function TagSelect(_a) {
|
|
|
69
74
|
}, [isSelected]);
|
|
70
75
|
var size = M ? 'M' : XS ? 'XS' : 'S';
|
|
71
76
|
var TYPO_COMP = getTypoComp(size);
|
|
72
|
-
return (react_1.default.createElement(index_styled_1.StyledTagSelect, { invert: invert, onClick:
|
|
73
|
-
react_1.default.createElement(TYPO_COMP,
|
|
77
|
+
return (react_1.default.createElement(index_styled_1.StyledTagSelect, { disabled: disabled, invert: invert, onClick: function () { return !onMouseDown && !disabled && handleOnClick(); }, selected: selected, size: size, style: style, onMouseDown: function (ev) { return !disabled && onMouseDown && onMouseDown(ev); } },
|
|
78
|
+
react_1.default.createElement(TYPO_COMP, { semibold: true }, display)));
|
|
74
79
|
}
|
|
75
80
|
exports.TagSelect = TagSelect;
|
|
76
81
|
function TagLink(_a) {
|
|
@@ -46,7 +46,7 @@ var commonStyle = function (_a) {
|
|
|
46
46
|
};
|
|
47
47
|
var blueHover = function (_a) {
|
|
48
48
|
var invert = _a.invert, colors = _a.colors;
|
|
49
|
-
return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n\
|
|
49
|
+
return (0, styled_components_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n @media (hover: hover){\n &:hover {\n background-color: ", ";\n color: ", ";\t\t\n }\n }\n"], ["\n @media (hover: hover){\n &:hover {\n background-color: ", ";\n color: ", ";\t\t\n }\n }\n"])), invert
|
|
50
50
|
? (0, utilsOolib_1.getPrimaryColor10)(colors)
|
|
51
51
|
: (0, utilsOolib_1.getPrimaryColor40)(colors), invert
|
|
52
52
|
? greyColor100
|
|
@@ -54,7 +54,7 @@ var blueHover = function (_a) {
|
|
|
54
54
|
};
|
|
55
55
|
var greyHover = function (_a) {
|
|
56
56
|
var invert = _a.invert;
|
|
57
|
-
return (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n\
|
|
57
|
+
return (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n @media (hover: hover){\n &:hover {\n background-color: ", ";\n }\n }\n"], ["\n @media (hover: hover){\n &:hover {\n background-color: ", ";\n }\n }\n"])), invert
|
|
58
58
|
? greyColor80
|
|
59
59
|
: greyColor10);
|
|
60
60
|
};
|
|
@@ -100,26 +100,38 @@ var StyledTagClearIconWrapper = styled_components_1.default.div(templateObject_1
|
|
|
100
100
|
: blueHover({ invert: invert, colors: colors });
|
|
101
101
|
});
|
|
102
102
|
exports.StyledTagClearIconWrapper = StyledTagClearIconWrapper;
|
|
103
|
-
var StyledTagSelect = styled_components_1.default.div(
|
|
103
|
+
var StyledTagSelect = styled_components_1.default.div(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n ", "\n ", "\n\n cursor: ", ";\n border-style: solid;\n border-width: ", ";\n \n\n ", "\n \n @media (hover: hover){\n &:hover {\n ", "\n }\n }\n \n"], ["\n ", "\n ", "\n\n cursor: ", ";\n border-style: solid;\n border-width: ", ";\n \n\n ", "\n \n @media (hover: hover){\n &:hover {\n ", "\n }\n }\n \n"])), function (_a) {
|
|
104
104
|
var size = _a.size;
|
|
105
105
|
return commonStyle({ size: size });
|
|
106
106
|
}, (0, mixins_1.transition)("background-color"), function (_a) {
|
|
107
|
-
var
|
|
108
|
-
return
|
|
107
|
+
var disabled = _a.disabled;
|
|
108
|
+
return disabled ? 'not-allowed' : 'pointer';
|
|
109
|
+
}, function (_a) {
|
|
110
|
+
var size = _a.size;
|
|
111
|
+
return size === "XS" ? "1px" : "2px";
|
|
112
|
+
}, function (_a) {
|
|
113
|
+
var disabled = _a.disabled, selected = _a.selected, invert = _a.invert, colors = _a.theme.colors;
|
|
114
|
+
if (disabled) {
|
|
115
|
+
return invert ? (0, styled_components_1.css)(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n border-color: ", ";\n background-color: ", ";\n color: ", ";\n "], ["\n border-color: ", ";\n background-color: ", ";\n color: ", ";\n "])), greyColor40, greyColor80, greyColor40) : (0, styled_components_1.css)(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n border-color: ", ";\n color: ", ";\n "], ["\n border-color: ", ";\n color: ", ";\n "])), greyColor15, greyColor40);
|
|
116
|
+
}
|
|
117
|
+
return invert ? (0, styled_components_1.css)(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n border-color: ", ";\n background-color: ", ";\n color: ", ";\n "], ["\n border-color: ", ";\n background-color: ", ";\n color: ", ";\n "])), (0, utilsOolib_1.getPrimaryColor40)(colors), selected ? (0, utilsOolib_1.getPrimaryColor40)(colors) : 'unset', selected ? greyColor100 : (0, utilsOolib_1.getPrimaryColor40)(colors)) : (0, styled_components_1.css)(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n border-color: ", ";\n background-color: ", ";\n color: ", ";\n "], ["\n border-color: ", ";\n background-color: ", ";\n color: ", ";\n "])), (0, utilsOolib_1.getPrimaryColor100)(colors), selected ? (0, utilsOolib_1.getPrimaryColor100)(colors) : 'unset', selected ? white : (0, utilsOolib_1.getPrimaryColorText)(colors));
|
|
118
|
+
}, function (_a) {
|
|
119
|
+
var selected = _a.selected, invert = _a.invert, disabled = _a.disabled, colors = _a.theme.colors;
|
|
120
|
+
return !selected && !disabled && (0, styled_components_1.css)(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n background-color: ", ";\n color: ", ";\n "], ["\n background-color: ", ";\n color: ", ";\n "])), invert ? greyColor80 : (0, utilsOolib_1.getPrimaryColor40)(colors), invert ? (0, utilsOolib_1.getPrimaryColor40)(colors) : (0, utilsOolib_1.getPrimaryColorText)(colors));
|
|
109
121
|
});
|
|
110
122
|
exports.StyledTagSelect = StyledTagSelect;
|
|
111
|
-
var StyledTagLink = styled_components_1.default.div(
|
|
123
|
+
var StyledTagLink = styled_components_1.default.div(templateObject_23 || (templateObject_23 = __makeTemplateObject(["\n \t", "\n\t", ";\n ", "\n"], ["\n \t", "\n\t", ";\n ", "\n"])), function (_a) {
|
|
112
124
|
var size = _a.size;
|
|
113
125
|
return commonStyle({ size: size });
|
|
114
126
|
}, (0, mixins_1.transition)("background-color", "color"), function (_a) {
|
|
115
127
|
var variant = _a.variant, invert = _a.invert, size = _a.size, colors = _a.theme.colors;
|
|
116
128
|
return variant === "primary"
|
|
117
|
-
? (0, styled_components_1.css)(
|
|
129
|
+
? (0, styled_components_1.css)(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n \t\tbackground-color: ", ";\n \t\tcolor: ", ";\n\t\t\t\t", ";\n \t"], ["\n \t\tbackground-color: ", ";\n \t\tcolor: ", ";\n\t\t\t\t", ";\n \t"])), !invert
|
|
118
130
|
? (0, utilsOolib_1.getPrimaryColor100)(colors)
|
|
119
131
|
: (0, utilsOolib_1.getPrimaryColor40)(colors), !invert ? white : greyColor100, blueHover({ invert: invert, colors: colors })) : // secondary
|
|
120
|
-
(0, styled_components_1.css)(
|
|
132
|
+
(0, styled_components_1.css)(templateObject_22 || (templateObject_22 = __makeTemplateObject(["\n \t\tbackground: none;\n \t\tborder: ", " solid ", ";\n \t\tcolor: ", ";\n\t\t\t\t", "\n \t"], ["\n \t\tbackground: none;\n \t\tborder: ", " solid ", ";\n \t\tcolor: ", ";\n\t\t\t\t", "\n \t"])), size === "XS" ? "1px" : "2px", !invert ? (0, utilsOolib_1.getPrimaryColor100)(colors) : (0, utilsOolib_1.getPrimaryColor40)(colors), !invert ? (0, utilsOolib_1.getPrimaryColorText)(colors) : (0, utilsOolib_1.getPrimaryColor40)(colors), blueHover({ invert: invert, colors: colors }));
|
|
121
133
|
});
|
|
122
134
|
exports.StyledTagLink = StyledTagLink;
|
|
123
|
-
var StyledLink = (0, styled_components_1.default)(react_router_dom_1.NavLink)(
|
|
135
|
+
var StyledLink = (0, styled_components_1.default)(react_router_dom_1.NavLink)(templateObject_24 || (templateObject_24 = __makeTemplateObject(["\n text-decoration: none;\n"], ["\n text-decoration: none;\n"])));
|
|
124
136
|
exports.StyledLink = StyledLink;
|
|
125
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21;
|
|
137
|
+
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24;
|