npm - @citygross/components - Versions diffs - 0.7.83 → 0.7.85 - Mend

@citygross/components 0.7.83 → 0.7.85

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 (158) hide show

package/build/es/components/src/components/AlertBox/AlertBox.styles.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
 import styled from 'styled-components';
-var AlertBox = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background: ", ";\n  border-left: ", ";\n  border-radius: ", ";\n  box-shadow: ", ";\n  padding: ", "px;\n  display: flex;\n  align-items: center;\n  gap: ", "px;\n"], ["\n  background: ", ";\n  border-left: ", ";\n  border-radius: ", ";\n  box-shadow: ", ";\n  padding: ", "px;\n  display: flex;\n  align-items: center;\n  gap: ", "px;\n"])), function (props) { var _a; return props.background || ((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.blueLight); }, function (props) { var _a; return ((_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.infoBlockBorderWidth) + "px solid " + props.borderColor; }, function (props) { var _a, _b; return ((_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius.extraSmall) + "px 0 0 " + ((_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.borderRadius.extraSmall) + "px"; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.layoutShadow; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; });
+var AlertBox = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  background: ", ";\n  border-left: ", ";\n  border-radius: ", ";\n  box-shadow: ", ";\n  padding: ", "px;\n  display: flex;\n  align-items: center;\n  gap: ", "px;\n"], ["\n  background: ", ";\n  border-left: ", ";\n  border-radius: ", ";\n  box-shadow: ", ";\n  padding: ", "px;\n  display: flex;\n  align-items: center;\n  gap: ", "px;\n"])), function (props) { var _a; return props.background || ((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.blueLight); }, function (props) { var _a; return "".concat((_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.infoBlockBorderWidth, "px solid ").concat(props.borderColor); }, function (props) { var _a, _b; return "".concat((_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius.extraSmall, "px 0 0 ").concat((_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.borderRadius.extraSmall, "px"); }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.layoutShadow; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; });
 var IconContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  min-width: ", "px;\n  display: flex;\n  align-items: center;\n"], ["\n  min-width: ", "px;\n  display: flex;\n  align-items: center;\n"])), function (props) { var _a; return props.minWidth || ((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.md); });
 var templateObject_1, templateObject_2;

package/build/es/components/src/components/BackgroundImage/BackgroundImage.styles.js CHANGED Viewed

@@ -1,10 +1,10 @@
 import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
 import styled from 'styled-components';
-var BackgroundContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  height: ", ";\n  width: ", ";\n  border-radius: ", "px;\n  overflow: hidden;\n  box-shadow: ", ";\n  display: flex;\n  align-items: center;\n  ", "\n"], ["\n  position: relative;\n  height: ", ";\n  width: ", ";\n  border-radius: ", "px;\n  overflow: hidden;\n  box-shadow: ", ";\n  display: flex;\n  align-items: center;\n  ", "\n"])), function (props) { return (props.height ? props.height + "px" : 'auto'); }, function (props) { return (props.height ? props.width + "px" : 'auto'); }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius.extraSmall; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.layoutShadow; }, function (props) {
+var BackgroundContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  height: ", ";\n  width: ", ";\n  border-radius: ", "px;\n  overflow: hidden;\n  box-shadow: ", ";\n  display: flex;\n  align-items: center;\n  ", "\n"], ["\n  position: relative;\n  height: ", ";\n  width: ", ";\n  border-radius: ", "px;\n  overflow: hidden;\n  box-shadow: ", ";\n  display: flex;\n  align-items: center;\n  ", "\n"])), function (props) { return (props.height ? "".concat(props.height, "px") : 'auto'); }, function (props) { return (props.height ? "".concat(props.width, "px") : 'auto'); }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius.extraSmall; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.layoutShadow; }, function (props) {
     var _a;
     return props.onClick &&
-        " \n    cursor: pointer;\n    &:hover {\n        box-shadow: " + ((_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.buttonHover) + ";\n        }";
+        " \n    cursor: pointer;\n    &:hover {\n        box-shadow: ".concat((_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.buttonHover, ";\n        }");
 });
 var BackgroundImgContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: 100%;\n  height: 100%;\n  position: absolute;\n"], ["\n  width: 100%;\n  height: 100%;\n  position: absolute;\n"])));
 var BackgroundGradient = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  width: 100%;\n  height: 100%;\n  background-color: ", ";\n  opacity: ", ";\n  z-index: 1;\n  position: absolute;\n  top: 0;\n"], ["\n  width: 100%;\n  height: 100%;\n  background-color: ", ";\n  opacity: ", ";\n  z-index: 1;\n  position: absolute;\n  top: 0;\n"])), function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.black; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.BackgroundOverlayOpacity; });

package/build/es/components/src/components/Badge/Badge.styles.js CHANGED Viewed

@@ -4,9 +4,9 @@ import styled from 'styled-components';
 var BaseBadge = styled.span(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 50%;\n  border: ", ";\n  width: ", ";\n  min-width: ", ";\n  height: ", ";\n  background-color: ", ";\n  color: ", ";\n  font-size: ", "px;\n  padding-top: 2px;\n"], ["\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 50%;\n  border: ", ";\n  width: ", ";\n  min-width: ", ";\n  height: ", ";\n  background-color: ", ";\n  color: ", ";\n  font-size: ", "px;\n  padding-top: 2px;\n"])), function (props) {
     var _a, _b, _c, _d;
     return props.borderColor && props.borderColor !== 'none'
-        ? "1px solid " + props.borderColor
+        ? "1px solid ".concat(props.borderColor)
         : props.background === ((_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.white)
-            ? "1px solid " + ((_d = (_c = props === null || props === void 0 ? void 0 : props.theme) === null || _c === void 0 ? void 0 : _c.palette) === null || _d === void 0 ? void 0 : _d.light)
+            ? "1px solid ".concat((_d = (_c = props === null || props === void 0 ? void 0 : props.theme) === null || _c === void 0 ? void 0 : _c.palette) === null || _d === void 0 ? void 0 : _d.light)
             : 'none';
 }, function (props) { return props.width; }, function (props) { return props.width; }, function (props) { return props.height; }, function (props) { return props.background; }, function (props) { return props.color; }, function (props) { var _a, _b, _c; return (_c = (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.typography) === null || _b === void 0 ? void 0 : _b.size) === null || _c === void 0 ? void 0 : _c.s2; });
 var templateObject_1;

package/build/es/components/src/components/Box/Box.styles.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
 import styled from 'styled-components';
-var BoxContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  padding: ", "px;\n  background: ", ";\n  border-radius: ", ";\n  @media (min-width: ", "px) {\n    padding: ", "px;\n  }\n\n  ", ";\n"], ["\n  padding: ", "px;\n  background: ", ";\n  border-radius: ", ";\n  @media (min-width: ", "px) {\n    padding: ", "px;\n  }\n\n  ", ";\n"])), function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.spacings) === null || _b === void 0 ? void 0 : _b.md; }, function (props) { return props.background; }, function (props) { return (props.rounded ? '5px' : '0'); }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.breakpoints) === null || _b === void 0 ? void 0 : _b.lg; }, function (props) { var _a, _b; return props.padding ? props.padding : (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.spacings) === null || _b === void 0 ? void 0 : _b.lg; }, function (props) { return props.padding && "padding: " + props.padding + "px"; });
+var BoxContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  padding: ", "px;\n  background: ", ";\n  border-radius: ", ";\n  @media (min-width: ", "px) {\n    padding: ", "px;\n  }\n\n  ", ";\n"], ["\n  padding: ", "px;\n  background: ", ";\n  border-radius: ", ";\n  @media (min-width: ", "px) {\n    padding: ", "px;\n  }\n\n  ", ";\n"])), function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.spacings) === null || _b === void 0 ? void 0 : _b.md; }, function (props) { return props.background; }, function (props) { return (props.rounded ? '5px' : '0'); }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.breakpoints) === null || _b === void 0 ? void 0 : _b.lg; }, function (props) { var _a, _b; return props.padding ? props.padding : (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.spacings) === null || _b === void 0 ? void 0 : _b.lg; }, function (props) { return props.padding && "padding: ".concat(props.padding, "px"); });
 var templateObject_1;
 export { BoxContainer };

