@trafilea/afrodita-components 5.0.0-beta.232 → 5.0.0-beta.233

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.
package/build/index.js CHANGED
@@ -4865,7 +4865,7 @@ var templateObject_1$1v, templateObject_2$$;
4865
4865
 
4866
4866
  var DialogDropdownWrapper = newStyled.div(templateObject_1$1u || (templateObject_1$1u = __makeTemplateObject(["\n position: relative;\n display: none;\n ::before,\n ::after {\n content: '';\n position: absolute;\n border: 11px solid transparent;\n margin-left: -10px;\n border-bottom-color: #e9e9e9;\n top: calc(", " - 5px);\n right: calc(", " + 21px);\n z-index: 50 !important;\n }\n ::after {\n border-bottom-color: #fff;\n top: calc(", " - 4px);\n right: calc(", " + 21px);\n z-index: 50 !important;\n }\n"], ["\n position: relative;\n display: none;\n ::before,\n ::after {\n content: '';\n position: absolute;\n border: 11px solid transparent;\n margin-left: -10px;\n border-bottom-color: #e9e9e9;\n top: calc(", " - 5px);\n right: calc(", " + 21px);\n z-index: 50 !important;\n }\n ::after {\n border-bottom-color: #fff;\n top: calc(", " - 4px);\n right: calc(", " + 21px);\n z-index: 50 !important;\n }\n"])), function (props) { return props.top; }, function (props) { return props.right; }, function (props) { return props.top; }, function (props) { return props.right; });
4867
4867
  var DialogDropdownListContainer = newStyled.ul(templateObject_2$_ || (templateObject_2$_ = __makeTemplateObject(["\n position: absolute;\n list-style: none;\n width: max-content;\n min-width: 100px;\n background: #fff;\n border: 1px solid #e9e9e9;\n top: calc(", " + 15px);\n right: calc(", " - 23px);\n z-index: 50 !important;\n margin-bottom: 1rem;\n\n font-family: inherit;\n font-size: 100%;\n font-style: inherit;\n font-variant: inherit;\n font-weight: inherit;\n line-height: inherit;\n margin: 0;\n padding: 0;\n vertical-align: inherit;\n"], ["\n position: absolute;\n list-style: none;\n width: max-content;\n min-width: 100px;\n background: #fff;\n border: 1px solid #e9e9e9;\n top: calc(", " + 15px);\n right: calc(", " - 23px);\n z-index: 50 !important;\n margin-bottom: 1rem;\n\n font-family: inherit;\n font-size: 100%;\n font-style: inherit;\n font-variant: inherit;\n font-weight: inherit;\n line-height: inherit;\n margin: 0;\n padding: 0;\n vertical-align: inherit;\n"])), function (props) { return props.top; }, function (props) { return props.right; });
4868
- var DialogDropdownListItem = newStyled.li(templateObject_3$M || (templateObject_3$M = __makeTemplateObject(["\n border-bottom: 1px solid #e9e9e9;\n margin: 0;\n padding: 0;\n font-style: normal;\n font-weight: 400;\n font-size: 14px;\n line-height: 17px;\n color: var(--colors-shades-550-color);\n vertical-align: inherit;\n"], ["\n border-bottom: 1px solid #e9e9e9;\n margin: 0;\n padding: 0;\n font-style: normal;\n font-weight: 400;\n font-size: 14px;\n line-height: 17px;\n color: var(--colors-shades-550-color);\n vertical-align: inherit;\n"])));
4868
+ var DialogDropdownListItem = newStyled.li(templateObject_3$N || (templateObject_3$N = __makeTemplateObject(["\n border-bottom: 1px solid #e9e9e9;\n margin: 0;\n padding: 0;\n font-style: normal;\n font-weight: 400;\n font-size: 14px;\n line-height: 17px;\n color: var(--colors-shades-550-color);\n vertical-align: inherit;\n"], ["\n border-bottom: 1px solid #e9e9e9;\n margin: 0;\n padding: 0;\n font-style: normal;\n font-weight: 400;\n font-size: 14px;\n line-height: 17px;\n color: var(--colors-shades-550-color);\n vertical-align: inherit;\n"])));
4869
4869
  var DialogDropdownLink = newStyled.a(templateObject_4$y || (templateObject_4$y = __makeTemplateObject(["\n display: inline-block;\n text-decoration: none;\n width: 100%;\n background-color: transparent;\n border: 0;\n margin: 0;\n padding: 12px;\n cursor: pointer;\n transition: all 0.2s;\n color: var(--colors-shades-700-color);\n font-size: 1.125rem;\n font-style: inherit;\n font-variant: inherit;\n font-weight: inherit;\n line-height: inherit;\n vertical-align: inherit;\n"], ["\n display: inline-block;\n text-decoration: none;\n width: 100%;\n background-color: transparent;\n border: 0;\n margin: 0;\n padding: 12px;\n cursor: pointer;\n transition: all 0.2s;\n color: var(--colors-shades-700-color);\n font-size: 1.125rem;\n font-style: inherit;\n font-variant: inherit;\n font-weight: inherit;\n line-height: inherit;\n vertical-align: inherit;\n"])));
