@trafilea/afrodita-components 6.54.10 → 6.54.12

package/build/index.esm.js

@@ -5773,7 +5773,9 @@ var Checkbox = function (_a) {
         }
         onChange(e.target.checked);
     };
-    return (jsxs$1(Container$1o, { children: [jsx$1(Input$5, { type: "checkbox", checked: checked, disabled: disabled, onChange: handleChange, id: id }, void 0), jsx$1(CustomCheckbox, __assign$1({ theme: theme, size: size, disabled: disabled, isChecked: checked, "data-testid": "checkbox", variant: variant, backgroundColor: backgroundColor, text: text }, { children: checked && jsx$1(Icon.Actions.Check, { fill: "#fff" }, void 0) }), void 0), jsx$1(Label$6, __assign$1({ "data-testid": "checkbox-text", size: sizeLabel, style: { color: colorLabel ? colorLabel : theme.colors.shades['700'].color }, variant: checked ? 'demi' : 'regular', htmlFor: id, disabled: disabled }, { children: text }), void 0)] }, void 0));
+    return (jsxs$1(Container$1o, { children: [jsx$1(Input$5, { type: "checkbox", checked: checked, disabled: disabled, onChange: handleChange, id: id }, void 0), jsx$1(CustomCheckbox, __assign$1({ theme: theme, size: size, disabled: disabled, isChecked: checked, "data-testid": "checkbox", variant: variant, backgroundColor: backgroundColor, text: text }, { children: checked && (jsx$1(Icon.Actions.Check, { fill: text === 'White'
+                        ? theme.colors.shades['black'].color
+                        : theme.colors.shades['white'].color }, void 0)) }), void 0), jsx$1(Label$6, __assign$1({ "data-testid": "checkbox-text", size: sizeLabel, style: { color: colorLabel ? colorLabel : theme.colors.shades['700'].color }, variant: checked ? 'demi' : 'regular', htmlFor: id, disabled: disabled }, { children: text }), void 0)] }, void 0));
 };
 var templateObject_1$2b, templateObject_2$1D;
 
@@ -8192,30 +8194,6 @@ function FilteringDropdown(_a) {
                 }) }, void 0)] }), void 0));
 }
 