package/build/es/components/src/components/BoxArrow/BoxArrow.styles.js CHANGED Viewed

@@ -5,8 +5,8 @@ var BoxArrowContainer = styled.div(templateObject_1 || (templateObject_1 = __mak
     return props.placement === 'right' ? 'flex-end' : 'flex-start';
 }, function (props) {
     return props.placement && props.placement === 'right'
-        ? "margin-right: " + props.margin + "px"
-        : "margin-left: " + props.margin + "px";
+        ? "margin-right: ".concat(props.margin, "px")
+        : "margin-left: ".concat(props.margin, "px");
 });
 var templateObject_1;

package/build/es/components/src/components/Button/Button.js CHANGED Viewed

@@ -15,6 +15,7 @@ var ButtonColor;
     ButtonColor[ButtonColor["white"] = 2] = "white";
     ButtonColor[ButtonColor["darkest"] = 3] = "darkest";
     ButtonColor[ButtonColor["lightest"] = 4] = "lightest";
+    ButtonColor[ButtonColor["buttonGray"] = 5] = "buttonGray";
 })(ButtonColor || (ButtonColor = {}));
 function Button(_a) {
     var _b;

package/build/es/components/src/components/Button/Button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.js","sources":[],"sourcesContent":[],"names":[],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~"}
1	+ {"version":3,"file":"Button.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/es/components/src/components/Button/Button.styles.js CHANGED Viewed

@@ -65,36 +65,38 @@ var BaseButton = styled.button(templateObject_1 || (templateObject_1 = __makeTem
 var BasePrimaryButton = styled(BaseButton)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  /* TypoGraphy */\n\n  font-size: ", ";\n  line-height: ", ";\n\n  /* shadow */\n\n  box-shadow: ", ";\n\n  /* Padding */\n\n  padding: ", ";\n\n  @media (min-width: ", "px) {\n    font-size: ", ";\n\n    padding: ", ";\n\n    box-shadow: ", ";\n  }\n"], ["\n  /* TypoGraphy */\n\n  font-size: ", ";\n  line-height: ", ";\n\n  /* shadow */\n\n  box-shadow: ", ";\n\n  /* Padding */\n\n  padding: ", ";\n\n  @media (min-width: ", "px) {\n    font-size: ", ";\n\n    padding: ", ";\n\n    box-shadow: ", ";\n  }\n"])), function (props) { return ButtonFontSize(props.xsSize || props.size); }, function (props) {
     var _a, _b;
     return props.size === 'small'
-        ? ((_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.lineHeight.s2) + "px"
-        : ((_b = props.theme.typography) === null || _b === void 0 ? void 0 : _b.lineHeight.m1) + "px";
+        ? "".concat((_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.lineHeight.s2, "px")
+        : "".concat((_b = props.theme.typography) === null || _b === void 0 ? void 0 : _b.lineHeight.m1, "px");
 }, function (props) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
     return props.selected
-        ? " inset 0px 0px 0px 1px " + ((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.blueMedium) + ",\n          " + ((_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.boxShadow.buttonHover)
+        ? " inset 0px 0px 0px 1px ".concat((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.blueMedium, ",\n          ").concat((_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.boxShadow.buttonHover)
         : props.xsSize ||
             (props.size &&
                 (props.color === ((_d = (_c = props === null || props === void 0 ? void 0 : props.theme) === null || _c === void 0 ? void 0 : _c.palette) === null || _d === void 0 ? void 0 : _d.primary) ||
-                    props.color === ((_f = (_e = props === null || props === void 0 ? void 0 : props.theme) === null || _e === void 0 ? void 0 : _e.palette) === null || _f === void 0 ? void 0 : _f.secondary)))
+                    props.color === ((_f = (_e = props === null || props === void 0 ? void 0 : props.theme) === null || _e === void 0 ? void 0 : _e.palette) === null || _f === void 0 ? void 0 : _f.secondary) ||
+                    props.color === ((_h = (_g = props === null || props === void 0 ? void 0 : props.theme) === null || _g === void 0 ? void 0 : _g.palette) === null || _h === void 0 ? void 0 : _h.buttonGray)))
             ? ButtonShadow(props.xsSize || props.size)
-            : props.color === ((_h = (_g = props === null || props === void 0 ? void 0 : props.theme) === null || _g === void 0 ? void 0 : _g.palette) === null || _h === void 0 ? void 0 : _h.white) ||
-                props.color === ((_k = (_j = props === null || props === void 0 ? void 0 : props.theme) === null || _j === void 0 ? void 0 : _j.palette) === null || _k === void 0 ? void 0 : _k.lightest)
-                ? "inset 0px 0px 0px 1px " + ((_l = props.theme.palette) === null || _l === void 0 ? void 0 : _l.medium)
+            : props.color === ((_k = (_j = props === null || props === void 0 ? void 0 : props.theme) === null || _j === void 0 ? void 0 : _j.palette) === null || _k === void 0 ? void 0 : _k.white) ||
+                props.color === ((_m = (_l = props === null || props === void 0 ? void 0 : props.theme) === null || _l === void 0 ? void 0 : _l.palette) === null || _m === void 0 ? void 0 : _m.lightest)
+                ? "inset 0px 0px 0px 1px ".concat((_o = props.theme.palette) === null || _o === void 0 ? void 0 : _o.medium)
                 : 'none';
 }, function (props) {
     return ButtonPadding(props.xsSize || props.size, props.icon, props.flexReverse);
 }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { return ButtonFontSize(props.size); }, function (props) {
     return ButtonPadding(props.size, props.icon, props.flexReverse);
 }, function (props) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
     return props.selected
-        ? " inset 0px 0px 0px 1px " + ((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.blueMedium) + ",\n            " + ((_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.boxShadow.buttonHover)
+        ? " inset 0px 0px 0px 1px ".concat((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.blueMedium, ",\n            ").concat((_b = props.theme.attributes) === null || _b === void 0 ? void 0 : _b.boxShadow.buttonHover)
         : props.size &&
             (props.color === ((_d = (_c = props === null || props === void 0 ? void 0 : props.theme) === null || _c === void 0 ? void 0 : _c.palette) === null || _d === void 0 ? void 0 : _d.primary) ||
-                props.color === ((_f = (_e = props === null || props === void 0 ? void 0 : props.theme) === null || _e === void 0 ? void 0 : _e.palette) === null || _f === void 0 ? void 0 : _f.secondary))
+                props.color === ((_f = (_e = props === null || props === void 0 ? void 0 : props.theme) === null || _e === void 0 ? void 0 : _e.palette) === null || _f === void 0 ? void 0 : _f.secondary) ||
+                props.color === ((_h = (_g = props === null || props === void 0 ? void 0 : props.theme) === null || _g === void 0 ? void 0 : _g.palette) === null || _h === void 0 ? void 0 : _h.buttonGray))
             ? ButtonShadow(props.size)
-            : props.color === ((_h = (_g = props === null || props === void 0 ? void 0 : props.theme) === null || _g === void 0 ? void 0 : _g.palette) === null || _h === void 0 ? void 0 : _h.white) ||
-                props.color === ((_k = (_j = props === null || props === void 0 ? void 0 : props.theme) === null || _j === void 0 ? void 0 : _j.palette) === null || _k === void 0 ? void 0 : _k.lightest)
-                ? "inset 0px 0px 0px 1px " + ((_l = props.theme.palette) === null || _l === void 0 ? void 0 : _l.medium)
+            : props.color === ((_k = (_j = props === null || props === void 0 ? void 0 : props.theme) === null || _j === void 0 ? void 0 : _j.palette) === null || _k === void 0 ? void 0 : _k.white) ||
+                props.color === ((_m = (_l = props === null || props === void 0 ? void 0 : props.theme) === null || _l === void 0 ? void 0 : _l.palette) === null || _m === void 0 ? void 0 : _m.lightest)
+                ? "inset 0px 0px 0px 1px ".concat((_o = props.theme.palette) === null || _o === void 0 ? void 0 : _o.medium)
                 : 'none';
 });
 var ButtonChildContainer = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: ", ";\n  width: 100%;\n  gap: ", "px;\n  align-items: center;\n  justify-content: center;\n  flex-wrap: ", ";\n"], ["\n  display: flex;\n  flex-direction: ", ";\n  width: 100%;\n  gap: ", "px;\n  align-items: center;\n  justify-content: center;\n  flex-wrap: ", ";\n"])), function (props) { return (props.flexReverse ? 'row-reverse' : 'row'); }, function (props) {
@@ -111,18 +113,18 @@ var LoadingSpinner = styled(Spinner)(templateObject_6 || (templateObject_6 = __m
 var BaseIconButton = styled(BaseButton)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n  padding: ", "px;\n  border-radius: 50%;\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  margin: 0;\n  height: ", "px;\n  width: ", "px;\n  min-width: ", "px;\n  ", ";\n\n  &::after {\n    border-radius: 50%;\n    box-shadow: ", ";\n  }\n  &::before {\n    border-radius: 50%;\n  }\n"], ["\n  padding: ", "px;\n  border-radius: 50%;\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  margin: 0;\n  height: ", "px;\n  width: ", "px;\n  min-width: ", "px;\n  ", ";\n\n  &::after {\n    border-radius: 50%;\n    box-shadow: ", ";\n  }\n  &::before {\n    border-radius: 50%;\n  }\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) { return props.height || 32; }, function (props) { return props.width || 32; }, function (props) { return props.width || 32; }, function (props) {
     var _a;
     return props.shadow && props.border
-        ? "box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.15), inset 0px 0px 0px 1px " + ((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.medium)
+        ? "box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.15), inset 0px 0px 0px 1px ".concat((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.medium)
         : props.shadow
             ? 'box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.15)'
             : props.border
-                ? "box-shadow: inset 0px 0px 0px 1px " + props.border
+                ? "box-shadow: inset 0px 0px 0px 1px ".concat(props.border)
                 : '';
 }, function (props) { var _a, _b; return (_b = (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow) === null || _b === void 0 ? void 0 : _b.iconButtonHover; });
 var BasePaginationButton = styled(BaseButton)(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n  height: ", "px;\n  width: ", "px;\n  min-width: ", "px;\n  text-align: center;\n  ", ";\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n"], ["\n  height: ", "px;\n  width: ", "px;\n  min-width: ", "px;\n  text-align: center;\n  ", ";\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n"])), function (props) { return props.height || 36; }, function (props) { return props.width || 36; }, function (props) { return props.width || 36; }, function (props) {
     var _a, _b, _c;
     return props.color !== ((_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.white)
         ? 'box-shadow: inset 0px -1px 0px rgba(0, 0, 0, 0.15)'
-        : "box-shadow: inset 0px 0px 0px 1px " + ((_c = props.theme.palette) === null || _c === void 0 ? void 0 : _c.medium);
+        : "box-shadow: inset 0px 0px 0px 1px ".concat((_c = props.theme.palette) === null || _c === void 0 ? void 0 : _c.medium);
 });
 var ButtonBadge = styled.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n  position: absolute;\n  top: ", "px;\n  right: ", "px;\n  padding: 0 7px;\n  background: black;\n  color: white;\n  width: fit-content;\n  border-radius: 100px;\n  font-size: ", "px;\n  line-height: ", "px;\n"], ["\n  position: absolute;\n  top: ", "px;\n  right: ", "px;\n  padding: 0 7px;\n  background: black;\n  color: white;\n  width: fit-content;\n  border-radius: 100px;\n  font-size: ", "px;\n  line-height: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.buttonBadgeTopPosition; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.buttonBadgeRightPosition; }, function (props) { var _a, _b; return (_b = (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size) === null || _b === void 0 ? void 0 : _b.xs; }, function (props) { var _a, _b; return (_b = (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.lineHeight) === null || _b === void 0 ? void 0 : _b.xs; });
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9;

package/build/es/components/src/components/Button/Button.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~"}
1	+ {"version":3,"file":"Button.styles.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/build/es/components/src/components/CartItemSummary/CartItemSummary.js CHANGED Viewed

@@ -11,10 +11,10 @@ function CartItemSummary(_a) {
             (product.amount === 0 || product.amount) &&
             (product === null || product === void 0 ? void 0 : product.cancelledQuantity) !== 0 &&
             (product === null || product === void 0 ? void 0 : product.cancelledQuantity) && (React.createElement(CancelledWrapper, null,
-            React.createElement(BodyText, { size: TextTypes.TextSize.SMALL, lineThrough: true }, (product === null || product === void 0 ? void 0 : product.cancelledQuantity) ? (product.cancelledQuantity + " st") : (React.createElement(Skeleton, { width: 100 }))),
+            React.createElement(BodyText, { size: TextTypes.TextSize.SMALL, lineThrough: true }, (product === null || product === void 0 ? void 0 : product.cancelledQuantity) ? ("".concat(product.cancelledQuantity, " st")) : (React.createElement(Skeleton, { width: 100 }))),
             React.createElement(AmountText, { lineThrough: true, fontWeight: withParenthesis ? 'regular' : 'semiBold' }, product ? (formatPrice(product.cancelledAmount, withParenthesis)) : (React.createElement(Skeleton, { width: 100 }))))),
         React.createElement(ItemInformationContainer, null,
-            React.createElement(BodyText, { size: TextTypes.TextSize.SMALL }, (product === null || product === void 0 ? void 0 : product.quantity) || (product === null || product === void 0 ? void 0 : product.quantity) === 0 ? (product.quantity + " " + unit) : (React.createElement(Skeleton, { width: 100 }))),
+            React.createElement(BodyText, { size: TextTypes.TextSize.SMALL }, (product === null || product === void 0 ? void 0 : product.quantity) || (product === null || product === void 0 ? void 0 : product.quantity) === 0 ? ("".concat(product.quantity, " ").concat(unit)) : (React.createElement(Skeleton, { width: 100 }))),
             React.createElement(AmountText, { fontWeight: withParenthesis ? 'regular' : 'semiBold' }, product ? (formatPrice(product.amount, withParenthesis)) : (React.createElement(Skeleton, { width: 100 }))))));
 }

package/build/es/components/src/components/CartSummary/CartSummary.styles.js CHANGED Viewed

@@ -3,7 +3,7 @@ import styled from 'styled-components';
 var CartSummaryContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject([""], [""])));
 var CartPaymentContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background: ", ";\n"], ["\n  background: ", ";\n"])), function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.yellowLighter; });
-var CartSummaryHeader = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  padding: ", "px;\n  ", ";\n  display: flex;\n  flex-direction: column;\n  gap: ", "px;\n"], ["\n  padding: ", "px;\n  ", ";\n  display: flex;\n  flex-direction: column;\n  gap: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.md; }, function (props) { var _a; return props.title && "padding-top: " + ((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm) + "px"; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; });
+var CartSummaryHeader = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  padding: ", "px;\n  ", ";\n  display: flex;\n  flex-direction: column;\n  gap: ", "px;\n"], ["\n  padding: ", "px;\n  ", ";\n  display: flex;\n  flex-direction: column;\n  gap: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.md; }, function (props) { var _a; return props.title && "padding-top: ".concat((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm, "px"); }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; });
 var CartSummaryFooter = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  padding: ", "px;\n  background: ", ";\n  display: flex;\n  flex-direction: column;\n  gap: ", "px;\n"], ["\n  padding: ", "px;\n  background: ", ";\n  display: flex;\n  flex-direction: column;\n  gap: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.md; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.yellowLight; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; });
 var CartLine = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n  text-decoration: ", ";\n"], ["\n  display: flex;\n  justify-content: space-between;\n  text-decoration: ", ";\n"])), function (props) { return props.cancelled && 'line-through'; });
 var AmountWrapper = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: flex;\n  gap: ", "px;\n"], ["\n  display: flex;\n  gap: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; });

