@trafilea/afrodita-components 5.0.0-beta.3 → 5.0.0-beta.4
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.esm.js +27 -36
- package/build/index.esm.js.map +1 -1
- package/build/index.js +27 -36
- package/build/index.js.map +1 -1
- package/package.json +1 -1
package/build/index.esm.js
CHANGED
|
@@ -4053,7 +4053,7 @@ var SelectorSecondary = function (_a) {
|
|
|
4053
4053
|
var TAGS = {
|
|
4054
4054
|
hero1: newStyled.h1(templateObject_1$11 || (templateObject_1$11 = __makeTemplateObject([""], [""]))),
|
|
4055
4055
|
hero2: newStyled.h2(templateObject_2$E || (templateObject_2$E = __makeTemplateObject([""], [""]))),
|
|
4056
|
-
hero3: newStyled.h3(templateObject_3$
|
|
4056
|
+
hero3: newStyled.h3(templateObject_3$p || (templateObject_3$p = __makeTemplateObject([""], [""]))),
|
|
4057
4057
|
display1: newStyled.h1(templateObject_4$g || (templateObject_4$g = __makeTemplateObject([""], [""]))),
|
|
4058
4058
|
display2: newStyled.h2(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject([""], [""]))),
|
|
4059
4059
|
heading1: newStyled.h1(templateObject_6$6 || (templateObject_6$6 = __makeTemplateObject([""], [""]))),
|
|
@@ -4069,7 +4069,7 @@ var TAGS = {
|
|
|
4069
4069
|
label: newStyled.label(templateObject_16 || (templateObject_16 = __makeTemplateObject([""], [""]))),
|
|
4070
4070
|
tag: newStyled.span(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n display: inline-block;\n text-transform: ", ";\n "], ["\n display: inline-block;\n text-transform: ", ";\n "])), function (props) { return (props.allCaps ? 'uppercase' : ''); }),
|
|
4071
4071
|
};
|
|
4072
|
-
var Text$
|
|
4072
|
+
var Text$5 = function (_a) {
|
|
4073
4073
|
var variant = _a.variant, children = _a.children, allProps = __rest(_a, ["variant", "children"]);
|
|
4074
4074
|
var theme = useTheme();
|
|
4075
4075
|
var Tag = useMemo(function () { return TAGS[variant] || 'p'; }, [variant]);
|
|
@@ -4174,7 +4174,7 @@ var DEFAULTS = {
|
|
|
4174
4174
|
size: 'regular',
|
|
4175
4175
|
},
|
|
4176
4176
|
};
|
|
4177
|
-
var templateObject_1$11, templateObject_2$E, templateObject_3$
|
|
4177
|
+
var templateObject_1$11, templateObject_2$E, templateObject_3$p, templateObject_4$g, templateObject_5$9, templateObject_6$6, templateObject_7$4, templateObject_8$1, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17;
|
|
4178
4178
|
|
|
4179
4179
|
var ButtonsContainer = newStyled.div(templateObject_1$10 || (templateObject_1$10 = __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) {
|
|
4180
4180
|
var inline = _a.inline;
|
|
@@ -4186,7 +4186,7 @@ var SizeSelector = function (_a) {
|
|
|
4186
4186
|
display: 'flex',
|
|
4187
4187
|
flexDirection: inline ? 'row' : 'column',
|
|
4188
4188
|
alignItems: inline ? 'center' : 'start',
|
|
4189
|
-
} }, { children: [jsxs(Text$
|
|
4189
|
+
} }, { children: [jsxs(Text$5, __assign$1({ variant: "body", weight: "regular", size: "small", css: { alignSelf: inline ? 'start' : 'inherit', padding: inline ? '0.75rem 0' : '0' } }, { children: [label, !inline && (jsx(Text$5, __assign$1({ variant: "label", weight: "demi", size: "regular" }, { children: selectedValue.description }), void 0))] }), void 0), jsx(ButtonsContainer, __assign$1({ inline: inline }, { children: sizes.map(function (size) {
|
|
4190
4190
|
var active = !size.disabled && size.label === selectedValue.label;
|
|
4191
4191
|
return (jsx(SelectorSecondary, { css: {
|
|
4192
4192
|
padding: '0.75rem 1rem 0.625rem',
|
|
@@ -4243,12 +4243,12 @@ var templateObject_1$$;
|
|
|
4243
4243
|
|
|
4244
4244
|
var Container$E = newStyled.div(templateObject_1$_ || (templateObject_1$_ = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n font-size: 0.88rem;\n"], ["\n display: flex;\n justify-content: space-between;\n font-size: 0.88rem;\n"])));
|
|
4245
4245
|
var P$3 = newStyled.p(templateObject_2$D || (templateObject_2$D = __makeTemplateObject(["\n margin: 0;\n"], ["\n margin: 0;\n"])));
|
|
4246
|
-
var PercentageSpan = newStyled.span(templateObject_3$
|
|
4246
|
+
var PercentageSpan = newStyled.span(templateObject_3$o || (templateObject_3$o = __makeTemplateObject(["\n font-weight: 700;\n text-decoration-line: underline;\n"], ["\n font-weight: 700;\n text-decoration-line: underline;\n"])));
|
|
4247
4247
|
var SizeFitGuide = function (_a) {
|
|
4248
4248
|
var title = _a.title, fitPercentageLabel = _a.fitPercentageLabel, fitPercentage = _a.fitPercentage, onClick = _a.onClick;
|
|
4249
4249
|
return (jsxs$1(Container$E, { children: [jsx$1(TextButton, { LeadingIcon: Icon.PDP.Rule, size: ComponentSize.Small, text: title, onClick: onClick }, void 0), jsxs$1(P$3, { children: [fitPercentageLabel, " ", jsxs$1(PercentageSpan, { children: [fitPercentage, "%"] }, void 0)] }, void 0)] }, void 0));
|
|
4250
4250
|
};
|
|
4251
|
-
var templateObject_1$_, templateObject_2$D, templateObject_3$
|
|
4251
|
+
var templateObject_1$_, templateObject_2$D, templateObject_3$o;
|
|
4252
4252
|
|
|
4253
4253
|
var getStylesBySize$6 = function (size) {
|
|
4254
4254
|
switch (size) {
|
|
@@ -4364,7 +4364,7 @@ var Price = newStyled.h1(templateObject_2$B || (templateObject_2$B = __makeTempl
|
|
|
4364
4364
|
var margin = _a.margin, size = _a.size;
|
|
4365
4365
|
return (margin ? (_b = getStylesBySize$5(size)) === null || _b === void 0 ? void 0 : _b.margin : '0');
|
|
4366
4366
|
});
|
|
4367
|
-
var TagContainer = newStyled.h1(templateObject_3$
|
|
4367
|
+
var TagContainer = newStyled.h1(templateObject_3$n || (templateObject_3$n = __makeTemplateObject(["\n margin: ", ";\n display: flex;\n align-items: center;\n"], ["\n margin: ", ";\n display: flex;\n align-items: center;\n"])), function (_a) {
|
|
4368
4368
|
var _b;
|
|
4369
4369
|
var size = _a.size;
|
|
4370
4370
|
return (_b = getStylesBySize$5(size)) === null || _b === void 0 ? void 0 : _b.margin;
|
|
@@ -4374,7 +4374,7 @@ var PriceLabel = function (_a) {
|
|
|
4374
4374
|
var theme = useTheme();
|
|
4375
4375
|
return (jsxs$1(Container$C, { children: [jsx$1(Price, __assign$1({ size: size, color: color || theme.colors.pallete.secondary.color, weight: 700, "data-testid": "price" }, { children: finalPrice }), void 0), originalPrice && (jsx$1(Price, __assign$1({ size: size, color: theme.colors.shades['300'].color, margin: true, underlined: true, "data-testid": "discount" }, { children: originalPrice }), void 0)), discount && (jsx$1(TagContainer, __assign$1({ size: size }, { children: jsx$1(DiscountTag, __assign$1({}, discount, { size: size }), void 0) }), void 0))] }, void 0));
|
|
4376
4376
|
};
|
|
4377
|
-
var templateObject_1$Y, templateObject_2$B, templateObject_3$
|
|
4377
|
+
var templateObject_1$Y, templateObject_2$B, templateObject_3$n;
|
|
4378
4378
|
|
|
4379
4379
|
var OneColorSelector = function (_a) {
|
|
4380
4380
|
var color = _a.color, selected = _a.selected, testId = _a.testId;
|
|
@@ -4415,12 +4415,12 @@ var OutOfStock = function (_a) {
|
|
|
4415
4415
|
|
|
4416
4416
|
var CustomRadioGroup = newStyled(lt)(templateObject_1$X || (templateObject_1$X = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
|
|
4417
4417
|
newStyled(lt.Label)(templateObject_2$A || (templateObject_2$A = __makeTemplateObject(["\n font-size: 0.88rem;\n"], ["\n font-size: 0.88rem;\n"])));
|
|
4418
|
-
var CustomRadioGroupOption = newStyled(lt.Option)(templateObject_3$
|
|
4418
|
+
var CustomRadioGroupOption = newStyled(lt.Option)(templateObject_3$m || (templateObject_3$m = __makeTemplateObject(["\n margin-right: 8px;\n\n svg {\n cursor: pointer;\n }\n"], ["\n margin-right: 8px;\n\n svg {\n cursor: pointer;\n }\n"])));
|
|
4419
4419
|
var Span = newStyled.span(templateObject_4$f || (templateObject_4$f = __makeTemplateObject(["\n font-weight: 600;\n"], ["\n font-weight: 600;\n"])));
|
|
4420
4420
|
var OptionsContainer = newStyled.div(templateObject_5$8 || (templateObject_5$8 = __makeTemplateObject(["\n display: flex;\n margin-top: 0.63rem;\n flex-wrap: wrap;\n"], ["\n display: flex;\n margin-top: 0.63rem;\n flex-wrap: wrap;\n"])));
|
|
4421
4421
|
var Label$2 = function (_a) {
|
|
4422
4422
|
var label = _a.label, values = _a.values;
|
|
4423
|
-
return (jsxs$1(Text$
|
|
4423
|
+
return (jsxs$1(Text$5, __assign$1({ variant: "body", weight: "regular", size: "small" }, { children: [label, " ", jsx$1(Span, { children: values }, void 0)] }), void 0));
|
|
4424
4424
|
};
|
|
4425
4425
|
var Option = function (_a) {
|
|
4426
4426
|
var value = _a.value, children = _a.children;
|
|
@@ -4435,7 +4435,7 @@ var ColorRadioGroup$1 = Object.assign(ColorRadioGroup, {
|
|
|
4435
4435
|
Option: Option,
|
|
4436
4436
|
OptionsContainer: OptionsContainer,
|
|
4437
4437
|
});
|
|
4438
|
-
var templateObject_1$X, templateObject_2$A, templateObject_3$
|
|
4438
|
+
var templateObject_1$X, templateObject_2$A, templateObject_3$m, templateObject_4$f, templateObject_5$8;
|
|
4439
4439
|
|
|
4440
4440
|
var Container$B = newStyled.div(templateObject_1$W || (templateObject_1$W = __makeTemplateObject(["\n width: 2rem;\n height: 2rem;\n border-radius: 50%;\n border: 0.081rem solid ", ";\n box-sizing: border-box;\n padding: 0.156rem;\n cursor: pointer;\n"], ["\n width: 2rem;\n height: 2rem;\n border-radius: 50%;\n border: 0.081rem solid ", ";\n box-sizing: border-box;\n padding: 0.156rem;\n cursor: pointer;\n"])), function (_a) {
|
|
4441
4441
|
var borderColor = _a.borderColor;
|
|
@@ -4536,12 +4536,12 @@ var templateObject_1$T;
|
|
|
4536
4536
|
|
|
4537
4537
|
var Container$z = newStyled.div(templateObject_1$S || (templateObject_1$S = __makeTemplateObject(["\n position: relative;\n height: 45rem;\n"], ["\n position: relative;\n height: 45rem;\n"])));
|
|
4538
4538
|
var TopTagContainer$1 = newStyled.div(templateObject_2$x || (templateObject_2$x = __makeTemplateObject(["\n position: absolute;\n left: 0;\n top: 0;\n"], ["\n position: absolute;\n left: 0;\n top: 0;\n"])));
|
|
4539
|
-
var BottomTagContainer$1 = newStyled.div(templateObject_3$
|
|
4539
|
+
var BottomTagContainer$1 = newStyled.div(templateObject_3$l || (templateObject_3$l = __makeTemplateObject(["\n position: absolute;\n bottom: 3.75rem;\n left: 0;\n"], ["\n position: absolute;\n bottom: 3.75rem;\n left: 0;\n"])));
|
|
4540
4540
|
var ImageProductWithTags$1 = function (_a) {
|
|
4541
4541
|
var image = _a.image, DiscountTagElement = _a.DiscountTagElement, BestSellerTagElement = _a.BestSellerTagElement, testId = _a.testId;
|
|
4542
4542
|
return (jsxs$1(Container$z, __assign$1({ "data-testid": testId }, { children: [jsx$1(Image, { src: image.imageUrl, alt: image.alt, objectFit: "cover", objectPosition: "center", width: "530px", height: "720px" }, void 0), jsx$1(TopTagContainer$1, { children: DiscountTagElement }, void 0), jsx$1(BottomTagContainer$1, { children: BestSellerTagElement }, void 0)] }), void 0));
|
|
4543
4543
|
};
|
|
4544
|
-
var templateObject_1$S, templateObject_2$x, templateObject_3$
|
|
4544
|
+
var templateObject_1$S, templateObject_2$x, templateObject_3$l;
|
|
4545
4545
|
|
|
4546
4546
|
var Container$y = newStyled.div(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n display: grid;\n grid-template-columns: auto auto;\n grid-column-gap: 20px;\n max-height: 45rem;\n width: fit-content;\n"], ["\n display: grid;\n grid-template-columns: auto auto;\n grid-column-gap: 20px;\n max-height: 45rem;\n width: fit-content;\n"])));
|
|
4547
4547
|
var ProductGallery = function (_a) {
|
|
@@ -4917,7 +4917,7 @@ var ContentWrapper = newStyled.div(templateObject_2$v || (templateObject_2$v = _
|
|
|
4917
4917
|
var borderColor = _a.borderColor;
|
|
4918
4918
|
return borderColor;
|
|
4919
4919
|
});
|
|
4920
|
-
var TooltipArrowContainer = newStyled.div(templateObject_3$
|
|
4920
|
+
var TooltipArrowContainer = newStyled.div(templateObject_3$k || (templateObject_3$k = __makeTemplateObject(["\n width: 1.25rem;\n height: 0.75rem;\n display: flex;\n transform: rotate(", ");\n padding: ", ";\n margin: ", ";\n"], ["\n width: 1.25rem;\n height: 0.75rem;\n display: flex;\n transform: rotate(", ");\n padding: ", ";\n margin: ", ";\n"])), function (_a) {
|
|
4921
4921
|
var position = _a.position;
|
|
4922
4922
|
return getArrowRotation(position);
|
|
4923
4923
|
}, function (_a) {
|
|
@@ -4937,7 +4937,7 @@ var Title$4 = newStyled.h1(templateObject_6$5 || (templateObject_6$5 = __makeTem
|
|
|
4937
4937
|
return color;
|
|
4938
4938
|
});
|
|
4939
4939
|
var IconContainer$5 = newStyled.div(templateObject_7$3 || (templateObject_7$3 = __makeTemplateObject(["\n width: 1.375rem;\n height: 1.125rem;\n margin-right: 0.563rem;\n"], ["\n width: 1.375rem;\n height: 1.125rem;\n margin-right: 0.563rem;\n"])));
|
|
4940
|
-
var templateObject_1$L, templateObject_2$v, templateObject_3$
|
|
4940
|
+
var templateObject_1$L, templateObject_2$v, templateObject_3$k, templateObject_4$e, templateObject_5$7, templateObject_6$5, templateObject_7$3;
|
|
4941
4941
|
|
|
4942
4942
|
var Tooltip = function (_a) {
|
|
4943
4943
|
var children = _a.children, position = _a.position, text = _a.text, _b = _a.align, align = _b === void 0 ? 'center' : _b, onClick = _a.onClick, header = _a.header;
|
|
@@ -5124,22 +5124,12 @@ var RadioGroupInput = function (_a) {
|
|
|
5124
5124
|
|
|
5125
5125
|
var Wrapper$3 = newStyled.div(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n padding: 0.625rem 1.5rem;\n"], ["\n padding: 0.625rem 1.5rem;\n"])));
|
|
5126
5126
|
var Container$r = newStyled.div(templateObject_2$t || (templateObject_2$t = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n"], ["\n display: flex;\n justify-content: space-between;\n align-items: center;\n"])));
|
|
5127
|
-
var Text$5 = newStyled.h4(templateObject_3$k || (templateObject_3$k = __makeTemplateObject(["\n font-size: 0.875rem;\n line-height: 1.375rem;\n color: ", ";\n font-weight: ", ";\n margin: ", ";\n"], ["\n font-size: 0.875rem;\n line-height: 1.375rem;\n color: ", ";\n font-weight: ", ";\n margin: ", ";\n"])), function (_a) {
|
|
5128
|
-
var color = _a.color;
|
|
5129
|
-
return color;
|
|
5130
|
-
}, function (_a) {
|
|
5131
|
-
var weight = _a.weight;
|
|
5132
|
-
return (weight ? weight : '400');
|
|
5133
|
-
}, function (_a) {
|
|
5134
|
-
var margin = _a.margin;
|
|
5135
|
-
return (margin ? margin : '0');
|
|
5136
|
-
});
|
|
5137
5127
|
var Minimalistic = function (_a) {
|
|
5138
|
-
var _b = _a.backgroundColor, backgroundColor = _b === void 0 ? '#
|
|
5128
|
+
var _b = _a.backgroundColor, backgroundColor = _b === void 0 ? '#FFF6EF' : _b, _c = _a.borderColor, borderColor = _c === void 0 ? '#E7C9B2' : _c, originalPrice = _a.originalPrice, price = _a.price, savingPrice = _a.savingPrice, getMorePayLessText = _a.getMorePayLessText, youAreSavingText = _a.youAreSavingText, getQtyForText = _a.getQtyForText, discount = _a.discount, offText = _a.offText, _d = _a.widthAuto, widthAuto = _d === void 0 ? false : _d;
|
|
5139
5129
|
var theme = useTheme();
|
|
5140
|
-
return (jsx$1(Card$2, __assign$1({ backgroundColor: backgroundColor, widthAuto: widthAuto, border: { borderColor: borderColor, borderWidth: '0.063rem' }, flex: false }, { children: jsxs$1(Wrapper$3, { children: [jsxs$1(Container$r, __assign$1({ "data-testid": "TopSection" }, { children: [jsx$1(Text$5, __assign$1({
|
|
5130
|
+
return (jsx$1(Card$2, __assign$1({ backgroundColor: backgroundColor, widthAuto: widthAuto, border: { borderColor: borderColor, borderWidth: '0.063rem' }, flex: false }, { children: jsxs$1(Wrapper$3, { children: [jsxs$1(Container$r, __assign$1({ "data-testid": "TopSection" }, { children: [jsx$1(Text$5, __assign$1({ variant: "body", weight: "demi", size: "small", style: { margin: '0.1rem 1.25rem 0.1rem 0' } }, { children: getMorePayLessText }), void 0), jsx$1(PriceLabel, { finalPrice: price, originalPrice: originalPrice, color: theme.colors.pallete.secondary.color, size: ComponentSize.Small }, void 0)] }), void 0), jsxs$1(Container$r, __assign$1({ "data-testid": "BottomSection" }, { children: [jsxs$1(Text$5, __assign$1({ variant: "body", weight: "demi", style: { color: '#d3373c', margin: '0.1rem 1.25rem 0.1rem 0' }, size: "small" }, { children: [getQtyForText, " ", discount, "% ", offText.toLocaleUpperCase()] }), void 0), jsxs$1(Text$5, __assign$1({ variant: "body", weight: "regular", size: "small" }, { children: [youAreSavingText, ": ", savingPrice] }), void 0)] }), void 0)] }, void 0) }), void 0));
|
|
5141
5131
|
};
|
|
5142
|
-
var templateObject_1$J, templateObject_2$t
|
|
5132
|
+
var templateObject_1$J, templateObject_2$t;
|
|
5143
5133
|
|
|
5144
5134
|
var Container$q = newStyled.div(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n padding: 0.625rem 1.5rem;\n"], ["\n padding: 0.625rem 1.5rem;\n"])));
|
|
5145
5135
|
var Title$3 = newStyled.h1(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n font-weight: 700;\n font-size: 1rem;\n line-height: 1.25rem;\n color: ", ";\n margin: 0;\n margin-bottom: 0.125rem;\n text-align: center;\n"], ["\n font-weight: 700;\n font-size: 1rem;\n line-height: 1.25rem;\n color: ", ";\n margin: 0;\n margin-bottom: 0.125rem;\n text-align: center;\n"])), function (props) { return props.color; });
|
|
@@ -5318,10 +5308,11 @@ var sliceString = function (str, maxLength) {
|
|
|
5318
5308
|
};
|
|
5319
5309
|
|
|
5320
5310
|
var formatPrice = function (value, _a) {
|
|
5321
|
-
var _b
|
|
5322
|
-
var
|
|
5311
|
+
var _b;
|
|
5312
|
+
var _c = _a === void 0 ? {} : _a, _d = _c.locale, locale = _d === void 0 ? 'en-US' : _d, _e = _c.currency, currency = _e === void 0 ? 'USD' : _e;
|
|
5313
|
+
var _f = value.toFixed(3).split('.'), integer = _f[0], fraction = _f[1];
|
|
5323
5314
|
// this prevents `Intl.NumberFormat` from rounding the number
|
|
5324
|
-
var valueToFormat = parseFloat("".concat(integer, ".").concat(fraction.slice(0, 2)));
|
|
5315
|
+
var valueToFormat = parseFloat("".concat(integer, ".").concat((_b = fraction === null || fraction === void 0 ? void 0 : fraction.slice(0, 2)) !== null && _b !== void 0 ? _b : 0));
|
|
5325
5316
|
return new Intl.NumberFormat(locale, {
|
|
5326
5317
|
style: 'currency',
|
|
5327
5318
|
currency: currency,
|
|
@@ -10466,7 +10457,7 @@ var Description$1 = newStyled.div({
|
|
|
10466
10457
|
var ProductItem = function (_a) {
|
|
10467
10458
|
var src = _a.src, title = _a.title, price = _a.price;
|
|
10468
10459
|
var theme = useTheme();
|
|
10469
|
-
return (jsxs$1(Container$a, __assign$1({ theme: theme }, { children: [jsx$1(Image, { src: src, alt: "", width: "4.063rem", height: "5.375rem" }, void 0), jsxs$1(Description$1, { children: [jsx$1(Text$
|
|
10460
|
+
return (jsxs$1(Container$a, __assign$1({ theme: theme }, { children: [jsx$1(Image, { src: src, alt: "", width: "4.063rem", height: "5.375rem" }, void 0), jsxs$1(Description$1, { children: [jsx$1(Text$5, __assign$1({ variant: "body", weight: "regular", size: "regular" }, { children: title }), void 0), jsx$1(PriceLabel, { finalPrice: price, color: "#C64844", size: ComponentSize.Small }, void 0)] }, void 0)] }), void 0));
|
|
10470
10461
|
};
|
|
10471
10462
|
var templateObject_1$e;
|
|
10472
10463
|
|
|
@@ -10477,7 +10468,7 @@ var Container$9 = newStyled.div({
|
|
|
10477
10468
|
});
|
|
10478
10469
|
var Footer = function (_a) {
|
|
10479
10470
|
var text = _a.text, onClick = _a.onClick;
|
|
10480
|
-
return (jsx$1(Container$9, { children: jsx$1(Text$
|
|
10471
|
+
return (jsx$1(Container$9, { children: jsx$1(Text$5, __assign$1({ variant: "link", size: "regular", underline: true, onClick: onClick }, { children: text }), void 0) }, void 0));
|
|
10481
10472
|
};
|
|
10482
10473
|
|
|
10483
10474
|
var Ul = newStyled.ul({
|
|
@@ -10511,7 +10502,7 @@ var Header = newStyled.div(templateObject_3$5 || (templateObject_3$5 = __makeTem
|
|
|
10511
10502
|
var ResultsPanel = function (_a) {
|
|
10512
10503
|
var options = _a.options, header = _a.header, footer = _a.footer, onClick = _a.onClick, onViewAll = _a.onViewAll, testId = _a.testId;
|
|
10513
10504
|
var theme = useTheme();
|
|
10514
|
-
return (jsxs$1(Container$8, __assign$1({ "data-testid": testId, theme: theme }, { children: [header && (jsx$1(Header, __assign$1({ theme: theme }, { children: jsx$1(Text$
|
|
10505
|
+
return (jsxs$1(Container$8, __assign$1({ "data-testid": testId, theme: theme }, { children: [header && (jsx$1(Header, __assign$1({ theme: theme }, { children: jsx$1(Text$5, __assign$1({ variant: "heading6", weight: "demi" }, { children: header }), void 0) }), void 0)), jsx$1(Ul, { children: options.map(function (item, index) { return (jsx$1(Li, __assign$1({ theme: theme }, { children: jsx$1(Button$2, __assign$1({ onClick: function () { return onClick(item); } }, { children: jsx$1(ProductItem, { src: item.src, title: item.title, price: item.price }, void 0) }), void 0) }), index)); }) }, void 0), footer && jsx$1(Footer, { text: footer, onClick: onViewAll }, void 0)] }), void 0));
|
|
10515
10506
|
};
|
|
10516
10507
|
var templateObject_1$d, templateObject_2$5, templateObject_3$5;
|
|
10517
10508
|
|
|
@@ -15030,9 +15021,9 @@ var PackCard = function (_a) {
|
|
|
15030
15021
|
.then(function (icon) { return setIcon(icon); })
|
|
15031
15022
|
.catch(function (e) { return console.error('Error getting icon', pack.meta.icon, e); });
|
|
15032
15023
|
}, [pack.meta.icon]);
|
|
15033
|
-
return (jsxs$1(Card, __assign$1({ onClick: function () { return onChange(pack); }, role: "radio", "aria-checked": selected, tabIndex: 0, "data-highlight": pack.meta.tag != null, "data-testid": "pack-selector" }, { children: [pack.meta.tag ? (jsx$1(Tag, __assign$1({ "data-testid": "pack-selector-tag" }, { children: jsx$1(Text$
|
|
15024
|
+
return (jsxs$1(Card, __assign$1({ onClick: function () { return onChange(pack); }, role: "radio", "aria-checked": selected, tabIndex: 0, "data-highlight": pack.meta.tag != null, "data-testid": "pack-selector" }, { children: [pack.meta.tag ? (jsx$1(Tag, __assign$1({ "data-testid": "pack-selector-tag" }, { children: jsx$1(Text$5, __assign$1({ variant: "tag", weight: "bold", size: "small" }, { children: pack.meta.tag.toUpperCase() }), void 0) }), void 0)) : null, jsxs$1(Label, { children: [jsx$1(Text$5, __assign$1({ variant: "body", weight: selected || pack.meta.tag ? 'bold' : 'regular' }, { children: pack.label }), void 0), jsx$1(Check, __assign$1({ "data-visible": selected, "data-testid": "pack-selector-check" }, { children: jsx$1(Icon.Actions.Check, { width: 0.7, fill: "var(--background)" }, void 0) }), void 0)] }, void 0), jsxs$1(Text$5, __assign$1({ variant: "body", size: "small" }, { children: ["Save ", pack.meta.discountPercentage, "%"] }), void 0), jsx$1(Spacing, { type: "block", size: 12 }, void 0), jsx$1(IconContainer, { children: icon ? HTMLReactParser$1(icon) : jsx$1(IconPlaceholder, {}, void 0) }, void 0), jsx$1(Spacing, { type: "block", size: 12 }, void 0), jsxs$1(Text$5, __assign$1({ variant: "body", size: "small", "data-testid": "pack-selector-prices" }, { children: [jsx$1("del", { children: formatPrice(pack.meta.originalPrice) }, void 0), " - ", formatPrice(pack.meta.price)] }), void 0), jsxs$1(Text$5, __assign$1({ variant: "body", weight: "bold", size: "small" }, { children: [formatPrice(pack.meta.price / pack.meta.quantity), " each"] }), void 0)] }), void 0));
|
|
15034
15025
|
};
|
|
15035
15026
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;
|
|
15036
15027
|
|
|
15037
|
-
export { Accordion, AmazonButton, AssetsProvider, Bundle, ButtonPrimary, ButtonSecondary, ButtonSecondaryOutline, Card$2 as Card, CardSectionType, CartProductItem, CategoryTag, Checkbox, Collection, ComponentPosition, ComponentSize, index as CrossSell, DeliveryDetails, DiscountTag, Drawer, DropdownListIcons, FilteringDropdown, Tags as FilteringTags, FitPredictor, Icon, IconButton, Image, Input$1 as Input, InputValidationType, Modal, MultiColorPicker, OfferBanner, OrderBar, Overlay, PackSelector, Pagination, PaymentMethod, PaypalButton, Portal, PriceLabel, ProductGallery, ProductGalleryMobile, ProgressBar, QuantityPicker, RadioGroupInput, RadioInput, Rating, Review, ScrollToTop, SearchBar, SeasonOfferTag, SimpleDropdown, SimpleOrderItem, SingleColorPicker, SizeFitGuide, SizeSelector, SizeTable, SliderNavigation, Spacing, Spinner, StarList, Text$
|
|
15028
|
+
export { Accordion, AmazonButton, AssetsProvider, Bundle, ButtonPrimary, ButtonSecondary, ButtonSecondaryOutline, Card$2 as Card, CardSectionType, CartProductItem, CategoryTag, Checkbox, Collection, ComponentPosition, ComponentSize, index as CrossSell, DeliveryDetails, DiscountTag, Drawer, DropdownListIcons, FilteringDropdown, Tags as FilteringTags, FitPredictor, Icon, IconButton, Image, Input$1 as Input, InputValidationType, Modal, MultiColorPicker, OfferBanner, OrderBar, Overlay, PackSelector, Pagination, PaymentMethod, PaypalButton, Portal, PriceLabel, ProductGallery, ProductGalleryMobile, ProgressBar, QuantityPicker, RadioGroupInput, RadioInput, Rating, Review, ScrollToTop, SearchBar, SeasonOfferTag, SimpleDropdown, SimpleOrderItem, SingleColorPicker, SizeFitGuide, SizeSelector, SizeTable, SliderNavigation, Spacing, Spinner, StarList, Text$5 as Text, TextButton, ThemeProvider, ThemeVariables, Timer, Tooltip, Totals, decimalFormat, formatPrice, isEmail, isEmpty, isNumber$1 as isNumber, isPhoneNumber, isValidDate, modalEvent, simulateMouseClick, sliceString, useModalEvent, useOnClickOutside, useTheme, useThemeAssets, useWindowDimensions };
|
|
15038
15029
|
//# sourceMappingURL=index.esm.js.map
|