krl-alfred 2.18.1 → 2.18.2
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.
|
@@ -12,7 +12,7 @@ var jsx_runtime_1 = require("react/jsx-runtime");
|
|
|
12
12
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
13
13
|
var Icon_1 = __importDefault(require("../../../Icon/Icon"));
|
|
14
14
|
var svgToBase64_1 = __importDefault(require("./../../../../utils/svgToBase64"));
|
|
15
|
-
exports.BoxedSmStyled = styled_components_1.default.label(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border: 1px solid var(--dark-opacity-10);\n position: relative;\n border-radius: 0.5rem;\n display: flex;\n align-items: center;\n justify-content: flex-start;\n cursor: ", ";\n padding: calc(0.75rem - 0.5px) 1rem;\n input[type=\"radio\"] {\n height: 0;\n width: 0;\n opacity: 0;\n z-index: -1;\n position: absolute;\n\n &:checked ~ .indicator {\n background-image:url('", "');\n }\n\n &:checked ", " {\n ~ div.labelsWrapper {\n &:before {\n content: \"\";\n position: absolute;\n inset: -1px;\n border-radius: 0.5rem;\n user-select: none;\n pointer-events: none;\n }\n }\n }\n \n &:checked {\n ~ div.labelsWrapper {\n &:before {\n border: 2px solid var(--primary) !important;\n }\n }\n }\n }\n\n div.indicator {\n background-image: url('", "');\n background-size: 100% 100%;\n display: block;\n position: absolute;\n left: 1rem;\n top: 50%;\n transform: translateY(-50%);\n margin: ", ";\n width: ", ";\n height: ", ";\n\n &:disabled {\n cursor: not-allowed;\n }\n }\n\n div.labelsWrapper {\n row-gap: 4px;\n cursor: ", ";\n margin: 0;\n color: ", ";\n padding: 0 0 0 1.5rem;\n display: grid;\n\n label.label {\n display: block;\n margin: 0;\n vertical-align: middle;\n cursor: pointer;\n font:
|
|
15
|
+
exports.BoxedSmStyled = styled_components_1.default.label(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n border: 1px solid var(--dark-opacity-10);\n position: relative;\n border-radius: 0.5rem;\n display: flex;\n align-items: center;\n justify-content: flex-start;\n cursor: ", ";\n padding: calc(0.75rem - 0.5px) 1rem;\n input[type=\"radio\"] {\n height: 0;\n width: 0;\n opacity: 0;\n z-index: -1;\n position: absolute;\n\n &:checked ~ .indicator {\n background-image:url('", "');\n }\n\n &:checked ", " {\n ~ div.labelsWrapper {\n &:before {\n content: \"\";\n position: absolute;\n inset: -1px;\n border-radius: 0.5rem;\n user-select: none;\n pointer-events: none;\n }\n }\n }\n \n &:checked {\n ~ div.labelsWrapper {\n &:before {\n border: 2px solid var(--primary) !important;\n }\n }\n }\n }\n\n div.indicator {\n background-image: url('", "');\n background-size: 100% 100%;\n display: block;\n position: absolute;\n left: 1rem;\n top: 50%;\n transform: translateY(-50%);\n margin: ", ";\n width: ", ";\n height: ", ";\n\n &:disabled {\n cursor: not-allowed;\n }\n }\n\n div.labelsWrapper {\n row-gap: 4px;\n cursor: ", ";\n margin: 0;\n color: ", ";\n padding: 0 0 0 1.5rem;\n display: grid;\n\n label.label {\n display: block;\n margin: 0;\n vertical-align: middle;\n cursor: pointer;\n font: ", ";\n }\n }\n"], ["\n border: 1px solid var(--dark-opacity-10);\n position: relative;\n border-radius: 0.5rem;\n display: flex;\n align-items: center;\n justify-content: flex-start;\n cursor: ", ";\n padding: calc(0.75rem - 0.5px) 1rem;\n input[type=\"radio\"] {\n height: 0;\n width: 0;\n opacity: 0;\n z-index: -1;\n position: absolute;\n\n &:checked ~ .indicator {\n background-image:url('", "');\n }\n\n &:checked ", " {\n ~ div.labelsWrapper {\n &:before {\n content: \"\";\n position: absolute;\n inset: -1px;\n border-radius: 0.5rem;\n user-select: none;\n pointer-events: none;\n }\n }\n }\n \n &:checked {\n ~ div.labelsWrapper {\n &:before {\n border: 2px solid var(--primary) !important;\n }\n }\n }\n }\n\n div.indicator {\n background-image: url('", "');\n background-size: 100% 100%;\n display: block;\n position: absolute;\n left: 1rem;\n top: 50%;\n transform: translateY(-50%);\n margin: ", ";\n width: ", ";\n height: ", ";\n\n &:disabled {\n cursor: not-allowed;\n }\n }\n\n div.labelsWrapper {\n row-gap: 4px;\n cursor: ", ";\n margin: 0;\n color: ", ";\n padding: 0 0 0 1.5rem;\n display: grid;\n\n label.label {\n display: block;\n margin: 0;\n vertical-align: middle;\n cursor: pointer;\n font: ", ";\n }\n }\n"])), function (props) { return (props.$disabled ? "not-allowed" : "pointer"); }, function (props) { return (0, svgToBase64_1.default)((0, jsx_runtime_1.jsx)(Icon_1.default, { hasWrapper: false, color: "".concat(props.$color), name: "RadioButtonElementChecked" })); }, function (props) { return !props.$readOnly && " , &:hover"; }, function (props) { return props.$disabled ? (0, svgToBase64_1.default)((0, jsx_runtime_1.jsx)(Icon_1.default, { hasWrapper: false, name: "RadioButtonElementDisabled" })) : (props.$valid ? (0, svgToBase64_1.default)((0, jsx_runtime_1.jsx)(Icon_1.default, { hasWrapper: false, name: "RadioButtonElementUnchecked" })) : (0, svgToBase64_1.default)((0, jsx_runtime_1.jsx)(Icon_1.default, { hasWrapper: false, name: "RadioButtonElementInvalid" }))); }, function (props) { return (props.$size === "small" ? "0 8px 0 0" : "0 16px 0 0"); }, function (props) {
|
|
16
16
|
switch (props.$size) {
|
|
17
17
|
case 'small':
|
|
18
18
|
return "16px";
|
|
@@ -30,5 +30,14 @@ exports.BoxedSmStyled = styled_components_1.default.label(templateObject_1 || (t
|
|
|
30
30
|
default:
|
|
31
31
|
return "16px";
|
|
32
32
|
}
|
|
33
|
-
}, function (props) { return (props.$disabled ? "not-allowed" : "pointer"); }, function (props) { return props.$valid ? 'var(--dark)' : 'var(--red)'; })
|
|
33
|
+
}, function (props) { return (props.$disabled ? "not-allowed" : "pointer"); }, function (props) { return props.$valid ? 'var(--dark)' : 'var(--red)'; }, function (props) {
|
|
34
|
+
switch (props.$textSize) {
|
|
35
|
+
case 'small':
|
|
36
|
+
return "var(--caption-semi-bold-12-15)";
|
|
37
|
+
case 'medium':
|
|
38
|
+
return "var(--body-semi-bold-14-17)";
|
|
39
|
+
default:
|
|
40
|
+
return "var(--body-semi-bold-14-17)";
|
|
41
|
+
}
|
|
42
|
+
});
|
|
34
43
|
var templateObject_1;
|