package/build/es/components/src/components/Chips/Chip.styles.js CHANGED Viewed

@@ -9,7 +9,7 @@ var BaseChip = styled.div(templateObject_1 || (templateObject_1 = __makeTemplate
 }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) {
     var _a;
     return props.checked &&
-        "box-shadow: 0 0 0 1px inset " + ((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.alertGreen);
+        "box-shadow: 0 0 0 1px inset ".concat((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.alertGreen);
 });
 var ChipCheckbox = styled.span(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  height: ", "px;\n  width: ", "px;\n  background: white;\n  border: 1px solid ", ";\n  border-radius: ", "px;\n"], ["\n  display: flex;\n  height: ", "px;\n  width: ", "px;\n  background: white;\n  border: 1px solid ", ";\n  border-radius: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.chipCheckBox; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.chipCheckBox; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.medium; }, function (props) { var _a, _b; return (_b = (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius) === null || _b === void 0 ? void 0 : _b.extraSmall; });
 var ChipLabel = styled(BodyText)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  pointer-events: none;\n"], ["\n  pointer-events: none;\n"])));

package/build/es/components/src/components/Collapsable/Collapsable.styles.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
 import styled from 'styled-components';
-var Collapsable = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), function (props) { return props.backgroundColor && "background: " + props.backgroundColor; });
+var Collapsable = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), function (props) { return props.backgroundColor && "background: ".concat(props.backgroundColor); });
 var PreviewContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  cursor: pointer;\n  border-bottom: 1px solid ", ";\n"], ["\n  cursor: pointer;\n  border-bottom: 1px solid ", ";\n"])), function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.light; });
 var PreviewInner = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n"], ["\n  display: flex;\n  justify-content: space-between;\n"])));
 var CollapsedContainer = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: ", ";\n"], ["\n  display: ", ";\n"])), function (props) { return (props.open ? 'block' : 'none'); });