-var Title$4 = newStyled.div(templateObject_1$1o || (templateObject_1$1o = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  border-bottom: 0.063rem solid ", ";\n  user-select: none;\n  cursor: pointer;\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  border-bottom: 0.063rem solid ", ";\n  user-select: none;\n  cursor: pointer;\n"])), function (props) { return props.borderColor; });
-var P$3 = newStyled.p(templateObject_2$14 || (templateObject_2$14 = __makeTemplateObject(["\n  font-size: 1rem;\n  font-weight: 700;\n  line-height: 1.5rem;\n  color: ", ";\n  margin: 0.75rem 0;\n"], ["\n  font-size: 1rem;\n  font-weight: 700;\n  line-height: 1.5rem;\n  color: ", ";\n  margin: 0.75rem 0;\n"])), function (props) { return props.color; });
-var ArrowContainer = newStyled.div(templateObject_3$W || (templateObject_3$W = __makeTemplateObject(["\n  width: 1rem;\n  height: 1rem;\n"], ["\n  width: 1rem;\n  height: 1rem;\n"])));
-var Container$11 = newStyled.div(templateObject_4$J || (templateObject_4$J = __makeTemplateObject(["\n  @media (max-width: 768px) {\n    display: ", ";\n  }\n"], ["\n  @media (max-width: 768px) {\n    display: ", ";\n  }\n"])), function (props) { return (props.showInMobile ? 'block' : 'none'); });
-var Accordion = function (_a) {
-    var title = _a.title, children = _a.children, _b = _a.isOpenByDefault, isOpenByDefault = _b === void 0 ? false : _b, _c = _a.showInMobile, showInMobile = _c === void 0 ? true : _c;
-    var theme = useTheme();
-    var _d = React__default.useState(isOpenByDefault), isOpen = _d[0], setIsOpen = _d[1];
-    return (jsxs$1(Container$11, __assign$1({ "data-testid": "FiltersAccordion", showInMobile: showInMobile }, { children: [jsxs$1(Title$4, __assign$1({ onClick: function () { return setIsOpen(function (state) { return !state; }); }, borderColor: theme.colors.shades['100'].color, "data-testid": "accordion-title" }, { children: [jsx$1(P$3, __assign$1({ color: theme.colors.shades['550'].color }, { children: title }), void 0), jsx$1(ArrowContainer, { children: isOpen ? (jsx$1(Icon.Arrows.ChevronUp, { fill: theme.colors.shades['700'].color }, void 0)) : (jsx$1(Icon.Arrows.ChevronDown, { fill: theme.colors.shades['700'].color }, void 0)) }, void 0)] }), void 0), jsx$1("div", __assign$1({ style: { display: isOpen ? 'block' : 'none' }, "data-testid": "accordion-children-container" }, { children: children }), void 0)] }), void 0));
-};
-var templateObject_1$1o, templateObject_2$14, templateObject_3$W, templateObject_4$J;
-
-var SectionContent = newStyled.div(templateObject_1$1n || (templateObject_1$1n = __makeTemplateObject(["\n  display: grid;\n  grid-template-columns: repeat(", ", 1fr);\n  grid-gap: 10px;\n  margin: 1.25rem 0;\n"], ["\n  display: grid;\n  grid-template-columns: repeat(", ", 1fr);\n  grid-gap: 10px;\n  margin: 1.25rem 0;\n"])), function (props) { return props.cols; });
-var Header$3 = newStyled.div(templateObject_2$13 || (templateObject_2$13 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 1.063rem;\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 1.063rem;\n"])));
-var MobileHeader = newStyled.div(templateObject_3$V || (templateObject_3$V = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 2.25rem;\n  margin-top: 1.063rem;\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 2.25rem;\n  margin-top: 1.063rem;\n"])));
-var MobileIconsContainer = newStyled.div(templateObject_4$I || (templateObject_4$I = __makeTemplateObject(["\n  width: 1.5rem;\n  height: 1.5rem;\n  cursor: pointer;\n"], ["\n  width: 1.5rem;\n  height: 1.5rem;\n  cursor: pointer;\n"])));
-var H4 = newStyled.h4(templateObject_5$A || (templateObject_5$A = __makeTemplateObject(["\n  font-size: 0.875rem;\n  font-weight: 400;\n  line-height: 1.375rem;\n  margin: 0;\n  color: ", ";\n"], ["\n  font-size: 0.875rem;\n  font-weight: 400;\n  line-height: 1.375rem;\n  margin: 0;\n  color: ", ";\n"])), function (props) { return props.color; });
-var FilterLink = newStyled.a(templateObject_6$v || (templateObject_6$v = __makeTemplateObject(["\n  font-size: 1rem;\n  font-weight: 700;\n  line-height: 1.5rem;\n  color: ", ";\n  text-decoration: none;\n"], ["\n  font-size: 1rem;\n  font-weight: 700;\n  line-height: 1.5rem;\n  color: ", ";\n  text-decoration: none;\n"])), function (props) { return props.color; });
-var OptionContainer = newStyled.div(templateObject_7$s || (templateObject_7$s = __makeTemplateObject(["\n  margin-bottom: 1.25rem;\n  &:last-child {\n    margin-bottom: 0;\n  }\n  @media (max-width: 768px) {\n    display: ", ";\n  }\n  @media (min-width: 768px) and (max-width: 992px) {\n    display: ", ";\n  }\n"], ["\n  margin-bottom: 1.25rem;\n  &:last-child {\n    margin-bottom: 0;\n  }\n  @media (max-width: 768px) {\n    display: ", ";\n  }\n  @media (min-width: 768px) and (max-width: 992px) {\n    display: ", ";\n  }\n"])), function (props) { return (props.showInMobile ? 'block' : 'none'); }, function (props) { return (props.showInTablet ? 'block' : 'none'); });
-var ClearAll = newStyled.span(templateObject_8$l || (templateObject_8$l = __makeTemplateObject(["\n  font-size: 0.875rem;\n  font-weight: 600;\n  line-height: 1.375rem;\n  margin: 0;\n  color: ", ";\n  text-decoration: underline;\n  cursor: pointer;\n"], ["\n  font-size: 0.875rem;\n  font-weight: 600;\n  line-height: 1.375rem;\n  margin: 0;\n  color: ", ";\n  text-decoration: underline;\n  cursor: pointer;\n"])), function (props) { return props.color; });
-var MobileFooter = newStyled.div(templateObject_9$d || (templateObject_9$d = __makeTemplateObject(["\n  background-color: #fff;\n  padding: 0.75rem 0.938rem;\n  position: sticky;\n  bottom: 0;\n  z-index: 1;\n  margin-top: 5.625rem;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n"], ["\n  background-color: #fff;\n  padding: 0.75rem 0.938rem;\n  position: sticky;\n  bottom: 0;\n  z-index: 1;\n  margin-top: 5.625rem;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n"])));
-var MobileClearContainer = newStyled.div(templateObject_10$b || (templateObject_10$b = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n\n  span {\n    margin-left: 0.5rem;\n    user-select: none;\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n\n  span {\n    margin-left: 0.5rem;\n    user-select: none;\n  }\n"])));
-var templateObject_1$1n, templateObject_2$13, templateObject_3$V, templateObject_4$I, templateObject_5$A, templateObject_6$v, templateObject_7$s, templateObject_8$l, templateObject_9$d, templateObject_10$b;
-
 var getStylesBySize$9 = function (size, theme) {
     switch (size) {
         case ComponentSize.Medium:
@@ -8279,6 +8257,30 @@ var SelectorSecondary = function (_a) {
             } }), id: id }, void 0));
 };
 
+var Title$4 = newStyled.div(templateObject_1$1o || (templateObject_1$1o = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  border-bottom: 0.063rem solid ", ";\n  user-select: none;\n  cursor: pointer;\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  border-bottom: 0.063rem solid ", ";\n  user-select: none;\n  cursor: pointer;\n"])), function (props) { return props.borderColor; });
+var P$3 = newStyled.p(templateObject_2$14 || (templateObject_2$14 = __makeTemplateObject(["\n  font-size: 1rem;\n  font-weight: 700;\n  line-height: 1.5rem;\n  color: ", ";\n  margin: 0.75rem 0;\n"], ["\n  font-size: 1rem;\n  font-weight: 700;\n  line-height: 1.5rem;\n  color: ", ";\n  margin: 0.75rem 0;\n"])), function (props) { return props.color; });
+var ArrowContainer = newStyled.div(templateObject_3$W || (templateObject_3$W = __makeTemplateObject(["\n  width: 1rem;\n  height: 1rem;\n"], ["\n  width: 1rem;\n  height: 1rem;\n"])));
+var Container$11 = newStyled.div(templateObject_4$J || (templateObject_4$J = __makeTemplateObject(["\n  @media (max-width: 768px) {\n    display: ", ";\n  }\n"], ["\n  @media (max-width: 768px) {\n    display: ", ";\n  }\n"])), function (props) { return (props.showInMobile ? 'block' : 'none'); });
+var Accordion = function (_a) {
+    var title = _a.title, children = _a.children, _b = _a.isOpenByDefault, isOpenByDefault = _b === void 0 ? false : _b, _c = _a.showInMobile, showInMobile = _c === void 0 ? true : _c;
+    var theme = useTheme();
+    var _d = React__default.useState(isOpenByDefault), isOpen = _d[0], setIsOpen = _d[1];
+    return (jsxs$1(Container$11, __assign$1({ "data-testid": "FiltersAccordion", showInMobile: showInMobile }, { children: [jsxs$1(Title$4, __assign$1({ onClick: function () { return setIsOpen(function (state) { return !state; }); }, borderColor: theme.colors.shades['100'].color, "data-testid": "accordion-title" }, { children: [jsx$1(P$3, __assign$1({ color: theme.colors.shades['550'].color }, { children: title }), void 0), jsx$1(ArrowContainer, { children: isOpen ? (jsx$1(Icon.Arrows.ChevronUp, { fill: theme.colors.shades['700'].color }, void 0)) : (jsx$1(Icon.Arrows.ChevronDown, { fill: theme.colors.shades['700'].color }, void 0)) }, void 0)] }), void 0), jsx$1("div", __assign$1({ style: { display: isOpen ? 'block' : 'none' }, "data-testid": "accordion-children-container" }, { children: children }), void 0)] }), void 0));
+};
+var templateObject_1$1o, templateObject_2$14, templateObject_3$W, templateObject_4$J;
+
+var SectionContent = newStyled.div(templateObject_1$1n || (templateObject_1$1n = __makeTemplateObject(["\n  display: grid;\n  grid-template-columns: repeat(", ", 1fr);\n  grid-gap: 10px;\n  margin: 1.25rem 0;\n"], ["\n  display: grid;\n  grid-template-columns: repeat(", ", 1fr);\n  grid-gap: 10px;\n  margin: 1.25rem 0;\n"])), function (props) { return props.cols; });
+var Header$3 = newStyled.div(templateObject_2$13 || (templateObject_2$13 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 1.063rem;\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 1.063rem;\n"])));
+var MobileHeader = newStyled.div(templateObject_3$V || (templateObject_3$V = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 2.25rem;\n  margin-top: 1.063rem;\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 2.25rem;\n  margin-top: 1.063rem;\n"])));
+var MobileIconsContainer = newStyled.div(templateObject_4$I || (templateObject_4$I = __makeTemplateObject(["\n  width: 1.5rem;\n  height: 1.5rem;\n  cursor: pointer;\n"], ["\n  width: 1.5rem;\n  height: 1.5rem;\n  cursor: pointer;\n"])));
+var H4 = newStyled.h4(templateObject_5$A || (templateObject_5$A = __makeTemplateObject(["\n  font-size: 0.875rem;\n  font-weight: 400;\n  line-height: 1.375rem;\n  margin: 0;\n  color: ", ";\n"], ["\n  font-size: 0.875rem;\n  font-weight: 400;\n  line-height: 1.375rem;\n  margin: 0;\n  color: ", ";\n"])), function (props) { return props.color; });
+var FilterLink = newStyled.a(templateObject_6$v || (templateObject_6$v = __makeTemplateObject(["\n  font-size: 1rem;\n  font-weight: 700;\n  line-height: 1.5rem;\n  color: ", ";\n  text-decoration: none;\n"], ["\n  font-size: 1rem;\n  font-weight: 700;\n  line-height: 1.5rem;\n  color: ", ";\n  text-decoration: none;\n"])), function (props) { return props.color; });
+var OptionContainer = newStyled.div(templateObject_7$s || (templateObject_7$s = __makeTemplateObject(["\n  margin-bottom: 1.25rem;\n  &:last-child {\n    margin-bottom: 0;\n  }\n  @media (max-width: 768px) {\n    display: ", ";\n  }\n  @media (min-width: 768px) and (max-width: 992px) {\n    display: ", ";\n  }\n"], ["\n  margin-bottom: 1.25rem;\n  &:last-child {\n    margin-bottom: 0;\n  }\n  @media (max-width: 768px) {\n    display: ", ";\n  }\n  @media (min-width: 768px) and (max-width: 992px) {\n    display: ", ";\n  }\n"])), function (props) { return (props.showInMobile ? 'block' : 'none'); }, function (props) { return (props.showInTablet ? 'block' : 'none'); });
+var ClearAll = newStyled.span(templateObject_8$l || (templateObject_8$l = __makeTemplateObject(["\n  font-size: 0.875rem;\n  font-weight: 600;\n  line-height: 1.375rem;\n  margin: 0;\n  color: ", ";\n  text-decoration: underline;\n  cursor: pointer;\n"], ["\n  font-size: 0.875rem;\n  font-weight: 600;\n  line-height: 1.375rem;\n  margin: 0;\n  color: ", ";\n  text-decoration: underline;\n  cursor: pointer;\n"])), function (props) { return props.color; });
+var MobileFooter = newStyled.div(templateObject_9$d || (templateObject_9$d = __makeTemplateObject(["\n  background-color: #fff;\n  padding: 0.75rem 0.938rem;\n  position: sticky;\n  bottom: 0;\n  z-index: 1;\n  margin-top: 5.625rem;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n"], ["\n  background-color: #fff;\n  padding: 0.75rem 0.938rem;\n  position: sticky;\n  bottom: 0;\n  z-index: 1;\n  margin-top: 5.625rem;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n"])));
+var MobileClearContainer = newStyled.div(templateObject_10$b || (templateObject_10$b = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n\n  span {\n    margin-left: 0.5rem;\n    user-select: none;\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n\n  span {\n    margin-left: 0.5rem;\n    user-select: none;\n  }\n"])));
+var templateObject_1$1n, templateObject_2$13, templateObject_3$V, templateObject_4$I, templateObject_5$A, templateObject_6$v, templateObject_7$s, templateObject_8$l, templateObject_9$d, templateObject_10$b;
+
 var UL = newStyled.ul(templateObject_1$1m || (templateObject_1$1m = __makeTemplateObject(["\n  margin: 0;\n  padding: 0;\n  flex-wrap: wrap;\n  display: flex;\n  max-width: 100%;\n"], ["\n  margin: 0;\n  padding: 0;\n  flex-wrap: wrap;\n  display: flex;\n  max-width: 100%;\n"])));
 var LI = newStyled.li(templateObject_2$12 || (templateObject_2$12 = __makeTemplateObject(["\n  list-style: none;\n  background-color: ", ";\n  padding: 0.375rem 0.625rem;\n  border-radius: 0.5rem;\n  font-size: 0.875rem;\n  line-height: 1.125rem;\n  color: ", ";\n  font-weight: 400;\n  margin-right: 0.5rem;\n  margin-bottom: 0.5rem;\n  display: flex;\n  align-items: center;\n"], ["\n  list-style: none;\n  background-color: ", ";\n  padding: 0.375rem 0.625rem;\n  border-radius: 0.5rem;\n  font-size: 0.875rem;\n  line-height: 1.125rem;\n  color: ", ";\n  font-weight: 400;\n  margin-right: 0.5rem;\n  margin-bottom: 0.5rem;\n  display: flex;\n  align-items: center;\n"])), function (props) { return props.backgroundColor; }, function (props) { return props.color; });
 var CloseIconContainer = newStyled.div(templateObject_3$U || (templateObject_3$U = __makeTemplateObject(["\n  width: 0.656rem;\n  height: 0.656rem;\n  display: flex;\n  align-items: center;\n  margin-left: 0.5rem;\n  cursor: pointer;\n"], ["\n  width: 0.656rem;\n  height: 0.656rem;\n  display: flex;\n  align-items: center;\n  margin-left: 0.5rem;\n  cursor: pointer;\n"])));
@@ -8337,7 +8339,9 @@ var Filters = function (_a) {
         }
         setCheckedItems(function (prev) {
             if (!currentFilter.isMultiselect) {
-                resetCheckedItems(__spreadArray([], prev, true));
+                if (prev.length > 0) {
+                    resetCheckedItems([]);
+                }
             }
             return checked
                 ? __spreadArray(__spreadArray([], (currentFilter.isMultiselect ? prev : []), true), [