@trafilea/afrodita-components 5.0.0-beta.18 → 5.0.0-beta.19

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 (6) hide show
  1. package/build/index.d.ts +15 -8
  2. package/build/index.esm.js +31 -23
  3. package/build/index.esm.js.map +1 -1
  4. package/build/index.js +31 -23
  5. package/build/index.js.map +1 -1
  6. package/package.json +1 -1
package/build/index.d.ts CHANGED
@@ -33,6 +33,7 @@ interface IconProps {
33
33
  height?: number;
34
34
  fill?: string;
35
35
  title?: string;
36
+ testId?: string;
36
37
  }
37
38
  declare type ButtonType = 'button' | 'submit' | 'reset';
38
39
  interface CTAProps {
@@ -191,9 +192,9 @@ declare namespace Other {
191
192
 
192
193
  declare const ChevronDown: ({ height, width, fill }: IconProps) => JSX.Element;
193
194
 
194
- declare const ChevronLeft: ({ height, width, fill, opacity }: IconWithOpacityProps) => JSX.Element;
195
+ declare const ChevronLeft: ({ height, width, fill, opacity, testId }: IconWithOpacityProps) => JSX.Element;
195
196
 
196
- declare const ChevronRight: ({ height, width, fill, opacity }: IconWithOpacityProps) => JSX.Element;
197
+ declare const ChevronRight: ({ height, width, fill, opacity, testId }: IconWithOpacityProps) => JSX.Element;
197
198
 
198
199
  declare const ChevronRightVariant: ({ height, width, fill }: IconProps) => JSX.Element;
199
200
 
@@ -342,7 +343,7 @@ interface IconWrapperProps {
342
343
  viewBoxX: number;
343
344
  viewBoxY: number;
344
345
  children: React.ReactNode;
345
- testid?: string;
346
+ testId?: string;
346
347
  fill?: string;
347
348
  }
348
349
 
@@ -425,7 +426,7 @@ declare namespace Emoji {
425
426
  };
426
427
  }
427
428
 
428
- declare type IconType = ({ height, width, fill }: IconProps) => JSX.Element;
429
+ declare type IconType = ({ height, width, fill, testId }: IconProps) => JSX.Element;
429
430
  declare const Icon: {
430
431
  Custom: typeof Custom;
431
432
  Arrows: typeof Arrows;
@@ -554,8 +555,9 @@ interface PriceLabelProps {
554
555
  color?: string;
555
556
  size?: ComponentSize.Small | ComponentSize.Medium | ComponentSize.Large;
556
557
  discount?: DiscountTagProps;
558
+ testId?: string;
557
559
  }
558
- declare const PriceLabel: ({ finalPrice, originalPrice, discount, color, size, }: PriceLabelProps) => JSX.Element;
560
+ declare const PriceLabel: ({ finalPrice, originalPrice, discount, color, testId, size, }: PriceLabelProps) => JSX.Element;
559
561
 
560
562
  interface ColorPickerProps {
561
563
  options: ColorPickerOption[];
@@ -1105,10 +1107,11 @@ interface MinimalisticProps {
1105
1107
  discount: number;
1106
1108
  offText: string;
1107
1109
  widthAuto?: boolean;
1110
+ testId?: string;
1108
1111
  }
1109
1112
 
1110
1113
  declare const Bundle: {
1111
- Minimalistic: ({ backgroundColor, borderColor, originalPrice, price, savingPrice, getMorePayLessText, youAreSavingText, getQtyForText, discount, offText, widthAuto, }: MinimalisticProps) => JSX.Element;
1114
+ Minimalistic: ({ backgroundColor, borderColor, originalPrice, price, savingPrice, getMorePayLessText, youAreSavingText, getQtyForText, discount, offText, widthAuto, testId, }: MinimalisticProps) => JSX.Element;
1112
1115
  Simple: ({ title, freeShippingText, price, anyQtyForText, backgroundColor, widthAuto, }: SimpleProps) => JSX.Element;
1113
1116
  };
1114
1117
 
@@ -1181,6 +1184,7 @@ interface BaseCTAProps {
1181
1184
  size?: ComponentSize;
1182
1185
  text: string;
1183
1186
  type?: ButtonType;
1187
+ inline?: boolean;
1184
1188
  testId?: string;
1185
1189
  }
1186
1190
 
@@ -1571,6 +1575,7 @@ declare type TextTagProps = {
1571
1575
  declare type TextProps = AriaAttributes & {
1572
1576
  style?: CSSProperties;
1573
1577
  className?: string;
1578
+ testId?: string;
1574
1579
  } & (TextHeroProps | TextDisplayProps | TextHeadingProps | TextBodyProps | TextLinkProps | TextButtonProps | TextPricingProps | TextLabelProps | TextTagProps);
1575
1580
 
1576
1581
  interface SearchBarProps {
@@ -1670,8 +1675,9 @@ declare type QuantityPickerPropsUncontrolled = {
1670
1675
  declare type QuantityPickerProps = {
1671
1676
  initialValue?: number;
1672
1677
  maxValue?: number;
1678
+ testId?: string;
1673
1679
  } & (QuantityPickerPropsControlled | QuantityPickerPropsUncontrolled);
1674
- declare const QuantityPicker: ({ initialValue, maxValue, value, onChange, }: QuantityPickerProps) => JSX.Element;
1680
+ declare const QuantityPicker: ({ initialValue, maxValue, value, testId, onChange, }: QuantityPickerProps) => JSX.Element;
1675
1681
 
1676
1682
  declare type SpacingProps = {
1677
1683
  size: number;
@@ -1710,8 +1716,9 @@ interface FiltersProps {
1710
1716
  applyText: string;
1711
1717
  mobileBackArrowClick: () => void;
1712
1718
  mobileApplyButtonClick: () => void;
1719
+ onResetValues: () => void;
1713
1720
  }
1714
- declare const Filters: ({ filters, onChange, tagsColor, filterByText, clearAllText, isMobile, filtersSelectText, applyText, mobileApplyButtonClick, mobileBackArrowClick, }: FiltersProps) => JSX.Element;
1721
+ declare const Filters: ({ filters, onChange, tagsColor, filterByText, clearAllText, isMobile, filtersSelectText, applyText, mobileApplyButtonClick, mobileBackArrowClick, onResetValues, }: FiltersProps) => JSX.Element;
1715
1722
 
1716
1723
  interface SearchNavigationProps {
1717
1724
  returnText?: string;
package/build/index.esm.js CHANGED
@@ -57,8 +57,8 @@ function __makeTemplateObject(cooked, raw) {
57
57
  }
58
58
 
59
59
  var IconWrapper = function (_a) {
60
- var height = _a.height, _b = _a.width, width = _b === void 0 ? 1 : _b, title = _a.title, viewBoxX = _a.viewBoxX, viewBoxY = _a.viewBoxY, children = _a.children, testid = _a.testid, fill = _a.fill;
61
- return (jsxs$1("svg", __assign$1({ style: { display: 'inline-block', verticalAlign: 'middle' }, width: width ? "".concat(width, "rem") : '100%', height: height ? "".concat(height, "rem") : width ? "".concat(width, "rem") : '100%', viewBox: "0 0 ".concat(viewBoxX, " ").concat(viewBoxY), xmlns: "http://www.w3.org/2000/svg", "data-testid": testid ? testid : 'IconWrapper', fill: fill }, { children: [jsxs$1("title", { children: [title, " icon"] }, void 0), children] }), void 0));
60
+ var height = _a.height, _b = _a.width, width = _b === void 0 ? 1 : _b, title = _a.title, viewBoxX = _a.viewBoxX, viewBoxY = _a.viewBoxY, children = _a.children, testId = _a.testId, fill = _a.fill;
61
+ return (jsxs$1("svg", __assign$1({ style: { display: 'inline-block', verticalAlign: 'middle' }, width: width ? "".concat(width, "rem") : '100%', height: height ? "".concat(height, "rem") : width ? "".concat(width, "rem") : '100%', viewBox: "0 0 ".concat(viewBoxX, " ").concat(viewBoxY), xmlns: "http://www.w3.org/2000/svg", "data-testid": testId ? testId : 'IconWrapper', fill: fill }, { children: [jsxs$1("title", { children: [title, " icon"] }, void 0), children] }), void 0));
62
62
  };
63
63
 
64
64
  var SixtyDaysGuarantee = function (_a) {
@@ -94,7 +94,7 @@ var LightExclamation = function (_a) {
94
94
 
95
95
  var LightCheck = function (_a) {
96
96
  var height = _a.height, width = _a.width, fill = _a.fill, _b = _a.strokeWidth, strokeWidth = _b === void 0 ? 5 : _b;
97
- return (jsxs$1(IconWrapper, __assign$1({ width: width, height: height, viewBoxX: 110, viewBoxY: 110, title: "check", fill: "none", testid: "LightCheck" }, { children: [jsx$1("circle", { cx: "54.9999", cy: "55", r: "47.9167", stroke: fill, strokeWidth: strokeWidth }, void 0), jsx$1("path", { d: "M72.2976 42.0884L46.957 67.5762L37.9226 58.186C36.6005 57.0681 34.397 57.0681 33.0748 58.186C31.7527 59.3039 31.7527 61.5396 33.0748 62.8811L44.7535 74.7307C45.4146 75.4014 46.296 75.625 47.1774 75.625C48.0588 75.625 48.9402 75.4014 49.3809 74.7307L76.925 46.7835C78.2471 45.4421 78.2471 43.4299 76.925 42.0884C75.6029 40.9705 73.6197 40.9705 72.2976 42.0884Z", fill: fill }, void 0)] }), void 0));
97
+ return (jsxs$1(IconWrapper, __assign$1({ width: width, height: height, viewBoxX: 110, viewBoxY: 110, title: "check", fill: "none", testId: "LightCheck" }, { children: [jsx$1("circle", { cx: "54.9999", cy: "55", r: "47.9167", stroke: fill, strokeWidth: strokeWidth }, void 0), jsx$1("path", { d: "M72.2976 42.0884L46.957 67.5762L37.9226 58.186C36.6005 57.0681 34.397 57.0681 33.0748 58.186C31.7527 59.3039 31.7527 61.5396 33.0748 62.8811L44.7535 74.7307C45.4146 75.4014 46.296 75.625 47.1774 75.625C48.0588 75.625 48.9402 75.4014 49.3809 74.7307L76.925 46.7835C78.2471 45.4421 78.2471 43.4299 76.925 42.0884C75.6029 40.9705 73.6197 40.9705 72.2976 42.0884Z", fill: fill }, void 0)] }), void 0));
98
98
  };
99
99
 
100
100
  var Question = function (_a) {
@@ -130,7 +130,7 @@ var FitPredictor$1 = function (_a) {
130
130
 
131
131
  var Loading = function (_a) {
132
132
  var height = _a.height, width = _a.width, fill = _a.fill, backgroundColor = _a.backgroundColor;
133
- return (jsxs$1(IconWrapper, __assign$1({ width: width, height: height, viewBoxX: 100, viewBoxY: 100, title: "loading", testid: "Loading" }, { children: [jsx$1("mask", __assign$1({ id: "loading-mask0", "mask-type": "alpha", maskUnits: "userSpaceOnUse", x: "0", y: "0", width: "100", height: "100" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M50 100C77.6142 100 100 77.6142 100 50C100 22.3858 77.6142 0 50 0C22.3858 0 0 22.3858 0 50C0 77.6142 22.3858 100 50 100ZM50 95C74.8528 95 95 74.8528 95 50C95 25.1472 74.8528 5 50 5C25.1472 5 5 25.1472 5 50C5 74.8528 25.1472 95 50 95Z" }, void 0) }), void 0), jsxs$1("g", __assign$1({ mask: "url(#loading-mask0)" }, { children: [jsx$1("rect", { width: "100", height: "100", fill: backgroundColor }, void 0), jsx$1("rect", { x: "50", width: "50", height: "50", fill: fill }, void 0)] }), void 0)] }), void 0));
133
+ return (jsxs$1(IconWrapper, __assign$1({ width: width, height: height, viewBoxX: 100, viewBoxY: 100, title: "loading", testId: "Loading" }, { children: [jsx$1("mask", __assign$1({ id: "loading-mask0", "mask-type": "alpha", maskUnits: "userSpaceOnUse", x: "0", y: "0", width: "100", height: "100" }, { children: jsx$1("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M50 100C77.6142 100 100 77.6142 100 50C100 22.3858 77.6142 0 50 0C22.3858 0 0 22.3858 0 50C0 77.6142 22.3858 100 50 100ZM50 95C74.8528 95 95 74.8528 95 50C95 25.1472 74.8528 5 50 5C25.1472 5 5 25.1472 5 50C5 74.8528 25.1472 95 50 95Z" }, void 0) }), void 0), jsxs$1("g", __assign$1({ mask: "url(#loading-mask0)" }, { children: [jsx$1("rect", { width: "100", height: "100", fill: backgroundColor }, void 0), jsx$1("rect", { x: "50", width: "50", height: "50", fill: fill }, void 0)] }), void 0)] }), void 0));
134
134
  };
135
135
 
136
136
  var Shapermint = function (_a) {
@@ -157,13 +157,13 @@ var ChevronDown = function (_a) {
157
157
  };
158
158
 
159
159
  var ChevronLeft = function (_a) {
160
- var height = _a.height, width = _a.width, fill = _a.fill, opacity = _a.opacity;
161
- return (jsx$1(IconWrapper, __assign$1({ width: width, height: height, viewBoxX: 20, viewBoxY: 34, title: "chevron left" }, { children: jsx$1("g", __assign$1({ opacity: opacity }, { children: jsx$1("path", { d: "M15.8577 33.3343C16.7726 34.2219 18.2973 34.2219 19.2122 33.3343C20.1271 32.4467 20.1271 30.9674 19.2122 30.0798C15.5527 26.5294 11.8933 23.0776 8.2338 19.5272C8.2338 19.4286 5.79416 17.2589 5.79416 17.1603C5.79416 17.0616 8.33545 14.7933 8.33545 14.6947C11.9949 11.1443 15.6544 7.59391 19.3139 3.94489C20.2287 3.05729 20.2287 1.57795 19.3139 0.690353C18.8056 0.197243 18.1957 0 17.5858 0C16.9759 0 16.3659 0.197243 15.8577 0.690353L0.711563 15.3851C0.304956 15.7795 0 16.3713 0 17.0616C0 17.6534 0.304956 18.2451 0.711563 18.7382L15.8577 33.3343Z", fill: fill }, void 0) }), void 0) }), void 0));
160
+ var height = _a.height, width = _a.width, fill = _a.fill, opacity = _a.opacity, testId = _a.testId;
161
+ return (jsx$1(IconWrapper, __assign$1({ width: width, height: height, viewBoxX: 20, viewBoxY: 34, title: "chevron left", testId: testId }, { children: jsx$1("g", __assign$1({ opacity: opacity }, { children: jsx$1("path", { d: "M15.8577 33.3343C16.7726 34.2219 18.2973 34.2219 19.2122 33.3343C20.1271 32.4467 20.1271 30.9674 19.2122 30.0798C15.5527 26.5294 11.8933 23.0776 8.2338 19.5272C8.2338 19.4286 5.79416 17.2589 5.79416 17.1603C5.79416 17.0616 8.33545 14.7933 8.33545 14.6947C11.9949 11.1443 15.6544 7.59391 19.3139 3.94489C20.2287 3.05729 20.2287 1.57795 19.3139 0.690353C18.8056 0.197243 18.1957 0 17.5858 0C16.9759 0 16.3659 0.197243 15.8577 0.690353L0.711563 15.3851C0.304956 15.7795 0 16.3713 0 17.0616C0 17.6534 0.304956 18.2451 0.711563 18.7382L15.8577 33.3343Z", fill: fill }, void 0) }), void 0) }), void 0));
162
162
  };
163
163
 
164
164
  var ChevronRight = function (_a) {
165
- var height = _a.height, width = _a.width, fill = _a.fill, opacity = _a.opacity;
166
- return (jsx$1(IconWrapper, __assign$1({ width: width, height: height, viewBoxX: 20, viewBoxY: 34, title: "chevron right" }, { children: jsx$1("g", __assign$1({ opacity: opacity }, { children: jsx$1("path", { d: "M4.14231 0.6657C3.22745 -0.2219 1.70267 -0.2219 0.787802 0.6657C-0.127065 1.5533 -0.127065 3.03263 0.787802 3.92023C4.44727 7.47063 8.10673 10.9224 11.7662 14.4728C11.7662 14.5714 14.2058 16.7411 14.2058 16.8397C14.2058 16.9384 11.6645 19.2067 11.6645 19.3053C8.00508 22.8557 4.34562 26.4061 0.68615 30.0551C-0.228717 30.9427 -0.228717 32.422 0.68615 33.3096C1.19441 33.8028 1.80432 34 2.41423 34C3.02414 34 3.63405 33.8028 4.14231 33.3096L19.2884 18.6149C19.695 18.2205 20 17.6287 20 16.9384C20 16.3466 19.695 15.7549 19.2884 15.2618L4.14231 0.6657Z", fill: fill }, void 0) }), void 0) }), void 0));
165
+ var height = _a.height, width = _a.width, fill = _a.fill, opacity = _a.opacity, testId = _a.testId;
166
+ return (jsx$1(IconWrapper, __assign$1({ width: width, height: height, viewBoxX: 20, viewBoxY: 34, title: "chevron right", testId: testId }, { children: jsx$1("g", __assign$1({ opacity: opacity }, { children: jsx$1("path", { d: "M4.14231 0.6657C3.22745 -0.2219 1.70267 -0.2219 0.787802 0.6657C-0.127065 1.5533 -0.127065 3.03263 0.787802 3.92023C4.44727 7.47063 8.10673 10.9224 11.7662 14.4728C11.7662 14.5714 14.2058 16.7411 14.2058 16.8397C14.2058 16.9384 11.6645 19.2067 11.6645 19.3053C8.00508 22.8557 4.34562 26.4061 0.68615 30.0551C-0.228717 30.9427 -0.228717 32.422 0.68615 33.3096C1.19441 33.8028 1.80432 34 2.41423 34C3.02414 34 3.63405 33.8028 4.14231 33.3096L19.2884 18.6149C19.695 18.2205 20 17.6287 20 16.9384C20 16.3466 19.695 15.7549 19.2884 15.2618L4.14231 0.6657Z", fill: fill }, void 0) }), void 0) }), void 0));
167
167
  };
168
168
 
169
169
  var ChevronRightVariant = function (_a) {
@@ -224,17 +224,17 @@ var Rule = function (_a) {
224
224
 
225
225
  var Star = function (_a) {
226
226
  var height = _a.height, width = _a.width, fill = _a.fill;
227
- return (jsx$1(IconWrapper, __assign$1({ width: width, height: height, viewBoxX: 38, viewBoxY: 36, title: "Star", testid: "star" }, { children: jsx$1("path", { d: "M16.9615 1.2523L12.3234 10.5605L1.9462 12.058C0.0852673 12.3251 -0.660526 14.596 0.689004 15.8966L8.19665 23.1379L6.42096 33.3671C6.10133 35.2161 8.0688 36.6011 9.71665 35.7363L19 30.9064L28.2833 35.7363C29.9312 36.594 31.8987 35.2161 31.579 33.3671L29.8033 23.1379L37.311 15.8966C38.6605 14.596 37.9147 12.3251 36.0538 12.058L25.6766 10.5605L21.0385 1.2523C20.2075 -0.406871 17.7996 -0.427962 16.9615 1.2523Z", fill: fill }, void 0) }), void 0));
227
+ return (jsx$1(IconWrapper, __assign$1({ width: width, height: height, viewBoxX: 38, viewBoxY: 36, title: "Star", testId: "star" }, { children: jsx$1("path", { d: "M16.9615 1.2523L12.3234 10.5605L1.9462 12.058C0.0852673 12.3251 -0.660526 14.596 0.689004 15.8966L8.19665 23.1379L6.42096 33.3671C6.10133 35.2161 8.0688 36.6011 9.71665 35.7363L19 30.9064L28.2833 35.7363C29.9312 36.594 31.8987 35.2161 31.579 33.3671L29.8033 23.1379L37.311 15.8966C38.6605 14.596 37.9147 12.3251 36.0538 12.058L25.6766 10.5605L21.0385 1.2523C20.2075 -0.406871 17.7996 -0.427962 16.9615 1.2523Z", fill: fill }, void 0) }), void 0));
228
228
  };
229
229
 
230
230
  var StarEmpty = function (_a) {
231
231
  var height = _a.height, width = _a.width, fill = _a.fill;
232
- return (jsx$1(IconWrapper, __assign$1({ width: width, height: height, viewBoxX: 38, viewBoxY: 36, title: "Star empty", testid: "star-empty" }, { children: jsx$1("path", { d: "M36.0538 12.058L25.6766 10.5605L21.0385 1.2523C20.2075 -0.406871 17.7996 -0.427962 16.9615 1.2523L12.3234 10.5605L1.9462 12.058C0.0852673 12.3251 -0.660526 14.596 0.689004 15.8966L8.19665 23.1379L6.42096 33.3671C6.10133 35.2161 8.0688 36.6011 9.71665 35.7363L19 30.9064L28.2833 35.7363C29.9312 36.594 31.8987 35.2161 31.579 33.3671L29.8033 23.1379L37.311 15.8966C38.6605 14.596 37.9147 12.3251 36.0538 12.058ZM26.1454 21.9568L27.8288 31.6868L19 27.096L10.1712 31.6868L11.8546 21.9568L4.70918 15.067L14.5821 13.6469L19 4.78858L23.4179 13.6469L33.2908 15.067L26.1454 21.9568Z", fill: fill }, void 0) }), void 0));
232
+ return (jsx$1(IconWrapper, __assign$1({ width: width, height: height, viewBoxX: 38, viewBoxY: 36, title: "Star empty", testId: "star-empty" }, { children: jsx$1("path", { d: "M36.0538 12.058L25.6766 10.5605L21.0385 1.2523C20.2075 -0.406871 17.7996 -0.427962 16.9615 1.2523L12.3234 10.5605L1.9462 12.058C0.0852673 12.3251 -0.660526 14.596 0.689004 15.8966L8.19665 23.1379L6.42096 33.3671C6.10133 35.2161 8.0688 36.6011 9.71665 35.7363L19 30.9064L28.2833 35.7363C29.9312 36.594 31.8987 35.2161 31.579 33.3671L29.8033 23.1379L37.311 15.8966C38.6605 14.596 37.9147 12.3251 36.0538 12.058ZM26.1454 21.9568L27.8288 31.6868L19 27.096L10.1712 31.6868L11.8546 21.9568L4.70918 15.067L14.5821 13.6469L19 4.78858L23.4179 13.6469L33.2908 15.067L26.1454 21.9568Z", fill: fill }, void 0) }), void 0));
233
233
  };
234
234
 
235
235
  var StarHalf = function (_a) {
236
236
  var height = _a.height, width = _a.width, fill = _a.fill;
237
- return (jsx$1(IconWrapper, __assign$1({ width: width, height: height, viewBoxX: 38, viewBoxY: 36, title: "Star half", testid: "star-half" }, { children: jsx$1("path", { d: "M36.0538 12.0593L25.677 10.5609L21.0397 1.25227C20.6229 0.420469 19.8097 0 18.9966 0C18.1884 0 17.3809 0.414844 16.9626 1.25227L12.3239 10.5602L1.94638 12.0572C0.0853893 12.3244 -0.660423 14.5948 0.688703 15.8955L8.19574 23.1377L6.41912 33.3668C6.16674 34.8279 7.34288 36 8.6601 36C9.00961 36 9.36905 35.9177 9.71431 35.7363L18.998 30.9073L28.2809 35.7377C28.6255 35.917 28.9842 35.9986 29.3323 35.9986C30.6509 35.9986 31.8292 34.8307 31.5768 33.3689L29.8023 23.1391L37.3108 15.8984C38.6606 14.5976 37.9148 12.3265 36.0538 12.0593ZM27.4231 20.7218L26.1385 21.9607L26.4419 23.7101L27.8258 31.687L20.5853 27.919L18.9987 27.0935L19.0008 4.79109L22.6186 12.0537L23.4112 13.6448L25.1842 13.9008L33.2825 15.0701L27.4231 20.7218Z", fill: fill }, void 0) }), void 0));
237
+ return (jsx$1(IconWrapper, __assign$1({ width: width, height: height, viewBoxX: 38, viewBoxY: 36, title: "Star half", testId: "star-half" }, { children: jsx$1("path", { d: "M36.0538 12.0593L25.677 10.5609L21.0397 1.25227C20.6229 0.420469 19.8097 0 18.9966 0C18.1884 0 17.3809 0.414844 16.9626 1.25227L12.3239 10.5602L1.94638 12.0572C0.0853893 12.3244 -0.660423 14.5948 0.688703 15.8955L8.19574 23.1377L6.41912 33.3668C6.16674 34.8279 7.34288 36 8.6601 36C9.00961 36 9.36905 35.9177 9.71431 35.7363L18.998 30.9073L28.2809 35.7377C28.6255 35.917 28.9842 35.9986 29.3323 35.9986C30.6509 35.9986 31.8292 34.8307 31.5768 33.3689L29.8023 23.1391L37.3108 15.8984C38.6606 14.5976 37.9148 12.3265 36.0538 12.0593ZM27.4231 20.7218L26.1385 21.9607L26.4419 23.7101L27.8258 31.687L20.5853 27.919L18.9987 27.0935L19.0008 4.79109L22.6186 12.0537L23.4112 13.6448L25.1842 13.9008L33.2825 15.0701L27.4231 20.7218Z", fill: fill }, void 0) }), void 0));
238
238
  };
239
239
 
240
240
  var Stopwatch = function (_a) {
@@ -439,7 +439,7 @@ var Payment = /*#__PURE__*/Object.freeze({
439
439
 
440
440
  var SlideDot = function (_a) {
441
441
  var height = _a.height, width = _a.width, fill = _a.fill, opacity = _a.opacity, testId = _a.testId;
442
- return (jsx$1(IconWrapper, __assign$1({ width: width, height: height, viewBoxX: 16, viewBoxY: 16, title: "Slide dot", testid: testId, fill: "none" }, { children: jsx$1("g", __assign$1({ opacity: opacity }, { children: jsx$1("circle", { cx: "8", cy: "8", r: "7.5", stroke: "#292929", fill: fill }, void 0) }), void 0) }), void 0));
442
+ return (jsx$1(IconWrapper, __assign$1({ width: width, height: height, viewBoxX: 16, viewBoxY: 16, title: "Slide dot", testId: testId, fill: "none" }, { children: jsx$1("g", __assign$1({ opacity: opacity }, { children: jsx$1("circle", { cx: "8", cy: "8", r: "7.5", stroke: "#292929", fill: fill }, void 0) }), void 0) }), void 0));
443
443
  };
444
444
 
445
445
  var SlideDots$1 = /*#__PURE__*/Object.freeze({
@@ -4082,7 +4082,7 @@ var TAGS = {
4082
4082
  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' : ''); }),
4083
4083
  };
4084
4084
  var Text$5 = function (_a) {
4085
- var variant = _a.variant, children = _a.children, allProps = __rest(_a, ["variant", "children"]);
4085
+ var variant = _a.variant, children = _a.children, testId = _a.testId, allProps = __rest(_a, ["variant", "children", "testId"]);
4086
4086
  var theme = useTheme();
4087
4087
  var Tag = useMemo(function () { return TAGS[variant] || 'p'; }, [variant]);
4088
4088
  var _b = useMemo(function () {
@@ -4126,7 +4126,7 @@ var Text$5 = function (_a) {
4126
4126
  }
4127
4127
  return propsHref;
4128
4128
  }, [props.disabled, propsHref]);
4129
- return (jsx(Tag, __assign$1({}, props, { css: commonCSS, href: href }, { children: children }), void 0));
4129
+ return (jsx(Tag, __assign$1({}, props, { css: commonCSS, href: href, "data-testid": testId }, { children: children }), void 0));
4130
4130
  };
4131
4131
  var DEFAULTS = {
4132
4132
  heading1: {
@@ -4381,10 +4381,17 @@ var TagContainer = newStyled.h1(templateObject_3$q || (templateObject_3$q = __ma
4381
4381
  var size = _a.size;
4382
4382
  return (_b = getStylesBySize$5(size)) === null || _b === void 0 ? void 0 : _b.margin;
4383
4383
  });
4384
+ function getTestId() {
4385
+ var args = [];
4386
+ for (var _i = 0; _i < arguments.length; _i++) {
4387
+ args[_i] = arguments[_i];
4388
+ }
4389
+ return args.filter(Boolean).join('-');
4390
+ }
4384
4391
  var PriceLabel = function (_a) {
4385
- var finalPrice = _a.finalPrice, originalPrice = _a.originalPrice, discount = _a.discount, color = _a.color, _b = _a.size, size = _b === void 0 ? ComponentSize.Medium : _b;
4392
+ var finalPrice = _a.finalPrice, originalPrice = _a.originalPrice, discount = _a.discount, color = _a.color, testId = _a.testId, _b = _a.size, size = _b === void 0 ? ComponentSize.Medium : _b;
4386
4393
  var theme = useTheme();
4387
- return (jsxs$1(Container$D, { 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));
4394
+ return (jsxs$1(Container$D, { children: [jsx$1(Price, __assign$1({ size: size, color: color || theme.colors.pallete.secondary.color, weight: 700, "data-testid": getTestId(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": getTestId(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));
4388
4395
  };
4389
4396
  var templateObject_1$$, templateObject_2$E, templateObject_3$q;
4390
4397
 
@@ -5137,9 +5144,9 @@ var RadioGroupInput = function (_a) {
5137
5144
  var Wrapper$3 = newStyled.div(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n padding: 0.625rem 1.5rem;\n"], ["\n padding: 0.625rem 1.5rem;\n"])));
5138
5145
  var Container$s = newStyled.div(templateObject_2$w || (templateObject_2$w = __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"])));
5139
5146
  var Minimalistic = function (_a) {
5140
- 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;
5147
+ 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, _e = _a.testId, testId = _e === void 0 ? 'minimalistic' : _e;
5141
5148
  var theme = useTheme();
5142
- 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$s, __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$s, __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));
5149
+ 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$s, __assign$1({ "data-testid": "".concat(testId, "-section") }, { 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, testId: testId }, void 0)] }), void 0), jsxs$1(Container$s, __assign$1({ "data-testid": "".concat(testId, "-section-bottom") }, { 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));
5143
5150
  };
5144
5151
  var templateObject_1$M, templateObject_2$w;
5145
5152
 
@@ -10253,7 +10260,7 @@ var ProductItemMobile = function (_a) {
10253
10260
  _a[ComponentSize.Small] = 2,
10254
10261
  _a)[size];
10255
10262
  }, [size]);
10256
- return (jsxs(Container$f, __assign$1({ as: url ? 'a' : 'div', href: url, className: className }, { children: [tags ? (jsxs(ImageContainer, __assign$1({ width: styles === null || styles === void 0 ? void 0 : styles.width, height: styles === null || styles === void 0 ? void 0 : styles.height, "data-testid": "tags-image-container" }, { children: [jsx(Image, { src: image.src, alt: image.alt, width: "100%", height: "100%" }, void 0), jsx(SeasonOfferTag, { text: tags.seasonOfferTagText, size: ComponentSize.Small, css: { position: 'absolute', top: 0, left: 0 } }, void 0), jsx(CategoryTag, { text: tags.categoryTagText, size: ComponentSize.Small, css: { position: 'absolute', bottom: '1rem', left: 0 } }, void 0)] }), void 0)) : (jsx(Image, { src: image.src, alt: image.alt, width: styles === null || styles === void 0 ? void 0 : styles.width, height: styles === null || styles === void 0 ? void 0 : styles.height }, void 0)), jsx(Spacing, { size: space }, void 0), jsx(H1, __assign$1({ theme: theme, align: alignName }, { children: title }), void 0), jsx(Spacing, { size: space }, void 0), jsx(PriceLabel, { finalPrice: price.finalPrice, originalPrice: price.originalPrice, color: price.color, size: ComponentSize.Small }, void 0), jsx(Spacing, { size: space }, void 0), jsx(Rating, { size: size === ComponentSize.Large ? ComponentSize.Small : ComponentSize.XSmall, rating: rating.rating, reviews: rating.reviews, reviewsText: "", wrapWithParenthesis: true }, void 0)] }), void 0));
10263
+ return (jsxs(Container$f, __assign$1({ as: url ? 'a' : 'div', href: url, className: className }, { children: [tags ? (jsxs(ImageContainer, __assign$1({ width: styles === null || styles === void 0 ? void 0 : styles.width, height: styles === null || styles === void 0 ? void 0 : styles.height, "data-testid": "tags-image-container" }, { children: [jsx(Image, { src: image.src, alt: image.alt, width: "100%", height: "100%" }, void 0), jsx(SeasonOfferTag, { text: tags.seasonOfferTagText, size: ComponentSize.Small, css: { position: 'absolute', top: 0, left: 0 } }, void 0), jsx(CategoryTag, { text: tags.categoryTagText, size: ComponentSize.Small, css: { position: 'absolute', bottom: '1rem', left: 0 } }, void 0)] }), void 0)) : (jsx(Image, { src: image.src, alt: image.alt, width: styles === null || styles === void 0 ? void 0 : styles.width, height: styles === null || styles === void 0 ? void 0 : styles.height }, void 0)), jsx(Spacing, { size: space }, void 0), jsx(H1, __assign$1({ theme: theme, align: alignName }, { children: title }), void 0), jsx(Spacing, { size: space }, void 0), jsx(PriceLabel, { finalPrice: price.finalPrice, originalPrice: price.originalPrice, color: price.color, size: ComponentSize.Small, testId: "volume-discount" }, void 0), jsx(Spacing, { size: space }, void 0), jsx(Rating, { size: size === ComponentSize.Large ? ComponentSize.Small : ComponentSize.XSmall, rating: rating.rating, reviews: rating.reviews, reviewsText: "", wrapWithParenthesis: true }, void 0)] }), void 0));
10257
10264
  };
10258
10265
  var templateObject_1$n, templateObject_2$d;
10259
10266
 
@@ -11192,9 +11199,9 @@ var Item = newStyled.span(templateObject_2$4 || (templateObject_2$4 = __makeTemp
11192
11199
  var Number$1 = newStyled(Item)(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject(["\n width: 1.25rem;\n text-align: center;\n font-weight: 600;\n"], ["\n width: 1.25rem;\n text-align: center;\n font-weight: 600;\n"])));
11193
11200
  var IncreaseDecrease = newStyled(Item)(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject(["\n cursor: pointer;\n user-select: none;\n padding: 0 0.313rem;\n font-weight: 400;\n"], ["\n cursor: pointer;\n user-select: none;\n padding: 0 0.313rem;\n font-weight: 400;\n"])));
11194
11201
  var QuantityPicker = function (_a) {
11195
- var _b = _a.initialValue, initialValue = _b === void 0 ? 0 : _b, _c = _a.maxValue, maxValue = _c === void 0 ? 99 : _c, value = _a.value, onChange = _a.onChange;
11202
+ var _b = _a.initialValue, initialValue = _b === void 0 ? 0 : _b, _c = _a.maxValue, maxValue = _c === void 0 ? 99 : _c, value = _a.value, _d = _a.testId, testId = _d === void 0 ? 'quantity-picker' : _d, onChange = _a.onChange;
11196
11203
  var theme = useTheme();
11197
- var _d = useState(value !== null && value !== void 0 ? value : initialValue), internal = _d[0], setInternal = _d[1];
11204
+ var _e = useState(value !== null && value !== void 0 ? value : initialValue), internal = _e[0], setInternal = _e[1];
11198
11205
  useEffect(function () {
11199
11206
  if (onChange) {
11200
11207
  onChange(internal);
@@ -11213,7 +11220,7 @@ var QuantityPicker = function (_a) {
11213
11220
  return clamp(value);
11214
11221
  });
11215
11222
  }, [value, clamp]);
11216
- return (jsxs$1(Container$2, __assign$1({ borderColor: theme.colors.shades['200'].color, color: theme.colors.shades['700'].color, "data-testid": "QuantityPickerContainer" }, { children: [jsx$1(IncreaseDecrease, __assign$1({ onClick: function () { return setInternal(function (value) { return clamp(value - 1); }); } }, { children: "-" }), void 0), jsx$1(Number$1, { children: internal }, void 0), jsx$1(IncreaseDecrease, __assign$1({ onClick: function () { return setInternal(function (value) { return clamp(value + 1); }); } }, { children: "+" }), void 0)] }), void 0));
11223
+ return (jsxs$1(Container$2, __assign$1({ borderColor: theme.colors.shades['200'].color, color: theme.colors.shades['700'].color, "data-testid": testId }, { children: [jsx$1(IncreaseDecrease, __assign$1({ "data-testid": "".concat(testId, "-minus"), onClick: function () { return setInternal(function (value) { return clamp(value - 1); }); } }, { children: "-" }), void 0), jsx$1(Number$1, { children: internal }, void 0), jsx$1(IncreaseDecrease, __assign$1({ "data-testid": "".concat(testId, "-plus"), onClick: function () { return setInternal(function (value) { return clamp(value + 1); }); } }, { children: "+" }), void 0)] }), void 0));
11217
11224
  };
11218
11225
  var templateObject_1$4, templateObject_2$4, templateObject_3$4, templateObject_4$3;
11219
11226
 
@@ -15046,7 +15053,7 @@ var MobileClearContainer = newStyled.div(templateObject_8 || (templateObject_8 =
15046
15053
  var templateObject_1$1, templateObject_2$1, templateObject_3$1, templateObject_4$1, templateObject_5$1, templateObject_6, templateObject_7, templateObject_8;
15047
15054
 
15048
15055
  var Filters = function (_a) {
15049
- var filters = _a.filters, onChange = _a.onChange, _b = _a.tagsColor, tagsColor = _b === void 0 ? '#fff6ef' : _b, filterByText = _a.filterByText, clearAllText = _a.clearAllText, isMobile = _a.isMobile, filtersSelectText = _a.filtersSelectText, applyText = _a.applyText, mobileApplyButtonClick = _a.mobileApplyButtonClick, mobileBackArrowClick = _a.mobileBackArrowClick;
15056
+ var filters = _a.filters, onChange = _a.onChange, _b = _a.tagsColor, tagsColor = _b === void 0 ? '#fff6ef' : _b, filterByText = _a.filterByText, clearAllText = _a.clearAllText, isMobile = _a.isMobile, filtersSelectText = _a.filtersSelectText, applyText = _a.applyText, mobileApplyButtonClick = _a.mobileApplyButtonClick, mobileBackArrowClick = _a.mobileBackArrowClick, onResetValues = _a.onResetValues;
15050
15057
  var theme = useTheme();
15051
15058
  var _c = React__default.useState([]), checkedItems = _c[0], setCheckedItems = _c[1];
15052
15059
  var handleCheckboxClick = useCallback(function (_a) {
@@ -15067,6 +15074,7 @@ var Filters = function (_a) {
15067
15074
  var sectionIndex = item.sectionIndex, itemIndex = item.itemIndex;
15068
15075
  handleCloseClick({ sectionIndex: sectionIndex, itemIndex: itemIndex });
15069
15076
  });
15077
+ onResetValues();
15070
15078
  };
15071
15079
  return (jsxs$1(Fragment$1, { children: [!isMobile ? (jsxs$1("div", __assign$1({ "data-testid": "DesktopHeader" }, { children: [jsxs$1(Header, { children: [jsxs$1(H4, __assign$1({ color: theme.colors.shades['700'].color }, { children: [filterByText, " (", checkedItems.length, ")"] }), void 0), jsx$1(ClearAll, __assign$1({ onClick: handleClearAllClick, color: theme.colors.shades['700'].color, "data-testid": "desktop-clear-all" }, { children: clearAllText }), void 0)] }, void 0), jsx$1(Tags, { color: tagsColor, items: checkedItems.map(function (item) { return item.label; }), onCloseClick: function (index) { return handleCloseClick(checkedItems[index]); } }, void 0)] }), void 0)) : (jsxs$1(MobileHeader, __assign$1({ "data-testid": "MobileHeader" }, { children: [jsx$1(MobileIconsContainer, __assign$1({ onClick: mobileBackArrowClick, "data-testid": "mobileBackArrow" }, { children: jsx$1(Icon.Arrows.ChevronRightVariant, { fill: theme.colors.shades['700'].color }, void 0) }), void 0), jsxs$1(H4, __assign$1({ color: theme.colors.shades['700'].color }, { children: [filtersSelectText, " (", checkedItems.length, ")"] }), void 0)] }), void 0)), filters.map(function (filter, sectionIndex) { return (jsx$1(Accordion, __assign$1({ title: filter.title, isOpenByDefault: filter.isOpenByDefault }, { children: jsx$1(SectionContent, __assign$1({ cols: filter.columns }, { children: filter.items.map(function (item, itemIndex) { return (jsx$1(FilterCheckbox, { onChange: handleCheckboxClick, text: item, itemIndex: itemIndex, sectionIndex: sectionIndex }, itemIndex)); }) }), void 0) }), sectionIndex)); }), isMobile && (jsxs$1(MobileFooter, __assign$1({ "data-testid": "MobileFooter" }, { children: [jsxs$1(MobileClearContainer, __assign$1({ onClick: handleClearAllClick }, { children: [jsx$1(MobileIconsContainer, { children: jsx$1(Icon.Actions.Trash, { fill: theme.colors.shades['700'].color }, void 0) }, void 0), jsx$1(ClearAll, __assign$1({ color: theme.colors.shades['700'].color }, { children: clearAllText }), void 0)] }), void 0), jsx$1(ButtonSecondary, { text: applyText, onClick: mobileApplyButtonClick }, void 0)] }), void 0))] }, void 0));
15072
15080
  };