package/build/es/components/src/components/DateBox/DateBox.styles.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
 import styled from 'styled-components';
 var StyledDateBox = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: inline-block;\n  background-color: ", ";\n"], ["\n  display: inline-block;\n  background-color: ", ";\n"])), function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.white; });
-var WeekBox = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  color: ", ";\n  padding: ", ";\n  text-align: center;\n"], ["\n  background-color: ", ";\n  color: ", ";\n  padding: ", ";\n  text-align: center;\n"])), function (props) { var _a; return props.labelBackground || ((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.brandBlue); }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.white; }, function (props) { var _a, _b; return ((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs) + "px " + ((_b = props.theme.constants) === null || _b === void 0 ? void 0 : _b.dateBoxHorizontalPadding) + "px"; });
+var WeekBox = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  background-color: ", ";\n  color: ", ";\n  padding: ", ";\n  text-align: center;\n"], ["\n  background-color: ", ";\n  color: ", ";\n  padding: ", ";\n  text-align: center;\n"])), function (props) { var _a; return props.labelBackground || ((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.brandBlue); }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.white; }, function (props) { var _a, _b; return "".concat((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs, "px ").concat((_b = props.theme.constants) === null || _b === void 0 ? void 0 : _b.dateBoxHorizontalPadding, "px"); });
 var WeekNumber = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  padding: ", "px 0;\n  text-align: center;\n"], ["\n  padding: ", "px 0;\n  text-align: center;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; });
 var DateHeader = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  text-align: center;\n"], ["\n  text-align: center;\n"])));
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4;

package/build/es/components/src/components/DeliveryTimeBlock/DeliveryTimeBlock.js CHANGED Viewed

@@ -22,7 +22,7 @@ function DeliveryTimeBlock(_a) {
             " ",
             month,
             ' ',
-            deliveryFromTime && deliveryToTime && (React.createElement("span", { style: { whiteSpace: 'nowrap' } }, localTimeVar + " " + deliveryFromTime + " - " + deliveryToTime))),
+            deliveryFromTime && deliveryToTime && (React.createElement("span", { style: { whiteSpace: 'nowrap' } }, "".concat(localTimeVar, " ").concat(deliveryFromTime, " - ").concat(deliveryToTime)))),
         children));
 }

package/build/es/components/src/components/DotIndicator/DotIndicator.styles.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
 import styled from 'styled-components';