4870
4870
  var DropdownDialog = function (_a) {
4871
4871
  var options = _a.options, _b = _a.position, top = _b.top, right = _b.right, style = _a.style, className = _a.className;
@@ -4874,7 +4874,7 @@ var DropdownDialog = function (_a) {
4874
4874
  return (jsxRuntime.jsx(DialogDropdownListItem, { children: jsxRuntime.jsx(DialogDropdownLink, __assign$1({ href: value }, { children: label }), void 0) }, idx));
4875
4875
  }) }), void 0) }), void 0));
4876
4876
  };
4877
- var templateObject_1$1u, templateObject_2$_, templateObject_3$M, templateObject_4$y;
4877
+ var templateObject_1$1u, templateObject_2$_, templateObject_3$N, templateObject_4$y;
4878
4878
 
4879
4879
  var getStylesBySize$a = function (size, theme) {
4880
4880
  switch (size) {
@@ -4944,7 +4944,7 @@ var SelectorSecondary = function (_a) {
4944
4944
  var TAGS = {
4945
4945
  hero1: newStyled.h1(templateObject_1$1t || (templateObject_1$1t = __makeTemplateObject([""], [""]))),
4946
4946
  hero2: newStyled.h2(templateObject_2$Z || (templateObject_2$Z = __makeTemplateObject([""], [""]))),
4947
- hero3: newStyled.h3(templateObject_3$L || (templateObject_3$L = __makeTemplateObject([""], [""]))),
4947
+ hero3: newStyled.h3(templateObject_3$M || (templateObject_3$M = __makeTemplateObject([""], [""]))),
4948
4948
  display1: newStyled.h1(templateObject_4$x || (templateObject_4$x = __makeTemplateObject([""], [""]))),
4949
4949
  display2: newStyled.h2(templateObject_5$j || (templateObject_5$j = __makeTemplateObject([""], [""]))),
4950
4950
  heading1: newStyled.h1(templateObject_6$g || (templateObject_6$g = __makeTemplateObject([""], [""]))),
@@ -5066,7 +5066,7 @@ var DEFAULTS = {
5066
5066
  size: 'regular',
5067
5067
  },
5068
5068
  };
5069
- var templateObject_1$1t, templateObject_2$Z, templateObject_3$L, templateObject_4$x, templateObject_5$j, templateObject_6$g, templateObject_7$a, templateObject_8$7, templateObject_9$4, templateObject_10$3, templateObject_11$2, templateObject_12$2, templateObject_13$2, templateObject_14$2, templateObject_15$2, templateObject_16$2, templateObject_17$2;
5069
+ var templateObject_1$1t, templateObject_2$Z, templateObject_3$M, templateObject_4$x, templateObject_5$j, templateObject_6$g, templateObject_7$a, templateObject_8$7, templateObject_9$4, templateObject_10$3, templateObject_11$2, templateObject_12$2, templateObject_13$2, templateObject_14$2, templateObject_15$2, templateObject_16$2, templateObject_17$2;
5070
5070
 
5071
5071
  var ButtonsContainer = newStyled.div(templateObject_1$1s || (templateObject_1$1s = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n margin: ", ";\n"], ["\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n margin: ", ";\n"])), function (_a) {
5072
5072
  var inline = _a.inline;
@@ -5134,12 +5134,12 @@ var templateObject_1$1r;
5134
5134
 
5135
5135
  var Container$$ = newStyled.div(templateObject_1$1q || (templateObject_1$1q = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n font-size: 0.88rem;\n"], ["\n display: flex;\n align-items: center;\n justify-content: space-between;\n font-size: 0.88rem;\n"])));
5136
5136
  var P$3 = newStyled.p(templateObject_2$Y || (templateObject_2$Y = __makeTemplateObject(["\n margin: 0;\n"], ["\n margin: 0;\n"])));
5137
- var PercentageSpan = newStyled.span(templateObject_3$K || (templateObject_3$K = __makeTemplateObject(["\n font-weight: 700;\n text-decoration-line: underline;\n cursor: pointer;\n"], ["\n font-weight: 700;\n text-decoration-line: underline;\n cursor: pointer;\n"])));
5137
+ var PercentageSpan = newStyled.span(templateObject_3$L || (templateObject_3$L = __makeTemplateObject(["\n font-weight: 700;\n text-decoration-line: underline;\n cursor: pointer;\n"], ["\n font-weight: 700;\n text-decoration-line: underline;\n cursor: pointer;\n"])));
5138
5138
  var SizeFitGuide = function (_a) {
5139
5139
  var title = _a.title, fitPercentage = _a.fitPercentage, onClick = _a.onClick, onClickFitPercentage = _a.onClickFitPercentage;
5140
5140
  return (jsxRuntime.jsxs(Container$$, { children: [jsxRuntime.jsx(TextButton, { LeadingIcon: Icon.PDP.Rule, size: exports.ComponentSize.Small, text: title, onClick: onClick, uppercase: false }, void 0), !!fitPercentage && (jsxRuntime.jsxs(P$3, { children: ["Fit As Expected:", ' ', jsxRuntime.jsxs(PercentageSpan, __assign$1({ onClick: onClickFitPercentage, role: "button" }, { children: [fitPercentage, "%"] }), void 0)] }, void 0))] }, void 0));
5141
5141
  };
5142
- var templateObject_1$1q, templateObject_2$Y, templateObject_3$K;
5142
+ var templateObject_1$1q, templateObject_2$Y, templateObject_3$L;
5143
5143
 
5144
5144
  var getStylesBySize$8 = function (size) {
5145
5145
  switch (size) {
@@ -5203,12 +5203,13 @@ var H3$3 = newStyled.h3(templateObject_2$X || (templateObject_2$X = __makeTempla
5203
5203
  var size = _a.size;
5204
5204
  return (_b = getStylesBySize$8(size)) === null || _b === void 0 ? void 0 : _b.lineHeight;
5205
5205
  });
5206
+ var Now = newStyled(H3$3)(templateObject_3$K || (templateObject_3$K = __makeTemplateObject(["\n display: none;\n margin-right: 0.25rem;\n"], ["\n display: none;\n margin-right: 0.25rem;\n"])));
5206
5207
  var DiscountTag = function (_a) {
5207
5208
  var discount = _a.discount, offText = _a.offText, disabled = _a.disabled, _b = _a.backgroundColor, backgroundColor = _b === void 0 ? '#fff' : _b, _c = _a.borderColor, borderColor = _c === void 0 ? 'transparent' : _c, _d = _a.textColor, textColor = _d === void 0 ? '#fff' : _d, _e = _a.size, size = _e === void 0 ? exports.ComponentSize.Medium : _e, style = _a.style;
5208
5209
  var theme = useTheme();
5209
- return (jsxRuntime.jsx(Container$_, __assign$1({ backgroundColor: disabled ? theme.colors.shades['50'].color : backgroundColor, borderColor: disabled ? theme.colors.shades['50'].color : borderColor, size: size, "data-testid": "discount-container", style: style }, { children: jsxRuntime.jsxs(H3$3, __assign$1({ textColor: disabled ? theme.colors.shades['250'].color : textColor, size: size, style: style }, { children: [discount, "% ", offText] }), void 0) }), void 0));
5210
+ return (jsxRuntime.jsxs(Container$_, __assign$1({ backgroundColor: disabled ? theme.colors.shades['50'].color : backgroundColor, borderColor: disabled ? theme.colors.shades['50'].color : borderColor, size: size, "data-testid": "discount-container", style: style }, { children: [jsxRuntime.jsx(Now, __assign$1({ "data-testid": "vwo-discount-now", textColor: disabled ? theme.colors.shades['250'].color : textColor, size: size, style: style }, { children: "Now:" }), void 0), jsxRuntime.jsxs(H3$3, __assign$1({ textColor: disabled ? theme.colors.shades['250'].color : textColor, size: size, style: style }, { children: [discount, "% ", offText] }), void 0)] }), void 0));
5210
5211
  };
5211
- var templateObject_1$1p, templateObject_2$X;
5212
+ var templateObject_1$1p, templateObject_2$X, templateObject_3$K;
5212
5213
 
5213
5214
  var getStylesBySize$7 = function (size) {
5214
5215
  switch (size) {