krl-alfred 2.18.8 → 2.18.10

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.
Files changed (3) hide show
  1. package/dist/components/CategoryMenu/CategoryMenu.styled.js +1 -1
  2. package/dist/components/RadioButton/layouts/horizontal/Horizontal.styled.js +1 -1
  3. package/package.json +1 -1
package/dist/components/CategoryMenu/CategoryMenu.styled.js CHANGED
@@ -31,7 +31,7 @@ exports.SubMenu = exports.CategoryItemButtonTitle = exports.CategoryItemButtonBa
31
31
  var styled_components_1 = __importStar(require("styled-components"));
32
32
  exports.CategoryMenuWrapper = styled_components_1.default.ul(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n padding:0;\n margin: 12.5px auto;\n max-width: 1050px;\n a {\n text-decoration:none;\n &:not([href]){\n cursor: initial;\n *{\n cursor: initial;\n }\n }\n }\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n padding:0;\n margin: 12.5px auto;\n max-width: 1050px;\n a {\n text-decoration:none;\n &:not([href]){\n cursor: initial;\n *{\n cursor: initial;\n }\n }\n }\n"])));
33
33
  var hoverAndActive = (0, styled_components_1.css)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n color: var(--dark);\n &:before{\n border-color: var(--grey-10);\n box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n color: var(--dark);\n }\n"], ["\n color: var(--dark);\n &:before{\n border-color: var(--grey-10);\n box-shadow: 0 6px 30px 0 var(--box-shadow-color);\n color: var(--dark);\n }\n"])));
34
- exports.CategoryItem = styled_components_1.default.li(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: block;\n position: relative;\n margin: 0;\n padding-bottom: 8px;\n padding-top: 8px;\n &:not(:last-child):not(:nth-last-child(2)){\n path, circle, rect {\n color : var(--dark-opacity-75);\n }\n }\n &:hover{\n &:not(:last-child):not(:nth-last-child(2)){\n path , circle, rect {\n color : var(--dark);\n }\n }\n > ul{\n opacity: 1;\n visibility: visible;\n transform: translateY(0);\n transition-delay: 0.3s;\n }\n .componentWrapper {\n > span{\n ", "\n }\n }\n }\n &:last-child , &:nth-last-child(2){\n ul{\n left: auto;\n right: 0;\n }\n }\n ", "\n ", "\n"], ["\n display: block;\n position: relative;\n margin: 0;\n padding-bottom: 8px;\n padding-top: 8px;\n &:not(:last-child):not(:nth-last-child(2)){\n path, circle, rect {\n color : var(--dark-opacity-75);\n }\n }\n &:hover{\n &:not(:last-child):not(:nth-last-child(2)){\n path , circle, rect {\n color : var(--dark);\n }\n }\n > ul{\n opacity: 1;\n visibility: visible;\n transform: translateY(0);\n transition-delay: 0.3s;\n }\n .componentWrapper {\n > span{\n ", "\n }\n }\n }\n &:last-child , &:nth-last-child(2){\n ul{\n left: auto;\n right: 0;\n }\n }\n ", "\n ", "\n"])), hoverAndActive, function (props) { return props.$isActiveCategory ? "\n .componentWrapper > span{\n ".concat(hoverAndActive, "\n }\n ") : ""; }, function (props) { return props.$hasCustomItem ? "\n display: flex;\n align-items: center;\n justify-content: center;\n &:before{\n content: '';\n background-color:var(--grey-10);\n height: 39px;\n width: 2px;\n display: block;\n vertical-align: middle;\n border-radius: 8px;\n margin-right: 15px;\n margin-left: 15px;\n }\n " : ""; });
34
+ exports.CategoryItem = styled_components_1.default.li(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: block;\n position: relative;\n margin: 0;\n padding-bottom: 8px;\n padding-top: 8px;\n &:not(:last-child):not(:nth-last-child(2)){\n path, circle, rect {\n color : var(--dark-opacity-75);\n }\n }\n &:hover{\n &:not(:last-child):not(:nth-last-child(2)){\n path , circle, rect {\n color : var(--dark);\n }\n }\n > ul{\n opacity: 1;\n visibility: visible;\n transform: translateY(0);\n transition-delay: 0.3s;\n }\n .componentWrapper {\n > span{\n ", "\n }\n }\n }\n &:last-child , &:nth-last-child(2){\n ul{\n left: auto;\n right: 0;\n }\n }\n ", "\n ", "\n"], ["\n display: block;\n position: relative;\n margin: 0;\n padding-bottom: 8px;\n padding-top: 8px;\n &:not(:last-child):not(:nth-last-child(2)){\n path, circle, rect {\n color : var(--dark-opacity-75);\n }\n }\n &:hover{\n &:not(:last-child):not(:nth-last-child(2)){\n path , circle, rect {\n color : var(--dark);\n }\n }\n > ul{\n opacity: 1;\n visibility: visible;\n transform: translateY(0);\n transition-delay: 0.3s;\n }\n .componentWrapper {\n > span{\n ", "\n }\n }\n }\n &:last-child , &:nth-last-child(2){\n ul{\n left: auto;\n right: 0;\n }\n }\n ", "\n ", "\n"])), hoverAndActive, function (props) { return props.$isActiveCategory ? "\n .componentWrapper > span{\n ".concat(hoverAndActive, "\n }\n ") : ""; }, function (props) { return props.$hasCustomItem ? "\n display: flex;\n align-items: center;\n justify-content: center;\n &:before{\n content: '';\n background-color:var(--grey-10);\n height: 39px;\n width: 2px;\n display: block;\n vertical-align: middle;\n border-radius: 8px;\n margin-right: 6px;\n margin-left: 6px;\n }\n " : ""; });
35
35
  exports.CategoryItemButtonInner = styled_components_1.default.span(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n text-decoration: none;\n padding: 12px 16px;\n color: var(--dark-opacity-75);\n margin: 0;\n transition: all 0.2s ease-in-out;\n text-align: center;\n outline: none;\n display: block;\n position: relative;\n border: 0;\n background: transparent;\n outline: 0;\n width: 100%;\n font-family:inherit;\n cursor:pointer;\n box-sizing: border-box;\n &:before{\n content: \"\";\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n border: 1px solid transparent;\n color: var(--dark-opacity-75);\n background-color: transparent;\n border-radius: 0.5rem;\n z-index: -1;\n transition: all 0.2s ease-in-out;\n }\n"], ["\n text-decoration: none;\n padding: 12px 16px;\n color: var(--dark-opacity-75);\n margin: 0;\n transition: all 0.2s ease-in-out;\n text-align: center;\n outline: none;\n display: block;\n position: relative;\n border: 0;\n background: transparent;\n outline: 0;\n width: 100%;\n font-family:inherit;\n cursor:pointer;\n box-sizing: border-box;\n &:before{\n content: \"\";\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n border: 1px solid transparent;\n color: var(--dark-opacity-75);\n background-color: transparent;\n border-radius: 0.5rem;\n z-index: -1;\n transition: all 0.2s ease-in-out;\n }\n"])));
36
36
  exports.CategoryItemButtonIcon = styled_components_1.default.span(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n @keyframes tada_category {\n 0% {\n transform: scaleX(1)\n }\n\n 10%,20% {\n transform: rotate(-2deg)\n }\n\n 30%,50%,70%,90% {\n transform: rotate(2deg)\n }\n\n 40%,60%,80% {\n transform: rotate(-2deg)\n }\n\n to {\n transform: scaleX(1)\n }\n }\n\n ", "\n height: 24px;\n display:flex;\n position: relative;\n align-items: center;\n justify-content: center;\n"], ["\n @keyframes tada_category {\n 0% {\n transform: scaleX(1)\n }\n\n 10%,20% {\n transform: rotate(-2deg)\n }\n\n 30%,50%,70%,90% {\n transform: rotate(2deg)\n }\n\n 40%,60%,80% {\n transform: rotate(-2deg)\n }\n\n to {\n transform: scaleX(1)\n }\n }\n\n ", "\n height: 24px;\n display:flex;\n position: relative;\n align-items: center;\n justify-content: center;\n"])), function (props) { return props.$hasAnimation ? "\n animation: tada_category 1.5s infinite;\n animation-iteration-count: 10;\n " : ""; });
37
37
  exports.CategoryItemButtonBadge = styled_components_1.default.span(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n font: var(--caption-bold-10-12);\n line-height: 17px;\n border-radius: 3px;\n background-color: var(--primary);\n color: white;\n padding: 0 0.5rem;\n display: inline-block;\n margin-top: 2px;\n"], ["\n font: var(--caption-bold-10-12);\n line-height: 17px;\n border-radius: 3px;\n background-color: var(--primary);\n color: white;\n padding: 0 0.5rem;\n display: inline-block;\n margin-top: 2px;\n"])));
package/dist/components/RadioButton/layouts/horizontal/Horizontal.styled.js CHANGED
@@ -13,5 +13,5 @@ var styled_components_1 = __importDefault(require("styled-components"));
13
13
  var devices_1 = require("../../../../constants/devices");
14
14
  var svgToBase64_1 = __importDefault(require("./../../../../utils/svgToBase64"));
15
15
  var Icon_1 = __importDefault(require("../../../Icon/Icon"));
16
- exports.HorizontalBoxStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: block;\n > label {\n display: flex;\n width: 100%;\n align-items: center;\n justify-content: center;\n border: ", ";\n border-radius: 0.5rem;\n height: 67px;\n cursor: ", ";\n background-color: ", ";\n ", "\n .inner {\n width: 100%;\n padding: 0 1.5rem;\n display: flex;\n align-items: center;\n justify-content: space-between;\n @media only screen and ", " {\n padding: 0 1rem;\n }\n .leftContent {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n flex: 0 0 auto;\n width: auto;\n position: relative;\n \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 }\n\n div.indicator {\n flex: 0 0 auto;\n background-image: url('", "');\n background-size: 100% 100%;\n display: block;\n position: relative;\n margin: 0 ", " 0 0;\n width: 16px;\n height: 16px;\n\n &:disabled {\n cursor: not-allowed;\n }\n }\n \n .labelContent {\n display: grid;\n align-items: center;\n justify-content: flex-start;\n }\n \n .labelWrapper{\n display: flex;\n align-items: center;\n justify-content: flex-start;\n font: var(--body-semi-bold-14-17);\n @media only screen and ", " {\n display: block;\n }\n }\n .badgesWrapper {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n margin-left: 1rem;\n }\n \n .description {\n color: var(--dark-opacity-50);\n font: var(--body-semi-bold-13-16);\n margin-top: 2px;\n margin-bottom: 0;\n width: 100%;\n display: block;\n }\n }\n .rightContent {\n flex: 0 0 auto;\n width: auto;\n text-align: end;\n row-gap: 0.25rem;\n display: grid;\n .price {\n color: var(--dark);\n font: var(--title-bold-16-19);\n }\n .totalPrice {\n display: block;\n color: var(--dark-opacity-50);\n font: var(--caption-semi-bold-12-15);\n .total {\n @media only screen and ", " {\n display: none;\n }\n }\n }\n }\n }\n }\n"], ["\n display: block;\n > label {\n display: flex;\n width: 100%;\n align-items: center;\n justify-content: center;\n border: ", ";\n border-radius: 0.5rem;\n height: 67px;\n cursor: ", ";\n background-color: ", ";\n ", "\n .inner {\n width: 100%;\n padding: 0 1.5rem;\n display: flex;\n align-items: center;\n justify-content: space-between;\n @media only screen and ", " {\n padding: 0 1rem;\n }\n .leftContent {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n flex: 0 0 auto;\n width: auto;\n position: relative;\n \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 }\n\n div.indicator {\n flex: 0 0 auto;\n background-image: url('", "');\n background-size: 100% 100%;\n display: block;\n position: relative;\n margin: 0 ", " 0 0;\n width: 16px;\n height: 16px;\n\n &:disabled {\n cursor: not-allowed;\n }\n }\n \n .labelContent {\n display: grid;\n align-items: center;\n justify-content: flex-start;\n }\n \n .labelWrapper{\n display: flex;\n align-items: center;\n justify-content: flex-start;\n font: var(--body-semi-bold-14-17);\n @media only screen and ", " {\n display: block;\n }\n }\n .badgesWrapper {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n margin-left: 1rem;\n }\n \n .description {\n color: var(--dark-opacity-50);\n font: var(--body-semi-bold-13-16);\n margin-top: 2px;\n margin-bottom: 0;\n width: 100%;\n display: block;\n }\n }\n .rightContent {\n flex: 0 0 auto;\n width: auto;\n text-align: end;\n row-gap: 0.25rem;\n display: grid;\n .price {\n color: var(--dark);\n font: var(--title-bold-16-19);\n }\n .totalPrice {\n display: block;\n color: var(--dark-opacity-50);\n font: var(--caption-semi-bold-12-15);\n .total {\n @media only screen and ", " {\n display: none;\n }\n }\n }\n }\n }\n }\n"])), function (props) { return props.$disabled ? 'var(--grey-10)' : props.checked ? '2px solid var(--primary)' : '1px solid var(--dark-opacity-10)'; }, function (props) { return props.$disabled ? 'not-allowed' : 'pointer'; }, function (props) { return props.$disabled ? 'var(--dark-opacity-3)' : 'white'; }, function (props) { return !props.checked && !props.$disabled && "\n @media only screen and ".concat(devices_1.devices.lgUp, " {\n &:hover{\n border: 1px solid var(--primary-hover);\n }\n }\n "); }, devices_1.devices.sm, function (props) { return (0, svgToBase64_1.default)((0, jsx_runtime_1.jsx)(Icon_1.default, { hasWrapper: false, color: props.$color || "#9763F6", name: "RadioButtonElementChecked" })); }, function (props) { return props.$disabled ? "\n pointer-events: none;\n user-select:none;\n " : ""; }, function (props) { return props.$disabled ? (0, svgToBase64_1.default)((0, jsx_runtime_1.jsx)(Icon_1.default, { hasWrapper: false, color: "#C2C3CE", name: "RadioButtonElementDisabled" })) : (props.$valid ? (0, svgToBase64_1.default)((0, jsx_runtime_1.jsx)(Icon_1.default, { hasWrapper: false, color: "#9763F6", name: "RadioButtonElementUnchecked" })) : (0, svgToBase64_1.default)((0, jsx_runtime_1.jsx)(Icon_1.default, { hasWrapper: false, color: "#FF1F1F", name: "RadioButtonElementInvalid" }))); }, function (props) { return props.$labelOffset || "0.5rem"; }, devices_1.devices.sm, devices_1.devices.sm);
16
+ exports.HorizontalBoxStyled = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: block;\n > label {\n display: flex;\n width: 100%;\n align-items: center;\n justify-content: center;\n border: ", ";\n border-radius: 0.5rem;\n height: 67px;\n cursor: ", ";\n background-color: ", ";\n ", "\n .inner {\n width: 100%;\n padding: 0 1.5rem;\n display: flex;\n align-items: center;\n justify-content: space-between;\n @media only screen and ", " {\n padding: 0 1rem;\n }\n .leftContent {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n flex: 0 0 auto;\n width: auto;\n position: relative;\n \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 }\n\n div.indicator {\n flex: 0 0 auto;\n background-image: url('", "');\n background-size: 100% 100%;\n display: block;\n position: relative;\n margin: 0 ", " 0 0;\n width: 16px;\n height: 16px;\n\n &:disabled {\n cursor: not-allowed;\n }\n }\n \n .labelContent {\n display: grid;\n align-items: center;\n justify-content: flex-start;\n }\n \n .labelWrapper{\n display: flex;\n align-items: center;\n justify-content: flex-start;\n font: var(--body-semi-bold-14-17);\n @media only screen and ", " {\n display: block;\n }\n }\n .badgesWrapper {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n margin-left: 1rem;\n }\n \n .description {\n color: var(--dark-opacity-50);\n font: var(--body-semi-bold-13-16);\n margin-top: 2px;\n margin-bottom: 0;\n width: 100%;\n display: block;\n }\n }\n .rightContent {\n flex: 0 0 auto;\n width: auto;\n text-align: end;\n row-gap: 0.25rem;\n display: grid;\n .price {\n color: var(--dark);\n font: var(--title-bold-16-19);\n }\n .totalPrice {\n display: block;\n color: var(--dark-opacity-50);\n font: var(--caption-semi-bold-12-15);\n .total {\n @media only screen and ", " {\n display: none;\n }\n }\n }\n }\n }\n }\n"], ["\n display: block;\n > label {\n display: flex;\n width: 100%;\n align-items: center;\n justify-content: center;\n border: ", ";\n border-radius: 0.5rem;\n height: 67px;\n cursor: ", ";\n background-color: ", ";\n ", "\n .inner {\n width: 100%;\n padding: 0 1.5rem;\n display: flex;\n align-items: center;\n justify-content: space-between;\n @media only screen and ", " {\n padding: 0 1rem;\n }\n .leftContent {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n flex: 0 0 auto;\n width: auto;\n position: relative;\n \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 }\n\n div.indicator {\n flex: 0 0 auto;\n background-image: url('", "');\n background-size: 100% 100%;\n display: block;\n position: relative;\n margin: 0 ", " 0 0;\n width: 16px;\n height: 16px;\n\n &:disabled {\n cursor: not-allowed;\n }\n }\n \n .labelContent {\n display: grid;\n align-items: center;\n justify-content: flex-start;\n }\n \n .labelWrapper{\n display: flex;\n align-items: center;\n justify-content: flex-start;\n font: var(--body-semi-bold-14-17);\n @media only screen and ", " {\n display: block;\n }\n }\n .badgesWrapper {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n margin-left: 1rem;\n }\n \n .description {\n color: var(--dark-opacity-50);\n font: var(--body-semi-bold-13-16);\n margin-top: 2px;\n margin-bottom: 0;\n width: 100%;\n display: block;\n }\n }\n .rightContent {\n flex: 0 0 auto;\n width: auto;\n text-align: end;\n row-gap: 0.25rem;\n display: grid;\n .price {\n color: var(--dark);\n font: var(--title-bold-16-19);\n }\n .totalPrice {\n display: block;\n color: var(--dark-opacity-50);\n font: var(--caption-semi-bold-12-15);\n .total {\n @media only screen and ", " {\n display: none;\n }\n }\n }\n }\n }\n }\n"])), function (props) { return props.$disabled ? 'var(--grey-10)' : props.checked ? '2px solid var(--primary)' : '1px solid var(--dark-opacity-10)'; }, function (props) { return props.$disabled ? 'not-allowed' : 'pointer'; }, function (props) { return props.$disabled ? 'var(--dark-opacity-3)' : 'white'; }, function (props) { return !props.checked && !props.$disabled && "\n @media only screen and ".concat(devices_1.devices.lgUp, " {\n &:hover{\n border: 1px solid var(--primary);\n }\n }\n "); }, devices_1.devices.sm, function (props) { return (0, svgToBase64_1.default)((0, jsx_runtime_1.jsx)(Icon_1.default, { hasWrapper: false, color: props.$color || "#9763F6", name: "RadioButtonElementChecked" })); }, function (props) { return props.$disabled ? "\n pointer-events: none;\n user-select:none;\n " : ""; }, function (props) { return props.$disabled ? (0, svgToBase64_1.default)((0, jsx_runtime_1.jsx)(Icon_1.default, { hasWrapper: false, color: "#C2C3CE", name: "RadioButtonElementDisabled" })) : (props.$valid ? (0, svgToBase64_1.default)((0, jsx_runtime_1.jsx)(Icon_1.default, { hasWrapper: false, color: "#9763F6", name: "RadioButtonElementUnchecked" })) : (0, svgToBase64_1.default)((0, jsx_runtime_1.jsx)(Icon_1.default, { hasWrapper: false, color: "#FF1F1F", name: "RadioButtonElementInvalid" }))); }, function (props) { return props.$labelOffset || "0.5rem"; }, devices_1.devices.sm, devices_1.devices.sm);
17
17
  var templateObject_1;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "krl-alfred",
3
- "version": "2.18.8",
3
+ "version": "2.18.10",
4
4
  "files": [
5
5
  "dist"
6
6
  ],