-var Dot = styled.span(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  height: ", "px;\n  width: ", "px;\n  min-width: ", "px;\n  display: inline-block;\n  border-radius: 50%;\n  background: ", ";\n  ", ";\n"], ["\n  height: ", "px;\n  width: ", "px;\n  min-width: ", "px;\n  display: inline-block;\n  border-radius: 50%;\n  background: ", ";\n  ", ";\n"])), function (props) { var _a, _b; return (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.spacings) === null || _b === void 0 ? void 0 : _b.xs; }, function (props) { var _a, _b; return (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.spacings) === null || _b === void 0 ? void 0 : _b.xs; }, function (props) { var _a, _b; return (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.spacings) === null || _b === void 0 ? void 0 : _b.xs; }, function (props) { return props.color; }, function (props) { return props.shadow && "box-shadow: 0 0 0 2px " + props.shadow + " "; });
+var Dot = styled.span(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  height: ", "px;\n  width: ", "px;\n  min-width: ", "px;\n  display: inline-block;\n  border-radius: 50%;\n  background: ", ";\n  ", ";\n"], ["\n  height: ", "px;\n  width: ", "px;\n  min-width: ", "px;\n  display: inline-block;\n  border-radius: 50%;\n  background: ", ";\n  ", ";\n"])), function (props) { var _a, _b; return (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.spacings) === null || _b === void 0 ? void 0 : _b.xs; }, function (props) { var _a, _b; return (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.spacings) === null || _b === void 0 ? void 0 : _b.xs; }, function (props) { var _a, _b; return (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.spacings) === null || _b === void 0 ? void 0 : _b.xs; }, function (props) { return props.color; }, function (props) { return props.shadow && "box-shadow: 0 0 0 2px ".concat(props.shadow, " "); });
 var templateObject_1;
 export { Dot };

package/build/es/components/src/components/FormControl/FormControl.styles.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
 import styled from 'styled-components';
 var FormControlWrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  flex: 1;\n  max-width: 100%;\n"], ["\n  flex: 1;\n  max-width: 100%;\n"])));
-var FormControlElementWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: relative;\n  padding-bottom: 8px;\n  display: flex;\n\n  @media (min-width: ", "px) {\n    ", ";\n  }\n"], ["\n  position: relative;\n  padding-bottom: 8px;\n  display: flex;\n\n  @media (min-width: ", "px) {\n    ", ";\n  }\n"])), function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { return props.screenWidth && "max-width: " + props.screenWidth; });
+var FormControlElementWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: relative;\n  padding-bottom: 8px;\n  display: flex;\n\n  @media (min-width: ", "px) {\n    ", ";\n  }\n"], ["\n  position: relative;\n  padding-bottom: 8px;\n  display: flex;\n\n  @media (min-width: ", "px) {\n    ", ";\n  }\n"])), function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { return props.screenWidth && "max-width: ".concat(props.screenWidth); });
 var templateObject_1, templateObject_2;
 export { FormControlElementWrapper, FormControlWrapper };

package/build/es/components/src/components/FormElements/Input/Input.styles.js CHANGED Viewed

@@ -11,8 +11,8 @@ var Input = styled.input(templateObject_1 || (templateObject_1 = __makeTemplateO
 }, function (props) {
     var _a, _b, _c, _d;
     return props.inputSize === 'small'
-        ? ((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs) + "px " + ((_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.xs) + "px"
-        : ((_c = props.theme.spacings) === null || _c === void 0 ? void 0 : _c.xs) + "px " + ((_d = props.theme.spacings) === null || _d === void 0 ? void 0 : _d.sm) + "px";
+        ? "".concat((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs, "px ").concat((_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.xs, "px")
+        : "".concat((_c = props.theme.spacings) === null || _c === void 0 ? void 0 : _c.xs, "px ").concat((_d = props.theme.spacings) === null || _d === void 0 ? void 0 : _d.sm, "px");
 }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.white; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.darkest; }, function (props) { var _a; return (_a = props.flexGrow) !== null && _a !== void 0 ? _a : 1; }, function (props) { var _a, _b, _c; return props.fontSize ? props.fontSize : (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.typography) === null || _b === void 0 ? void 0 : _b.size) === null || _c === void 0 ? void 0 : _c.s3; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.transition.inputTransition; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.brandBlue; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.buttonHover; }, function (props) {
     var _a, _b, _c, _d;
     return props.disabled

package/build/es/components/src/components/FormElements/Radio/Radio.styles.js CHANGED Viewed

@@ -4,7 +4,7 @@ import styled from 'styled-components';
 var RadioWrapper = styled(motion.div)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  width: 24px;\n  height: 24px;\n  min-width: 24px;\n"], ["\n  position: relative;\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  width: 24px;\n  height: 24px;\n  min-width: 24px;\n"])));
 var CustomRadio = styled.span(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  width: 100%;\n  height: 100%;\n  position: absolute;\n  border-radius: 50%;\n  z-index: 2;\n  border: 1px solid ", ";\n"], ["\n  width: 100%;\n  height: 100%;\n  position: absolute;\n  border-radius: 50%;\n  z-index: 2;\n  border: 1px solid ", ";\n"])), function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.medium; });
-var RadioInput = styled.input(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  position: absolute;\n  opacity: 0;\n  width: 100%;\n  height: 100%;\n  cursor: pointer;\n  z-index: 3;\n\n  &:checked + ", " {\n    display: inline-block;\n    ", ";\n    animation-fill-mode: forwards;\n\n    &::after {\n      z-index: 1;\n      content: '';\n      width: 14px;\n      height: 14px;\n      border-radius: 50%;\n      top: 3px;\n      left: 3px;\n      position: absolute;\n      ", ";\n      animation-fill-mode: forwards;\n\n      @keyframes backgroundAnimation {\n        from {background: none;}\n        to {background:", ";}\n      }\n\n      @keyframes borderAntmation {\n        from {border: 2px solid ", ";}\n        to {border: 2px solid ", ";}\n      }\n    }\n  }\n"], ["\n  position: absolute;\n  opacity: 0;\n  width: 100%;\n  height: 100%;\n  cursor: pointer;\n  z-index: 3;\n\n  &:checked + ", " {\n    display: inline-block;\n    ", ";\n    animation-fill-mode: forwards;\n\n    &::after {\n      z-index: 1;\n      content: '';\n      width: 14px;\n      height: 14px;\n      border-radius: 50%;\n      top: 3px;\n      left: 3px;\n      position: absolute;\n      ", ";\n      animation-fill-mode: forwards;\n\n      @keyframes backgroundAnimation {\n        from {background: none;}\n        to {background:", ";}\n      }\n\n      @keyframes borderAntmation {\n        from {border: 2px solid ", ";}\n        to {border: 2px solid ", ";}\n      }\n    }\n  }\n"])), CustomRadio, function (props) { return props.customColor && 'animation: borderAntmation 500ms'; }, function (props) { return props.customColor && 'animation: backgroundAnimation 500ms'; }, function (props) { return props.customColor && "" + props.customColor; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.medium; }, function (props) { return props.customColor; });
+var RadioInput = styled.input(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  position: absolute;\n  opacity: 0;\n  width: 100%;\n  height: 100%;\n  cursor: pointer;\n  z-index: 3;\n\n  &:checked + ", " {\n    display: inline-block;\n    ", ";\n    animation-fill-mode: forwards;\n\n    &::after {\n      z-index: 1;\n      content: '';\n      width: 14px;\n      height: 14px;\n      border-radius: 50%;\n      top: 3px;\n      left: 3px;\n      position: absolute;\n      ", ";\n      animation-fill-mode: forwards;\n\n      @keyframes backgroundAnimation {\n        from {background: none;}\n        to {background:", ";}\n      }\n\n      @keyframes borderAntmation {\n        from {border: 2px solid ", ";}\n        to {border: 2px solid ", ";}\n      }\n    }\n  }\n"], ["\n  position: absolute;\n  opacity: 0;\n  width: 100%;\n  height: 100%;\n  cursor: pointer;\n  z-index: 3;\n\n  &:checked + ", " {\n    display: inline-block;\n    ", ";\n    animation-fill-mode: forwards;\n\n    &::after {\n      z-index: 1;\n      content: '';\n      width: 14px;\n      height: 14px;\n      border-radius: 50%;\n      top: 3px;\n      left: 3px;\n      position: absolute;\n      ", ";\n      animation-fill-mode: forwards;\n\n      @keyframes backgroundAnimation {\n        from {background: none;}\n        to {background:", ";}\n      }\n\n      @keyframes borderAntmation {\n        from {border: 2px solid ", ";}\n        to {border: 2px solid ", ";}\n      }\n    }\n  }\n"])), CustomRadio, function (props) { return props.customColor && 'animation: borderAntmation 500ms'; }, function (props) { return props.customColor && 'animation: backgroundAnimation 500ms'; }, function (props) { return props.customColor && "".concat(props.customColor); }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.medium; }, function (props) { return props.customColor; });
 var templateObject_1, templateObject_2, templateObject_3;
 export { CustomRadio, RadioInput, RadioWrapper };

package/build/es/components/src/components/FormElements/TextArea/TextArea.styles.js CHANGED Viewed

@@ -6,7 +6,7 @@ var TextArea = styled.textarea(templateObject_1 || (templateObject_1 = __makeTem
     return props.disabled
         ? (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.medium
         : (_d = (_c = props === null || props === void 0 ? void 0 : props.theme) === null || _c === void 0 ? void 0 : _c.palette) === null || _d === void 0 ? void 0 : _d.dark;
-}, function (props) { var _a, _b, _c, _d; return ((_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.spacings) === null || _b === void 0 ? void 0 : _b.xs) + 'px' + ' ' + ((_d = (_c = props === null || props === void 0 ? void 0 : props.theme) === null || _c === void 0 ? void 0 : _c.spacings) === null || _d === void 0 ? void 0 : _d.sm); }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.white; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.darkest; }, function (props) { var _a; return (_a = props.flexGrow) !== null && _a !== void 0 ? _a : 1; }, function (props) { var _a, _b, _c; return props.fontSize ? props.fontSize : (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.typography) === null || _b === void 0 ? void 0 : _b.size) === null || _c === void 0 ? void 0 : _c.s3; }, function (props) { return props.flexGrow && "flex: " + props.flexGrow; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.transition.inputTransition; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.brandBlue; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.buttonHover; }, function (props) {
+}, function (props) { var _a, _b, _c, _d; return ((_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.spacings) === null || _b === void 0 ? void 0 : _b.xs) + 'px' + ' ' + ((_d = (_c = props === null || props === void 0 ? void 0 : props.theme) === null || _c === void 0 ? void 0 : _c.spacings) === null || _d === void 0 ? void 0 : _d.sm); }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.white; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.darkest; }, function (props) { var _a; return (_a = props.flexGrow) !== null && _a !== void 0 ? _a : 1; }, function (props) { var _a, _b, _c; return props.fontSize ? props.fontSize : (_c = (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.typography) === null || _b === void 0 ? void 0 : _b.size) === null || _c === void 0 ? void 0 : _c.s3; }, function (props) { return props.flexGrow && "flex: ".concat(props.flexGrow); }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.transition.inputTransition; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.brandBlue; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.boxShadow.buttonHover; }, function (props) {
     var _a, _b, _c, _d;
     return props.disabled
         ? (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.medium

package/build/es/components/src/components/FormGroup/FormGroup.styles.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
 import styled from 'styled-components';
 var FormControlWrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  ", ";\n\n  gap: ", "px;\n  @media (min-width: ", "px) {\n    gap: ", "px;\n  }\n"], ["\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  ", ";\n\n  gap: ", "px;\n  @media (min-width: ", "px) {\n    gap: ", "px;\n  }\n"])), function (props) {
-    return props.justifyContent && "justify-content: " + props.justifyContent;
+    return props.justifyContent && "justify-content: ".concat(props.justifyContent);
 }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a, _b; return (_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.breakpoints) === null || _b === void 0 ? void 0 : _b.xs; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.md; });
 var templateObject_1;

package/build/es/components/src/components/GridContainer/GridContainer.styles.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
 import styled from 'styled-components';
-var Grid = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: grid;\n  grid-template-columns: 1fr;\n  align-items: ", ";\n  gap: ", "px;\n  @media (min-width: ", "px) {\n    grid-template-columns: repeat(\n      ", ",\n      ", "\n    );\n  }\n"], ["\n  display: grid;\n  grid-template-columns: 1fr;\n  align-items: ", ";\n  gap: ", "px;\n  @media (min-width: ", "px) {\n    grid-template-columns: repeat(\n      ", ",\n      ", "\n    );\n  }\n"])), function (props) { return props.alignItems || 'start'; }, function (props) { var _a, _b; return props.gap || ((_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.spacings) === null || _b === void 0 ? void 0 : _b.sm); }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.md; }, function (props) { return props.columns; }, function (props) { return (props.columnWidth ? props.columnWidth + "px" : '1fr'); });
+var Grid = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: grid;\n  grid-template-columns: 1fr;\n  align-items: ", ";\n  gap: ", "px;\n  @media (min-width: ", "px) {\n    grid-template-columns: repeat(\n      ", ",\n      ", "\n    );\n  }\n"], ["\n  display: grid;\n  grid-template-columns: 1fr;\n  align-items: ", ";\n  gap: ", "px;\n  @media (min-width: ", "px) {\n    grid-template-columns: repeat(\n      ", ",\n      ", "\n    );\n  }\n"])), function (props) { return props.alignItems || 'start'; }, function (props) { var _a, _b; return props.gap || ((_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.spacings) === null || _b === void 0 ? void 0 : _b.sm); }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.md; }, function (props) { return props.columns; }, function (props) { return (props.columnWidth ? "".concat(props.columnWidth, "px") : '1fr'); });
 var templateObject_1;
 export { Grid };

package/build/es/components/src/components/HeaderLink/HeaderLink.styles.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
 import styled from 'styled-components';
-var HeaderLinkContainer = styled.a(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: block;\n  background: ", ";\n  color: ", ";\n  padding: ", ";\n  font-size: ", "px;\n  text-decoration: none;\n  line-height: ", "px;\n"], ["\n  display: block;\n  background: ", ";\n  color: ", ";\n  padding: ", ";\n  font-size: ", "px;\n  text-decoration: none;\n  line-height: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.darker; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.white; }, function (props) { var _a, _b; return ((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs) + "px " + ((_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.md) + "px"; }, function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.s2; }, function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.lineHeight.s2; });
+var HeaderLinkContainer = styled.a(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: block;\n  background: ", ";\n  color: ", ";\n  padding: ", ";\n  font-size: ", "px;\n  text-decoration: none;\n  line-height: ", "px;\n"], ["\n  display: block;\n  background: ", ";\n  color: ", ";\n  padding: ", ";\n  font-size: ", "px;\n  text-decoration: none;\n  line-height: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.darker; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.white; }, function (props) { var _a, _b; return "".concat((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs, "px ").concat((_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.md, "px"); }, function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.s2; }, function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.lineHeight.s2; });
 var TextContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n"], ["\n  display: flex;\n  align-items: center;\n"])));
 var ArrowLeft = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  margin-right: ", "px;\n  align-self: center;\n"], ["\n  display: flex;\n  margin-right: ", "px;\n  align-self: center;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; });
 var templateObject_1, templateObject_2, templateObject_3;

package/build/es/components/src/components/IconToolTip/IconToolTip.styles.js CHANGED Viewed

@@ -5,9 +5,9 @@ var IconToolTipContainer = styled.div(templateObject_1 || (templateObject_1 = __
 var ArrowUp = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: absolute;\n  top: ", "px;\n  width: 0;\n  left: ", "px;\n  height: 0;\n  border-left: ", "px solid\n    transparent;\n  border-right: ", "px solid\n    transparent;\n  border-bottom: ", "px solid\n    ", ";\n"], ["\n  position: absolute;\n  top: ", "px;\n  width: 0;\n  left: ", "px;\n  height: 0;\n  border-left: ", "px solid\n    transparent;\n  border-right: ", "px solid\n    transparent;\n  border-bottom: ", "px solid\n    ", ";\n"])), function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.iconToolTipArrowTop; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.iconToolTipArrowLeft; }, function (props) { var _a, _b; return (_b = (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius) === null || _b === void 0 ? void 0 : _b.small; }, function (props) { var _a, _b; return (_b = (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius) === null || _b === void 0 ? void 0 : _b.small; }, function (props) { var _a, _b; return (_b = (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius) === null || _b === void 0 ? void 0 : _b.small; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.darkest; });
 var ToolTipBox = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  position: absolute;\n  top: ", "px;\n  ", ";\n  width: ", "px;\n  background-color: ", ";\n  border-radius: ", "px;\n  padding: ", "px;\n  z-index: 99;\n"], ["\n  position: absolute;\n  top: ", "px;\n  ", ";\n  width: ", "px;\n  background-color: ", ";\n  border-radius: ", "px;\n  padding: ", "px;\n  z-index: 99;\n"])), function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.iconToolTipTop; }, function (props) {
     return props.right
-        ? "right: " + props.right + "px"
+        ? "right: ".concat(props.right, "px")
         : props.left
-            ? "left:" + props.left + "px"
+            ? "left:".concat(props.left, "px")
             : null;
 }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.iconToolTipBoxWidth; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.darkest; }, function (props) { var _a, _b; return (_b = (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius) === null || _b === void 0 ? void 0 : _b.small; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; });
 var ToolTipheader = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n  align-items: center;\n"], ["\n  display: flex;\n  width: 100%;\n  justify-content: space-between;\n  align-items: center;\n"])));

package/build/es/components/src/components/InfoTextBlock/InfoTextBlock.styles.js CHANGED Viewed

@@ -4,10 +4,10 @@ import styled from 'styled-components';
 var InfoBlock = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex: 1;\n  flex-wrap: wrap;\n  gap: ", "px;\n  position: relative;\n  background: ", ";\n  padding: ", ";\n  @media (min-width: ", "px) {\n    flex-wrap: nowrap;\n    align-items: center;\n    justify-content: space-between;\n  } ;\n"], ["\n  display: flex;\n  flex: 1;\n  flex-wrap: wrap;\n  gap: ", "px;\n  position: relative;\n  background: ", ";\n  padding: ", ";\n  @media (min-width: ", "px) {\n    flex-wrap: nowrap;\n    align-items: center;\n    justify-content: space-between;\n  } ;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { return props.background; }, function (props) {
     var _a, _b, _c;
     return props.hasImage
-        ? ((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.md) + "px"
-        : ((_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.sm) + "px " + ((_c = props.theme.spacings) === null || _c === void 0 ? void 0 : _c.md) + "px";
+        ? "".concat((_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.md, "px")
+        : "".concat((_b = props.theme.spacings) === null || _b === void 0 ? void 0 : _b.sm, "px ").concat((_c = props.theme.spacings) === null || _c === void 0 ? void 0 : _c.md, "px");
 }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.sm; });
-var ImageContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: ", ";\n  max-width: ", "px;\n  height: ", ";\n  @media (min-width: ", "px) {\n    max-width: ", "px;\n  }\n"], ["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: ", ";\n  max-width: ", "px;\n  height: ", ";\n  @media (min-width: ", "px) {\n    max-width: ", "px;\n  }\n"])), function (props) { return (props.width ? props.width + "px" : '100%'); }, function (props) { var _a; return props.width || ((_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.listImageMaxWidth); }, function (props) { return (props.height ? props.height + "px" : 'auto'); }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a; return props.width || ((_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.infoBlockImageMaxWidthDesktop); });
+var ImageContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: ", ";\n  max-width: ", "px;\n  height: ", ";\n  @media (min-width: ", "px) {\n    max-width: ", "px;\n  }\n"], ["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: ", ";\n  max-width: ", "px;\n  height: ", ";\n  @media (min-width: ", "px) {\n    max-width: ", "px;\n  }\n"])), function (props) { return (props.width ? "".concat(props.width, "px") : '100%'); }, function (props) { var _a; return props.width || ((_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.listImageMaxWidth); }, function (props) { return (props.height ? "".concat(props.height, "px") : 'auto'); }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a; return props.width || ((_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.infoBlockImageMaxWidthDesktop); });
 var Image = styled.img(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n"], ["\n  width: 100%;\n  height: 100%;\n  object-fit: contain;\n"])));
 var InfoTextWrapper = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: flex;\n  gap: ", "px;\n  @media (min-width: ", "px) {\n    gap: ", "px;\n  }\n"], ["\n  display: flex;\n  gap: ", "px;\n  @media (min-width: ", "px) {\n    gap: ", "px;\n  }\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.lg; });
 var ButtonContainer = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: flex;\n  width: 100%;\n  @media (min-width: ", "px) {\n    max-width: max-content;\n  }\n"], ["\n  display: flex;\n  width: 100%;\n  @media (min-width: ", "px) {\n    max-width: max-content;\n  }\n"])), function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.sm; });

package/build/es/components/src/components/ListItem/ListItem.js CHANGED Viewed

@@ -7,12 +7,12 @@ import { theme as theme_1 } from '../../../../design-tokens/build/index.js';
 function ListItem(_a) {
     var _b;
-    var item = _a.item, loading = _a.loading, isSmall = _a.isSmall, fallBackImage = _a.fallBackImage, imageAutoHeight = _a.imageAutoHeight, boldHeader = _a.boldHeader, smallSkeleton = _a.smallSkeleton, children = _a.children;
+    var item = _a.item, loading = _a.loading, isSmall = _a.isSmall, fallBackImage = _a.fallBackImage, imageAutoHeight = _a.imageAutoHeight, boldHeader = _a.boldHeader, smallSkeleton = _a.smallSkeleton, children = _a.children, usedInSearch = _a.usedInSearch;
     return (React.createElement(ListItemContainer, null,
-        React.createElement(ListLeft, null,
+        React.createElement(ListLeft, { usedInSearch: usedInSearch },
             React.createElement(ListImageContainer, { isSmall: isSmall },
                 React.createElement(ListImage, { autoHeight: imageAutoHeight, src: (item === null || item === void 0 ? void 0 : item.image) || fallBackImage || FallbackIcon, alt: item === null || item === void 0 ? void 0 : item.name, isSmall: isSmall })),
-            React.createElement(ItemInformationContainer, null,
+            React.createElement(ItemInformationContainer, { usedInSearch: usedInSearch },
                 React.createElement(BodyText, { fontWeight: boldHeader ? 'semiBold' : 'regular', size: isSmall
                         ? TextTypes.TextSize.EXTRASMALL
                         : TextTypes.TextSize.REGULAR }, (item === null || item === void 0 ? void 0 : item.name) || React.createElement(Skeleton, { width: smallSkeleton ? 150 : 250 })),

package/build/es/components/src/components/ListItem/ListItem.styles.js CHANGED Viewed

@@ -1,9 +1,9 @@
 import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
 import styled from 'styled-components';
-var ItemInformationContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  padding: ", "px;\n"], ["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  padding: ", "px;\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs; });
-var ListItemContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n\n  p {\n    padding: 1px 0px;\n  }\n"], ["\n  display: flex;\n  justify-content: space-between;\n\n  p {\n    padding: 1px 0px;\n  }\n"])));
-var ListLeft = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  gap: ", "px;\n  @media (min-width: ", "px) {\n    gap: ", "px;\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  gap: ", "px;\n  @media (min-width: ", "px) {\n    gap: ", "px;\n  }\n"])), function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.listItemFlexGap; });
+var ItemInformationContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  padding: ", "px;\n"], ["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  padding: ", "px;\n"])), function (props) { var _a; return (props.usedInSearch ? 0 : (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xs); });
+var ListItemContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n  p {\n    padding: 1px 0px;\n  }\n"], ["\n  display: flex;\n  justify-content: space-between;\n  p {\n    padding: 1px 0px;\n  }\n"])));
+var ListLeft = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  align-items: ", ";\n  gap: ", "px;\n  @media (min-width: ", "px) {\n    gap: ", "px;\n  }\n"], ["\n  display: flex;\n  align-items: ", ";\n  gap: ", "px;\n  @media (min-width: ", "px) {\n    gap: ", "px;\n  }\n"])), function (props) { return (props.usedInSearch ? 'inherit' : 'center'); }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.listItemFlexGap; });
 var ListRight = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  justify-content: space-between;\n  text-align: right;\n"], ["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  justify-content: space-between;\n  text-align: right;\n"])));
 var ListImageContainer = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-direction: row;\n  width: ", "px;\n  height: ", "px;\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-direction: row;\n  width: ", "px;\n  height: ", "px;\n"])), function (props) {
     var _a, _b;
@@ -20,9 +20,9 @@ var ListImage = styled.img(templateObject_6 || (templateObject_6 = __makeTemplat
     var _a, _b;
     return props.autoHeight
         ? '100%'
-        : ((props === null || props === void 0 ? void 0 : props.isSmall)
+        : "".concat((props === null || props === void 0 ? void 0 : props.isSmall)
             ? (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.listImageMaxHeightSmall
-            : (_b = props.theme.constants) === null || _b === void 0 ? void 0 : _b.listImageMaxHeight) + "px";
+            : (_b = props.theme.constants) === null || _b === void 0 ? void 0 : _b.listImageMaxHeight, "px");
 });
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;

package/build/es/components/src/components/ListItemWithRadio/ListItemWithRadio.js CHANGED Viewed

@@ -18,7 +18,7 @@ function ListItemWithRadio(_a) {
                 React.createElement(Skeleton, { width: 140, count: 2, style: {
                         display: 'flex',
                         flexDirection: 'column',
-                        marginBottom: ((_b = theme_1.spacings) === null || _b === void 0 ? void 0 : _b.xs) + "px"
+                        marginBottom: "".concat((_b = theme_1.spacings) === null || _b === void 0 ? void 0 : _b.xs, "px")
                     } })))) : (React.createElement(React.Fragment, null,
             React.createElement(ListItemHeader, null,
                 React.createElement(BodyText, { fontWeight: 'semiBold' }, item === null || item === void 0 ? void 0 :

package/build/es/components/src/components/Menu/Menu.styles.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
 import styled from 'styled-components';
 var MenuContainer = styled.nav(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  display: flex;\n  flex-wrap: nowrap;\n  overflow-x: auto;\n  overflow-y: hidden;\n  -webkit-overflow-scrolling: touch;\n  -ms-overflow-style: -ms-autohiding-scrollbar;\n\n  ::-webkit-scrollbar {\n    background: ", ";\n    height: 2px;\n  }\n\n  ::-webkit-scrollbar-thumb {\n    border-radius: ", "px;\n    background-color: ", ";\n  }\n  /* for mozilla */\n  scrollbar-width: thin;\n  scrollbar-color: ", ";\n\n  @media (min-width: ", "px) {\n    /* for mozila scroll bar */\n    width: calc(100% - 40px);\n  }\n"], ["\n  position: relative;\n  display: flex;\n  flex-wrap: nowrap;\n  overflow-x: auto;\n  overflow-y: hidden;\n  -webkit-overflow-scrolling: touch;\n  -ms-overflow-style: -ms-autohiding-scrollbar;\n\n  ::-webkit-scrollbar {\n    background: ", ";\n    height: 2px;\n  }\n\n  ::-webkit-scrollbar-thumb {\n    border-radius: ", "px;\n    background-color: ", ";\n  }\n  /* for mozilla */\n  scrollbar-width: thin;\n  scrollbar-color: ", ";\n\n  @media (min-width: ", "px) {\n    /* for mozila scroll bar */\n    width: calc(100% - 40px);\n  }\n"])), function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.white; }, function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.borderRadius.default; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.dark; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.dark; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; });
-var MenuItem = styled.a(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  flex: 0 0 auto;\n  font-weight: ", ";\n  padding: ", "px 0;\n  display: block;\n  border-bottom: ", "px solid;\n  border-bottom-color: ", ";\n  cursor: pointer;\n  font-size: ", "px;\n  margin-left: ", "px;\n  margin-right: ", "px;\n\n  &:last-child {\n    position: relative;\n    &::after {\n      position: absolute;\n      content: '';\n      right: -", "px;\n      width: ", "px;\n      height: 100%;\n    }\n  }\n  @media (min-width: ", "px) {\n    &:hover {\n      border-bottom-color: ", ";\n    }\n  }\n"], ["\n  flex: 0 0 auto;\n  font-weight: ", ";\n  padding: ", "px 0;\n  display: block;\n  border-bottom: ", "px solid;\n  border-bottom-color: ", ";\n  cursor: pointer;\n  font-size: ", "px;\n  margin-left: ", "px;\n  margin-right: ", "px;\n\n  &:last-child {\n    position: relative;\n    &::after {\n      position: absolute;\n      content: '';\n      right: -", "px;\n      width: ", "px;\n      height: 100%;\n    }\n  }\n  @media (min-width: ", "px) {\n    &:hover {\n      border-bottom-color: ", ";\n    }\n  }\n"])), function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.weight.semiBold; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.tableHeaderVerticalPadding; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) { var _a; return props.active ? "" + ((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.primary) : 'transparent'; }, function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.s3; }, function (props) { var _a; return props.isFirstChild ? 0 : (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.menuHorizontalMargin; }, function (props) { var _a; return props.isLastChild ? 0 : (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.menuHorizontalMargin; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.primary; });
+var MenuItem = styled.a(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  flex: 0 0 auto;\n  font-weight: ", ";\n  padding: ", "px 0;\n  display: block;\n  border-bottom: ", "px solid;\n  border-bottom-color: ", ";\n  cursor: pointer;\n  font-size: ", "px;\n  margin-left: ", "px;\n  margin-right: ", "px;\n\n  &:last-child {\n    position: relative;\n    &::after {\n      position: absolute;\n      content: '';\n      right: -", "px;\n      width: ", "px;\n      height: 100%;\n    }\n  }\n  @media (min-width: ", "px) {\n    &:hover {\n      border-bottom-color: ", ";\n    }\n  }\n"], ["\n  flex: 0 0 auto;\n  font-weight: ", ";\n  padding: ", "px 0;\n  display: block;\n  border-bottom: ", "px solid;\n  border-bottom-color: ", ";\n  cursor: pointer;\n  font-size: ", "px;\n  margin-left: ", "px;\n  margin-right: ", "px;\n\n  &:last-child {\n    position: relative;\n    &::after {\n      position: absolute;\n      content: '';\n      right: -", "px;\n      width: ", "px;\n      height: 100%;\n    }\n  }\n  @media (min-width: ", "px) {\n    &:hover {\n      border-bottom-color: ", ";\n    }\n  }\n"])), function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.weight.semiBold; }, function (props) { var _a; return (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.tableHeaderVerticalPadding; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.xxs; }, function (props) { var _a; return props.active ? "".concat((_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.primary) : 'transparent'; }, function (props) { var _a; return (_a = props.theme.typography) === null || _a === void 0 ? void 0 : _a.size.s3; }, function (props) { var _a; return props.isFirstChild ? 0 : (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.menuHorizontalMargin; }, function (props) { var _a; return props.isLastChild ? 0 : (_a = props.theme.constants) === null || _a === void 0 ? void 0 : _a.menuHorizontalMargin; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.sm; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.primary; });
 var Fade = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  pointer-events: none;\n  position: absolute;\n  top: 0;\n  right: 0;\n  width: 100%;\n  height: 100%;\n  background: linear-gradient(\n    to right,\n    rgba(255, 255, 255, 0) 80%,\n    rgba(255, 255, 255, 1)\n  );\n  transition: all 0.5s;\n  opacity: ", ";\n"], ["\n  pointer-events: none;\n  position: absolute;\n  top: 0;\n  right: 0;\n  width: 100%;\n  height: 100%;\n  background: linear-gradient(\n    to right,\n    rgba(255, 255, 255, 0) 80%,\n    rgba(255, 255, 255, 1)\n  );\n  transition: all 0.5s;\n  opacity: ", ";\n"])), function (props) { return ((props === null || props === void 0 ? void 0 : props.isVisible) ? '1' : '0'); });
 var templateObject_1, templateObject_2, templateObject_3;

package/build/es/components/src/components/Modal/Modal.styles.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { __makeTemplateObject } from '../../../../_virtual/_tslib.js';
 import styled from 'styled-components';
 var ModalOverlay = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  z-index: ", ";\n  background: ", ";\n  position: fixed;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  height: 100%;\n  justify-content: center;\n  align-items: center;\n\n  @media (min-width: ", "px) {\n    padding: ", "px;\n  }\n"], ["\n  display: flex;\n  z-index: ", ";\n  background: ", ";\n  position: fixed;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  height: 100%;\n  justify-content: center;\n  align-items: center;\n\n  @media (min-width: ", "px) {\n    padding: ", "px;\n  }\n"])), function (props) { var _a; return (_a = props.theme.attributes) === null || _a === void 0 ? void 0 : _a.zIndex.modal; }, function (props) { var _a; return (_a = props.theme.palette) === null || _a === void 0 ? void 0 : _a.darkOverlay; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.lg; });
-var ModalContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  overflow: auto;\n  display: flex;\n  flex-direction: column;\n  ", ";\n  max-width: 100%;\n  max-height: 100vh;\n  padding: ", "px;\n  @media (min-width: ", "px) {\n    padding: ", "px;\n    width: 100%;\n    max-width: ", ";\n    max-height: 90vh;\n  }\n"], ["\n  overflow: auto;\n  display: flex;\n  flex-direction: column;\n  ", ";\n  max-width: 100%;\n  max-height: 100vh;\n  padding: ", "px;\n  @media (min-width: ", "px) {\n    padding: ", "px;\n    width: 100%;\n    max-width: ", ";\n    max-height: 90vh;\n  }\n"])), function (props) { return props.background && "background: " + props.background; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.md; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.lg; }, function (props) {
+var ModalContainer = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  overflow: auto;\n  display: flex;\n  flex-direction: column;\n  ", ";\n  max-width: 100%;\n  max-height: 100vh;\n  padding: ", "px;\n  @media (min-width: ", "px) {\n    padding: ", "px;\n    width: 100%;\n    max-width: ", ";\n    max-height: 90vh;\n  }\n"], ["\n  overflow: auto;\n  display: flex;\n  flex-direction: column;\n  ", ";\n  max-width: 100%;\n  max-height: 100vh;\n  padding: ", "px;\n  @media (min-width: ", "px) {\n    padding: ", "px;\n    width: 100%;\n    max-width: ", ";\n    max-height: 90vh;\n  }\n"])), function (props) { return props.background && "background: ".concat(props.background); }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.md; }, function (props) { var _a; return (_a = props.theme.breakpoints) === null || _a === void 0 ? void 0 : _a.xs; }, function (props) { var _a; return (_a = props.theme.spacings) === null || _a === void 0 ? void 0 : _a.lg; }, function (props) {
     var _a, _b;
     return props.maxWidth
         ? props.maxWidth